Skip to content

C
CivManage
Commit ee819e2f authored by 皮倩雯's avatar 皮倩雯
Browse files
Options

fix: '表字段字段配置大保存'

parent 0e4f51a3
Pipeline #46690 skipped with stages
          Hide whitespace changes
          Inline Side-by-side
          Showing with 730 additions and 415 deletions
          src/pages/bsmanager/base/tablemanager/filedConfig/fieldEditor.jsx
          View file @ ee819e2f
          /* eslint-disable prefer-destructuring */
          /* eslint-disable import/order */
          /* eslint-disable default-case */
          /* eslint-disable one-var */
          /* eslint-disable no-unused-expressions */
          /* eslint-disable no-case-declarations */
          import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
          import { import {
          Form, Form,
          ...@@ -11,6 +17,7 @@ import { ...@@ -11,6 +17,7 @@ import {
          Drawer, Drawer,
          Space, Space,
          Button, Button,
          Empty,
          } from 'antd'; } from 'antd';
          import { import {
          ...@@ -23,14 +30,25 @@ import { ...@@ -23,14 +30,25 @@ import {
          import styles from './index.less'; import styles from './index.less';
          import ChangeAdd from './changeAdd'; import ChangeAdd from './changeAdd';
          import VerifyModal from './VerifyModal'; import VerifyModal from './VerifyModal';
          import { PlusSquareOutlined } from '@ant-design/icons'; import { PlusSquareOutlined, UnorderedListOutlined, FontColorsOutlined } from '@ant-design/icons';
          import Tree from '@/components/ExpendableTree';
          import { shape } from 'prop-types'; import { shape } from 'prop-types';
          const AddModal = props => { const AddModal = props => {
          const { callBackSubmit = () => {}, isType, itemData, isVisible, formObj1, onCancel } = props; const {
          callBackSubmit = () => {},
          isType,
          itemData,
          isVisible,
          formObj1,
          onCancel,
          treeData,
          keepTreeFirst,
          } = props;
          const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
          const [fieldName, setFieldName] = useState([]); // 弹窗 const [fieldName, setFieldName] = useState([]); // 弹窗
          const [eventList, setEventList] = useState([]); // 事件 const [eventList, setEventList] = useState([]); // 事件
          const [filed, setFiled] = useState({}); // 事件 const [filed, setFiled] = useState({}); // 事件
          const [treeValue, setTreeValue] = useState([]);
          const [verification, setVerification] = useState([]); const [verification, setVerification] = useState([]);
          const [Shape, setShape] = useState('文本'); const [Shape, setShape] = useState('文本');
          const [characteristics, setCharacteristics] = useState([ const [characteristics, setCharacteristics] = useState([
          ...@@ -81,6 +99,7 @@ const AddModal = props => { ...@@ -81,6 +99,7 @@ const AddModal = props => {
          const [type, setType] = useState(''); // 弹窗类型 const [type, setType] = useState(''); // 弹窗类型
          const [formObj, setFormObj] = useState({ rule: [], numerical: '' }); const [formObj, setFormObj] = useState({ rule: [], numerical: '' });
          const [characterValue, setCharacterValue] = useState(''); const [characterValue, setCharacterValue] = useState('');
          const [show, setShow] = useState('block');
          const [pramData, setPramData] = useState({ const [pramData, setPramData] = useState({
          Unit: '', Unit: '',
          ExceptionEvent: '', ExceptionEvent: '',
          ...@@ -95,78 +114,93 @@ const AddModal = props => { ...@@ -95,78 +114,93 @@ const AddModal = props => {
          must: false, must: false,
          coordinates: false, coordinates: false,
          }); });
          const [checkedList, setCheckedList] = useState([]); //选中的复选框内容 const [currentSelectOrg, setCurrentSelectOrg] = useState([]);
          const [checkedList, setCheckedList] = useState([]); // 选中的复选框内容
          const [expendKey, setExpendKey] = useState(''); // 保存默认展开项
          const [valueData, setValueData] = useState([]); // 保存所有修改数据
          const [keep, setKeep] = useState();
          const { TextArea } = Input; const { TextArea } = Input;
          const [form] = Form.useForm(); const [form] = Form.useForm();
          const { Item } = Form; const { Item } = Form;
          // 提交 // 提交
          const onSubmit = () => { const onSubmit = () => {
          console.log(itemData, 'itemData'); // 不切换树
          form.validateFields().then(validate => { if (valueData.length == 0) {
          if (validate) { console.log(pramData);
          setLoading(true); form.validateFields().then(validate => {
          let obj = form.getFieldsValue(); if (validate) {
          let data = [ setLoading(true);
          { let obj = form.getFieldsValue();
          Unit: pramData.Unit || '', let data = [
          StoreType: 'nvarchar(255)', {
          Group: pramData.Group || '', Unit: pramData.Unit || '',
          Shape, StoreType: 'nvarchar(255)',
          ExceptionEvent: pramData.ExceptionEvent || '', Group: pramData.Group || '',
          RowSpan: Number(pramData.RowSpan) || 0, Shape,
          ColSpan: pramData.ColSpan || 0, ExceptionEvent: pramData.ExceptionEvent || '',
          ReadOnly: pramData.ReadOnly || false, RowSpan: Number(pramData.RowSpan) || 0,
          EditableLater: pramData.EditableLater || false, ColSpan: pramData.ColSpan || 0,
          ExceptionValue: pramData.ExceptionValue || '', ReadOnly: pramData.ReadOnly || false,
          Preset: pramData.Preset || '', EditableLater: pramData.EditableLater || false,
          ID: Number(itemData.ID), ExceptionValue: pramData.ExceptionValue || '',
          Order: Number(itemData.order), Preset: pramData.Preset || '',
          Name: obj.Name, ID: pramData.ID,
          Alias: obj.Alias, Order: pramData.Order,
          SyncEvent: obj.SyncEvent, Name: obj.Name,
          ValidationRule: obj.ValidationRule, Alias: obj.Alias,
          ExceptionEventFields: characterValue, SyncEvent: obj.SyncEvent,
          }, ValidationRule: obj.ValidationRule,
          ]; ExceptionEventFields: characterValue,
          },
          ];
          switch (Shape) { switch (Shape) {
          case '编码': case '编码':
          data[0].Config = `${obj.code}.${obj.prefix ? obj.prefix : ''}`; data[0].Config = `${obj.code}.${obj.prefix ? obj.prefix : ''}`;
          break; break;
          case '坐标控件': case '坐标控件':
          pramData.coordinates ? (data[0].Config = '当前坐标') : (data[0].Config = ''); pramData.coordinates ? (data[0].Config = '当前坐标') : (data[0].Config = '');
          break; break;
          case '图片': case '图片':
          case '可预览图片': case '可预览图片':
          data[0].Preset = pramData.picture ? '拍照相册' : ''; data[0].Preset = pramData.picture ? '拍照相册' : '';
          data[0].ValidationRule = pramData.must ? 'required' : ''; data[0].ValidationRule = pramData.must ? 'required' : '';
          break; break;
          default: default:
          data[0].Config = obj.Config; data[0].Config = obj.Config;
          }
          UpdateFields(data).then(res => {
          setLoading(false);
          if (res.msg === 'Ok' || res.msg === '') {
          form.resetFields();
          callBackSubmit();
          notification.success({
          message: '提示',
          duration: 3,
          description: '修改成功',
          });
          } else {
          notification.error({
          message: '提示',
          duration: 3,
          description: res.msg,
          });
          } }
          }); UpdateFields(data).then(res => {
          } setLoading(false);
          }); if (res.msg === 'Ok' || res.msg === '') {
          form.resetFields();
          callBackSubmit();
          notification.success({
          message: '提示',
          duration: 3,
          description: '修改成功',
          });
          } else {
          notification.error({
          message: '提示',
          duration: 3,
          description: res.msg,
          });
          }
          });
          }
          });
          } else {
          onSelect(1.14, keep);
          }
          }; };
          useEffect(() => { useEffect(() => {
          setTreeValue(treeData);
          setValueData([]);
          setShow('block');
          setExpendKey(itemData.ID);
          setCurrentSelectOrg(itemData.ID);
          console.log(treeData);
          if (isType != '') { if (isType != '') {
          let req1 = getField({ fieldID: itemData.ID }); let req1 = getField({ fieldID: itemData.ID });
          let req2 = loadTableFields({ tableName: formObj1 }); let req2 = loadTableFields({ tableName: formObj1 });
          ...@@ -207,6 +241,7 @@ const AddModal = props => { ...@@ -207,6 +241,7 @@ const AddModal = props => {
          break; break;
          } }
          setPramData({ ...res[0].data.root, coordinates, must, picture }); setPramData({ ...res[0].data.root, coordinates, must, picture });
          console.log(pramData);
          let index = res[2].data.root.find(item => { let index = res[2].data.root.find(item => {
          return item.Name == res[0].data.root.ExceptionEvent; return item.Name == res[0].data.root.ExceptionEvent;
          }); });
          ...@@ -412,248 +447,509 @@ const AddModal = props => { ...@@ -412,248 +447,509 @@ const AddModal = props => {
          } }
          setPramData(data); setPramData(data);
          }; };
          const mapTree = org => {
          const haveChildren = Array.isArray(org.children) && org.children.length > 0;
          return {
          title: (
          <span className={styles.titleText}>
          {org.children ? (
          <UnorderedListOutlined style={{ color: '#1890FF' }} />
          ) : (
          <FontColorsOutlined style={{ color: '#1890FF' }} />
          )}
          <span style={{ marginLeft: '5px' }}>{org.name}</span>
          </span>
          ),
          key: org.ID,
          // 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作
          children: haveChildren ? org.children.map(i => mapTree(i)) : [],
          org,
          };
          };
          const onSelect = (i, e) => {
          console.log(e);
          setKeep(e);
          if (e.node) {
          setCurrentSelectOrg(e.node.org.ID);
          } else {
          setCurrentSelectOrg(e.ID);
          }
          if (e.node && keepTreeFirst.indexOf(e.node.org.name) != -1) {
          setShow('none');
          } else {
          setShow('block');
          }
          if (isType != '') {
          let req1 = getField({ fieldID: e.node.org.ID });
          let req2 = loadTableFields({ tableName: formObj1 });
          let req3 = LoadEventType({});
          console.log(valueData);
          let bb = [];
          valueData.map(i => {
          bb.push(i.ID.toString());
          });
          console.log(bb);
          console.log(e.node.org.ID);
          console.log(bb.indexOf(e.node.org.ID.toString()));
          if (bb.indexOf(e.node.org.ID) != -1) {
          console.log(34353535);
          let aa = valueData.find(i => i.ID == e.node.org.ID);
          console.log(aa);
          Promise.all([req1, req2, req3]).then(res => {
          res[1].msg === 'Ok' && setFieldName(res[1].data.root);
          res[2].msg === 'Ok' && setEventList(res[2].data.root);
          if (res[0].msg === 'Ok') {
          form.setFieldsValue({ ...aa });
          if (aa.ExceptionEventFields === '') {
          setCharacterValue('');
          setCheckedList([]);
          setIsShow(false);
          } else {
          setIsShow(true);
          setCharacterValue(aa.ExceptionEventFields);
          setCheckedList(aa.ExceptionEventFields.split(','));
          }
          setShape(aa.Shape);
          let coordinates = false,
          picture = false,
          must = false;
          switch (aa.Shape) {
          case '坐标控件':
          aa.Config === '当前坐标' ? (coordinates = true) : (coordinates = false);
          break;
          case '图片':
          case '可预览图片':
          aa.Preset === '拍照相册' ? (picture = true) : (picture = false);
          aa.ValidationRule === 'required' ? (must = true) : (must = false);
          break;
          case '编码':
          let code = aa.Config.split('.');
          form.setFieldsValue({
          code: code[0] || '',
          prefix: code[1] === 'undefined' ? '' : code[1],
          });
          break;
          }
          console.log(aa);
          setPramData({ ...aa, coordinates, must, picture });
          let index = res[2].data.root.find(item => {
          return item.Name == aa.ExceptionEvent;
          });
          console.log('index', index);
          getFieldData(index.TableName);
          }
          });
          } else {
          console.log(1212122);
          Promise.all([req1, req2, req3]).then(res => {
          res[1].msg === 'Ok' && setFieldName(res[1].data.root);
          res[2].msg === 'Ok' && setEventList(res[2].data.root);
          if (res[0].msg === 'Ok') {
          form.setFieldsValue({ ...res[0].data.root });
          if (res[0].data.root.ExceptionEventFields === '') {
          setCharacterValue('');
          setCheckedList([]);
          setIsShow(false);
          } else {
          setIsShow(true);
          setCharacterValue(res[0].data.root.ExceptionEventFields);
          setCheckedList(res[0].data.root.ExceptionEventFields.split(','));
          }
          setShape(res[0].data.root.Shape);
          let coordinates = false,
          picture = false,
          must = false;
          switch (res[0].data.root.Shape) {
          case '坐标控件':
          res[0].data.root.Config === '当前坐标'
          ? (coordinates = true)
          : (coordinates = false);
          break;
          case '图片':
          case '可预览图片':
          res[0].data.root.Preset === '拍照相册' ? (picture = true) : (picture = false);
          res[0].data.root.ValidationRule === 'required' ? (must = true) : (must = false);
          break;
          case '编码':
          let code = res[0].data.root.Config.split('.');
          form.setFieldsValue({
          code: code[0] || '',
          prefix: code[1] === 'undefined' ? '' : code[1],
          });
          break;
          }
          setPramData({ ...res[0].data.root, coordinates, must, picture });
          let index = res[2].data.root.find(item => {
          return item.Name == res[0].data.root.ExceptionEvent;
          });
          console.log('index', index);
          getFieldData(index.TableName);
          }
          });
          }
          }
          form.validateFields().then(validate => {
          console.log(pramData);
          if (validate) {
          setLoading(true);
          let obj = form.getFieldsValue();
          let data = [
          {
          Unit: pramData.Unit || '',
          StoreType: 'nvarchar(255)',
          Group: pramData.Group || '',
          Shape,
          ExceptionEvent: pramData.ExceptionEvent || '',
          RowSpan: Number(pramData.RowSpan) || 0,
          ColSpan: pramData.ColSpan || 0,
          ReadOnly: pramData.ReadOnly || false,
          EditableLater: pramData.EditableLater || false,
          ExceptionValue: pramData.ExceptionValue || '',
          Preset: pramData.Preset || '',
          ID: pramData.ID,
          Order: pramData.Order,
          Name: obj.Name,
          Alias: obj.Alias,
          SyncEvent: obj.SyncEvent,
          ValidationRule: obj.ValidationRule,
          ExceptionEventFields: characterValue,
          },
          ];
          switch (Shape) {
          case '编码':
          data[0].Config = `${obj.code}.${obj.prefix ? obj.prefix : ''}`;
          break;
          case '坐标控件':
          pramData.coordinates ? (data[0].Config = '当前坐标') : (data[0].Config = '');
          break;
          case '图片':
          case '可预览图片':
          data[0].Preset = pramData.picture ? '拍照相册' : '';
          data[0].ValidationRule = pramData.must ? 'required' : '';
          break;
          default:
          data[0].Config = obj.Config;
          }
          console.log(data[0]);
          if (keepTreeFirst.indexOf(e.node.org.name) == -1) {
          if (valueData.length > 0) {
          let aa = [];
          valueData.map(i => {
          aa.push(i.ID);
          });
          if (aa.indexOf(data[0].ID) != -1) {
          valueData.map((i, j) => {
          if (i.ID == data[0].ID) {
          valueData[j] = data[0];
          }
          });
          } else {
          valueData.push(data[0]);
          }
          } else {
          valueData.push(data[0]);
          }
          }
          if (i == 1.14) {
          console.log(valueData);
          UpdateFields(valueData).then(res => {
          setLoading(false);
          if (res.msg === 'Ok' || res.msg === '') {
          form.resetFields();
          callBackSubmit();
          notification.success({
          message: '提示',
          duration: 3,
          description: '修改成功',
          });
          } else {
          notification.error({
          message: '提示',
          duration: 3,
          description: res.msg,
          });
          }
          });
          }
          }
          });
          };
          return ( return (
          <> <>
          <Drawer <Drawer
          title="修改" title="修改"
          width="600px" width="900px"
          // {...props} // {...props}
          visible={isVisible} visible={isVisible}
          onClose={onCancel} onClose={onCancel}
          destroyOnClose
          footer={ footer={
          <Space> <Space>
          <Button onClick={onCancel}>取消</Button>
          <Button onClick={onSubmit} type="primary"> <Button onClick={onSubmit} type="primary">
          确定 全部保存
          </Button> </Button>
          </Space> </Space>
          } }
          > >
          {isVisible && ( <div style={{ width: '100%', display: 'flex', justifyContent: 'flex-start' }}>
          <Form form={form} {...layout}> <div
          <Item label="字段名" name="Name" rules={[{ required: true, message: '请输入表名' }]}> style={{
          <Input placeholder="请输入别名" disabled style={{ width: '93%' }} /> width: '300px',
          </Item> overflowY: 'scroll',
          <Item label="别名" name="Alias"> height: 'calc(100vh - 160px)',
          <Input placeholder="请输入别名" allowClear style={{ width: '93%' }} /> borderRight: '1px solid #f0eded',
          </Item> }}
          <Item name="ReadOnly" label="属性"> >
          <div> <Tree
          <Checkbox checked={pramData.ReadOnly} onChange={e => onChangeReady(e, 'ReadOnly')}> showIcon="true"
          只读 blockNode
          </Checkbox> autoExpandParent
          <Checkbox selectedKeys={[currentSelectOrg]}
          checked={pramData.EditableLater} onSelect={onSelect}
          onChange={e => onChangeReady(e, 'EditableLater')} treeData={treeValue.map(t => mapTree(t))}
          > expandedKeys={expendKey}
          允许补正(事后修改) />
          </Checkbox> </div>
          </div> {show == 'block' ? (
          </Item> <div style={{ width: '600px', overflowY: 'scroll', height: 'calc(100vh - 160px)' }}>
          <Item label="同步" name="SyncEvent"> {isVisible && (
          <Radio.Group> <Form form={form} {...layout}>
          <Radio value={0} style={{ marginRight: '0.5rem' }}> <Item
          不同步 label="字段名"
          </Radio> name="Name"
          <Radio value={1} style={{ marginRight: '0.5rem' }}> rules={[{ required: true, message: '请输入表名' }]}
          工单 → 事件 >
          </Radio> <Input placeholder="请输入别名" disabled style={{ width: '93%' }} />
          <Radio value={2}>事件（上报时） → 工单</Radio> </Item>
          </Radio.Group> <Item label="别名" name="Alias">
          </Item> <Input placeholder="请输入别名" allowClear style={{ width: '93%' }} />
          </Item>
          <Item name="ReadOnly" label="属性">
          <div>
          <Checkbox
          checked={pramData.ReadOnly}
          onChange={e => onChangeReady(e, 'ReadOnly')}
          >
          只读
          </Checkbox>
          <Checkbox
          checked={pramData.EditableLater}
          onChange={e => onChangeReady(e, 'EditableLater')}
          >
          允许补正(事后修改)
          </Checkbox>
          </div>
          </Item>
          <Item label="同步" name="SyncEvent">
          <Radio.Group>
          <Radio value={0} style={{ marginRight: '0.5rem' }}>
          不同步
          </Radio>
          <Radio value={1} style={{ marginRight: '0.5rem' }}>
          工单 → 事件
          </Radio>
          <Radio value={2}>事件（上报时） → 工单</Radio>
          </Radio.Group>
          </Item>
          <Item label="形态"> <Item label="形态">
          <div className={styles.listEvent}> <div className={styles.listEvent}>
          <Select <Select
          style={{ width: '42%' }} style={{ width: '42%' }}
          value={Shape} value={Shape}
          onChange={handleCharacteristics} onChange={handleCharacteristics}
          showSearch showSearch
          > >
          {characteristics.length {characteristics.length
          ? characteristics.map((item, index) => { ? characteristics.map((item, index) => {
          return (
          <Select.Option key={index} value={item}>
          {item}
          </Select.Option>
          );
          })
          : ''}
          </Select>
          <div className={styles.unit}>
          单位：
          <Input
          style={{ width: '5rem' }}
          placeholder=""
          allowClear
          value={pramData.Unit}
          onChange={e => handleInput(e, 'Unit')}
          />
          </div>
          <div className={styles.unit}>
          宽：
          <Input
          style={{ width: '3.8rem' }}
          placeholder=""
          allowClear
          value={pramData.RowSpan}
          onChange={e => handleInput(e, 'RowSpan')}
          onkeyup="value=value.replace(/[^\d]/g,'')"
          />
          </div>
          </div>
          </Item>
          {(() => {
          switch (Shape) {
          case '编码':
          return ( return (
          <Select.Option key={index} value={item}> <>
          {item} <Item label="前缀" name="prefix">
          </Select.Option> <Input style={{ width: '93%' }} placeholder="" allowClear />
          </Item>
          <Item label="编码方式" name="code">
          <Radio.Group>
          <Radio value="年份编码" style={{ marginRight: '0.5rem' }}>
          XJ-2019-000001（前缀-年份-六位编码）
          </Radio>
          <Radio value="年月编码" style={{ marginRight: '0.5rem' }}>
          XJ-201909-000001（前缀-年份月份-六位编码）
          </Radio>
          <Radio value="一般编码" defaultChecked>
          XJ00000001（前缀 八位编码）
          </Radio>
          </Radio.Group>
          </Item>
          </>
          ); );
          }) case '值选择器':
          : ''} case '值复选器':
          </Select> case '可编辑值选择器':
          <div className={styles.unit}> case '平铺值选择器':
          单位： return (
          <Input <>
          style={{ width: '5rem' }} {' '}
          placeholder="" <Item label="可选值" name="Config">
          allowClear <TextArea allowClear style={{ width: '93%' }} />
          value={pramData.Unit} </Item>
          onChange={e => handleInput(e, 'Unit')} <Item colon={false} label=" ">
          /> {' '}
          </div> <div style={{ display: 'flex', alignItems: 'center' }}>
          <div className={styles.unit}> <span style={{ marginRight: '0.4rem' }}>
          宽： 以英文逗号为分隔符填写，或其他分隔符粘贴：
          <Input </span>
          style={{ width: '3.8rem' }} <Select onChange={handleSeparator} style={{ width: '30.8%' }}>
          placeholder="" <Select.Option value="0">以,分隔(英文逗号)</Select.Option>
          allowClear <Select.Option value="1">以/分隔(正斜杠)</Select.Option>
          value={pramData.RowSpan} <Select.Option value="2">以\\分隔(反斜杠)</Select.Option>
          onChange={e => handleInput(e, 'RowSpan')} <Select.Option value="3">以、分隔(中文顿号)</Select.Option>
          /> <Select.Option value="4">以;分隔(英文分号)</Select.Option>
          </div> <Select.Option value="5">以；分隔(中文分号)</Select.Option>
          </div> <Select.Option value="6">(是)/否</Select.Option>
          </Item> <Select.Option value="7">是/(否)</Select.Option>
          {(() => { <Select.Option value="8">(否)/是</Select.Option>
          switch (Shape) { </Select>
          case '编码': </div>
          return ( </Item>
          <> </>
          <Item label="前缀" name="prefix"> );
          <Input style={{ width: '93%' }} placeholder="" allowClear /> case '图片':
          </Item> case '可预览图片':
          <Item label="编码方式" name="code"> return (
          <Radio.Group> <Item name="ReadOnly" label="选项">
          <Radio value="年份编码" style={{ marginRight: '0.5rem' }}> <div>
          XJ-2019-000001（前缀-年份-六位编码） <Checkbox
          </Radio> checked={pramData.picture}
          <Radio value="年月编码" style={{ marginRight: '0.5rem' }}> onChange={e => onChangeReady(e, 'picture')}
          XJ-201909-000001（前缀-年份月份-六位编码） >
          </Radio> 允许从相册选取
          <Radio value="一般编码" defaultChecked> </Checkbox>
          XJ00000001（前缀 八位编码） <Checkbox
          </Radio> checked={pramData.must}
          </Radio.Group> onChange={e => onChangeReady(e, 'must')}
          </Item> >
          </> 必填字段
          ); </Checkbox>
          case '值选择器': </div>
          case '值复选器': </Item>
          case '可编辑值选择器': );
          case '平铺值选择器': case '日期时间':
          return ( case '日期':
          <> case '日期月份':
          {' '} case '日期年份':
          <Item label="可选值" name="Config"> case '日期周':
          <TextArea allowClear style={{ width: '93%' }} /> case '时分秒':
          </Item> return (
          <Item colon={false} label=" "> <Item label="选项" name="Config">
          {' '} <Radio.Group style={{ marginTop: '0.3rem' }}>
          <div style={{ display: 'flex', alignItems: 'center' }}> <Radio
          <span style={{ marginRight: '0.4rem' }}> value="默认为空"
          以英文逗号为分隔符填写，或其他分隔符粘贴： defaultChecked
          </span> style={{ width: '18rem', marginBottom: '0.5rem' }}
          <Select onChange={handleSeparator} style={{ width: '30.8%' }}> >
          <Select.Option value="0">以,分隔(英文逗号)</Select.Option> 默认为空
          <Select.Option value="1">以/分隔(正斜杠)</Select.Option> </Radio>
          <Select.Option value="2">以\\分隔(反斜杠)</Select.Option> <Radio value="">默认为当前时间</Radio>
          <Select.Option value="3">以、分隔(中文顿号)</Select.Option> <Radio value="不可选择" style={{ width: '18rem' }}>
          <Select.Option value="4">以;分隔(英文分号)</Select.Option> 锁定为当前时间(通过用户点击刷新)
          <Select.Option value="5">以；分隔(中文分号)</Select.Option> </Radio>
          <Select.Option value="6">(是)/否</Select.Option> <Radio value="不超过当前时间">不超过当前时间</Radio>
          <Select.Option value="7">是/(否)</Select.Option> </Radio.Group>
          <Select.Option value="8">(否)/是</Select.Option> </Item>
          </Select> );
          </div> case '坐标控件':
          </Item> return (
          </> <Item label="选项" name="Config">
          ); <div>
          case '图片': <Checkbox
          case '可预览图片': value="当前坐标"
          return ( style={{ marginRight: '0.2rem' }}
          <Item name="ReadOnly" label="选项"> checked={pramData.coordinates}
          <div> onChange={e => onChangeReady(e, 'coordinates')}
          <Checkbox />
          checked={pramData.picture} 锁定为当前位置坐标
          onChange={e => onChangeReady(e, 'picture')} </div>
          > </Item>
          允许从相册选取 );
          </Checkbox> default:
          <Checkbox checked={pramData.must} onChange={e => onChangeReady(e, 'must')}> return (
          必填字段 <Item label="配置" name="Config">
          </Checkbox> <TextArea allowClear style={{ width: '93%' }} />
          </div> </Item>
          </Item> );
          ); }
          case '日期时间': })()}
          case '日期': {Shape === '图片' || Shape === '可预览图片' ? (
          case '日期月份': ''
          case '日期年份': ) : (
          case '日期周': <Item label="预设值">
          case '时分秒': <div className={styles.listEvent}>
          return ( <Input
          <Item label="选项" name="Config"> style={{ width: '42%', height: '1.8rem' }}
          <Radio.Group style={{ marginTop: '0.3rem' }}> value={pramData.Preset}
          <Radio onChange={e => handleInput(e, 'Preset')}
          value="默认为空" placeholder=""
          defaultChecked allowClear
          style={{ width: '18rem', marginBottom: '0.5rem' }}
          >
          默认为空
          </Radio>
          <Radio value="">默认为当前时间</Radio>
          <Radio value="不可选择" style={{ width: '18rem' }}>
          锁定为当前时间(通过用户点击刷新)
          </Radio>
          <Radio value="不超过当前时间">不超过当前时间</Radio>
          </Radio.Group>
          </Item>
          );
          case '坐标控件':
          return (
          <Item label="选项" name="Config">
          <div>
          <Checkbox
          value="当前坐标"
          style={{ marginRight: '0.2rem' }}
          checked={pramData.coordinates}
          onChange={e => onChangeReady(e, 'coordinates')}
          /> />
          锁定为当前位置坐标 <Item
          style={{ marginLeft: '1rem' }}
          label="验证"
          name="ValidationRule"
          style={{ margin: '0 0 0 1rem' }}
          >
          <Input style={{ width: '95%' }} placeholder="" allowClear />
          </Item>
          <Tooltip title="选择验证规则">
          <PlusSquareOutlined
          onClick={() => add('rule')}
          style={{
          fontSize: '24px',
          color: '#1890FF',
          display: 'flex',
          alignItems: 'center',
          }}
          />
          </Tooltip>
          </div> </div>
          </Item> </Item>
          ); )}
          default: {/* <Item label="异常值">
          return (
          <Item label="配置" name="Config">
          <TextArea allowClear style={{ width: '93%' }} />
          </Item>
          );
          }
          })()}
          {Shape === '图片' || Shape === '可预览图片' ? (
          ''
          ) : (
          <Item label="预设值">
          <div className={styles.listEvent}>
          <Input
          style={{ width: '42%', height: '1.8rem' }}
          value={pramData.Preset}
          onChange={e => handleInput(e, 'Preset')}
          placeholder=""
          allowClear
          />
          <Item
          style={{ marginLeft: '1rem' }}
          label="验证"
          name="ValidationRule"
          style={{ margin: '0 0 0 1rem' }}
          >
          <Input style={{ width: '95%' }} placeholder="" allowClear />
          </Item>
          <Tooltip title="选择验证规则">
          <PlusSquareOutlined
          onClick={() => add('rule')}
          style={{
          fontSize: '24px',
          color: '#1890FF',
          display: 'flex',
          alignItems: 'center',
          }}
          />
          </Tooltip>
          </div>
          </Item>
          )}
          {/* <Item label="异常值">
          <div className={styles.listEvent}> <div className={styles.listEvent}>
          <Input <Input
          style={{ width: '40%', height: '1.8rem' }} style={{ width: '40%', height: '1.8rem' }}
          ...@@ -712,9 +1008,9 @@ const AddModal = props => { ...@@ -712,9 +1008,9 @@ const AddModal = props => {
          </Tooltip> </Tooltip>
          </div> </div>
          </Item> */} </Item> */}
          </Form> </Form>
          )} )}
          {/* <ChangeAdd {/* <ChangeAdd
          visible={visible} visible={visible}
          onCancel={() => setVisible(false)} onCancel={() => setVisible(false)}
          callBackSubmit={onOK} callBackSubmit={onOK}
          ...@@ -724,16 +1020,23 @@ const AddModal = props => { ...@@ -724,16 +1020,23 @@ const AddModal = props => {
          characterValue={characterValue} characterValue={characterValue}
          formObj={formObj} formObj={formObj}
          /> */} /> */}
          <VerifyModal <VerifyModal
          visible={visible} visible={visible}
          onCancel={() => setVisible(false)} onCancel={() => setVisible(false)}
          callBackSubmit={onOK} callBackSubmit={onOK}
          newCheckedList={checkedList} newCheckedList={checkedList}
          isType={type} isType={type}
          filed={filed} filed={filed}
          characterValue={characterValue} characterValue={characterValue}
          formObj={formObj} formObj={formObj}
          /> />
          </div>
          ) : (
          <div style={{ margin: '0 auto' }}>
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="当前未选中字段" />
          </div>
          )}
          </div>
          </Drawer> </Drawer>
          </> </>
          ); );
          ......
          src/pages/bsmanager/base/tablemanager/filedConfig/filedConfig.jsx
          View file @ ee819e2f
          ...@@ -21,6 +21,8 @@ import LoadGroup from '../components/Field/loadGroupNew'; ...@@ -21,6 +21,8 @@ import LoadGroup from '../components/Field/loadGroupNew';
          const AddModal = props => { const AddModal = props => {
          const history = useHistory(); const history = useHistory();
          const [allData, setAllData] = useState([]); const [allData, setAllData] = useState([]);
          const [treeData, setTreeData] = useState([]);
          const [keepTreeFirst, setKeepTreeFirst] = useState([]);
          const [tableList, setTableList] = useState([]); const [tableList, setTableList] = useState([]);
          const [tableData, setTableData] = useState([]); const [tableData, setTableData] = useState([]);
          const [treeLoading, setTreeLoading] = useState(false); const [treeLoading, setTreeLoading] = useState(false);
          ...@@ -265,8 +267,16 @@ const AddModal = props => { ...@@ -265,8 +267,16 @@ const AddModal = props => {
          newArr.push({ type: item, key: index, id: index }); newArr.push({ type: item, key: index, id: index });
          }); });
          setAllData(arr); setAllData(arr);
          console.log(arr);
          let aa = [];
          let bb = [];
          Object.keys(arr).forEach((item, index) => {
          aa.push({ name: item, key: index, ID: index, children: arr[item] });
          bb.push(item);
          });
          setKeepTreeFirst(bb);
          setTreeData(aa);
          setTableData(newArr); setTableData(newArr);
          console.log(newArr);
          setSelect(newArr); setSelect(newArr);
          } }
          }); });
          ...@@ -382,7 +392,7 @@ const AddModal = props => { ...@@ -382,7 +392,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 className={styles.btn}> <div className={styles.btn}>
          <Button type="primary" icon={<PlusSquareOutlined />} onClick={add}> <Button type="primary" icon={<PlusSquareOutlined />} onClick={add}>
          附加 附加
          ...@@ -420,6 +430,8 @@ const AddModal = props => { ...@@ -420,6 +430,8 @@ const AddModal = props => {
          itemData={itemData} itemData={itemData}
          formObj1={formObj} formObj1={formObj}
          onCancel={() => setIsVisible(false)} onCancel={() => setIsVisible(false)}
          treeData={treeData}
          keepTreeFirst={keepTreeFirst}
          callBackSubmit={Submit} callBackSubmit={Submit}
          /> />
          {visible && type === 'affiliateAdd' && ( {visible && type === 'affiliateAdd' && (
          ......
          src/pages/bsmanager/base/tablemanager/filedConfig/index.less
          View file @ ee819e2f
          .field{ .field {
          width:100%; width: 100%;
          display: flex; display: flex;
          justify-content: flex-start; justify-content: flex-start;
          flex-wrap: wrap; flex-wrap: wrap;
          max-height: 20rem; max-height: 20rem;
          overflow-y: scroll;
          .ant-card {
          width: 80%;
          margin-left: 4rem;
          }
          .ant-card-head-title {
          flex: none;
          }
          .ant-card-extra {
          margin-left: 0.2rem;
          }
          .ant-card-body {
          // padding: 0 ;
          height: 15rem;
          overflow-y: scroll; overflow-y: scroll;
          .ant-card{ }
          width: 80%; .ant-drawer-body {
          margin-left: 4rem; overflow: hidden;
          } }
          .ant-card-head-title{
          flex: none;
          }
          .ant-card-extra{
          margin-left: 0.2rem;
          }
          .ant-card-body{
          // padding: 0 ;
          height: 15rem;
          overflow-y: scroll;
          }
          } }
          .containerBox { .containerBox {
          width: 100vm; width: 100vm;
          height: calc(100vh - 90px) ; height: calc(100vh - 90px);
          background: #ffffff; background: #ffffff;
          .ant-table.ant-table-small .ant-table-tbody .ant-table-wrapper:only-child .ant-table{ .ant-table.ant-table-small .ant-table-tbody .ant-table-wrapper:only-child .ant-table {
          margin-left: 0; margin-left: 0;
          } }
          .ant-table.ant-table-bordered > .ant-table-container{ .ant-table.ant-table-bordered > .ant-table-container {
          border: none; border: none;
          } }
          .clickRowStyle{ .clickRowStyle {
          background: #cfe7fd; background: #cfe7fd;
          } }
          .ant-table-thead tr th{ .ant-table-thead tr th {
          font-weight: 600; font-weight: 600;
          color:rgba(0,0,0,0.85); color: rgba(0, 0, 0, 0.85);
          } }
          } }
          .paneTitle{ .paneTitle {
          font-weight: bold; font-weight: bold;
          font-size: 18px; font-size: 18px;
          margin: 0 0 0.5rem 4rem; margin: 0 0 0.5rem 4rem;
          } }
          .listEvent{ .listEvent {
          display: flex; display: flex;
          } }
          .cardList{ .cardList {
          .ant-card-body{ .ant-card-body {
          overflow-y:none !important; overflow-y: none !important;
          } }
          } }
          .unit{ .unit {
          display: flex; display: flex;
          margin-left: 1.1rem; margin-left: 1.1rem;
          align-items: center; align-items: center;
          } }
          .listCard{ .listCard {
          display: flex; display: flex;
          .cardItem{ .cardItem {
          width: 50%; width: 50%;
          padding: 0.5rem; padding: 0.5rem;
          } }
          .cardContent{ .cardContent {
          height: 25rem; height: 25rem;
          overflow-y: scroll; overflow-y: scroll;
          width: 19.5rem; width: 19.5rem;
          } }
          .cardItemData{ .cardItemData {
          padding: 1rem; padding: 1rem;
          border: 1px solid #b5b8c8; border: 1px solid #b5b8c8;
          margin-bottom: 1rem; margin-bottom: 1rem;
          } }
          } }
          .sortable-ghost { .sortable-ghost {
          border-bottom: 2px dashed #1890ff; border-bottom: 2px dashed #1890ff;
          } }
          .doctorTable { .doctorTable {
          margin-bottom: 16px; margin-bottom: 16px;
          table { table {
          width: 100%; width: 100%;
          td { td {
          padding: 6px; padding: 6px;
          border: 1px solid #e8e8e8; border: 1px solid #e8e8e8;
          } }
          thead { thead {
          tr { tr {
          font-weight: 600; font-weight: 600;
          background: #FAFAFA; background: #fafafa;
          }
          } }
          tbody{ }
          tr:hover{ tbody {
          background-color:#ededed ; tr:hover {
          } background-color: #ededed;
          } }
          } }
          } }
          .config{ }
          display: flex; .config {
          padding: 1rem 0 0.5rem 0.5rem; display: flex;
          justify-content: space-between; padding: 1rem 0 0.5rem 0.5rem;
          width: calc(100% - 10px); justify-content: space-between;
          .title{ width: calc(100% - 10px);
          font-size: 18px; .title {
          color: rgba(0, 114, 255, 1); font-size: 18px;
          font-weight: bold; color: rgba(0, 114, 255, 1);
          } font-weight: bold;
          .btn{
          display: flex;
          justify-content: space-around;
          width: 20rem;
          }
          .ant-btn{
          display: flex;
          align-items: center;
          }
          } }
          .btn {
          display: flex;
          justify-content: space-around;
          width: 20rem;
          }
          .ant-btn {
          display: flex;
          align-items: center;
          }
          }
          src/pages/bsmanager/base/tablemanager/index.jsx
          View file @ ee819e2f
          ...@@ -535,7 +535,7 @@ const TableManager = props => { ...@@ -535,7 +535,7 @@ const TableManager = props => {
          expandRowByClick expandRowByClick
          expandedRowKeys={chooseLine} expandedRowKeys={chooseLine}
          dataSource={groupArr} dataSource={groupArr}
          scroll={{ y: 'calc(100vh - 190px)' }} scroll={{ y: 'calc(100vh - 170px)' }}
          size="small" size="small"
          pagination={false} pagination={false}
          onExpand={onUnfold} onExpand={onUnfold}
          ......
          src/pages/platformCenter/videoManager/AddModal.jsx
          View file @ ee819e2f
          ...@@ -128,7 +128,7 @@ const AddModal = props => { ...@@ -128,7 +128,7 @@ const AddModal = props => {
          }, },
          ]} ]}
          > >
          <Input placeholder="请输入名称" /> <Input placeholder="请输入名称" maxlength="20px" />
          </Item> </Item>
          </Col> </Col>
          {(() => { {(() => {
          ...@@ -390,7 +390,7 @@ const AddModal = props => { ...@@ -390,7 +390,7 @@ const AddModal = props => {
          }, },
          ]} ]}
          > >
          <Input placeholder="账户登录名" /> <Input placeholder="账户登录名" maxlength="100px" />
          </Item> </Item>
          </Col> </Col>
          <Col span={12}> <Col span={12}>
          ...@@ -542,7 +542,7 @@ const AddModal = props => { ...@@ -542,7 +542,7 @@ const AddModal = props => {
          name="PlayZeroChannel" name="PlayZeroChannel"
          rules={[ rules={[
          { {
          validator: (rule, value) => { validator: (__rule, value) => {
          if (form.getFieldsValue().PlayZeroChannel == '') { if (form.getFieldsValue().PlayZeroChannel == '') {
          return Promise.reject('请输入设备端口'); return Promise.reject('请输入设备端口');
          } }
          ...@@ -616,7 +616,7 @@ const AddModal = props => { ...@@ -616,7 +616,7 @@ const AddModal = props => {
          name="StreamType" name="StreamType"
          rules={[ rules={[
          { {
          validator: (rule, value) => { validator: (_rule, value) => {
          if (form.getFieldsValue().StreamType == '') { if (form.getFieldsValue().StreamType == '') {
          return Promise.reject('请选择码流类型'); return Promise.reject('请选择码流类型');
          } }
          ......
          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