| | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import asyncIconComponent from '@/utils/asyncIconComponent' |
| | | import { getModalForm } from '@/templates/zshare/formconfig' |
| | | import { resetStyle } from '@/utils/utils-custom.js' |
| | | import { resetStyle, getTables } from '@/utils/utils-custom.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import getWrapForm from './options' |
| | | import zhCN from '@/locales/zh-CN/model.js' |
| | | import enUS from '@/locales/en-US/model.js' |
| | | import './index.scss' |
| | | |
| | | const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform')) |
| | |
| | | } |
| | | |
| | | state = { |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | appType: sessionStorage.getItem('appType'), |
| | | card: null, |
| | | back: false, |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | | dataName: card.dataName || '', |
| | | width: card.width || 24, |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitStyle', this.getStyle) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitStyle', this.getStyle) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | card.errors = [] |
| | | |
| | | if (card.wrap.datatype !== 'static') { |
| | | let supModule = card.setting.supModule ? card.setting.supModule[card.setting.supModule.length - 1] || '' : '' |
| | | if (supModule === 'empty') { |
| | | supModule = '' |
| | | } |
| | | let columns = card.columns.map(c => c.field) |
| | | |
| | | if (card.setting.interType === 'system' && card.setting.execute !== 'false' && !card.setting.dataresource) { |
| | | card.errors.push({ level: 0, detail: '未设置数据源!'}) |
| | | } else if (card.setting.interType === 'system' && card.setting.execute === 'false' && card.scripts.filter(script => script.status !== 'false').length === 0) { |
| | | card.errors.push({ level: 0, detail: '数据源中无可用脚本!'}) |
| | | } else if (!card.setting.primaryKey) { |
| | | card.errors.push({ level: 0, detail: '未设置主键!'}) |
| | | } else if (!columns.includes(card.setting.primaryKey)) { |
| | | card.errors.push({ level: 0, detail: '主键已失效!'}) |
| | | } else if (!card.setting.supModule) { |
| | | card.errors.push({ level: 0, detail: '未设置上级组件!'}) |
| | | } |
| | | |
| | | let supModule = card.setting.supModule ? card.setting.supModule[card.setting.supModule.length - 1] || '' : '' |
| | | if (supModule === 'empty') { |
| | | supModule = '' |
| | | if (card.errors.length === 0) { |
| | | card.$tables = getTables(card) |
| | | } |
| | | let columns = card.columns.map(c => c.field) |
| | | let lowcols = card.columns.map(c => c.field.toLowerCase()) |
| | | |
| | | card.subcards.forEach(item => { |
| | | item.fields.forEach(m => { |
| | | if (m.type === 'linkMain' && !supModule) { |
| | | card.errors.push({ level: 1, detail: `关联主表表单“${m.label}”无效`}) |
| | | } else if (m.field && !columns.includes(m.field) && lowcols.includes(m.field.toLowerCase())) { |
| | | card.errors.push({ level: 1, detail: `表单“${m.label}”大小写与字段集不一致`}) |
| | | card.errors.push({ level: 1, detail: `请检查关联主表“${m.label}”是否有效`}) |
| | | } |
| | | }) |
| | | }) |
| | | } else { |
| | | let supModule = card.wrap.supModule ? card.wrap.supModule[card.wrap.supModule.length - 1] : '' |
| | | |
| | | card.$tables = getTables(card) |
| | | |
| | | card.subcards.forEach(item => { |
| | | item.fields.forEach(m => { |
| | | if (m.type === 'linkMain' && !supModule) { |
| | | card.errors.push({ level: 1, detail: `关联主表表单“${m.label}”无效`}) |
| | | card.errors.push({ level: 1, detail: `请检查关联主表“${m.label}”是否有效`}) |
| | | } |
| | | }) |
| | | }) |
| | |
| | | changeStyle = () => { |
| | | const { card } = this.state |
| | | |
| | | MKEmitter.emit('changeStyle', [card.uuid], ['height', 'background', 'border', 'padding', 'margin', 'shadow'], card.style) |
| | | MKEmitter.emit('changeStyle', ['height', 'background', 'border', 'padding', 'margin', 'shadow', 'clear'], card.style, this.getStyle) |
| | | } |
| | | |
| | | getStyle = (comIds, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (comIds[0] === 'form') { |
| | | let Index = card.subcards[0].fields.findIndex(n => n.uuid === comIds[1]) |
| | | |
| | | if (Index === -1) return |
| | | |
| | | let _card = fromJS(card).toJS() |
| | | |
| | | _card.subcards[0].fields[Index].style = style |
| | | |
| | | this.updateComponent(_card) |
| | | |
| | | return |
| | | } |
| | | |
| | | if (comIds.length !== 1 || comIds[0] !== card.uuid) return |
| | | |
| | | let _card = {...card, style} |
| | | getStyle = (style) => { |
| | | let _card = {...this.state.card, style} |
| | | |
| | | this.updateComponent(_card) |
| | | } |
| | |
| | | standardform, |
| | | visible: true, |
| | | editform: _form, |
| | | formlist: getModalForm(_form, _inputfields, _tabfields, _linkableFields, _linksupFields) |
| | | formlist: getModalForm(_form, _inputfields, _tabfields, _linkableFields, _linksupFields, card.columns) |
| | | }) |
| | | } |
| | | |
| | |
| | | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.LText = param.LText.replace(/@\$|\$@/ig, '').replace(/@(BID|ID|LoginUID|SessionUid|UserID|Appkey|time_id)@/ig, `'${param.timestamp}'`) |
| | | param.LText = param.LText.replace(/\n/g, ' ') |
| | | |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.secretkey = Utils.encrypt('', param.timestamp) |
| | |
| | | param.rduri = window.GLOB.mainSystemApi |
| | | } |
| | | |
| | | Api.getLocalConfig(param).then(result => { |
| | | Api.genericInterface(param).then(result => { |
| | | if (result.status) { |
| | | this.setState({ |
| | | sqlVerifing: false, |
| | |
| | | } |
| | | |
| | | updateWrap = (res) => { |
| | | let _card = {...this.state.card, wrap: res} |
| | | let _card = fromJS(this.state.card).toJS() |
| | | _card.wrap = res |
| | | |
| | | if (res.datatype === 'static') { |
| | | if (res.supModule && res.supModule.length > 0) { |
| | |
| | | _card.subcards[0].setting.align = _card.wrap.align |
| | | _card.subcards[0].setting.enable = _card.wrap.enable |
| | | _card.subcards[0].setting.verticalSpace = _card.wrap.verticalSpace |
| | | |
| | | if (_card.wrap.closeEnable === 'true' && !_card.subcards[0].closeButton) { |
| | | _card.subcards[0].closeButton = {label: '关闭', enable: 'true', type: 'close', style: {backgroundColor: '#ffffff', color: 'rgba(0,0,0,0.65)', borderColor: '#d9d9d9', borderWidth: '1px', paddingLeft: '25px', paddingRight: '25px', paddingTop: '5px', paddingBottom: '5px', marginLeft: '10px'}} |
| | | } else if (_card.subcards[0].closeButton) { |
| | | _card.subcards[0].closeButton.enable = _card.wrap.closeEnable |
| | | } |
| | | |
| | | this.updateComponent(_card) |
| | | } |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { card, dict, appType } = this.state |
| | | const { card, appType } = this.state |
| | | |
| | | return ( |
| | | <div className="menu-simple-form-edit-box" style={resetStyle(card.style)} onClick={this.clickComponent} id={card.uuid}> |
| | |
| | | <PlusOutlined className="plus" title="添加表单" onClick={this.addForm}/> |
| | | <FieldsComponent config={card.subcards[0]} type="form" plusFields={this.plusFields} /> |
| | | <span style={{color: 'red', marginLeft: '30px', cursor: 'pointer'}} onClick={this.clearGroup}>清空</span> |
| | | <Switch checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} /> |
| | | <Switch checkedChildren="开" unCheckedChildren="关" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} /> |
| | | {appType !== 'mob' ? <Button className="mk-cols-change" onClick={() => this.changecols(1)}>1列</Button> : null} |
| | | {appType !== 'mob' ? <Button className="mk-cols-change" onClick={() => this.changecols(2)}>2列</Button> : null} |
| | | {appType !== 'mob' ? <Button className="mk-cols-change" onClick={() => this.changecols(3)}>3列</Button> : null} |
| | |
| | | list={card.subcards[0].fields} |
| | | setting={card.subcards[0].setting} |
| | | showField={this.state.showField} |
| | | placeholder={dict['header.form.modal.placeholder']} |
| | | handleList={this.handleList} |
| | | handleForm={this.handleForm} |
| | | closeForm={this.closeForm} |
| | |
| | | </div> |
| | | </div> |
| | | <Modal |
| | | title={this.state.dict['model.edit']} |
| | | title="编辑" |
| | | visible={this.state.visible} |
| | | width={950} |
| | | maskClosable={false} |
| | |
| | | destroyOnClose |
| | | > |
| | | <ModalForm |
| | | dict={this.state.dict} |
| | | card={this.state.editform} |
| | | formlist={this.state.formlist} |
| | | inputSubmit={this.handleSubmit} |