2019-11-26-01

king

2019-11-26 07acb5f4dc11e484801ccfcd95eee8845128c62a

2019-11-26-01

 src/components/sidemenu/index.jsx

@@ -155,7 +155,8 @@
  }

  shouldComponentUpdate(nextProps, nextState) {
    if (!is(fromJS(this.props.mainMenu), fromJS(nextProps.mainMenu)) || (!this.props.collapse && !is(fromJS(this.props.tabviews), fromJS(nextProps.tabviews)))) {
    // if (!is(fromJS(this.props.mainMenu), fromJS(nextProps.mainMenu)) || (!this.props.collapse && !is(fromJS(this.props.tabviews), fromJS(nextProps.tabviews)))) {
    if (!is(fromJS(this.props.mainMenu), fromJS(nextProps.mainMenu))) {
      // 主菜单切换，或菜单展开下的tab页变化，不会刷新
      return false
    } else {

 src/locales/en-US/comtable.js

@@ -31,6 +31,11 @@
  'header.form.outerFunc': '外部函数',
  'header.form.callbackFunc': '回调函数',
  'header.form.position': '显示位置',
  'header.form.execSuccess': '执行成功',
  'header.form.execError': '执行失败',
  'header.form.refresh.never': '不刷新',
  'header.form.refresh.view': '刷新页面',
  'header.form.refresh.grid': '刷新表格',
  'header.form.toolbar': '工具栏',
  'header.form.grid': '表格',
  'header.form.intertype': '接口类型',
@@ -57,6 +62,8 @@
  'header.form.requiredOnce': '多行拼接',
  'header.form.openType': '打开方式',
  'header.form.pop': '弹窗',
  'header.form.popform': '弹窗（表单）',
  'header.form.popview': '弹窗（页面）',
  'header.form.tab': '新标签页',
  'header.form.newpage': '新页面',
  'header.form.blank': '当前页跳转',

 src/locales/zh-CN/comtable.js

@@ -31,6 +31,11 @@
  'header.form.outerFunc': '外部函数',
  'header.form.callbackFunc': '回调函数',
  'header.form.position': '显示位置',
  'header.form.execSuccess': '执行成功',
  'header.form.execError': '执行失败',
  'header.form.refresh.never': '不刷新',
  'header.form.refresh.view': '刷新页面',
  'header.form.refresh.grid': '刷新表格',
  'header.form.toolbar': '工具栏',
  'header.form.grid': '表格',
  'header.form.intertype': '接口类型',
@@ -57,6 +62,8 @@
  'header.form.requiredOnce': '多行拼接',
  'header.form.openType': '打开方式',
  'header.form.pop': '弹窗',
  'header.form.popform': '弹窗（表单）',
  'header.form.popview': '弹窗（页面）',
  'header.form.tab': '新标签页',
  'header.form.newpage': '新页面',
  'header.form.blank': '当前页跳转',

 src/store/reducer.js

@@ -15,26 +15,31 @@
export default (state = defaultState, action = {}) => {
  switch (action.type) {
    case Type.Toggle_COLLAPSE:
    // 切换菜单栏展开合并状态
      return {
        ...state,
        collapse: action.collapse
      }
    case Type.MODIFY_MAINMENU:
    // 切换主菜单
      return {
        ...state,
        selectedMainMenu: action.selectedMainMenu
      }
    case Type.MODIFY_TABVIEW:
    // tab页改变
      return {
        ...state,
        tabviews: action.tabviews
      }
    case Type.TOGGLE_ISIFRAME:
    // 切换是否为iframe状态
      return {
        ...state,
        isiframe: action.isiframe
      }
    case Type.RESET_STATE:
    // 重置默认参数（退出时）
      return {
        ...state,
        ...{
@@ -45,25 +50,30 @@
        }
      }
    case Type.RESET_DEBUG:
    // 切换debug状态
      return {
        ...state,
        debug: true
      }
    case Type.REFRESH_TABVIEW:
    // 刷新tab页面
      return {
        ...state,
        refreshTab: action.refreshTab
      }
    case Type.RESET_EDITSTATE:
    // 重置编辑状态
      return {
        ...state,
        editState: action.editState,
        collapse: false
      }
    case Type.RESET_EDITLEVEL:
    // 重置编辑级别
      return {
        ...state,
        editLevel: action.editLevel
        editLevel: action.editLevel,
        tabviews: []
      }
    case Type.LOGOUT:
      return {

 src/tabviews/commontable/index.jsx

@@ -4,12 +4,13 @@
import { BackTop, notification} from 'antd'
import Api from '@/api'
import MainSearch from './mainSearch'
// import MainAction from './mainAction'
// import MainTable from './mainTable'
import MainAction from './mainAction'
import MainTable from './mainTable'
import NotFount from '@/components/404'
import Loading from '@/components/loading'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
// import Utils from '@/utils/utils.js'
import './index.scss'

export default class NormalTable extends Component {
@@ -29,7 +30,7 @@
    select: null,
    data: null,
    total: 0,
    loading: true,
    loading: false,
    param: {
      pageIndex: 1,
      pageSize: 10,
@@ -67,6 +68,7 @@
        })
      }
      this.setState({config})
      console.log(config.columns)
    } else {
      this.setState({
        loadingview: false,
@@ -98,37 +100,41 @@

  refreshbysearch = (searches) => {
    // 搜索条件变化
    this.loadmaindata(this.state.param.pageIndex, this.state.param.pageSize, this.state.param.orderColumn, this.state.param.orderType, searches)
    let param = Object.assign({}, this.state.param, {
      search: searches
    })
    this.setState({
      loading: true,
      param: param
    })
    console.log(searches)
    // searches = Utils.jointsearchkey(searches)
    // this.loadmaindata(this.state.param.pageIndex, this.state.param.pageSize, this.state.param.orderColumn, this.state.param.orderType, searches)
    // let param = Object.assign({}, this.state.param, {
    //   search: searches
    // })
    // this.setState({
    //   loading: true,
    //   param: param
    // })
  }

  refreshbytable = (pagination, filters, sorter) => {
    // 表格查询条件修改
    console.log(pagination)
    console.log(filters)
    if (sorter.order) {
      let _chg = {
        ascend: 'asc',
        descend: 'desc'
      }
      sorter.order = _chg[sorter.order]
    }
    this.loadmaindata(pagination.current, pagination.pageSize, sorter.field, sorter.order, this.state.param.search)
    let param = Object.assign({}, this.state.param, {
      pageIndex: pagination.current,
      pageSize: pagination.pageSize,
      orderColumn: sorter.field,
      orderType: sorter.order
    })
    this.setState({
      loading: true,
      param: param
    })
    console.log(sorter)
    // if (sorter.order) {
    //   let _chg = {
    //     ascend: 'asc',
    //     descend: 'desc'
    //   }
    //   sorter.order = _chg[sorter.order]
    // }
    // this.loadmaindata(pagination.current, pagination.pageSize, sorter.field, sorter.order, this.state.param.search)
    // let param = Object.assign({}, this.state.param, {
    //   pageIndex: pagination.current,
    //   pageSize: pagination.pageSize,
    //   orderColumn: sorter.field,
    //   orderType: sorter.order
    // })
    // this.setState({
    //   loading: true,
    //   param: param
    // })
  }

  refreshbyaction = () => {
@@ -153,6 +159,23 @@
    // 组件加载时，获取菜单数据
    this.loadconfig()
    // this.loadmaindata()

    this.setState({
      data: [1,2,3,4,5,6,7,8,9,10].map(item => {
        return {
          key: item,
          ID: item + 'mainkey',
          ExRateName: '$',
          SupplierName: '阿里巴巴' + item + '店',
          SupShortName: '阿里巴巴',
          SupplierCode: '201922' + item,
          OrgName: '阿里巴巴',
          OrgCode: '302999',
          PlanDate: '2019-11-' + (item < 10 ? '0' + item : item)
        }
      }),
      total: 329
    })
  }

  shouldComponentUpdate (nextProps, nextState) {
@@ -172,30 +195,29 @@
            dict={this.state.dict}
          /> : null
        }
        {/* {this.state.actions &&
        {config.action &&
          <MainAction
            MenuNo={this.props.MenuNo}
            fixed={this.state.fixed.fixaction}
            MenuID={this.props.MenuID}
            fixed={config.setting && config.setting.actionfixed}
            refreshdata={this.refreshbyaction}
            gettableselected={this.gettableselected}
            actions={this.state.actions}
            actions={config.action}
            dict={this.state.dict}
          />
        }
        {this.state.columns &&
        {config.columns &&
          <MainTable
            ref="mainTable"
            MenuNo={this.props.MenuNo}
            fixed={this.state.fixed}
            MenuID={this.props.MenuID}
            setting={config.setting}
            refreshdata={this.refreshbytable}
            columns={this.state.columns}
            columns={config.columns}
            data={this.state.data}
            select={this.state.select}
            total={this.state.total}
            loading={this.state.loading}
            dict={this.state.dict}
          />
        } */}
        }
        <BackTop>
          <div className="ant-back-top">
            <div className="ant-back-top-content">

 src/tabviews/commontable/mainAction/index.jsx

@@ -10,7 +10,7 @@

class MainAction extends Component {
  static propTpyes = {
    MenuNo: PropTypes.string,
    MenuID: PropTypes.string,
    actions: PropTypes.array, // 搜索条件列表
    dict: PropTypes.object, // 字典项
    fixed: PropTypes.any
@@ -157,28 +157,19 @@
    this.formRef.handleReset()
  }

  UNSAFE_componentWillMount () {

  }

  // shouldComponentUpdate (nextProps, nextState) {
  //   console.log(!is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)))
  //   return true
  // }

  render() {
    if (this.props.fixed) { // 按钮是否固定在头部
      return (
        <Affix offsetTop={48}>
          <div className="button-list" id={this.props.MenuNo + 'mainaction'}>
          <div className="button-list" id={this.props.MenuID + 'mainaction'}>
            {this.props.actions.map((item, index) => {
              return (
                <Button
                  className={'mk-btn ' + item.CssClass}
                  icon={item.Icon}
                  className={'mk-btn mk-' + item.class}
                  icon={item.icon}
                  key={'action' + index}
                  onClick={() => {this.actionTrigger(item)}}
                >{item.MenuName}</Button>
                >{item.label}</Button>
              )
            })}
            {this.getModels()}
@@ -191,11 +182,11 @@
        {this.props.actions.map((item, index) => {
          return (
            <Button
              className={'mk-btn ' + item.CssClass}
              icon={item.Icon}
              className={'mk-btn mk-' + item.class}
              icon={item.icon}
              key={'action' + index}
              onClick={() => {this.actionTrigger(item)}}
            >{item.MenuName}</Button>
            >{item.label}</Button>
          )
        })}
      </div>

 src/tabviews/commontable/mainSearch/index.jsx

@@ -1,15 +1,10 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
// import { is, fromJS } from 'immutable'
import { Form, Row, Col, Input, Button, Select, DatePicker } from 'antd'
import moment from 'moment'
import Utils from '@/utils/utils.js'
import './index.scss'

const {MonthPicker, WeekPicker} = DatePicker
const dateFormat = 'YYYY-MM-DD'
const weekFormat = 'YYYYMMDD'
const monthFormat = 'YYYY-MM'
const {MonthPicker, WeekPicker, RangePicker} = DatePicker

class MainSearch extends Component {
  static propTpyes = {
@@ -18,32 +13,22 @@
  }

  state = {
    formats: null, // 事件校验规则
    match: null // 搜索条件匹配规则
    match: null, // 搜索条件匹配规则
    style: null
  }

  UNSAFE_componentWillMount () {
    console.log(this.props.searchlist)
    // let formats = {}
    // let match = {}
    // this.props.searchlist.forEach(item => {
    //   if (item.Type === 'date') {
    //     // formats[item.FieldName] = dateFormat
    //     formats[item.FieldName] = weekFormat
    //   } else if (item.ID === 'WHE1400200905') {
    //     formats[item.FieldName] = monthFormat
    //   }
    //   match[item.FieldName] = item.Op
    // })
    // this.setState({
    //   formats: formats,
    //   match: match
    // })
    let match = {}
    let style = {}
    this.props.searchlist.forEach(item => {
      match[item.field] = item.match
      style[item.field] = item.type
    })
    this.setState({
      match: match,
      style: style
    })
  }

  // shouldComponentUpdate (nextProps, nextState) {
  //   return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
  // }

  getFields() {
    const { getFieldDecorator } = this.props.form
@@ -64,7 +49,7 @@
              {getFieldDecorator(item.field, {initialValue: item.initval })(
                <Select
                  showSearch
                  onChange={(val) => {this.selectChange(item.field, val)}}
                  onChange={this.searchChange}
                  filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                >
                  {item.options.map(option =>
@@ -76,43 +61,58 @@
          </Col>
        )
      } else if (item.type === 'date') { // 时间搜索
        if (item.ID === 'WHE14002009024') {
          fields.push(
            <Col span={6} key={index}>
              <Form.Item label={item.label}>
                {getFieldDecorator(item.field, {initialValue: moment('2019-09-14', dateFormat) })(
                  <DatePicker format={dateFormat} onChange={(val) => {this.timeChange(item.field, val)}} />
                )}
              </Form.Item>
            </Col>
          )
        } else if (item.ID === 'WHE1400200905') {
          fields.push(
            <Col span={6} key={index}>
              <Form.Item label={item.label}>
                {getFieldDecorator(item.field, {initialValue: moment('2019-09', monthFormat) })(
                  <MonthPicker format={monthFormat} onChange={(val) => {this.timeChange(item.FieldName, val)}} />
                )}
              </Form.Item>
            </Col>
          )
        } else if (item.ID === 'WHE1400200902') {
          fields.push(
            <Col span={6} key={index}>
              <Form.Item label={item.Label}>
                {getFieldDecorator(item.FieldName, {initialValue: moment('20190906', weekFormat) })(
                  <WeekPicker onChange={(val) => {this.timeChange(item.FieldName, val)}} />
                )}
              </Form.Item>
            </Col>
          )
        }
        fields.push(
          <Col span={6} key={index}>
            <Form.Item label={item.label}>
              {getFieldDecorator(item.field, {initialValue: item.initval ? moment().subtract(item.initval, 'days') : null })(
                <DatePicker onChange={this.searchChange} />
              )}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'datemonth') {
        fields.push(
          <Col span={6} key={index}>
            <Form.Item label={item.label}>
              {getFieldDecorator(item.field, {initialValue: item.initval ? moment().subtract(item.initval, 'month') : null })(
                <MonthPicker onChange={this.searchChange} />
              )}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'dateweek') {
        fields.push(
          <Col span={6} key={index}>
            <Form.Item label={item.label}>
              {getFieldDecorator(item.field, {initialValue: item.initval ? moment().subtract(item.initval * 7, 'days') : null })(
                <WeekPicker onChange={this.searchChange} />
              )}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'daterange') {
        fields.push(
          <Col className="daterange" span={6} key={index}>
            <Form.Item label={item.label}>
              {getFieldDecorator(item.field,
                {
                  initialValue: item.initval ? [moment().subtract(item.initval, 'days'), moment().subtract(item.initval === 1 ? 1 : 0, 'days')] : [null, null]
                })(
                <RangePicker
                  placeholder={['开始日期', '结束日期']}
                  renderExtraFooter={() => 'extra footer'}
                  onChange={this.searchChange}
                />
              )}
            </Form.Item>
          </Col>
        )
      }
    })

    if (this.props.searchlist.length >= 4) { // 添加搜索、重置按钮
      fields.push(
        <Col span={this.props.searchlist.length % 4 ? 6 : 24} style={{ textAlign: 'right' }} key="actions">
        <Col span={this.props.searchlist.length % 4 ? 6 : 24} style={{paddingLeft: '112px'}} key="actions">
          <Button type="primary" htmlType="submit">
            {this.props.dict['main.search']}
          </Button>
@@ -141,21 +141,17 @@
    // 回车或点击搜索
    e.preventDefault()
    this.props.form.validateFields((err, values) => {
      this.getFieldsValues(values)
      let searches = this.getFieldsValues(values)
      this.props.refreshdata(searches)
    })
  }

  selectChange = (key, val) => {
    // 条件选择切换
    this.props.form.validateFields((err, values) => {
      this.getFieldsValues(Object.assign({}, values, {[key]: val}))
    })
  }

  timeChange = (key, val) => {
    // 时间切换
    this.props.form.validateFields((err, values) => {
      this.getFieldsValues(Object.assign({}, values, {[key]: val}))
  searchChange = () => {
    this.setState({}, () => {
      this.props.form.validateFields((err, values) => {
        let searches = this.getFieldsValues(values)
        this.props.refreshdata(searches)
      })
    })
  }

@@ -163,46 +159,74 @@
    // 重置
    this.props.form.resetFields()
    this.props.form.validateFields((err, values) => {
      this.getFieldsValues(values)
      let searches = this.getFieldsValues(values)
      this.props.refreshdata(searches)
    })
  }

  getFieldsValues = (searches) => {
  getFieldsValues = (values) => {
    // 获取搜索条件值
    let search = []
    Object.keys(searches).forEach(key => {
      if (searches[key] && typeof(searches[key]) === 'object') {
        if (this.state.formats[key] === weekFormat) {
          search.push({
            type: 'date',
            key: key,
            value: moment(searches[key]).startOf('week').format(this.state.formats[key]) + ' ' + moment(searches[key]).endOf('week').format(this.state.formats[key]),
            op: this.state.match[key]
          })
        } else {
          search.push({
            type: 'date',
            key: key,
            value: moment(searches[key]).format(this.state.formats[key]),
            op: this.state.match[key]
          })
    Object.keys(values).forEach(key => {
      if (this.state.style[key] === 'daterange') {
        let _value = ''
        if (values[key].length > 0) {
          _value = [moment(values[key][0]).format('YYYY-MM-DD'), moment(values[key][1]).format('YYYY-MM-DD')]
        }
      } else if (searches[key] && searches[key] !== '-1') {
        search.push({
          type: 'text',
          type: this.state.style[key],
          key: key,
          value: searches[key],
          op: this.state.match[key]
          value: _value,
          match: this.state.match[key]
        })
      } else if (this.state.style[key] === 'dateweek') {
        let _value = ''
        if (values[key]) {
          _value = [moment(values[key]).startOf('week').format('YYYY-MM-DD'), moment(values[key]).endOf('week').format('YYYY-MM-DD')]
        }
        search.push({
          type: this.state.style[key],
          key: key,
          value: _value,
          match: this.state.match[key]
        })
      } else if (this.state.style[key] === 'date') {
        let _value = ''
        if (values[key]) {
          _value = moment(values[key]).format('YYYY-MM-DD')
        }
        search.push({
          type: this.state.style[key],
          key: key,
          value: _value,
          match: this.state.match[key]
        })
      } else if (this.state.style[key] === 'datemonth') {
        let _value = ''
        if (values[key]) {
          _value = moment(values[key]).format('YYYY-MM')
        }
        search.push({
          type: this.state.style[key],
          key: key,
          value: _value,
          match: this.state.match[key]
        })
      } else {
        search.push({
          type: this.state.style[key],
          key: key,
          value: values[key],
          match: this.state.match[key]
        })
      }
    })
    search = Utils.jointsearchkey(search)
    this.props.refreshdata(search)
    return search
  }

  render() {
    return (
      <Form className="ant-advanced-search-form main-search" onSubmit={this.handleSearch}>
      <Form className="ant-advanced-search-form commontable-main-search" onSubmit={this.handleSearch}>
        <Row gutter={24}>{this.getFields()}</Row>
      </Form>
    )

 src/tabviews/commontable/mainSearch/index.scss

@@ -1,4 +1,4 @@
.ant-advanced-search-form.main-search {
.ant-advanced-search-form.commontable-main-search {
  padding: 0px 24px 20px;
  border-bottom: 1px solid #d9d9d9;
  .ant-form-item {
@@ -11,4 +11,8 @@
  .ant-form-item-label {
    width: 100px;
  }
  .daterange .ant-calendar-picker-input {
    padding: 4px 20px 4px 5px;
    font-size: 13px;
  }
}

 src/tabviews/commontable/mainTable/index.jsx

@@ -1,13 +1,13 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
// import { is, fromJS } from 'immutable'
import { Table, Icon, message, Affix } from 'antd'
import { Table, message, Affix } from 'antd'
import './index.scss'

export default class MainTable extends Component {
  static propTpyes = {
    MenuNo: PropTypes.string, // 菜单参数
    fixed: PropTypes.object, // 表格头部是否固定于页面上方
    MenuID: PropTypes.string, // 菜单参数
    setting: PropTypes.object, // 表格头部是否固定于页面上方
    loading: PropTypes.bool,
    total: PropTypes.number,
    select: PropTypes.object,
@@ -24,23 +24,19 @@
    pageIndex: 1,
    pageSize: 10,
    columns: this.props.columns.map((item, index) => {
      let _width = parseInt(item.Width) || 50
      return {
        align: item.Align,
        dataIndex: item.FieldName,
        title: item.Label,
        dataIndex: item.field,
        title: item.label,
        // fixed: index < 3,
        sorter: item.IsSort === 'true',
        filterMultiple: item.CDefine1 === 'true',
        filters: item.CDefine2 && JSON.parse(item.CDefine2),
        width: _width * 30,
        width: item.Width || 120,
        render: (text, record) => (
          <div style={{ wordWrap: 'break-word', wordBreak: 'break-word', minWidth: _width + 'px' }}>
          <div style={{ wordWrap: 'break-word', wordBreak: 'break-word', minWidth: (item.Width || 120) + 'px' }}>
            {text}
            {item.FieldName === 'MenuNo' ? <Icon onClick={(e) => {this.copycontent(e, record[item.FieldName])}} type="copy"/> : ''}
            {/* {item.FieldName === 'MenuNo' ? <Icon onClick={(e) => {this.copycontent(e, record[item.FieldName])}} type="copy"/> : ''} */}
          </div>
        )
        // onHeaderCell: () => ({style:{textAlign: 'center'}})
      }
    })
  }
@@ -99,21 +95,22 @@

  render() {
    let { selectedRowKeys } = this.state

    let rowSelection = null
    if (this.props.select && this.props.select.selectable) {
    if (this.props.setting.tableType) {
      rowSelection = {
        selectedRowKeys,
        type: this.props.select.selectType === 'radio' ? 'radio' : 'checkbox',
        type: this.props.setting.tableType === 'radio' ? 'radio' : 'checkbox',
        onChange: this.onSelectChange
      }
    }
    let offset = null
    if (this.props.fixed.fixtable) {
    if (this.props.setting.columnfixed) {
      // 表格头部固定于顶部时，判断距顶部高度
      if (!this.props.fixed.fixaction) {
      if (!this.props.setting.actionfixed) {
        offset = 48
      } else {
        let box = document.getElementById(this.props.MenuNo + 'mainaction')
        let box = document.getElementById(this.props.MenuID + 'mainaction')
        if (box) {
          offset = 48 + box.offsetHeight
        } else {
@@ -123,7 +120,7 @@
    }
    return (
      <div className="main-table">
        {this.props.fixed.fixtable && <Affix offsetTop={offset} className="fix-header">
        {this.props.setting.columnfixed && <Affix offsetTop={offset} className="fix-header">
          <Table
            bordered={true}
            rowSelection={rowSelection}

 src/templates/comtableconfig/actionform/index.jsx

@@ -73,11 +73,16 @@
    if (key === 'OpenType') {
      let _options = null
      if (value === 'newpage') {
        _options = ['label', 'position', 'Ot', 'OpenType', 'pageTemplate', 'icon', 'class']
        _options = ['label', 'Ot', 'OpenType', 'pageTemplate', 'icon', 'class', 'position']
      } else if (value === 'blank' || value === 'tab' || value === 'popview') {
        _options = ['label', 'Ot', 'OpenType', 'icon', 'class', 'position']
      } else {
        _options = ['label', 'position', 'OpenType', 'innerFunc', 'Ot', 'icon', 'class', 'execSuccess', 'execError']
      }
      this.setState({
        openType: value,
        expand: value === 'newpage' ? false : this.state.expand,
        expand: false,
        interType: 'inner',
        formlist: this.state.formlist.map(item => {
          if (_options) {
            item.hidden = !_options.includes(item.key)
@@ -216,9 +221,9 @@
    let expand = !this.state.expand
    let _options = null
    if (expand) {
      _options = ['label', 'position', 'OpenType', 'intertype', 'innerFunc', 'interface', 'outerFunc', 'callbackFunc', 'Ot', 'icon', 'class']
      _options = ['label', 'position', 'OpenType', 'intertype', 'innerFunc', 'interface', 'outerFunc', 'callbackFunc', 'Ot', 'icon', 'class', 'execSuccess', 'execError']
    } else {
      _options = ['label', 'position', 'OpenType', 'innerFunc', 'Ot', 'icon', 'class']
      _options = ['label', 'position', 'OpenType', 'innerFunc', 'Ot', 'icon', 'class', 'execSuccess', 'execError']
    }
    if (!expand) {
      this.setState({
@@ -249,11 +254,13 @@
    let _options = null
    if (_opentype === 'newpage') {
      _options = ['label', 'Ot', 'OpenType', 'pageTemplate', 'icon', 'class', 'position']
    } else if (_opentype === 'blank' || _opentype === 'tab' || _opentype === 'popview') {
      _options = ['label', 'Ot', 'OpenType', 'icon', 'class', 'position']
    } else {
      if (_intertype === 'outer') {
      _options = ['label', 'position', 'OpenType', 'intertype', 'innerFunc', 'interface', 'outerFunc', 'callbackFunc', 'Ot', 'icon', 'class']
      _options = ['label', 'position', 'OpenType', 'intertype', 'innerFunc', 'interface', 'outerFunc', 'callbackFunc', 'Ot', 'icon', 'class', 'execSuccess', 'execError']
      } else {
        _options = ['label', 'position', 'OpenType', 'innerFunc', 'Ot', 'icon', 'class']
        _options = ['label', 'position', 'OpenType', 'innerFunc', 'Ot', 'icon', 'class', 'execSuccess', 'execError']
      }
    }
    this.setState({
@@ -276,6 +283,7 @@
  }

  render() {
    const { openType } = this.state
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
@@ -289,7 +297,7 @@
    return (
      <Form {...formItemLayout} className="ant-advanced-search-form commontable-action-form" id="winter">
        <Row gutter={24}>{this.getFields()}</Row>
        {this.state.openType !== 'newpage' && <Row>
        {openType !== 'newpage' && openType !== 'blank' && openType !== 'tab' && openType !== 'popview' && <Row>
          <Col span={24} style={{ textAlign: 'right' }}>
            <span className="superconfig" onClick={this.toggle}>
              高级设置 <Icon type={this.state.expand ? 'up' : 'down'} />

 src/templates/comtableconfig/dragelement/index.jsx

@@ -7,7 +7,7 @@
import ItemTypes from './itemtypes'
import './index.scss'

const Container = ({list, type, placeholder, handleList, handleMenu }) => {
const Container = ({list, setting, type, placeholder, handleList, handleMenu }) => {
  let target = null
  const [cards, setCards] = useState(list)
  const moveCard = (id, atIndex) => {
@@ -73,6 +73,14 @@

      let newcard = {}
      if (item.type === 'search') {
        let _match = 'like'
        if (item.subType === 'select' || item.subType === 'link') {
          _match = '='
        } else if (item.subType === 'date' || item.subType === 'datemonth') {
          _match = '>='
        } else if (item.subType === 'dateweek' || item.subType === 'daterange') {
          _match = 'between'
        }
        newcard.uuid = Utils.getuuid()
        newcard.label = 'fieldName'
        newcard.field = ''
@@ -87,6 +95,7 @@
        newcard.valueText = ''
        newcard.orderBy = ''
        newcard.orderType = 'asc'
        newcard.match = _match
        newcard.display = 'dropdown'
      } else if (item.type === 'action') {
        newcard.uuid = Utils.getuuid()
@@ -99,6 +108,9 @@
        newcard.class = 'default'
        newcard.intertype = 'inner'
        newcard.interface = ''
        newcard.position = 'toolbar'
        newcard.execSuccess = 'grid'
        newcard.execError = 'never'
        newcard.callbackFunc = ''
        newcard.pageTemplate = ''
      } else if (item.type === 'columns') {
@@ -181,10 +193,15 @@
      {type === 'columns' && cards.length > 0 &&
        columns.map((column, i) => (
          <div key={i} className="column-box">
            {i === 0 &&
            {/* 多选 */}
            {i === 0 && setting.tableType === 'checkbox' ?
              <div className="page-card" style={{flex: 60}}>
                <span className="ant-checkbox-inner"></span>
              </div>
              </div> : null
            }
            {/* 单选 */}
            {i === 0 && setting.tableType === 'radio' ?
              <div className="page-card" style={{flex: 60}}></div> : null
            }
            {column.map(card => (
              <Card

 src/templates/comtableconfig/editcard/index.jsx

@@ -52,7 +52,7 @@
          <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}>
            <Radio value="text">text</Radio>
            <Radio value="select">select</Radio>
            <Radio value="daterange">daterange</Radio>
            <Radio value="daterange">dateRange</Radio>
          </Radio.Group> : null
        }
        {type === 'columns' ?

 src/templates/comtableconfig/index.jsx

@@ -457,7 +457,10 @@
          required: true,
          options: [{
            MenuID: 'pop',
            text: this.state.dict['header.form.pop']
            text: this.state.dict['header.form.popform']
          }, {
            MenuID: 'popview',
            text: this.state.dict['header.form.popview']
          }, {
            MenuID: 'prompt',
            text: this.state.dict['header.form.prompt']
@@ -473,20 +476,6 @@
          }, {
            MenuID: 'newpage',
            text: this.state.dict['header.form.newpage']
          }]
        },
        {
          type: 'select',
          key: 'position',
          label: this.state.dict['header.form.position'],
          initVal: card.position || 'toolbar',
          required: true,
          options: [{
            MenuID: 'toolbar',
            text: this.state.dict['header.form.toolbar']
          }, {
            MenuID: 'grid',
            text: this.state.dict['header.form.grid']
          }]
        },
        {
@@ -523,6 +512,37 @@
          }, {
            MenuID: 'requiredOnce',
            text: this.state.dict['header.form.requiredOnce']
          }]
        },
        {
          type: 'select',
          key: 'position',
          label: this.state.dict['header.form.position'],
          initVal: card.position || 'toolbar',
          required: true,
          options: [{
            MenuID: 'toolbar',
            text: this.state.dict['header.form.toolbar']
          }, {
            MenuID: 'grid',
            text: this.state.dict['header.form.grid']
          }]
        },
        {
          type: 'select',
          key: 'execSuccess',
          label: this.state.dict['header.form.execSuccess'],
          initVal: card.execSuccess || 'never',
          required: true,
          options: [{
            MenuID: 'never',
            text: this.state.dict['header.form.refresh.never']
          }, {
            MenuID: 'grid',
            text: this.state.dict['header.form.refresh.grid']
          }, {
            MenuID: 'view',
            text: this.state.dict['header.form.refresh.view']
          }]
        },
        {
@@ -578,7 +598,24 @@
          initVal: card.callbackFunc,
          required: false,
          readonly: false
        }
        },
        {
          type: 'select',
          key: 'execError',
          label: this.state.dict['header.form.execError'],
          initVal: card.execError || 'never',
          required: true,
          options: [{
            MenuID: 'never',
            text: this.state.dict['header.form.refresh.never']
          }, {
            MenuID: 'grid',
            text: this.state.dict['header.form.refresh.grid']
          }, {
            MenuID: 'view',
            text: this.state.dict['header.form.refresh.view']
          }]
        },
      ]
    })
  }
@@ -993,7 +1030,7 @@
      datetime: 'equal',
      date: 'equal'
    }
    const datematch = { // 选择date时匹配规则
    const datematch = { // 选择dateRange时匹配规则
      text: 'between',
      number: 'between',
      datetime: 'between',
@@ -1022,6 +1059,9 @@
              item.match = selectmatch[cell.datatype]
            } else if (cell.type === 'daterange') {
              item.match = datematch[cell.datatype]
            } else {
              cell.type = 'text'
              item.match = textmatch[cell.datatype]
            }
            
            item.type = cell.type
@@ -1047,6 +1087,9 @@
            _match = selectmatch[item.datatype]
          } else if (item.type === 'daterange') {
            _match = datematch[item.datatype]
          } else {
            item.type = 'text'
            _match = textmatch[item.datatype]
          }

          let newcard = {
@@ -1198,7 +1241,12 @@
    this.settingRef.handleConfirm().then(res => {
      this.setState({
        config: {...config, setting: res},
        settingVisible: false
        settingVisible: false,
        columnsloading: true
      }, () => {
        this.setState({
          columnsloading: false
        })
      })
    })
  }
@@ -1270,7 +1318,10 @@
  }

  render () {
    const configAction = this.state.config.action.filter(_action => !_action.origin && (_action.OpenType === 'pop'))
    const configAction = this.state.config.action.filter(_action =>
      !_action.origin && (_action.OpenType === 'pop' || _action.OpenType === 'popview' || _action.OpenType === 'blank' || _action.OpenType === 'tab')
    )

    return (
      <div className="common-table-board">
        <DndProvider backend={HTML5Backend}>
@@ -1392,6 +1443,7 @@
                {!this.state.columnsloading ?
                  <DragElement
                    list={this.state.config.columns}
                    setting={this.state.config.setting}
                    type="columns"
                    placeholder={this.state.dict['header.form.column.placeholder']}
                    handleList={this.handleList}
@@ -1478,6 +1530,7 @@
        >
          <SettingForm
            data={this.state.config.setting}
            columns={this.state.config.columns}
            dict={this.state.dict}
            wrappedComponentRef={(inst) => this.settingRef = inst}
          />

 src/templates/comtableconfig/index.scss

@@ -204,6 +204,7 @@
        }
        .ant-calendar-picker {
          min-width: 100px!important;
          width: 100%;
        }
      }
      .action-list {

 src/templates/comtableconfig/searchform/index.jsx

@@ -1,11 +1,52 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, Select, Icon, Radio, notification } from 'antd'
// import moment from 'moment'
import EditTable from '../editable'
import './index.scss'

const { TextArea } = Input
const matchReg = {
  text: [{
    value: 'like',
    text: 'like'
  }, {
    value: 'not like',
    text: 'not like'
  }, {
    value: '=',
    text: '='
  }],
  select: [{
    value: '=',
    text: '='
  }, {
    value: 'like',
    text: 'like'
  }, {
    value: 'not like',
    text: 'not like'
  }],
  date: [{
    value: '>=',
    text: '>='
  }, {
    value: '<=',
    text: '<='
  }, {
    value: '>',
    text: '>'
  }, {
    value: '<',
    text: '<'
  }, {
    value: '=',
    text: '='
  }],
  daterange: [{
    value: 'between',
    text: 'between'
  }]
}

class MainSearch extends Component {
  static propTpyes = {
@@ -29,18 +70,17 @@
  openTypeChange = (key, value) => {
    if (key === 'type') {
      let _options = ['label', 'field', 'initval', 'type', 'match']
      if (value === 'select' && this.state.resourceType === '0') {
        _options = [..._options, ...['resourceType', 'setAll', 'options', 'display']]
      } else if (value === 'select' && this.state.resourceType === '1') {
        _options = [..._options, ...['resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
      } else if (value === 'link' && this.state.resourceType === '0') {
        _options = [..._options, ...['resourceType', 'setAll', 'options', 'linkField', 'display']]
      } else if (value === 'link' && this.state.resourceType === '1') {
        _options = [..._options, ...['resourceType', 'setAll', 'dataSource', 'linkField', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
      if (value === 'select' || value === 'link') { // 切换类型为选择或关联时，来源默认为自定义
        _options = [..._options, 'resourceType', 'setAll', 'options', 'display']
      }
      
      if (value === 'link') {
        _options = [..._options, 'linkField']
      }
      
      this.setState({
        openType: value,
        resourceType: '0',
        formlist: this.state.formlist.map(form => {
          form.hidden = !_options.includes(form.key)
          if (form.key === 'initval') {
@@ -53,12 +93,29 @@
            form.initVal = ''
            form.hidden = true
          }

          if (form.key === 'match') {
            if (value === 'text') {
              form.options = matchReg.text
            } else if (value === 'select' || value === 'link') {
              form.options = matchReg.select
            } else if (value === 'date' || value === 'datemonth') {
              form.options = matchReg.date
            } else if (value === 'dateweek' || value === 'daterange') {
              form.options = matchReg.daterange
            }
            form.hidden = true
          }
          return form
        })
      }, () => {
        this.setState({
          formlist: this.state.formlist.map(form => {
            if (form.key === 'initval') {
              form.hidden = false
            }
            if (form.key === 'match') {
              form.initVal = form.options[0].value
              form.hidden = false
            }
            return form
@@ -69,17 +126,18 @@
  }

  onChange = (e, key) => {
    const { openType } = this.state
    let value = e.target.value
    if (key === 'resourceType') {
      let _options = ['label', 'field', 'initval', 'type', 'match', 'resourceType', 'setAll']
      if (this.state.openType === 'select' && value === '0') {
        _options = [..._options, ...['options', 'display']]
      } else if (this.state.openType === 'select' && value === '1') {
        _options = [..._options, ...['dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
      } else if (this.state.openType === 'link' && value === '0') {
        _options = [..._options, ...['options', 'linkField', 'display']]
      } else if (this.state.openType === 'link' && value === '1') {
        _options = [..._options, ...['dataSource', 'linkField', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
      let _options = ['label', 'field', 'initval', 'type', 'match', 'resourceType', 'setAll', 'display']
      if (value === '0') {
        _options = [..._options, 'options']
      } else if (value === '1') {
        _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType']
      }
      
      if (openType === 'link') {
        _options = [..._options, 'linkField']
      }
      
      this.setState({
@@ -246,15 +304,15 @@
    if (!formlist) return
    let type = formlist.filter(cell => cell.key === 'type')[0].initVal
    let resourceType = formlist.filter(cell => cell.key === 'resourceType')[0].initVal
    let _options = ['label', 'field', 'initval', 'type', 'match']
    if (type === 'select' && resourceType === '0') {
      _options = [..._options, ...['resourceType', 'setAll', 'options', 'display']]
    } else if (type === 'select' && resourceType === '1') {
      _options = [..._options, ...['resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
    } else if (type === 'link' && resourceType === '0') {
      _options = [..._options, ...['resourceType', 'setAll', 'options', 'linkField', 'display']]
    } else if (type === 'link' && resourceType === '1') {
      _options = [..._options, ...['resourceType', 'setAll', 'dataSource', 'linkField', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']]
    let _options = ['label', 'field', 'initval', 'type', 'match'] // 默认显示项
    if ((type === 'select' || type === 'link') && resourceType === '0') { // 选择类型、自定义资源
      _options = [..._options, 'resourceType', 'setAll', 'options', 'display']
    } else if ((type === 'select' || type === 'link') && resourceType === '1') { // 选择类型、数据源
      _options = [..._options, 'resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display']
    }

    if (type === 'link') { // 关联类型、增加关联字段
      _options = [..._options, 'linkField']
    }
    
    this.setState({
@@ -265,6 +323,17 @@
          form.options = this.state.dateoptions[type]
          form.type = 'select'
        }
        if (form.key === 'match') {
          if (type === 'text') {
            form.options = matchReg.text
          } else if (type === 'select' || type === 'link') {
            form.options = matchReg.select
          } else if (type === 'date' || type === 'datemonth') {
            form.options = matchReg.date
          } else if (type === 'dateweek' || type === 'daterange') {
            form.options = matchReg.daterange
          }
        }
        form.hidden = !_options.includes(form.key)
        return form
      })

 src/templates/comtableconfig/settingform/index.jsx

@@ -1,6 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, Radio } from 'antd'
import { Form, Row, Col, Input, Radio, Select } from 'antd'
import './index.scss'

const { TextArea } = Input
@@ -8,8 +8,8 @@
class SettingForm extends Component {
  static propTpyes = {
    dict: PropTypes.object, // 字典项
    formlist: PropTypes.any,
    card: PropTypes.object
    data: PropTypes.object,
    columns: PropTypes.array
  }

  handleConfirm = () => {
@@ -39,8 +39,16 @@
        sm: { span: 16 }
      }
    }

    let primaryKey = data.primaryKey
    if (primaryKey) {
      let field = this.props.columns.filter(column => column.field === primaryKey)
      if (field.length !== 1) {
        primaryKey = ''
      }
    }
    return (
      <Form {...formItemLayout} className="ant-advanced-search-form commontable-setting-form">
      <Form {...formItemLayout} className="ant-advanced-search-form commontable-setting-form" id="commontable-setting-form">
        <Row gutter={24}>
          <Col span={12}>
            <Form.Item label="固定按钮">
@@ -66,6 +74,34 @@
              )}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label="表名">
              {getFieldDecorator('tableName', {
                initialValue: data.tableName,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.input'] + '表名!'
                  }
                ]
              })(<Input placeholder="" autoComplete="off" />)}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label="表格属性">
              {getFieldDecorator('tableType', {
                initialValue: data.tableType
              })(
                <Select
                  getPopupContainer={() => document.getElementById('commontable-setting-form')}
                >
                  <Select.Option value="">不可选</Select.Option>
                  <Select.Option value="radio">单选</Select.Option>
                  <Select.Option value="checkbox">多选</Select.Option>
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label="数据源" className="textarea">
              {getFieldDecorator('dataresource', {
@@ -79,6 +115,22 @@
              })(<TextArea rows={4} />)}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label="主键">
              {getFieldDecorator('primaryKey', {
                initialValue: primaryKey
              })(
                <Select
                  getPopupContainer={() => document.getElementById('commontable-setting-form')}
                >
                  <Select.Option value="">不设置</Select.Option>
                  {this.props.columns.map(option =>
                    <Select.Option id={option.uuid} title={option.label} key={option.uuid} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
        </Row>
      </Form>
    )

 src/templates/comtableconfig/source.jsx

@@ -10,6 +10,9 @@
    setting: {
      actionfixed: false,
      columnfixed: false,
      tableName: '',
      tableType: 'checkbox',
      primaryKey: '',
      dataresource: ''
    },
    tables: [],
@@ -86,6 +89,8 @@
        callbackFunc: '',
        Ot: 'notRequired',
        position: 'toolbar',
        execSuccess: 'grid',
        execError: 'never',
        OpenType: 'pop',
        pageTemplate: '',
        icon: 'plus',
@@ -102,6 +107,8 @@
        callbackFunc: '',
        Ot: 'requiredSgl',
        position: 'grid',
        execSuccess: 'grid',
        execError: 'never',
        OpenType: 'pop',
        pageTemplate: '',
        icon: 'form',
@@ -118,6 +125,8 @@
        callbackFunc: '',
        Ot: 'required',
        position: 'toolbar',
        execSuccess: 'grid',
        execError: 'never',
        OpenType: 'prompt',
        pageTemplate: '',
        icon: 'delete',
@@ -210,8 +219,20 @@
    },
    {
      type: 'search',
      label: '时间框（秒）',
      subType: 'datetime',
      label: '时间框（周）',
      subType: 'dateweek',
      url: ''
    },
    {
      type: 'search',
      label: '时间框（月）',
      subType: 'datemonth',
      url: ''
    },
    {
      type: 'search',
      label: '时间框（区间）',
      subType: 'daterange',
      url: ''
    }
  ]