Merge branch 'master' into positec
| | |
| | | MKEmitter.emit('cardAddElement', card.uuid, res) |
| | | } else { |
| | | res.eleType = 'button' |
| | | res.width = res.width || 12 |
| | | MKEmitter.emit('cardAddElement', card.uuid, res) |
| | | } |
| | | resolve({status: true}) |
| | |
| | | |
| | | if (element.copyType === 'action') { |
| | | element.eleType = 'button' |
| | | element.width = element.width || 12 |
| | | } |
| | | |
| | | element.uuid = _uuid |
| | |
| | | |
| | | if (element.copyType === 'action') { |
| | | element.eleType = 'button' |
| | | element.width = element.width || 12 |
| | | } |
| | | |
| | | element.uuid = _uuid |
| | |
| | | label: '无动作' |
| | | } |
| | | ] |
| | | columns.forEach(col => { |
| | | if (col.editable === 'true' && col.uuid !== card.uuid) { |
| | | editCols.push({ |
| | | field: col.uuid, |
| | | label: col.label |
| | | }) |
| | | } else if (col.type === 'colspan') { |
| | | col.subcols.forEach(subcol => { |
| | | if (subcol.editable === 'true' && subcol.uuid !== card.uuid) { |
| | | editCols.push({ |
| | | field: subcol.uuid, |
| | | label: col.label + '-' + subcol.label |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | let cols = [] |
| | | let getcols = (columns, suplabel = '') => { |
| | | columns.forEach(col => { |
| | | if (col.editable === 'true' && col.uuid !== card.uuid) { |
| | | cols.push({ |
| | | field: col.uuid, |
| | | label: suplabel + col.label |
| | | }) |
| | | } else if (col.type === 'colspan') { |
| | | getcols(col.subcols, col.label + '-') |
| | | } |
| | | }) |
| | | } |
| | | |
| | | getcols(columns) |
| | | |
| | | editCols.push(...cols) |
| | | |
| | | cols.forEach(col => { |
| | | editCols.push({ |
| | | field: '$next_' + col.field, |
| | | label: col.label + '(下一行)' |
| | | }) |
| | | }) |
| | | |
| | | return [ |
| | |
| | | |
| | | const { Panel } = Collapse |
| | | const { confirm } = Modal |
| | | const TableComponent = asyncComponent(() => import('./tablecomponent')) |
| | | const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform')) |
| | | const PasteForms = asyncComponent(() => import('@/menu/components/share/pasteforms')) |
| | | const DragElement = asyncComponent(() => import('@/templates/modalconfig/dragelement')) |
| | |
| | | <DndProvider backend={HTML5Backend}> |
| | | <div className="tools"> |
| | | <Collapse accordion defaultActiveKey="1" bordered={false}> |
| | | <Panel header="基本信息" key="0"> |
| | | <TableComponent /> |
| | | </Panel> |
| | | <Panel header="表单" key="1"> |
| | | <div className="search-element"> |
| | | {SearchItems.map((item, index) => { |
New file |
| | |
| | | import React, {Component} from 'react' |
| | | import { fromJS } from 'immutable' |
| | | import { Tooltip, Select, List, notification } from 'antd' |
| | | import { QuestionCircleOutlined, CloseOutlined } from '@ant-design/icons' |
| | | import moment from 'moment' |
| | | |
| | | import Api from '@/api' |
| | | import options from '@/store/options.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import { queryTableSql } from '@/utils/option.js' |
| | | |
| | | import './index.scss' |
| | | |
| | | const { Option } = Select |
| | | |
| | | class TablesComponent extends Component { |
| | | state = { |
| | | tables: [], // 系统表 |
| | | selectedTables: [], // 已选表 |
| | | } |
| | | |
| | | /** |
| | | * @description 搜索条件初始化 |
| | | */ |
| | | UNSAFE_componentWillMount () { |
| | | this.setState({ |
| | | selectedTables: window.GLOB.publicTables ? fromJS(window.GLOB.publicTables).toJS() : [] |
| | | }) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | this.gettables() |
| | | } |
| | | |
| | | /** |
| | | * @description 获取系统表 |
| | | */ |
| | | gettables = () => { |
| | | let param = { |
| | | func: 'sPC_Get_SelectedList', |
| | | LText: queryTableSql, |
| | | obj_name: 'data', |
| | | arr_field: 'TbName,Remark' |
| | | } |
| | | |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | param.open_key = Utils.encryptOpenKey(param.secretkey, param.timestamp) // 云端数据验证 |
| | | |
| | | if (options.cloudServiceApi) { // 且存在云端地址 |
| | | param.rduri = options.cloudServiceApi |
| | | param.userid = sessionStorage.getItem('CloudUserID') || '' |
| | | param.LoginUID = sessionStorage.getItem('CloudLoginUID') || '' |
| | | } |
| | | |
| | | Api.getSystemCacheConfig(param).then(res => { |
| | | if (res.status) { |
| | | this.setState({ |
| | | tables: res.data |
| | | }) |
| | | } else { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 添加表名 |
| | | */ |
| | | onTableChange = (value) => { |
| | | const { tables, selectedTables } = this.state |
| | | |
| | | let _table = tables.filter(item => item.TbName === value)[0] |
| | | let isSelected = !!selectedTables.filter(cell => cell.TbName === value)[0] |
| | | if (!isSelected) { |
| | | let _tables = [...selectedTables, _table] |
| | | |
| | | MKEmitter.emit('publicTableChange', value, 'plus') |
| | | |
| | | this.setState({ |
| | | selectedTables: _tables |
| | | }) |
| | | } |
| | | } |
| | | |
| | | /** |
| | | * @description 删除表名 |
| | | */ |
| | | deleteTable = (table) => { |
| | | const { selectedTables } = this.state |
| | | |
| | | let _tables = selectedTables.filter(item => item.TbName !== table.TbName) |
| | | |
| | | MKEmitter.emit('publicTableChange', table, 'del') |
| | | |
| | | this.setState({ |
| | | selectedTables: _tables |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新 |
| | | */ |
| | | componentWillUnmount () { |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { tables, selectedTables } = this.state |
| | | |
| | | return ( |
| | | <div className="model-tablename-manage-view"> |
| | | {/* 表名添加 */} |
| | | <div className="ant-col ant-form-item-label"> |
| | | <label> |
| | | <Tooltip placement="topLeft" title="此处可以添加页面配置相关的常用表。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 表名 |
| | | </Tooltip> |
| | | </label> |
| | | </div> |
| | | <Select |
| | | showSearch |
| | | className="tables" |
| | | style={{ width: '100%' }} |
| | | optionFilterProp="children" |
| | | value="请选择表名" |
| | | onSelect={this.onTableChange} |
| | | dropdownClassName="mk-tables" |
| | | dropdownMatchSelectWidth={false} |
| | | showArrow={false} |
| | | filterOption={(input, option) => { |
| | | return option.props.children[0].toLowerCase().indexOf(input.toLowerCase()) >= 0 || |
| | | option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0 |
| | | }} |
| | | > |
| | | {tables.map((table, index) => ( |
| | | <Option key={index} title={table.TbName} value={table.TbName}>{table.Remark}<br/>{table.TbName}</Option> |
| | | ))} |
| | | </Select> |
| | | {selectedTables.length > 0 && <List |
| | | size="small" |
| | | bordered |
| | | dataSource={selectedTables} |
| | | renderItem={(item, index) => <List.Item key={index} title={item.Remark + ' (' + item.TbName + ')'}> |
| | | {item.Remark + ' (' + item.TbName + ')'} |
| | | <CloseOutlined onClick={() => this.deleteTable(item)}/> |
| | | </List.Item>} |
| | | />} |
| | | </div> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default TablesComponent |
New file |
| | |
| | | .model-tablename-manage-view { |
| | | >.ant-list { |
| | | margin-top: 20px; |
| | | .ant-list-item { |
| | | display: -webkit-box; |
| | | padding-right: 20px; |
| | | position: relative; |
| | | padding-left: 5px; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | -webkit-line-clamp: 2; |
| | | -webkit-box-orient: vertical; |
| | | min-height: 55px; |
| | | width: 100%; |
| | | .anticon { |
| | | position: absolute; |
| | | top: 0px; |
| | | right: 0px; |
| | | padding: 3px 3px 10px 10px; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | } |
| | | .tables { |
| | | width: 66.66666667%!important; |
| | | .ant-select-selection-selected-value { |
| | | opacity: 0.4!important; |
| | | } |
| | | } |
| | | >.ant-form-item-label { |
| | | width: 33.33333333%; |
| | | } |
| | | } |
| | | .mk-tables { |
| | | max-width: 300px; |
| | | } |
| | |
| | | |
| | | const { Panel } = Collapse |
| | | const { confirm } = Modal |
| | | const TableComponent = asyncComponent(() => import('@/menu/modalconfig/tablecomponent')) |
| | | const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform')) |
| | | const PasteForms = asyncComponent(() => import('@/menu/components/share/pasteforms')) |
| | | const DragElement = asyncComponent(() => import('@/mob/components/formdragelement')) |
| | |
| | | <DndProvider backend={HTML5Backend}> |
| | | <div className="tools"> |
| | | <Collapse accordion defaultActiveKey="1" bordered={false}> |
| | | <Panel header="基本信息" key="0"> |
| | | <TableComponent /> |
| | | </Panel> |
| | | <Panel header="表单" key="1"> |
| | | <div className="search-element"> |
| | | {SearchItems.map((item, index) => { |
| | |
| | | let _columns = [] |
| | | setting.initId = '' |
| | | let triMap = new Map() |
| | | setting.hasSubmit = false |
| | | |
| | | let getColumns = (cols) => { |
| | | return cols.filter(item => { |
| | |
| | | } |
| | | |
| | | if (item.editable === 'true') { |
| | | setting.hasSubmit = true |
| | | if (!setting.initId) { |
| | | setting.initId = item.uuid |
| | | } |
| | |
| | | } |
| | | |
| | | return ( |
| | | <div className="custom-edit-table" id={'anchor' + config.uuid} style={style}> |
| | | <div className={'custom-edit-table' + (setting.hasSubmit ? '' : ' withnot-submit')} id={'anchor' + config.uuid} style={style}> |
| | | <NormalHeader config={config}/> |
| | | {config.search && config.search.length ? |
| | | <MainSearch BID={BID} config={config} refreshdata={this.refreshbysearch}/> : null |
| | |
| | | right: 0px; |
| | | margin-top: 15px; |
| | | } |
| | | } |
| | | .custom-edit-table.withnot-submit { |
| | | .button-list.toolbar-button { |
| | | margin-right: 0px; |
| | | } |
| | | } |
| | |
| | | |
| | | this.setState({editing: false}) |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | this.setState({editing: false}) |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | this.setState({editing: false}) |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | this.onBlur() |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | const { col, record } = this.props |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | } |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | | if (/\$next/.test(col.enter)) { |
| | | MKEmitter.emit('nextLine', col, record.$$uuid) |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | |
| | | let next = edData[index + 1] || null |
| | | |
| | | if (next) { |
| | | let node = document.getElementById(setting.initId + next.$$uuid) |
| | | let nextId = setting.initId + next.$$uuid |
| | | if (/^\$next_/.test(col.enter)) { |
| | | nextId = col.enter.split('_')[1] + next.$$uuid |
| | | } |
| | | |
| | | let node = document.getElementById(nextId) |
| | | if (node) { |
| | | if (setting.editType === 'multi') { |
| | | if (setting.triType === 'click') { |
| | |
| | | |
| | | return ( |
| | | <> |
| | | <div className="edit-custom-table-btn-wrap" style={submit.wrapStyle}> |
| | | {setting.hasSubmit ? <div className="edit-custom-table-btn-wrap" style={submit.wrapStyle}> |
| | | <Button style={submit.style} onClick={() => setTimeout(() => {this.submit()}, 10)} loading={loading} className="submit-table" type="link">提交</Button> |
| | | </div> |
| | | </div> : null} |
| | | <div className={`edit-custom-table ${setting.tableHeader || ''} ${height ? 'fixed-height' : ''} ${setting.mode || ''} table-vertical-${setting.vertical || ''} mk-edit-${setting.editType || 'simple'}`} id={tableId}> |
| | | <Table |
| | | rowKey="$$uuid" |
| | |
| | | onChange={this.changeTable} |
| | | pagination={_pagination} |
| | | /> |
| | | {_data.length > 10 ? <Button style={submit.style} onClick={() => setTimeout(() => {this.submit()}, 10)} loading={loading} className="submit-footer-table" type="link">提交</Button> : null} |
| | | {setting.hasSubmit && _data.length > 10 ? <Button style={submit.style} onClick={() => setTimeout(() => {this.submit()}, 10)} loading={loading} className="submit-footer-table" type="link">提交</Button> : null} |
| | | </div> |
| | | </> |
| | | ) |
| | |
| | | table tbody tr { |
| | | color: var(--mk-table-color); |
| | | } |
| | | .ant-table-bordered { |
| | | table { |
| | | tbody { |
| | | tr:last-child { |
| | | td { |
| | | border-bottom: none; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | // .ant-table-bordered { |
| | | // table { |
| | | // tbody { |
| | | // tr:last-child { |
| | | // td { |
| | | // border-bottom: none; |
| | | // } |
| | | // } |
| | | // } |
| | | // } |
| | | // } |
| | | } |
| | | .edit-custom-table.mk-edit-simple { |
| | | table tbody tr td { |
| | |
| | | import Api from '@/api' |
| | | import options from '@/store/options.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import { queryTableSql } from '@/utils/option.js' |
| | | |
| | | import './index.scss' |
| | |
| | | UNSAFE_componentWillMount () { |
| | | const { config } = this.props |
| | | |
| | | let tables = config.tables ? fromJS(config.tables).toJS() : [] |
| | | |
| | | window.GLOB.publicTables = tables |
| | | |
| | | this.setState({ |
| | | selectedTables: config.tables ? fromJS(config.tables).toJS() : [] |
| | | selectedTables: tables |
| | | }, () => { |
| | | this.gettableFields() |
| | | }) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('publicTableChange', this.publicTableChange) |
| | | this.gettables() |
| | | } |
| | | |
| | | publicTableChange = (table, type) => { |
| | | if (type === 'plus') { |
| | | this.onTableChange(table) |
| | | } else if (type === 'del') { |
| | | this.deleteTable(table) |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | let _table = tables.filter(item => item.TbName === value)[0] |
| | | let isSelected = !!selectedTables.filter(cell => cell.TbName === value)[0] |
| | | if (!isSelected) { |
| | | let _tables = [...selectedTables, _table] |
| | | |
| | | window.GLOB.publicTables = _tables |
| | | |
| | | this.setState({ |
| | | selectedTables: [...selectedTables, _table] |
| | | selectedTables: _tables |
| | | }) |
| | | |
| | | let _config = {...config, tables: [...selectedTables, _table]} |
| | | let _config = {...config, tables: _tables} |
| | | |
| | | Api.getSystemConfig({func: 'sPC_Get_FieldName', TBName: value}).then(res => { |
| | | if (res.status) { |
| | |
| | | let _tables = selectedTables.filter(item => item.TbName !== table.TbName) |
| | | let _fields = tableFields.filter(item => item.tableName !== table.TbName) |
| | | |
| | | window.GLOB.publicTables = _tables |
| | | |
| | | this.setState({ |
| | | selectedTables: _tables, |
| | | tableFields: _fields |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('publicTableChange', this.publicTableChange) |
| | | } |
| | | |
| | | render() { |
| | |
| | | {/* 表名添加 */} |
| | | <div className="ant-col ant-form-item-label"> |
| | | <label> |
| | | <Tooltip placement="topLeft" title="此处可以添加页面配置相关的常用表,可通过工具栏中的添加按钮,可批量添加表格相关字段。"> |
| | | <Tooltip placement="topLeft" title="此处可以添加页面配置相关的常用表。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 表名 |
| | | </Tooltip> |
| | |
| | | |
| | | return cell |
| | | }) |
| | | } else if (col.editable === 'true' && col.enter) { |
| | | col.enter = md5(commonId + col.enter) |
| | | } else if (col.editable === 'true' && col.enter && col.enter !== '$next' && col.enter !== '$sub') { |
| | | if (/\$next_/.test(col.enter)) { |
| | | col.enter = '$next_' + md5(commonId + col.enter.split('_')[1]) |
| | | } else { |
| | | col.enter = md5(commonId + col.enter) |
| | | } |
| | | } |
| | | |
| | | return col |
| | |
| | | } |
| | | return cell |
| | | }) |
| | | } else if (col.editable === 'true' && col.enter) { // 可编辑表 |
| | | col.enter = md5(commonId + col.enter) |
| | | } else if (col.editable === 'true' && col.enter && col.enter !== '$next' && col.enter !== '$sub') { // 可编辑表 |
| | | if (/\$next_/.test(col.enter)) { |
| | | col.enter = '$next_' + md5(commonId + col.enter.split('_')[1]) |
| | | } else { |
| | | col.enter = md5(commonId + col.enter) |
| | | } |
| | | } |
| | | |
| | | return col |