| | |
| | | } |
| | | .ant-input-search.ant-input-affix-wrapper { |
| | | width: 50%; |
| | | max-width: 130px; |
| | | max-width: 150px; |
| | | margin-top: 8px; |
| | | margin-right: 25px; |
| | | float: right; |
| | |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | | setting: { interType: 'system' }, |
| | | wrap: { name: card.name, width: card.width || 24, bordered: 'true', tableType: 'checkbox' }, |
| | | wrap: { name: card.name, width: card.width || 24, bordered: 'true', tableType: 'checkbox', show: 'true' }, |
| | | style: { marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' }, |
| | | headerStyle: { fontSize: '16px', borderBottomWidth: '1px', borderBottomColor: '#e8e8e8' }, |
| | | columns: [], |
| | |
| | | .page-card { |
| | | background: transparent; |
| | | } |
| | | .quickly-add { |
| | | display: inline-block; |
| | | position: absolute; |
| | | z-index: 3; |
| | | right: 70px; |
| | | bottom: 5px; |
| | | .ant-btn-block { |
| | | background-color: transparent; |
| | | color: #1890ff; |
| | | border: none; |
| | | box-shadow: none !important; |
| | | height: 18px; |
| | | padding: 0 10px; |
| | | } |
| | | } |
| | | } |
| | | .model-table-search-list.length0 { |
| | | display: none; |
| | |
| | | ] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | field: 'show', |
| | | label: '搜索按钮', |
| | | initval: wrap.show || 'true', |
| | | tooltip: '搜索条件存在时,可选择是否显示搜索按钮。', |
| | | required: false, |
| | | options: [ |
| | | {value: 'true', label: '显示'}, |
| | | {value: 'false', label: '隐藏'}, |
| | | ] |
| | | }, |
| | | { |
| | | type: 'color', |
| | | field: 'borderColor', |
| | | label: '边框颜色', |
| | |
| | | } |
| | | .ant-input-search.ant-input-affix-wrapper { |
| | | width: 50%; |
| | | max-width: 130px; |
| | | max-width: 150px; |
| | | margin-top: 6px; |
| | | float: right; |
| | | height: 30px; |
| | |
| | | |
| | | if (btn.uuid !== res.menuId) return |
| | | |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | this.setState({ loading: true }) |
| | | |
| | | this.execSubmit(this.state.tabledata, () => {}, res.form) |
| | | } |
| | |
| | | /** |
| | | * @description 按钮状态改变 |
| | | */ |
| | | updateStatus = (type) => { |
| | | if (type === 'start') { |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | } else if (type === 'over') { |
| | | this.setState({ |
| | | loading: false, |
| | | visible: false |
| | | }) |
| | | } |
| | | updateStatus = () => { |
| | | this.setState({ |
| | | loading: false, |
| | | visible: false, |
| | | confirmLoading: false |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | MKEmitter.emit('mkFormSubmit', btn.uuid) |
| | | return |
| | | } else if (btn.OpenType === 'prompt') { |
| | | this.updateStatus('start') |
| | | this.setState({loading: true}) |
| | | confirm({ |
| | | title: this.state.dict['main.action.confirm.tip'], |
| | | onOk() { |
| | |
| | | }) |
| | | }, |
| | | onCancel() { |
| | | _this.updateStatus('over') |
| | | _this.setState({loading: false}) |
| | | } |
| | | }) |
| | | } else if (btn.OpenType === 'exec') { |
| | | this.updateStatus('start') |
| | | this.setState({loading: true}) |
| | | this.execSubmit(data, () => { this.setState({loading: false})}) |
| | | } else if (btn.OpenType === 'pop') { |
| | | this.updateStatus('start') |
| | | |
| | | let modal = this.state.btnconfig |
| | | if (!modal && btn.modal) { |
| | | modal = this.handleModelConfig(btn.modal) |
| | | } |
| | | |
| | | this.setState({ |
| | | loading: true, |
| | | tabledata: data, |
| | | btnconfig: modal |
| | | }, () => { |
| | |
| | | } |
| | | resolve(res) |
| | | }, () => { |
| | | this.updateStatus('over') |
| | | this.updateStatus() |
| | | _resolve() |
| | | }) |
| | | }, 100 * i) |
| | |
| | | } |
| | | resolve() |
| | | }, () => { |
| | | _this.updateStatus('over') |
| | | _this.updateStatus() |
| | | resolve() |
| | | _resolve() |
| | | }) |
| | |
| | | _resolve() |
| | | } |
| | | }, () => { |
| | | this.updateStatus('over') |
| | | this.updateStatus() |
| | | _resolve() |
| | | }) |
| | | } |
| | |
| | | _resolve() |
| | | } |
| | | }, () => { |
| | | this.updateStatus('over') |
| | | this.updateStatus() |
| | | _resolve() |
| | | }) |
| | | } |
| | |
| | | _resolve() |
| | | } |
| | | }, () => { |
| | | this.updateStatus('over') |
| | | this.updateStatus() |
| | | _resolve() |
| | | }) |
| | | } |
| | |
| | | _resolve() |
| | | } |
| | | }, () => { |
| | | this.updateStatus('over') |
| | | this.updateStatus() |
| | | _resolve() |
| | | }) |
| | | } else { |
| | |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | this.updateStatus('over') |
| | | this.setState({ loading: false }) |
| | | } else if (!_LongParam || (btn.OpenType === 'pop' && _LongParam.type !== 'Modal')) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '未获取到按钮配置信息!', |
| | | duration: 5 |
| | | }) |
| | | this.updateStatus('over') |
| | | this.setState({ loading: false }) |
| | | } else { |
| | | _LongParam = updateForm(_LongParam) |
| | | _LongParam = this.handleModelConfig(_LongParam) |
| | |
| | | */ |
| | | handleOk = () => { |
| | | this.formRef.handleConfirm().then(res => { |
| | | this.setState({ |
| | | confirmLoading: true |
| | | }) |
| | | this.setState({ confirmLoading: true }) |
| | | |
| | | this.execSubmit(this.state.tabledata, () => { |
| | | this.setState({ |
| | | confirmLoading: false |
| | | }) |
| | | }, res) |
| | | this.execSubmit(this.state.tabledata, () => { this.setState({ confirmLoading: false }) }, res) |
| | | }) |
| | | } |
| | | |
| | |
| | | */ |
| | | handleCancel = () => { |
| | | this.setState({ |
| | | loading: false, |
| | | visible: false, |
| | | confirmLoading: false |
| | | }) |
| | | this.updateStatus('over') |
| | | } |
| | | |
| | | modelconfirm = () => { |
| | |
| | | }) |
| | | }, |
| | | onCancel() { |
| | | _this.updateStatus('over') |
| | | _this.setState({ loading: false }) |
| | | } |
| | | }) |
| | | } |
| | |
| | | } |
| | | MKEmitter.removeListener('triggerBtnId', this.actionTrigger) |
| | | } |
| | | |
| | | /** |
| | | * @description 按钮状态改变 |
| | | */ |
| | | updateStatus = (type) => { |
| | | if (type === 'start') { |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | } else if (type === 'over') { |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | } |
| | | } |
| | | |
| | | /** |
| | | * @description 触发按钮操作 |
| | |
| | | } |
| | | |
| | | if (btn.execMode === 'pop') { |
| | | this.updateStatus('start') |
| | | let modal = this.state.btnconfig |
| | | if (!modal && btn.modal) { |
| | | modal = this.handleModelConfig(btn.modal) |
| | | } |
| | | |
| | | this.setState({ |
| | | loading: true, |
| | | tabledata: data, |
| | | btnconfig: modal |
| | | }, () => { |
| | | this.improveAction() |
| | | }) |
| | | } else if (btn.execMode === 'prompt') { |
| | | this.updateStatus('start') |
| | | this.setState({ loading: true }) |
| | | confirm({ |
| | | title: this.state.dict['main.action.confirm.tip'], |
| | | onOk() { |
| | | _this.triggerPrint(data) |
| | | }, |
| | | onCancel() { |
| | | _this.updateStatus('over') |
| | | _this.setState({ loading: false }) |
| | | } |
| | | }) |
| | | } else { |
| | |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | this.updateStatus('over') |
| | | this.setState({ loading: false }) |
| | | } else if (!_LongParam || (btn.execMode === 'pop' && _LongParam.type !== 'Modal')) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '未获取到按钮配置信息!', |
| | | duration: 5 |
| | | }) |
| | | this.updateStatus('over') |
| | | this.setState({ loading: false }) |
| | | } else { |
| | | _LongParam = updateForm(_LongParam) |
| | | _LongParam = this.handleModelConfig(_LongParam) |
| | |
| | | * @description 模态框(表单),确认 |
| | | */ |
| | | handleOk = () => { |
| | | const { btnconfig } = this.state |
| | | this.formRef.handleConfirm().then(res => { |
| | | this.setState({ |
| | | visible: false |
| | | }) |
| | | if (btnconfig.setting.finish !== 'unclose') { |
| | | this.setState({ |
| | | visible: false |
| | | }) |
| | | } |
| | | this.triggerPrint(this.state.tabledata, res) |
| | | }) |
| | | } |
| | |
| | | */ |
| | | handleCancel = () => { |
| | | this.setState({ |
| | | loading: false, |
| | | visible: false |
| | | }) |
| | | this.updateStatus('over') |
| | | } |
| | | |
| | | modelconfirm = () => { |
| | |
| | | _this.triggerPrint(tabledata, result) |
| | | }, |
| | | onCancel() { |
| | | _this.updateStatus('over') |
| | | _this.setState({ loading: false }) |
| | | } |
| | | }) |
| | | } |
| | |
| | | .ant-form-item.checkcard, .ant-form-item.file-upload { |
| | | margin-bottom: 10px; |
| | | .ant-form-item-control { |
| | | line-height: 1.5; |
| | | line-height: 1; |
| | | } |
| | | } |
| | | .ant-form-item.readonly { |
| | |
| | | .check-card-form-box { |
| | | margin-top: 10px; |
| | | margin-bottom: -10px; |
| | | margin-top: 5px; |
| | | // margin-bottom: -10px; |
| | | .card-cell { |
| | | position: relative; |
| | | border: 1px solid #bcbcbc; |
| | |
| | | .ant-calendar-picker-container { |
| | | z-index: 10 !important; |
| | | } |
| | | .check-card-form-box { |
| | | margin-top: 5px; |
| | | } |
| | | .advance-button { |
| | | position: absolute; |
| | | left: 0; |
| | |
| | | } |
| | | |
| | | if (searchlist) { |
| | | if (setting && setting.show === 'false') { |
| | | showButton = false |
| | | } |
| | | _searchlist = fromJS(searchlist).toJS() |
| | | } else if (config) { |
| | | _searchlist = fromJS(config.search).toJS() |
| | |
| | | } |
| | | } |
| | | } |
| | | .check-card-form-box { |
| | | margin-top: 5px; |
| | | } |
| | | .ant-calendar-picker-clear, .ant-calendar-picker-icon { |
| | | right: 8px; |
| | | } |
| | |
| | | |
| | | render() { |
| | | return ( |
| | | <div className="check-card-edit-box" style={{marginTop: '10px'}}> |
| | | <div className="check-card-edit-box" style={{marginTop: '5px'}}> |
| | | <Row gutter={12}>{this.getCards()}</Row> |
| | | </div> |
| | | ) |
| | |
| | | } |
| | | |
| | | let formItem = null |
| | | let className = 'ant-form-item' |
| | | if (card.type === 'text') { |
| | | formItem = (<Input style={{marginTop: '4px'}} placeholder={card.placeholder || ''} value={card.initval} />) |
| | | } else if (card.type === 'number') { |
| | |
| | | } else if (card.type === 'split') { |
| | | formItem = <div className="split-line">{card.label}</div> |
| | | } else if (card.type === 'checkcard') { |
| | | className += ' checkcard' |
| | | formItem = <CheckCard config={card} /> |
| | | } |
| | | |
| | |
| | | <div className="page-card" style={{ opacity: opacity}}> |
| | | <div ref={node => drag(drop(node))} onDoubleClick={edit}> |
| | | {card.type === 'split' ? formItem : <Form.Item |
| | | className="ant-form-item" |
| | | className={className} |
| | | colon={!!_label} |
| | | label={_label} |
| | | required={card.required === 'true'} |
| | |
| | | padding-left: 10px; |
| | | border-bottom: 1px solid #e9e9e9; |
| | | } |
| | | .ant-form-item.checkcard { |
| | | .ant-form-item-control { |
| | | line-height: 1; |
| | | } |
| | | } |
| | | .ant-form-item { |
| | | cursor: move; |
| | | display: flex; |
| | |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={12}> |
| | | <Form.Item label="显示方式"> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="打印按钮中无效。"> |
| | | <Icon type="question-circle" /> |
| | | 显示方式 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('display', { |
| | | initialValue: display || 'modal' |
| | | })( |
| | |
| | | import zhCN from '@/locales/zh-CN/model.js' |
| | | import enUS from '@/locales/en-US/model.js' |
| | | import { getSearchForm } from '@/templates/zshare/formconfig' |
| | | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import SearchForm from './searchform' |
| | | import DragElement from './dragsearch' |
| | | import './index.scss' |
| | | |
| | | const { confirm } = Modal |
| | | |
| | | const FieldsComponent = asyncComponent(() => import('@/templates/sharecomponent/fieldscomponent')) |
| | | |
| | | class SearchComponent extends Component { |
| | | static propTpyes = { |
| | |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) || this.props.config.setting.show !== nextProps.config.setting.show |
| | | if (!is(fromJS(this.state), fromJS(nextState))) { |
| | | return true |
| | | } else if (this.props.config.wrap) { |
| | | return this.props.config.wrap.show !== nextProps.config.wrap.show |
| | | } else { |
| | | return this.props.config.setting.show !== nextProps.config.setting.show |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { config } = this.props |
| | | const { dict, searchlist, visible, sqlVerifing, card, showField } = this.state |
| | | |
| | | let show = config.setting.show |
| | | if (config.wrap) { |
| | | show = config.wrap.show |
| | | } |
| | | |
| | | return ( |
| | | <div className={'model-table-search-list length' + searchlist.length}> |
| | | <Tooltip placement="bottomLeft" overlayClassName="middle" title={dict['model.tooltip.search.guide']}> |
| | | <Icon type="question-circle" /> |
| | | </Tooltip> |
| | | <FieldsComponent config={config} type="search" /> |
| | | <Switch checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={showField} onChange={this.onFieldChange} /> |
| | | <DragElement |
| | | list={searchlist} |
| | | show={config.setting.show} |
| | | show={show} |
| | | showField={showField} |
| | | handleList={this.handleList} |
| | | handleMenu={this.handleSearch} |
| | |
| | | position: relative; |
| | | border-bottom: 1px solid #d9d9d9; |
| | | |
| | | .quickly-add { |
| | | display: none; |
| | | } |
| | | .anticon-question-circle { |
| | | color: #c49f47; |
| | | position: relative; |
| | |
| | | } |
| | | } else if (['multiselect', 'select', 'link', 'checkcard'].includes(values.type) && values.resourceType === '1') { |
| | | values.options = [] |
| | | } else if (values.type === 'text' && values.advanced === 'true') { |
| | | values.inputType = 'input' |
| | | } |
| | | |
| | | if (values.type === 'range') { |