Skip to content

C
CivManage
Commit 1123424f authored by 邓超's avatar 邓超
Browse files
Options

fix: 添加建表、表编辑功能

parent 049dfc13
Show whitespace changes
Inline Side-by-side
Showing with 1119 additions and 12 deletions
src/pages/bsmanager/base/tablemanager/components/TableView.jsx 0 → 100644
View file @ 1123424f
import React, { useEffect, useState, useRef, useContext } from 'react';
import {
CreateTablePost,
getTableInfo,
updateTablePost,
} from '@/services/tablemanager/tablemanager';
import {
Form,
Modal,
Button,
Input,
Select,
Checkbox,
Table,
notification,
InputNumber,
Tooltip,
Switch,
Spin,
} from 'antd';
import { DeleteOutlined, PlusOutlined, MinusOutlined, DeleteFilled } from '@ant-design/icons';
import styles from './TableView.less';
import { defaultFields } from './defaultFields';
const EditableContext = React.createContext(null);
const tableMap = { 事件表: '事件', 工单表: '工单', 台账表: '台账', 设备表: '设备', 反馈表: '反馈' };
const EditableRow = ({ index, ...props }) => {
const [form] = Form.useForm();
return (
<Form form={form} component={false}>
<EditableContext.Provider value={form}>
<tr {...props} />
</EditableContext.Provider>
</Form>
);
};
const EditableCell = ({
index,
title,
editable,
children,
dataIndex,
record,
handleSave,
ellipsis,
width,
dataSource,
tableDataCount,
...restProps
}) => {
const [editing, setEditing] = useState(false);
const inputRef = useRef(null);
const form = useContext(EditableContext);
// 复选框回显
useEffect(() => {
if (record && dataIndex === 'IsNullable') {
form.setFieldsValue({
[dataIndex]: record[dataIndex],
});
}
}, []);
useEffect(() => {
if (editing && inputRef.current) {
inputRef.current.focus();
}
}, [editing]);
const toggleEdit = () => {
setEditing(!editing);
form.setFieldsValue({
[dataIndex]: record[dataIndex],
});
};
const save = async () => {
try {
const values = await form.validateFields();
toggleEdit();
handleSave({ ...record, [dataIndex]: values[dataIndex], index, errors: [] }, dataIndex);
} catch (errInfo) {
toggleEdit();
handleSave({ ...record, index, errors: errInfo.errorFields[0].errors }, dataIndex);
console.log('Save failed:', errInfo);
}
};
const saveCheckBox = async () => {
const values = await form.validateFields();
form.setFieldsValue({
[dataIndex]: values.IsNullable,
});
handleSave({ ...record, ...values, index });
};
const rendeFrom = val => {
let lengthMin = 0;
let lengthMax = 0;
let decimalPlaceMin = 0;
let decimalPlaceMax = 0;
// 字段类型为精确数值型（decimal），字段长度1-38小数点位数0-38
if (record.FieldType === 8) {
lengthMin = 1;
lengthMax = 38;
decimalPlaceMin = 0;
decimalPlaceMax = 38;
}
// 字段类型为字符串型（nvarchar）、二进制（varbinary），字段长度为0-4000
if (record.FieldType === 2 || record.FieldType === 10) {
lengthMin = 1;
lengthMax = 4000;
}
// 字段类型为字符串型（varchar）、，字段长度为0-8000
if (record.FieldType === 0 || record.FieldType === 1) {
lengthMin = 1;
lengthMax = 8000;
}
if (val === '字段名称') {
return <Input ref={inputRef} onPressEnter={save} onBlur={save} />;
}
if (val === '字段类型') {
return (
<Select
ref={inputRef}
onPressEnter={save}
onBlur={save}
showSearch
filterOption={(input, option) =>
option.children.toLowerCase().includes(input.toLowerCase())
}
>
<Select.Option value={0}>字符串型（varchar）</Select.Option>
<Select.Option value={12}>字符串型（varchar(max)）</Select.Option>
<Select.Option value={1}>字符型（nchar）</Select.Option>
<Select.Option value={2}>字符串型（nvarchar）</Select.Option>
<Select.Option value={3}>字符串型（nvarchar(max)）</Select.Option>
<Select.Option value={4}>布尔型（bit）</Select.Option>
<Select.Option value={5}>整数型（int）</Select.Option>
<Select.Option value={6}>浮点型（float）</Select.Option>
<Select.Option value={7}>长整形（bigint）</Select.Option>
<Select.Option value={8}>精确数值型（decimal）</Select.Option>
<Select.Option value={9}>时间（datetime）</Select.Option>
<Select.Option value={10}>二进制（varbinary）</Select.Option>
<Select.Option value={11}>二进制（varbinary(max)）</Select.Option>
</Select>
);
}
if (val === '字段长度') {
return (
<InputNumber
ref={inputRef}
min={lengthMin}
max={lengthMax}
onPressEnter={save}
onBlur={save}
/>
);
}
if (val === '小数点位') {
return (
<InputNumber
ref={inputRef}
min={decimalPlaceMin}
max={decimalPlaceMax}
onPressEnter={save}
onBlur={save}
/>
);
}
return <Input ref={inputRef} onPressEnter={save} onBlur={save} />;
};
let childNode = children;
if (editable) {
// 字段类型为 字符串型（varchar）、二进制（varbinary）、字符型（nchar）、字符串型（nvarchar）、精确数值型（decimal）让修改
if (
title === '字段长度' &&
(record.FieldType !== 0 &&
record.FieldType !== 10 &&
record.FieldType !== 1 &&
record.FieldType !== 2 &&
record.FieldType !== 8)
) {
return <td {...restProps}>--</td>;
}
// 字段类型为 精确数值型（decimal）让修改
if (title === '小数点位' && record.FieldType !== 8) {
return <td {...restProps}>--</td>;
}
// 只读
if (record.ReadOnly && title !== '允许空值') {
return <td {...restProps}>{childNode}</td>;
}
// 表单规则
let rules = [];
if (title === '字段名称') {
rules = [
{
required: true,
message: '字段名称不能为空',
},
{
validator: (rule, value) => {
if (
value &&
dataSource.some((item, i) => item.Name === value && item.keyIndex !== record.keyIndex)
) {
return Promise.reject(new Error('字段名称不能重复'));
}
return Promise.resolve();
},
},
];
}
childNode = editing ? (
<Form.Item
style={{
width: `${width - 20}px`,
height: '32px',
margin: 0,
marginLeft: '50%',
transform: 'translateX(-50%)',
}}
rules={rules}
name={dataIndex}
>
{rendeFrom(title)}
</Form.Item>
) : (
<div
className="editable-cell-value-wrap"
title={children[1]}
style={{
width: `${width - 20}px`,
height: '32px',
overflow: 'hidden',
whiteSpace: 'nowrap',
textOverflow: 'ellipsis',
margin: 'auto',
}}
onClick={toggleEdit}
>
{children}
</div>
);
if (title === '允许空值') {
childNode = (
<Form.Item
style={{
margin: 0,
}}
name={dataIndex}
valuePropName="checked"
>
<Checkbox onChange={saveCheckBox} disabled={record.ReadOnly || tableDataCount} />
</Form.Item>
);
}
}
return <td {...restProps}>{childNode}</td>;
};
const TableView = props => {
const { callBackSubmit, onCancel, visible, type, formObj, tableType } = props;
const [dataSource, setDataSource] = useState([]);
const [count, setCount] = useState(0);
const [loading, setLoading] = useState(false);
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const [tableMsg, setTableMsg] = useState({});
const [tableDataCount, setTableDataCount] = useState(false);
const [defaultData, setDefaultData] = useState([]);
const [showDefault, setShowDefault] = useState(true);
const [form] = Form.useForm();
useEffect(() => {
if (visible) {
if (type === 'tableEdit') {
setLoading(true);
form.setFieldsValue({
tableName: formObj.tableName,
alias: formObj.tableAlias,
});
getTableInfo({ tableName: formObj.tableName, isIncludeField: true })
.then(res => {
setLoading(false);
if (res.code === 0) {
setTableDataCount(res.data.root[0].TableDataCount);
setTableMsg({
tableStyle: res.data.root[0].tableStyle ? res.data.root[0].tableStyle : '大',
officeTmpl: res.data.root[0].officeTmpl,
interfaceName: res.data.root[0].interfaceText,
tableID: res.data.root[0].tableID,
});
const defaultList = [];
const fieldList = res.data.root[0].TableFields.map((item, index) => {
const obj = {
...item,
keyIndex: index,
};
if (item.ReadOnly) {
defaultList.push(obj);
}
return obj;
});
setDefaultData(defaultList);
setCount(fieldList.length);
setDataSource(fieldList);
} else {
notification.error({ message: '提示', duration: 3, description: res.msg });
}
})
.catch(() => {
setLoading(false);
notification.error({ message: '提示', duration: 3, description: '网络异常' });
});
} else {
let list = [];
defaultFields.forEach(item => {
if (item.value === tableType) {
list = item.list.map((val, index) => ({ ...val, keyIndex: index }));
}
});
setDefaultData(list);
setCount(list.length);
setDataSource(list);
}
} else {
setShowDefault(true);
setDataSource([]);
setDefaultData([]);
setSelectedRowKeys([]);
form.resetFields();
}
}, [visible]);
// 提交表单
const onFinish = () => {
// 校验提示
let checkMsg = '';
let TableFields = JSON.parse(JSON.stringify(dataSource));
TableFields.forEach((item, index) => {
item.Order = index;
if (!item.Name) {
item.errors = ['字段名称不能为空'];
}
if (item.errors?.length > 0) {
item.errors.forEach(ele => {
checkMsg = `${checkMsg}第${index + 1}行 校验错误：${ele}\n`;
});
}
});
if (!showDefault) {
// 默认字段不显示时要拼接上默认字段
TableFields = [...defaultData, ...TableFields];
}
if (checkMsg) {
notification.error({
message: '提示',
duration: 3,
description: checkMsg,
style: { whiteSpace: 'pre-wrap' },
});
return;
}
form.validateFields().then(validate => {
if (validate) {
if (!validate.tableName) {
notification.error({ message: '提示', duration: 3, description: '请填写表名' });
return;
}
if (type === 'add') {
// 新建表
CreateTablePost({
...validate,
tableName: `${tableMap[tableType]}_${validate.tableName}`,
TableFields,
tableType,
}).then(res => {
if (res.code === 0) {
notification.success({
message: '提示',
duration: 3,
description: type === 'add' ? '新增成功' : '编辑成功',
});
callBackSubmit();
} else {
notification.error({ message: '提示', duration: 3, description: res.msg });
}
});
} else {
// 编辑表
updateTablePost({ ...validate, TableFields, ...tableMsg }).then(res => {
if (res.code === 0) {
notification.success({
message: '提示',
duration: 3,
description: type === 'add' ? '新增成功' : '编辑成功',
});
callBackSubmit();
} else {
notification.error({ message: '提示', duration: 3, description: res.msg });
}
});
}
}
});
};
// 添加字段
const handleAdd = () => {
const newData = {
keyIndex: count,
Name: '',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
};
setDataSource([...dataSource, newData]);
setCount(count + 1);
};
// 批量删除字段
const deleteFilleds = () => {
if (selectedRowKeys.length === 0) {
notification.error({ message: '提示', duration: 3, description: '请选择字段' });
return;
}
const list = [];
dataSource.forEach(item => {
const isDelete = selectedRowKeys.some(value => value === item.keyIndex);
if (!isDelete) {
list.push(item);
}
});
setDataSource(list);
};
// 删除字段
const handleDelete = (record, keyIndex) => {
if (record.ReadOnly) {
notification.error({ message: '提示', duration: 3, description: '内置字段不允许删除' });
return;
}
const newData = dataSource.filter((item, index) => index !== keyIndex);
setDataSource(newData);
};
// 修改后存值
const handleSave = (row, key) => {
if (key === 'FieldType') {
if (row.FieldType === 0 || row.FieldType === 10 || row.FieldType === 2) {
row.FieldLength = 50;
row.DecimalPlace = 0;
} else if (row.FieldType === 1) {
row.FieldLength = 10;
row.DecimalPlace = 0;
} else if (row.FieldType === 8) {
row.FieldLength = 18;
row.DecimalPlace = 3;
} else {
row.FieldLength = 0;
row.DecimalPlace = 0;
}
}
const { index } = row;
const newData = [...dataSource];
const item = newData[index];
newData.splice(index, 1, { ...item, ...row });
setDataSource(newData);
};
// 是否显示默认字段
const showDefaultFields = e => {
setShowDefault(e);
let list = JSON.parse(JSON.stringify(dataSource));
if (e) {
// 显示内置字段
list = [...defaultData, ...list];
} else {
list = list.filter(item => !item.ReadOnly);
}
setDataSource(list);
};
// 表格设置
const components = {
body: {
row: EditableRow,
cell: EditableCell,
},
};
const defaultColumns = [
{
title: '序号',
align: 'center',
width: 50,
render: (text, record, index) => <span>{index + 1}</span>,
},
{
title: '字段名称',
dataIndex: 'Name',
width: 200,
ellipsis: true,
editable: true,
align: 'center',
},
{
title: '字段类型',
dataIndex: 'FieldType',
width: 220,
ellipsis: true,
editable: true,
align: 'center',
render: text => {
switch (text) {
case 0:
return '字符串型（varchar）';
case 1:
return '字符型（nchar）';
case 2:
return '字符串型（nvarchar）';
case 3:
return '字符串型（nvarchar(max)）';
case 4:
return '布尔型（bit）';
case 5:
return '整数型（int）';
case 6:
return '浮点型（float）';
case 7:
return '长整形（bigint）';
case 8:
return '精确数值型（decimal）';
case 9:
return '时间（datetime）';
case 10:
return '二进制（varbinary）';
case 11:
return '二进制（varbinary(max)）';
case 12:
return '字符串型（varchar(max)）';
default:
return null;
}
},
},
{
title: '字段长度',
dataIndex: 'FieldLength',
width: 100,
ellipsis: true,
editable: true,
align: 'center',
},
{
title: '小数点位',
dataIndex: 'DecimalPlace',
width: 100,
ellipsis: true,
editable: true,
align: 'center',
},
{
title: '允许空值',
dataIndex: 'IsNullable',
width: 100,
editable: true,
align: 'center',
},
{
title: '操作',
width: 100,
align: 'center',
render: (_, record, index) =>
dataSource.length >= 1 ? (
<Tooltip title="删除">
<DeleteOutlined
onClick={() => handleDelete(record, index)}
style={{ fontSize: '16px', color: `${record.ReadOnly ? '#ccc' : '#e86060'}` }}
/>
</Tooltip>
) : null,
},
];
const columns = defaultColumns.map(col => {
if (!col.editable) {
return col;
}
return {
...col,
onCell: (record, index) => ({
index,
record,
editable: col.editable,
dataIndex: col.dataIndex,
width: col.width,
title: col.title,
ellipsis: col.ellipsis,
align: col.align,
dataSource,
tableDataCount,
handleSave,
}),
};
});
// 表格复选框
const onSelectChange = newSelectedRowKeys => {
setSelectedRowKeys(newSelectedRowKeys);
};
const rowSelection = {
selectedRowKeys,
onChange: onSelectChange,
getCheckboxProps: record => ({
disabled: record.ReadOnly,
}),
};
return (
<Modal
title={type === 'add' ? `建表【${tableType}】` : `表编辑`}
visible={visible}
width="1300px"
onOk={onFinish}
onCancel={onCancel}
maskClosable={false}
destroyOnClose
centered
>
<div className={styles.content}>
<Form form={form} layout="inline">
<Form.Item label="表名" name="tableName" required>
<Input
addonBefore={type === 'add' ? `${tableMap[tableType]}_` : null}
placeholder="请填写表名"
/>
</Form.Item>
<Form.Item label="别名" name="alias">
<Input placeholder="请填写别名" />
</Form.Item>
<Form.Item label="内置字段">
<Switch
defaultChecked
checkedChildren="显示"
unCheckedChildren="隐藏"
onChange={showDefaultFields}
/>
</Form.Item>
<Form.Item>
<Button icon={<PlusOutlined />} type="primary" onClick={() => handleAdd()}>
新增
</Button>
</Form.Item>
<Form.Item>
<Button icon={<MinusOutlined />} onClick={() => deleteFilleds()}>
批量删除
</Button>
</Form.Item>
</Form>
<Spin spinning={loading}>
<Table
rowKey="keyIndex"
rowSelection={rowSelection}
size="small"
style={{ marginTop: '10PX' }}
components={components}
rowClassName={() => 'editable-row'}
bordered
dataSource={dataSource}
columns={columns}
scroll={{ x: 'max-content', y: '540px' }}
pagination={false}
/>
</Spin>
</div>
</Modal>
);
};
export default TableView;
src/pages/bsmanager/base/tablemanager/components/TableView.less 0 → 100644
View file @ 1123424f
.content {
height: 620px;
:global {
.ant-table-row {
height: 49px;
}
.editable-cell {
position: relative;
}
.editable-cell-value-wrap {
padding: 5px 12px;
cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
padding: 4px 11px;
border: 1px solid #fff;
border-radius: 2px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
border: 1px solid #434343;
}
.ant-table-cell-ellipsis {
overflow: visible;
}
.ant-form-item-explain {
position: absolute;
height: 35px;
width: 140px;
background-color: #ff4d4f;
top: -50px;
left: 50%;
transform: translateX(-50%);
border-radius: 5px;
}
.ant-form-item-explain-error {
color: #fff;
line-height: 35px;
}
.ant-select-arrow .anticon {
margin-top: 8px;
}
}
}
\ No newline at end of file
src/pages/bsmanager/base/tablemanager/components/defaultFields.js 0 → 100644
View file @ 1123424f
export const defaultFields = [
{
value: '事件表',
list: [
{
Name: 'ID',
FieldType: 7,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: false,
ReadOnly: true,
},
{
Name: '事件编号',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '事件状态',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '事件名称',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '上报站点',
FieldType: 0,
FieldLength: 500,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '处理站点',
FieldType: 0,
FieldLength: 500,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '上报人名称',
FieldType: 0,
FieldLength: 20,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '上报人部门',
FieldType: 0,
FieldLength: 20,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '上报时间',
FieldType: 9,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '现场图片',
FieldType: 0,
FieldLength: 500,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '现场录音',
FieldType: 0,
FieldLength: 500,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '坐标位置',
FieldType: 0,
FieldLength: 100,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '更新时间',
FieldType: 9,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '更新状态',
FieldType: 0,
FieldLength: 200,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '是否置顶',
FieldType: 5,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '是否删除',
FieldType: 5,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
],
},
{
value: '工单表',
list: [
{
Name: 'ID',
FieldType: 7,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: false,
ReadOnly: true,
},
{
Name: '工单编号',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
],
},
{
value: '台账表',
list: [
{
Name: 'ID',
FieldType: 7,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: false,
ReadOnly: true,
},
{
Name: '所属站点',
FieldType: 0,
FieldLength: 200,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '录入时间',
FieldType: 9,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '是否删除',
FieldType: 5,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
],
},
{
value: '设备表',
list: [
{
Name: 'ID',
FieldType: 7,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: false,
ReadOnly: true,
},
{
Name: '设备名称',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '所属站点',
FieldType: 0,
FieldLength: 100,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '编码',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: 'GIS编号',
FieldType: 0,
FieldLength: 100,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '父设备编码',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '坐标位置',
FieldType: 0,
FieldLength: 200,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '风貌图',
FieldType: 0,
FieldLength: 500,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '视频缩略图',
FieldType: 0,
FieldLength: 200,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '第三方编码',
FieldType: 0,
FieldLength: 200,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '录入时间',
FieldType: 9,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '是否删除',
FieldType: 5,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
],
},
{
value: '反馈表',
list: [
{
Name: 'ID',
FieldType: 7,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: false,
ReadOnly: true,
},
{
Name: '编码',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '设备编码',
FieldType: 0,
FieldLength: 50,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '录入时间',
FieldType: 9,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
{
Name: '是否删除',
FieldType: 5,
FieldLength: 0,
DecimalPlace: 0,
IsNullable: true,
ReadOnly: true,
},
],
},
];
src/pages/bsmanager/base/tablemanager/filedConfig/filedConfig.jsx
View file @ 1123424f
...@@ -616,7 +616,7 @@ const AddModal = props => { ...@@ -616,7 +616,7 @@ const AddModal = props => {
<Spin tip="loading..." spinning={treeLoading}> <Spin tip="loading..." spinning={treeLoading}>
<div className={styles.containerBox}> <div className={styles.containerBox}>
<div className={styles.config}> <div className={styles.config}>
<div className={styles.title}>{formObj}</div> <div className={styles.title}> 页面属性 【{formObj}】</div>
<div style={{ display: 'flex', justifyContent: 'flex-end' }}> <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<div style={{ lineHeight: '32px', marginRight: '5px' }}>快速切换表:</div> <div style={{ lineHeight: '32px', marginRight: '5px' }}>快速切换表:</div>
<div style={{ width: '350px', marginRight: '10px' }}> <div style={{ width: '350px', marginRight: '10px' }}>
......
src/pages/bsmanager/base/tablemanager/index.jsx
View file @ 1123424f
...@@ -15,6 +15,8 @@ import { ...@@ -15,6 +15,8 @@ import {
Badge, Badge,
Spac, Spac,
Card, Card,
Dropdown,
Menu,
} from 'antd'; } from 'antd';
import { import {
EditOutlined, EditOutlined,
...@@ -26,6 +28,7 @@ import { ...@@ -26,6 +28,7 @@ import {
BorderInnerOutlined, BorderInnerOutlined,
DoubleLeftOutlined, DoubleLeftOutlined,
DoubleRightOutlined, DoubleRightOutlined,
TableOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer'; import PageContainer from '@/components/BasePageContainer';
import { import {
...@@ -36,10 +39,12 @@ import { ...@@ -36,10 +39,12 @@ import {
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import styles from './index.less'; import styles from './index.less';
import Editor from './components/Field/editor'; import Editor from './components/Field/editor';
import AddTablelList from './components/Field/addTable'; // import AddTablelList from './components/Field/addTable';
import AddTablelList from './components/TableView';
import AffiliateAdd from './components/Field/affiliateAdd'; import AffiliateAdd from './components/Field/affiliateAdd';
import LoadGroup from './components/Field/loadGroup'; import LoadGroup from './components/Field/loadGroup';
import LoadGroupNew from './components/Field/loadGroupNew'; import LoadGroupNew from './components/Field/loadGroupNew';
import { defaultFields } from './components/defaultFields';
const { Search } = Input; const { Search } = Input;
const { Option } = Select; const { Option } = Select;
const placeholder = '请输入表名'; const placeholder = '请输入表名';
...@@ -67,6 +72,7 @@ const TableManager = props => { ...@@ -67,6 +72,7 @@ const TableManager = props => {
const [treeVisible, setTreeVisible] = useState(true); // 是否显示左侧树 const [treeVisible, setTreeVisible] = useState(true); // 是否显示左侧树
const [hoverItemIndex, setHoverItemIndex] = useState(0); // hover流程索引 const [hoverItemIndex, setHoverItemIndex] = useState(0); // hover流程索引
const [pickIndex, setPickIndex] = useState(0); const [pickIndex, setPickIndex] = useState(0);
const [tableType, setTableType] = useState(defaultFields[0].value);
const initNum = useRef(0); const initNum = useRef(0);
useEffect( useEffect(
...@@ -210,7 +216,7 @@ const TableManager = props => { ...@@ -210,7 +216,7 @@ const TableManager = props => {
const getField = () => { const getField = () => {
loadUnattachedTables().then(res => { loadUnattachedTables().then(res => {
if (res.data.root && res.data.root.length) { if (res.data.root && res.data.root.length) {
setTableList(res.data.root); setTableList(res.data.root.reverse());
} }
}); });
}; };
...@@ -244,7 +250,6 @@ const TableManager = props => { ...@@ -244,7 +250,6 @@ const TableManager = props => {
} }
} }
setKeepTreeFirst(bb); setKeepTreeFirst(bb);
console.log(aa);
setKeepTreeSelect(aa); setKeepTreeSelect(aa);
initNum.current += 1; initNum.current += 1;
} }
...@@ -384,6 +389,16 @@ const TableManager = props => { ...@@ -384,6 +389,16 @@ const TableManager = props => {
style={{ fontSize: '20px', color: '#1890FF' }} style={{ fontSize: '20px', color: '#1890FF' }}
/> />
</Tooltip> </Tooltip>
<Tooltip title="表配置">
<TableOutlined
onClick={() => {
setType('tableEdit');
setVisible(true);
setFormObj(record);
}}
style={{ fontSize: '20px', color: '#1890FF' }}
/>
</Tooltip>
{/* <Tooltip title="字段配置"> {/* <Tooltip title="字段配置">
<FontColorsOutlined <FontColorsOutlined
onClick={e => fieldsConfig(record, e)} onClick={e => fieldsConfig(record, e)}
...@@ -426,7 +441,18 @@ const TableManager = props => { ...@@ -426,7 +441,18 @@ const TableManager = props => {
list[pickIndex].pageSize = pageSize; list[pickIndex].pageSize = pageSize;
setGroupArr(list); setGroupArr(list);
}; };
const onMenuClick = e => {
console.log('click', e);
setTableType(e.key);
AddTable();
};
const menu = (
<Menu
onClick={onMenuClick}
items={defaultFields.map(item => ({ key: item.value, label: item.value }))}
/>
);
return ( return (
<Spin tip="loading..." spinning={treeLoading}> <Spin tip="loading..." spinning={treeLoading}>
<PageContainer> <PageContainer>
...@@ -504,15 +530,15 @@ const TableManager = props => { ...@@ -504,15 +530,15 @@ const TableManager = props => {
style={{ width: '300px' }} style={{ width: '300px' }}
/> />
</div> </div>
<Dropdown overlay={menu} arrow>
<Button <Button
type="primary" type="primary"
style={{ marginLeft: '10px' }}
icon={<BorderInnerOutlined />} icon={<BorderInnerOutlined />}
onClick={AddTable} style={{ marginLeft: '10px' }}
> >
建表 建表
</Button> </Button>
</Dropdown>
<Button <Button
type="primary" type="primary"
style={{ marginLeft: '10px' }} style={{ marginLeft: '10px' }}
...@@ -579,9 +605,17 @@ const TableManager = props => { ...@@ -579,9 +605,17 @@ const TableManager = props => {
formObj={formObj} formObj={formObj}
/> />
)} )}
{visible && type === 'add' && ( {/* {visible && type === 'add' && (
<AddTablelList type={type} onCancel={() => setVisible(false)} callBackSubmit={onSubmit} /> <AddTablelList type={type} onCancel={() => setVisible(false)} callBackSubmit={onSubmit} />
)} )} */}
<AddTablelList
visible={visible && (type === 'add' || type === 'tableEdit')}
type={type}
onCancel={() => setVisible(false)}
formObj={formObj}
callBackSubmit={onSubmit}
tableType={tableType}
/>
{visible && type === 'affiliateAdd' && ( {visible && type === 'affiliateAdd' && (
<AffiliateAdd <AffiliateAdd
visible={visible} visible={visible}
......
src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/NodeModal.jsx
View file @ 1123424f
...@@ -244,14 +244,14 @@ const NodeModal = props => { ...@@ -244,14 +244,14 @@ const NodeModal = props => {
</Form.Item> </Form.Item>
<Form.Item label="检查前面在办" name="aheadHandle"> <Form.Item label="检查前面在办" name="aheadHandle">
<Select> <Select>
<Option value={0}>前面有在办也能移交</Option>
<Option value={1}>前面有在办不能移交</Option> <Option value={1}>前面有在办不能移交</Option>
<Option value={0}>前面有在办也能移交</Option>
</Select> </Select>
</Form.Item> </Form.Item>
<Form.Item label="节点办理情况" name="NodeHandling"> <Form.Item label="节点办理方式" name="NodeHandling">
<Select> <Select>
<Option value={0}>多人接收，多人办理</Option>
<Option value={1}>多人接收，一人办理</Option> <Option value={1}>多人接收，一人办理</Option>
<Option value={0}>多人接收，多人办理</Option>
<Option value={2}>一人接收，一人办理</Option> <Option value={2}>一人接收，一人办理</Option>
</Select> </Select>
</Form.Item> </Form.Item>
......
src/services/tablemanager/tablemanager.js
View file @ 1123424f
...@@ -57,3 +57,7 @@ export const LoadFieldsByGroup = param => ...@@ -57,3 +57,7 @@ export const LoadFieldsByGroup = param =>
// 18.根据分组名加载字段集 // 18.根据分组名加载字段集
export const ChangeOrder = data => post(`${PUBLISH_SERVICE}/CaseManage/ChangeOrder`, data); export const ChangeOrder = data => post(`${PUBLISH_SERVICE}/CaseManage/ChangeOrder`, data);
// 创建表
export const CreateTablePost = data => post(`${PUBLISH_SERVICE}/CaseManage/CreateTable`, data);
// 修改表
export const updateTablePost = param => post(`${PUBLISH_SERVICE}/CaseManage/UpdateTable`, param);
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