2019-11-19update

king

2019-11-19 4d201e812c323b3d73e53607b83e6341568f2ab1

2019-11-19update

 src/components/sidemenu/comtableconfig/columnform/index.jsx

@@ -34,7 +34,7 @@
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'spinner') { // 文本搜索
      } else if (item.type === 'number') { // 文本搜索
        fields.push(
          <Col span={12} key={index}>
            <Form.Item label={item.label}>
@@ -46,7 +46,7 @@
                    message: this.props.dict['form.required.input'] + item.label + '!'
                  }
                ]
              })(<InputNumber min={1} max={1000} />)}
              })(<InputNumber min={1} max={1000} precision={item.decimal} />)}
            </Form.Item>
          </Col>
        )

 src/components/sidemenu/comtableconfig/dragelement/card.jsx

@@ -53,7 +53,7 @@
            {(card.type === 'select' || card.type === 'link') &&
              <Select defaultValue={card.initval}></Select>
            }
            {card.type === 'dateday' &&
            {card.type === 'date' &&
              <DatePicker defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD') : null} />
            }
            {card.type === 'datetime' &&

 src/components/sidemenu/comtableconfig/dragelement/index.jsx

@@ -107,7 +107,8 @@
        newcard.label = 'fieldName'
        newcard.field = ''
        newcard.Hide = 'false'
        newcard.IsSort = item.subType
        newcard.IsSort = 'true'
        newcard.type = item.subType
        newcard.Width = 120
      }
      

 src/components/sidemenu/comtableconfig/editcard/index.jsx

@@ -7,19 +7,19 @@
    super(props)

    this.state = {
      selected: false,
      card: props.card
      card: props.card,
      type: props.type
    }
  }

  changeSelect = () => {
    const { card } = this.state
    this.setState({
      selected: !this.state.selected
      card: {...card, selected: !card.selected}
    })
  }

  changeType = (e) => {
    console.log(e.target.value)
    const { card } = this.state
    this.setState({
      card: {...card, type: e.target.value}
@@ -27,20 +27,24 @@
  }

  render() {
    const { card } = this.state
    const { card, type } = this.state
    return (
      <div className={'ant-card ant-card-bordered ' + (this.state.selected ? 'selected' : '')} >
      <div className={'ant-card ant-card-bordered ' + (card.selected ? 'selected' : '')} >
        <div className="base" onClick={this.changeSelect}>
          <Icon type="check" />
          <p>字段名: {card.label}</p>
          <p>提示文字: {card.field}</p>
          <p title={card.field}>字段名: {card.field}</p>
          <p title={card.label}>提示文字: {card.label}</p>
        </div>
        <label>类型:</label>
        <Radio.Group onChange={this.changeType} value={this.state.card.type} disabled={!this.state.selected}>
        {type === 'search' && <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}>
          <Radio value="text">text</Radio>
          <Radio value="select">select</Radio>
          <Radio value="date">date</Radio>
        </Radio.Group>
          <Radio value="datetime">datetime</Radio>
        </Radio.Group>}
        {type === 'columns' && <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}>
          <Radio value="text">text</Radio>
          <Radio value="picture">picture</Radio>
        </Radio.Group>}
      </div>
    )
  }
@@ -52,30 +56,27 @@

    this.state = {
      dataSource: props.data,
      title: props.title
      type: props.type
    }
  }

  getSelectedCard = () => {
    let box = []
    this.state.dataSource.forEach((item, index) => {
      if (this.refs['cellCard' + index].state.selected) {
        box.push(this.refs['cellCard' + index].state.card)
      }
    })
    return box
  }

  render() {
    const { dataSource, title } = this.state
    const { dataSource, type } = this.state

    return (
      <div className="common-modal-edit-card">
        {title && <h4>{title}</h4>}
        <Row>
          {dataSource.map((item, index) => (
            <Col key={index} span={8}>
              <EditCardCell ref={'cellCard' + index} card={item} />
              <EditCardCell ref={'cellCard' + index} type={type} card={item} />
            </Col>
          ))}
        </Row>

 src/components/sidemenu/comtableconfig/editcard/index.scss

@@ -7,9 +7,16 @@
      padding: 10px;
      p {
        margin-bottom: 5px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      label {
        margin-right: 10px;
        margin-right: 7px;
        span.ant-radio + * {
          padding-right: 0px;
          padding-left: 4px;
        }
      }
      .anticon {
        position: absolute;

 src/components/sidemenu/comtableconfig/index.jsx

@@ -3,7 +3,7 @@
// import { is, fromJS } from 'immutable'
import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import { Button, Card, Modal, Collapse, notification, Spin, Row, Col, Select, List, Icon } from 'antd'
import { Button, Card, Modal, Collapse, notification, Spin, Select, List, Icon } from 'antd'
import DragElement from './dragelement'
import SourceElement from './dragelement/source'
import Api from '@/api'
@@ -19,7 +19,7 @@

const { Panel } = Collapse
const { Option } = Select
const HeaderDict = (!localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN') ? zhCN : enUS
const CommonDict = (!localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN') ? zhCN : enUS

class ComTableConfig extends Component {
  static propTpyes = {
@@ -31,13 +31,13 @@
  }

  state = {
    dict: HeaderDict, // 字典
    dict: CommonDict, // 字典
    config: null, // 页面配置
    visible: false, // 搜索条件、按钮、显示列，模态框显示控制
    tableVisible: false, // 数据表字段模态框
    addType: '', // 添加类型-搜索条件或显示列
    tableColumns: [], // 表格显示列
    option: {}, // 搜索条件及显示列，可选条件包括normal、others
    fields: null, // 搜索条件及显示列，可选字段
    loading: false, // 加载中（获取表数据）
    menuformlist: null, // 基本信息表单字段
    formlist: null, // 搜索条件、按钮、显示列表单字段
@@ -106,7 +106,7 @@
          label: 'date',
          field: '',
          initval: '',
          type: 'dateday',
          type: 'date',
          resourceType: '0',
          setAll: 'false',
          options: [],
@@ -192,6 +192,7 @@
          field: '',
          Hide: 'false',
          IsSort: 'true',
          type: 'text',
          Width: 120
        }, {
          origin: true,
@@ -202,6 +203,7 @@
          field: '',
          Hide: 'false',
          IsSort: 'true',
          type: 'text',
          Width: 120
        }, {
          origin: true,
@@ -212,6 +214,7 @@
          field: '',
          Hide: 'false',
          IsSort: 'true',
          type: 'text',
          Width: 120
        }, {
          origin: true,
@@ -222,6 +225,7 @@
          field: '',
          Hide: 'false',
          IsSort: 'true',
          type: 'text',
          Width: 120
        }
      ]
@@ -242,7 +246,7 @@
      {
        type: 'search',
        label: '时间框（天）',
        subType: 'dateday',
        subType: 'date',
        url: ''
      },
      {
@@ -255,37 +259,37 @@
    actionItems: [
      {
        type: 'action',
        label: HeaderDict['header.form.pop'],
        label: CommonDict['header.form.pop'],
        subType: 'pop',
        url: ''
      },
      {
        type: 'action',
        label: HeaderDict['header.form.prompt'],
        label: CommonDict['header.form.prompt'],
        subType: 'prompt',
        url: ''
      },
      {
        type: 'action',
        label: HeaderDict['header.form.exec'],
        label: CommonDict['header.form.exec'],
        subType: 'exec',
        url: ''
      },
      {
        type: 'action',
        label: HeaderDict['header.form.tab'],
        label: CommonDict['header.form.tab'],
        subType: 'tab',
        url: ''
      },
      {
        type: 'action',
        label: HeaderDict['header.form.newpage'],
        label: CommonDict['header.form.newpage'],
        subType: 'newpage',
        url: ''
      },
      {
        type: 'action',
        label: HeaderDict['header.form.blank'],
        label: CommonDict['header.form.blank'],
        subType: 'blank',
        url: ''
      }
@@ -293,14 +297,14 @@
    columnItems: [
      {
        type: 'columns',
        label: '排序列',
        subType: 'true',
        label: CommonDict['header.form.text'],
        subType: 'text',
        url: ''
      },
      {
        type: 'columns',
        label: '非排序列',
        subType: 'false',
        label: CommonDict['header.form.picture'],
        subType: 'picture',
        url: ''
      }
    ]
@@ -377,7 +381,7 @@
            MenuID: 'link',
            text: this.state.dict['header.form.link']
          }, {
            MenuID: 'dateday',
            MenuID: 'date',
            text: this.state.dict['header.form.dateday']
          }, {
            MenuID: 'datetime',
@@ -647,6 +651,20 @@
        },
        {
          type: 'select',
          key: 'type',
          label: this.state.dict['header.form.type'],
          initVal: card.type,
          required: true,
          options: [{
            MenuID: 'text',
            text: this.state.dict['header.form.text']
          }, {
            MenuID: 'picture',
            text: this.state.dict['header.form.picture']
          }]
        },
        {
          type: 'select',
          key: 'Align',
          label: this.state.dict['header.form.align'],
          initVal: card.Align,
@@ -691,8 +709,9 @@
          }]
        },
        {
          type: 'spinner',
          type: 'number',
          key: 'Width',
          decimal: 0,
          label: this.state.dict['header.form.columnWidth'],
          initVal: card.Width,
          required: true
@@ -803,33 +822,126 @@
    })

    if (type === 'search') {
      let others = []
      config.search.forEach(item => {
        if (columns.has(item.field)) {
          columns.set(item.field, item)
        } else if (item.field) {
          others.push(item)
          columns.set(item.field, {...item, selected: true, type: item.type})
        }
      })
    } else if (type === 'columns') {
      config.columns.forEach(item => {
        if (columns.has(item.field)) {
          columns.set(item.field, {...item, selected: true, type: item.type})
        }
      })
    }
      this.setState({
        addType: type,
        tableVisible: true,
        option: {
          normal: [...columns.values()],
          others: others
        }
      }, () => {
        console.log(this.state.option)
      fields: [...columns.values()]
      })
    }
    // console.log(tableColumns)
    // console.log(columns)
    // console.log(config)
  }

  addFieldSubmit = () => {
    const {addType, config} = this.state

    let cards = this.refs.searchcard.getSelectedCard()
    console.log(cards)
    let columns = new Map()
    cards.forEach(card => {
      columns.set(card.field, card)
    })

    let items = []
    if (addType === 'search') {
      config.search.forEach(item => {
        if (columns.has(item.field)) {
          let cell = columns.get(item.field)

          if (cell.selected) {
            items.push(item)
          }
          columns.delete(item.field)
        } else if (!item.origin) {
          items.push(item)
        }
      })

      let _columns = [...columns.values()]
      let indexes = items.map(card => {return card.id})
      let id = Math.max(...indexes, 0)

      _columns.forEach(item => {
        if (item.selected) {
          let newcard = {
            id: id,
            uuid: Utils.getuuid(),
            label: item.label,
            field: item.field,
            initval: '',
            type: item.type,
            resourceType: '0',
            setAll: 'false',
            options: [],
            dataSource: '',
            linkField: '',
            valueField: '',
            valueText: '',
            orderBy: '',
            orderType: 'asc',
            display: 'dropdown'
          }

          items.push(newcard)
          id++
        }
      })
    } else {
      config.columns.forEach(item => {
        if (columns.has(item.field)) {
          let cell = columns.get(item.field)

          if (cell.selected) {
            items.push(item)
          }
          columns.delete(item.field)
        } else if (!item.origin) {
          items.push(item)
        }
      })

      let _columns = [...columns.values()]
      let indexes = items.map(card => {return card.id})
      let id = Math.max(...indexes, 0)

      _columns.forEach(item => {
        if (item.selected) {
          let newcard = {
            id: id,
            uuid: Utils.getuuid(),
            Align: 'left',
            label: item.label,
            field: item.field,
            Hide: 'false',
            IsSort: 'true',
            Width: 120
          }

          items.push(newcard)
          id++
        }
      })
    }

    this.setState({
      tableVisible: false,
      [addType + 'loading']: true,
      addType: '',
      config: {...config, [addType]: items}
    })
    setTimeout(() => {
      this.setState({
        [addType + 'loading']: false
      })
    }, 100)
  }

  cancelFieldSubmit = () => {
@@ -890,6 +1002,12 @@
        }
      ]
    })
    let _text = "select TbName ,Remark from sDataDictionary where IsKey!='' and Deleted =0"
    _text = Utils.formatOptions(_text)
    console.log(_text)
    // Api.getSystemConfig({func: 'sPC_Get_SelectedList', LText: _text, obj_name: ''}).then(res => {

    // })
  }

  onTableChange = (value) => {
@@ -901,207 +1019,49 @@
      this.setState({
        selectedTables: [...selectedTables, _table]
      })
      let SUsers = [
        {
          field: 'UID',
          label: 'UID',
          type: 'text'
        },
        {
          field: 'UserCode',
          label: 'UserCode',
          type: 'text'
        },
        {
          field: 'UserName',
          label: 'UserName',
          type: 'text'
        },
        {
          field: 'PassWord',
          label: 'PassWord',
          type: 'text'
        },
        {
          field: 'FullName',
          label: 'FullName',
          type: 'text'
        },
        {
          field: 'RoleID',
          label: 'RoleID',
          type: 'text'
        },
        {
          field: 'RoleName',
          label: 'RoleName',
          type: 'text'
        }
      ]
      let SMenus = [
        {
          field: 'RoleID',
          label: 'RoleID',
          type: 'text'
        },
        {
          field: 'RoleName',
          label: 'RoleName',
          type: 'text'
        },
        {
          field: 'DepartmentCode',
          label: 'DepartmentCode',
          type: 'text'
        },
        {
          field: 'Organization',
          label: 'Organization',
          type: 'text'
        },
        {
          field: 'CSS',
          label: 'CSS',
          type: 'text'
        },
        {
          field: 'HeadImage',
          label: 'HeadImage',
          type: 'text'
        },
        {
          field: 'StaffID',
          label: 'StaffID',
          type: 'text'
        },
        {
          field: 'Remark',
          label: 'Remark',
          type: 'text'
        },
        {
          field: 'Deleted',
          label: 'Deleted',
          type: 'text'
        },
        {
          field: 'APICode',
          label: 'APICode',
          type: 'text'
        },
        {
          field: 'Status',
          label: 'Status',
          type: 'text'
        },
        {
          field: 'Type',
          label: 'Type',
          type: 'text'
        },
        {
          field: 'CreateDate',
          label: 'CreateDate',
          type: 'date'
        }
      ]
      let SColumns = [
        {
          field: 'Type',
          label: 'Type',
          type: 'text'
        },
        {
          field: 'CreateDate',
          label: 'CreateDate',
          type: 'date'
        },
        {
          field: 'CreateUserID',
          label: 'CreateUserID',
          type: 'text'
        },
        {
          field: 'CreateUser',
          label: 'CreateUser',
          type: 'text'
        },
        {
          field: 'CreateStaff',
          label: 'CreateStaff',
          type: 'text'
        },
        {
          field: 'CreateDepartCode',
          label: 'CreateDepartCode',
          type: 'text'
        },
        {
          field: 'ModifyDate',
          label: 'ModifyDate',
          type: 'date'
        },
        {
          field: 'ModifyUserID',
          label: 'ModifyUserID',
          type: 'text'
        },
        {
          field: 'ModifyUser',
          label: 'ModifyUser',
          type: 'text'
        },
        {
          field: 'ModifyDepartCode',
          label: 'ModifyDepartCode',
          type: 'text'
        },
        {
          field: 'ModifyOrganCode',
          label: 'ModifyOrganCode',
          type: 'text'
        }
      ]
      let SActions = [
        {
          field: 'ModifyDepartCode',
          label: 'ModifyDepartCode',
          type: 'text'
        },
        {
          field: 'ModifyOrganCode',
          label: 'ModifyOrganCode',
          type: 'text'
        },
        {
          field: 'SubmitDate',
          label: 'SubmitDate',
          type: 'date'
        },
        {
          field: 'SubmitUserID',
          label: 'SubmitUserID',
          type: 'text'
        },
        {
          field: 'SubmitUser',
          label: 'SubmitUser',
          type: 'text'
        }
      ]
      Api.getSystemConfig({func: 'sPC_Get_MainMenu'}).then(res => {
      Api.getSystemConfig({func: 'sPC_Get_FieldName', TBName: 'SRMPurchaseOrder'}).then(res => {
        if (res.status) {
          let _change = {
            SUsers: SUsers,
            SMenus: SMenus,
            SColumns: SColumns,
            SActions: SActions
          let tabmsg = {
            tableName: _table.name,
            columns: res.FDName.map(item => {
              let _type = item.FieldType.toLowerCase()
              let _decimal = 0
              if (/^nvarchar/.test(_type)) {
                _type = 'text'
              // } else if (/^int/.test(_type)) {
              //   _type = 'number'
              // } else if (/^decimal/.test(_type)) {
              //   _decimal = _type.split(',')[1]
              //   _decimal = parseInt(_decimal)
              //   if (_decimal > 4) {
              //     _decimal = 4
              //   }
              //   _type = 'number'
              // } else if (/^decimal/.test(_type)) {
              //   _decimal = _type.split(',')[1]
              //   _decimal = parseInt(_decimal)
              //   if (_decimal > 4) {
              //     _decimal = 4
              //   }
              //   _type = 'number'
              } else if (/^datetime/.test(_type)) {
                _type = 'datetime'
              } else if (/^date/.test(_type)) {
                _type = 'date'
              } else {
                _type = 'text'
              }

              return {
                field: item.FieldName,
                label: item.FieldDec,
                type: _type,
                decimal: _decimal
              }
            })
          }
          this.setState({
            tableColumns: tableColumns.concat([{
              tableName: _table.name,
              columns: _change[_table.name]
            }])
            tableColumns: [...tableColumns, tabmsg]
          })
        } else {
          notification.warning({
@@ -1124,7 +1084,6 @@
  }

  render () {
    console.log(this.state.option)
    return (
      <div className="common-table-board">
        <DndProvider backend={HTML5Backend}>
@@ -1187,7 +1146,7 @@
                    return (<SourceElement key={index} content={item}/>)
                  })}
                </div>
                <Button type="primary" block onClick={() => this.queryField('column')}>添加显示列</Button>
                <Button type="primary" block onClick={() => this.queryField('columns')}>添加显示列</Button>
              </Panel>
            </Collapse>
          </div>
@@ -1273,21 +1232,11 @@
          onCancel={this.cancelFieldSubmit}
          destroyOnClose
        >
          {this.state.addType === 'search' &&
            <div>
              {this.state.option.normal.length > 0 && <EditCard data={this.state.option.normal} ref="searchcard" title="" />}
              {this.state.option.others.length > 0 && <Row style={{marginLeft: '-10px', marginRight: '-10px'}}>
                <p style={{margin: '10px 0px 0px 10px', color: '#1890ff'}}>自定义字段</p>
                {this.state.option.others.map((item, index) => (
                  <Col key={index} span={8} style={{padding: '10px'}}>
                    <div className="ant-card ant-card-bordered" style={{padding: '10px'}}>
                      <p>{item.label}</p>
                      <p>{item.field}</p>
                    </div>
                  </Col>
                ))}
              </Row>}
            </div>
          {this.state.addType === 'search' && this.state.fields.length > 0 &&
            <EditCard data={this.state.fields} ref="searchcard" type="search" />
          }
          {this.state.addType === 'columns' && this.state.fields.length > 0 &&
            <EditCard data={this.state.fields} ref="searchcard" type="columns" />
          }
        </Modal>
        {this.state.loading && <Spin size="large" style={{position: 'fixed', left: '49vw', top: '230px'}} />}

 src/components/sidemenu/comtableconfig/searchform/index.jsx

@@ -75,7 +75,7 @@

      if (item.type === 'text') { // 文本搜索
        let placeholder = ''
        if (item.key === 'initval' && this.state.openType === 'dateday') {
        if (item.key === 'initval' && this.state.openType === 'date') {
          placeholder = '例：' + moment().format('YYYY-MM-DD')
        } else if (item.key === 'initval' && this.state.openType === 'datetime') {
          placeholder = '例：' + moment().format('YYYY-MM-DD HH:mm:ss')

 src/locales/en-US/comtable.js

@@ -35,6 +35,7 @@
  'header.form.pageTemplate': '页面模板',
  'header.form.type': 'Type',
  'header.form.text': 'Text',
  'header.form.picture': '图片',
  'header.form.select': 'Select',
  'header.form.link': '关联菜单',
  'header.form.dateday': 'Date(Day)',

 src/locales/zh-CN/comtable.js

@@ -35,6 +35,7 @@
  'header.form.pageTemplate': '页面模板',
  'header.form.type': '类型',
  'header.form.text': '文本',
  'header.form.picture': '图片',
  'header.form.select': '选择',
  'header.form.link': '关联菜单',
  'header.form.dateday': '日期（天）',

 src/utils/utils.js

@@ -30,6 +30,58 @@
  }

  /**
   * @description 格式化搜索条件
   * @return {String}  value
   */
  static formatOptions (value) {
    // 产生一个新的GUID值
    let format = [{
      key: 'select',
      value: 'msltk'
    }, {
      key: 'from',
      value: 'mfrmk'
    }, {
      key: 'where',
      value: 'mwhrk'
    }, {
      key: 'order by',
      value: 'modbk'
    }, {
      key: 'asc',
      value: 'modack'
    }, {
      key: 'desc',
      value: 'moddesk'
    }, {
      key: '%',
      value: 'mpercent'
    }, {
      key: '>',
      value: 'greateror'
    }, {
      key: '<',
      value: 'lessor'
    }, {
      key: '=',
      value: 'equal'
    }, {
      key: 'top',
      value: 'mtpk'
    }]

    format.forEach(item => {
      let reg  =  new RegExp(item.key, 'ig')
      value = value.replace(reg, item.value)
    })

    value = value.replace(/\*/ig, 'mastrsk')
    value = value.replace(/'/ig, 'mqotek')
    value = value.replace(/\s/ig, 'mspace')
    return value
  }

  /**
   * @description 拼接搜索条件
   * @param {Array}   searches     搜索条件
   * @return {String}  searchText  拼接结果