Skip to content

X
xform
Commit 0c716241 authored by 田翔's avatar 田翔
Browse files
Options

fix: 组件调整

parent dc6ceea2
Hide whitespace changes
Inline Side-by-side
Showing with 160 additions and 113 deletions
examples/base/test.js
View file @ 0c716241
import React, { useState, useEffect, useRef } from 'react';
import { FormRender, FormDesigner, TableRender } from '../../src/index';
import { FormRender, FormDesigner, Account } from '../../src/index';
import { schemaValues } from './data';
import { Button, Tabs } from 'antd';
......@@ -3471,7 +3471,7 @@ const Test = (props) => {
{/* <FormDesigner ref={formDesignerRef} extra={true} tableName='事件工单_测试一键布局' /> */}
{/* <FormRender ref={formRenderRef} schemaValues={schemaValues} /> */}
{/* <div onClick={submit}>提交</div> */}
<TableRender accountName={'形态测试台账WY'} />
<Account accountName={'形态测试台账WY'} />
</div>
)
......
src/core/TableRender/components/SearchGroup/index.js → src/core/Account/components/SearchGroup/index.js
View file @ 0c716241
......@@ -223,7 +223,7 @@ const SearchGroup = forwardRef((props, ref) => {
ranges={{ ...rangerOptions }}
format={formatterStr}
style={{ width: 300 }}
// onChange={dateChange}
// onChange={dateChange}
/>
</Form.Item>
) : (
......@@ -324,7 +324,7 @@ const SearchGroup = forwardRef((props, ref) => {
<Button
type="primary"
size="middle"
onClick={() => btnsClick('add')}
onClick={() => btnsClick('添加')}
icon={<PlusOutlined />}
style={{ marginLeft: 20 }}
>
......
src/core/TableRender/index.js → src/core/Account/index.js
View file @ 0c716241
......@@ -6,6 +6,7 @@ import TablePack from './components/TablePack'
import { GetAccountConfigInfo, GetAccountPageList, getStationListByUserID, GetTableJson } from '../../apis/process'
import { isJson, isObject } from '../../utils/index'
import IconPack from '../widgets/IconPack'
import FormRender from '../FormRender'
const getFileInfo = (formJson) => {
let obj = {}
......@@ -31,7 +32,7 @@ const TableRender = (props) => {
const [detailShow, setDetailShow] = useState(false)
const [params, setParams] = useState({ userID: userID, accountName, direction: 'desc', timeField: '录入时间', pageIndex: 1, pageSize: 100 })
const [loading, setLoading] = useState(false)
const [config, setConfig] = useState({ webShowFieldGroup: '', formJson: '' })
const [config, setConfig] = useState({ webShowFieldGroup: '', formJson: '', values: [] })
const [dataSource, setDataSource] = useState([])
const fileColumns = useMemo(() => {
......@@ -111,7 +112,7 @@ const TableRender = (props) => {
}, [fileColumns])
const btnsClick = (type, row) => {
if (['详情', '编辑'].includes(type)) {
if (['添加', '详情', '编辑'].includes(type)) {
setDetailShow(true)
}
}
......@@ -151,30 +152,43 @@ const TableRender = (props) => {
}, [])
return (
<div className={styles.account} style={{ width: '100%', height: '100%' }}>
<div className={styles.account}>
<div className={styles.tableRender} style={{ display: !detailShow ? 'block' : 'none' }}>
<div className={styles.top}>
<SearchGroup onChange={search} />
<div className={styles.content}>
<div className={styles.top}>
<SearchGroup
onChange={search}
btnsClick={btnsClick}
/>
</div>
<div className={styles.bottom}>
<Table
size='small'
rowKey='ID'
bordered
loading={loading}
columns={columns}
dataSource={dataSource}
pagination={false}
scroll={{ y: '100%' }}
/>
</div>
</div>
<div className={styles.bottom}>
<Table
size='small'
rowKey='ID'
bordered
loading={loading}
columns={columns}
dataSource={dataSource}
pagination={false}
scroll={{ y: 'calc(100% - 50px)' }}
/>
<div className={styles.footer}>
</div>
</div>
<div className={styles.tableDetail} style={{ display: detailShow ? 'block' : 'none' }}>
<Button
onClick={() => setDetailShow(false)}
>
返回
</Button>
<div className={styles.formBox}>
<FormRender schemaValues={config} />
</div>
<div className={styles.formBtns}>
<Button
onClick={() => setDetailShow(false)}
>
返回
</Button>
</div>
</div>
</div>
......
src/core/Account/index.less 0 → 100644
View file @ 0c716241
@import '~antd/es/style/themes/default.less';
.account {
width: 100%;
height: 100%;
.tableRender {
width: 100%;
height: 100%;
padding-bottom: 50px;
position: relative;
.content {
width: 100%;
height: 100%;
.top {
width: 100%;
height: 50px;
}
.bottom {
width: 100%;
height: calc(100% - 100px);
.@{ant-prefix}-table-wrapper {
height: 100%;
.@{ant-prefix}-spin-nested-loading {
height: 100%;
}
.@{ant-prefix}-spin-container {
height: 100%;
}
.@{ant-prefix}-table {
height: 100%;
.@{ant-prefix}-table-container {
height: 100%;
}
}
}
.ant-table.ant-table-bordered>.ant-table-container {
border-left: 1px solid #dbe7fb;
.ant-table-header>table {
border-top: 1px solid #dbe7fb;
}
} // .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table {
// border-top: 1px solid #dbe7fb;
// }
.@{ant-prefix}-table-thead>tr {
height: 40px;
th {
border-right: 1px solid #dbe7fb!important;
border-bottom: 1px solid #dbe7fb;
background: white;
}
th:last-child {
border-left: 1px solid #dbe7fb;
}
}
.ant-table-tbody>tr {
&:nth-child(2n-1) {
td {
background: #f6f9fe;
}
}
td {
border-bottom: 1px solid #dbe7fb;
border-right: 1px solid #dbe7fb!important;
&:last-child {
border-left: 1px solid #dbe7fb;
}
}
} // .ant-table-tbody > tr > td:last-child {
// border-left: 1px solid #dbe7fb;
// }
.@{ant-prefix}-table-body {
overflow-x: scroll;
&::-webkit-scrollbar {
width: 0;
height: 12px;
}
&::-webkit-scrollbar {
width: 0; // height: 12px;
height: 6px;
}
&::-webkit-scrollbar-thumb {
// background: #c8c8c8;
background: rgb(41, 166, 255);
}
&::-webkit-scrollbar-track {
background: #f7f4f5;
padding: 0 3px;
}
}
}
}
.footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50px;
}
}
.tableDetail {
width: 100%;
height: 100%;
padding-bottom: 50px;
.formBox {
width: 100%;
height: 100%;
overflow: auto;
}
.formBtns {
display: flex;
align-items: center;
justify-content: flex-end;
padding: 0 20px;
background: white;
height: 50px;
}
}
}
\ No newline at end of file
src/core/TableRender/index.less deleted 100644 → 0
View file @ dc6ceea2
@import '~antd/es/style/themes/default.less';
.tableRender {
width: 100%;
height: 100%;
.top {
width: 100%;
height: 50px;
}
.bottom {
width: 100%;
height: calc(100% - 100px);
.@{ant-prefix}-table-wrapper {
height: 100%;
.@{ant-prefix}-spin-nested-loading {
height: 100%;
}
.@{ant-prefix}-spin-container {
height: 100%;
}
.@{ant-prefix}-table {
height: 100%;
.@{ant-prefix}-table-container {
height: 100%;
}
}
}
.ant-table.ant-table-bordered > .ant-table-container {
border-left: 1px solid #dbe7fb;
.ant-table-header > table {
border-top: 1px solid #dbe7fb;
}
}
// .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table {
// border-top: 1px solid #dbe7fb;
// }
.@{ant-prefix}-table-thead > tr {
height: 40px;
th {
border-right: 1px solid #dbe7fb!important;
border-bottom: 1px solid #dbe7fb;
background: white;
}
th:last-child {
border-left: 1px solid #dbe7fb;
}
}
.ant-table-tbody > tr {
&:nth-child(2n-1) {
td {
background: #f6f9fe;
}
}
td {
border-bottom: 1px solid #dbe7fb;
border-right: 1px solid #dbe7fb!important;
&:last-child {
border-left: 1px solid #dbe7fb;
}
}
}
// .ant-table-tbody > tr > td:last-child {
// border-left: 1px solid #dbe7fb;
// }
.@{ant-prefix}-table-body {
overflow-x: scroll;
&::-webkit-scrollbar {
width: 0;
height: 12px;
}
&::-webkit-scrollbar {
width: 0; // height: 12px;
height: 6px;
}
&::-webkit-scrollbar-thumb {
// background: #c8c8c8;
background: rgb(41, 166, 255);
}
&::-webkit-scrollbar-track {
background: #f7f4f5;
padding: 0 3px;
}
}
}
}
src/index.js
View file @ 0c716241
import FormRender from './core/FormRender'
import FormDesigner from './core/FormDesigner'
import TableRender from './core/TableRender'
import Account from './core/Account'
import './main.less'
export {
FormRender,
FormDesigner,
TableRender,
Account,
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment