| | |
| | | }) |
| | | } |
| | | |
| | | |
| | | handleviewconfig = (e) => { |
| | | e.stopPropagation() |
| | | |
| | |
| | | |
| | | triggerDate = (item) => { |
| | | const { config } = this.state |
| | | let time = '' |
| | | |
| | | if (!config.tab) return |
| | | |
| | | if (item.time.length === 6) { |
| | | time = item.time.substr(0, 4) + '-' + item.time.substr(4, 2) |
| | | } else { |
| | | time = item.time.substr(0, 4) + '-' + item.time.substr(4, 2) + '-' + item.time.substr(6, 2) |
| | | } |
| | | |
| | | this.setState({ |
| | | visible: true, |
| | | triggerTime: time |
| | | triggerTime: item.time.substr(0, 4) + '-' + item.time.substr(4, 2) + '-' + item.time.substr(6, 2) |
| | | }) |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { BID, searchlist, loadingview, viewlost, config, loading, data } = this.state |
| | | const { BID, searchlist, loadingview, viewlost, config, loading, data, triggerTime } = this.state |
| | | |
| | | return ( |
| | | <div className="calendar-page" id={this.state.ContainerId}> |
| | |
| | | destroyOnClose |
| | | > |
| | | {config.tab ? <SubTabTable |
| | | BID={triggerTime} |
| | | Tab={config.tab} |
| | | SupMenuID={this.props.MenuID} |
| | | MenuID={config.tab.linkTab} |
| | | refreshSupView={this.loadmaindata} |
| | |
| | | class SubTabModalTable extends Component { |
| | | static propTpyes = { |
| | | type: PropTypes.any, // 类型,calendar需特殊处理 |
| | | Tab: PropTypes.any, // 日历标签信息 |
| | | BID: PropTypes.string, // 上级数据ID |
| | | BData: PropTypes.any, // 上级数据 |
| | | MenuID: PropTypes.string, // 菜单Id |
| | | mainSearch: PropTypes.any, // 主表搜索条件 |
| | | SupMenuID: PropTypes.string, // 上级菜单Id |
| | | refreshSupView: PropTypes.any, // 刷新上级菜单 |
| | | closeModalView: PropTypes.any // 关闭模态框 |
| | |
| | | |
| | | // 仅支持exec、prompt、pop 三种类型按钮 |
| | | if (type === 'calendar') { |
| | | config.action = config.action.filter(item => ['exec', 'prompt', 'pop', 'tab'].includes(item.OpenType)) |
| | | config.action = config.action.filter(item => ['exec', 'prompt', 'pop', 'tab', 'excelIn', 'excelOut'].includes(item.OpenType)) |
| | | } else { |
| | | config.action = config.action.filter(item => ['exec', 'prompt', 'pop'].includes(item.OpenType)) |
| | | } |
| | |
| | | * @description 获取用户自定义存储过程传参 |
| | | */ |
| | | getCustomParam = () => { |
| | | const { mainSearch } = this.props |
| | | const { pageIndex, pageSize, orderBy, search, setting } = this.state |
| | | |
| | | let _search = Utils.formatCustomMainSearch(search) |
| | | let searches = search |
| | | if (mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | searches = [...mainSearch, ...search] |
| | | } |
| | | |
| | | let _search = Utils.formatCustomMainSearch(searches) |
| | | |
| | | let param = { |
| | | OrderCol: orderBy || setting.order, |
| | |
| | | * @description 获取系统存储过程 sPC_Get_TableData 的参数 |
| | | */ |
| | | getDefaultParam = () => { |
| | | const { mainSearch } = this.props |
| | | const { arr_field, pageIndex, pageSize, orderBy, search, setting } = this.state |
| | | |
| | | let _search = Utils.joinMainSearchkey(search) |
| | | let searches = search |
| | | if (mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | searches = [...mainSearch, ...search] |
| | | } |
| | | |
| | | let _search = Utils.joinMainSearchkey(searches) |
| | | _search = _search ? 'where ' + _search : '' |
| | | |
| | | let param = { |
| | |
| | | |
| | | let regoptions = null |
| | | if (setting.queryType === 'statistics' || param.custom_script) { |
| | | let allSearch = Utils.getAllSearchOptions(search) |
| | | let allSearch = Utils.getAllSearchOptions(searches) |
| | | |
| | | regoptions = allSearch.map(item => { |
| | | return { |
| | |
| | | * @description 按钮操作完成后(成功或失败),页面刷新,重置页码及选择项 |
| | | */ |
| | | refreshbyaction = (position) => { |
| | | if (position === 'grid') { |
| | | if (position === 'grid' || position === 'maingrid') { |
| | | this.reloadtable() |
| | | this.props.refreshSupView() |
| | | } else if (position === 'view') { |
| | |
| | | data: record |
| | | } |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 导出Excel时,获取页面搜索排序等参数 |
| | | */ |
| | | getexceloutparam = () => { |
| | | const { Tab, mainSearch } = this.props |
| | | const { arr_field, orderBy, search, setting} = this.state |
| | | |
| | | let searches = search |
| | | if (mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | searches = [...mainSearch, ...search] |
| | | } |
| | | |
| | | return { |
| | | arr_field: arr_field, |
| | | orderBy: orderBy || setting.order, |
| | | search: searches, |
| | | menuName: Tab.label |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | logcolumns={this.state.logcolumns} |
| | | operations={config.gridBtn.operations || []} |
| | | refreshdata={this.refreshbyaction} |
| | | getexceloutparam={this.getexceloutparam} |
| | | /> |
| | | </div> |
| | | <SubTable |
| | |
| | | let level = _levels[0] |
| | | let monthlist = null |
| | | |
| | | if (_levels.includes('month')) { |
| | | if (_levels.includes('month') || _levels.includes('year')) { |
| | | monthlist = datelist.filter(item => item.month === moment().format('MM'))[0] |
| | | } |
| | | |
| | |
| | | let datelist = this.mountdata(this.state.datelist, nextProps.data || []) |
| | | let monthlist = null |
| | | |
| | | if (this.state.levels.includes('month')) { |
| | | if (this.state.levels.includes('month') || this.state.levels.includes('year')) { |
| | | monthlist = datelist.filter(item => item.month === this.state.selectMonth)[0] |
| | | } |
| | | |
| | |
| | | }) |
| | | }) |
| | | |
| | | if (datalist.length === 0) return datelist |
| | | |
| | | datalist.sort((a, b) => a.level - b.level) |
| | | if (datalist.length > 0) { |
| | | datalist.sort((a, b) => a.level - b.level) |
| | | } |
| | | |
| | | let styles = [ |
| | | {background: '#d0021b', color: '#ffffff'}, |
| | |
| | | ] |
| | | |
| | | return datelist.map(month => { |
| | | month.subData = [] |
| | | datalist.forEach(item => { |
| | | if (item.startMonth <= month.time && item.endMonth >= month.time) { |
| | | month.subData.push(item) |
| | |
| | | week.sublist = week.sublist.map(day => { |
| | | if (!day) return null |
| | | |
| | | day.subData = [] |
| | | datalist.forEach(item => { |
| | | if (item.start <= day.time && item.end >= day.time) { |
| | | day.subData.push(item) |
| | |
| | | if (day.subData[0]) { |
| | | day.style = styles[day.subData[0].level - 1] || null |
| | | } |
| | | |
| | | return day |
| | | }) |
| | | |
| | | return week |
| | | }) |
| | | |
| | | return month |
| | | }) |
| | | } |
| | |
| | | let datelist = this.getDateList(value) |
| | | let monthlist = null |
| | | |
| | | if (levels.includes('month')) { |
| | | if (levels.includes('month') || levels.includes('year')) { |
| | | monthlist = datelist.filter(item => item.month === selectMonth)[0] |
| | | } |
| | | |
| | |
| | | |
| | | this.setState({ selectYear: value, datelist, monthlist }) |
| | | } else { |
| | | this.setState({ selectYear: value, datelist, monthlist }) |
| | | |
| | | this.props.changeDate(value) |
| | | this.setState({ selectYear: value, datelist, monthlist }, () => { |
| | | this.props.changeDate(value) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | const { datelist } = this.state |
| | | |
| | | this.setState({ |
| | | level: 'month', |
| | | selectMonth: value, |
| | | monthlist: datelist.filter(item => item.month === value)[0] |
| | | }) |
| | |
| | | {level === 'year' && monthlist ? <Row className="year-calendar"> |
| | | {datelist.map(item => ( |
| | | <Col span={8} key={item.month}> |
| | | <div className="year-wrap" style={item.style || null} onClick={() => this.triggerDay(item)}> |
| | | <div className="year-wrap" style={item.style || null} onClick={() => this.monthChange(item.month)}> |
| | | <div className="header" style={item.style ? null : {color: '#1890ff'}}> |
| | | {item.label} |
| | | </div> |
| | |
| | | // 回车或点击搜索 |
| | | e.preventDefault() |
| | | this.props.form.validateFields((err, values) => { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | if (!err) { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | searchChange = () => { |
| | | this.setState({}, () => { |
| | | this.props.form.validateFields((err, values) => { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | if (!err) { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | |
| | | this.setState({searchlist}, () => { |
| | | this.props.form.resetFields() |
| | | this.props.form.validateFields((err, values) => { |
| | | // 异步获取更新后的时间组 |
| | | this.setState({}, () => { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | }) |
| | | if (!err) { |
| | | // 异步获取更新后的时间组 |
| | | this.setState({}, () => { |
| | | values = this.addHideFieldValue(values) |
| | | let searches = this.getFieldsValues(values) |
| | | this.props.refreshdata(searches) |
| | | }) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | |
| | | pasteContent: null, // 粘贴内容 |
| | | openEdition: '', // 编辑版本标记,防止多人操作 |
| | | mockdata: [], // 测试数据 |
| | | mockloading: false // 数据加载中 |
| | | } |
| | | |
| | | /** |
| | |
| | | |
| | | getMockData = (year) => { |
| | | let msgs = [ |
| | | {color: 'red', remark: '服务器异常,请联系运维人员!'}, |
| | | {color: 'orange', remark: '系统异常,请及时处理!'}, |
| | | {color: 'yellow', remark: '您的订单异常,请联系客服!'}, |
| | | {color: 'green', remark: '您的订单已完成。'}, |
| | | {color: 'red', remark: '您有一条新的消息!'}, |
| | | {color: 'orange', remark: '您有一条新的消息!'}, |
| | | {color: 'yellow', remark: '您有一条新的消息!'}, |
| | | {color: 'green', remark: '您有一条新的消息。'}, |
| | | {color: 'cyan', remark: '您有一条新的消息。'}, |
| | | {color: 'blue', remark: '任务未完成,请注意后续工作。'}, |
| | | {color: 'purple', remark: '您有新的任务等待处理!'}, |
| | | {color: 'gray', remark: '您有一封未读邮件。'} |
| | | {color: 'blue', remark: '您有一条新的消息!'}, |
| | | {color: 'purple', remark: '您有一条新的消息。'}, |
| | | {color: 'gray', remark: '您有一条新的消息。'} |
| | | ] |
| | | let mockdata = [] |
| | | |
| | |
| | | * @description 校验配置信息的合法性 |
| | | */ |
| | | verifyconfig = (config) => { |
| | | let hasKey = false |
| | | // let hasKey = false |
| | | let cols = [] |
| | | config.columns.forEach(col => { |
| | | if (col.field) { |
| | | cols.push(col.field) |
| | | } |
| | | if (config.setting.primaryKey === col.field) { |
| | | hasKey = true |
| | | } |
| | | // if (config.setting.primaryKey === col.field) { |
| | | // hasKey = true |
| | | // } |
| | | }) |
| | | |
| | | let calvaild = true |
| | |
| | | |
| | | if (config.setting.interType === 'inner' && !config.setting.innerFunc && config.setting.default !== 'false' && !config.setting.dataresource) { |
| | | return '菜单尚未设置数据源,不可启用!' |
| | | } else if (!config.setting.primaryKey) { |
| | | return '菜单尚未设置主键,不可启用!' |
| | | } else if (!hasKey) { |
| | | return '显示列中不存在主键字段,不可启用!' |
| | | // } else if (!config.setting.primaryKey) { |
| | | // return '菜单尚未设置主键,不可启用!' |
| | | // } else if (!hasKey) { |
| | | // return '显示列中不存在主键字段,不可启用!' |
| | | } else if (!calvaild) { |
| | | return '日历关联字段未设置,不可启用!' |
| | | } else { |
| | |
| | | |
| | | // 年切换时重新生成数据 |
| | | changeDate = (year) => { |
| | | this.setState({mockloading: true}, () => { |
| | | this.setState({ |
| | | mockloading: false, |
| | | mockdata: this.getMockData(year) |
| | | }) |
| | | this.setState({ |
| | | mockdata: this.getMockData(year) |
| | | }) |
| | | } |
| | | |
| | | render () { |
| | | const { activeKey, config, tabviews, mockdata, mockloading } = this.state |
| | | const { activeKey, config, tabviews, mockdata } = this.state |
| | | |
| | | return ( |
| | | <div className="model-calendar-board"> |
| | |
| | | <TabComponent config={config} updateConfig={this.updateconfig} tabviews={tabviews} setSubConfig={this.setSubConfig} /> |
| | | <CalComponent config={config} updateConfig={this.updateconfig} /> |
| | | <CalendarComponent calendar={{ |
| | | levels: config.calendar.levels, startfield: 'start', endfield: 'end', colorfield: 'color', remarkfield: 'remark' |
| | | }} loading={mockloading} data={mockdata} changeDate={this.changeDate}/> |
| | | levels: config.calendar.levels, startfield: 'start', endfield: 'end', colorfield: 'color', remarkfield: 'remark', refresh: config.calendar.refresh |
| | | }} data={mockdata} changeDate={this.changeDate}/> |
| | | </div> |
| | | </Card> |
| | | </div> |
| | |
| | | }) |
| | | } |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Col span={24} key={index}> |
| | | <Form.Item label={ |
| | | item.tooltip ? |
| | | <Tooltip placement="topLeft" title={item.tooltip}> |
| | |
| | | ) |
| | | } else if (item.type === 'number') { |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Col span={24} key={index}> |
| | | <Form.Item label={ |
| | | item.tooltip ? |
| | | <Tooltip placement="topLeft" title={item.tooltip}> |
| | |
| | | ) |
| | | } else if (item.type === 'select') { // 下拉搜索 |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Col span={24} key={index}> |
| | | <Form.Item label={item.label}> |
| | | {getFieldDecorator(item.key, { |
| | | initialValue: item.initVal, |
| | |
| | | ) |
| | | } else if (item.type === 'mutilselect') { |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Col span={24} key={index}> |
| | | <Form.Item label={ |
| | | item.tooltip ? |
| | | <Tooltip placement="topLeft" title={item.tooltip}> |
| | |
| | | ) |
| | | } else if (item.type === 'radio') { |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Col span={24} key={index}> |
| | | <Form.Item label={item.tooltip ? |
| | | <Tooltip placement="topLeft" title={item.tooltip}> |
| | | <Icon type="question-circle" /> |
| | |
| | | }, |
| | | wrapperCol: { |
| | | xs: { span: 24 }, |
| | | sm: { span: 16 } |
| | | sm: { span: 12 } |
| | | } |
| | | } |
| | | return ( |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { Form, Row, Col, Input, Radio, Select, Tooltip, Icon, notification } from 'antd' |
| | | import { Form, Row, Col, Input, Radio, Tooltip, Icon, notification } from 'antd' |
| | | import moment from 'moment' |
| | | |
| | | import Api from '@/api' |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { columns, setting } = this.props |
| | | const { setting } = this.props |
| | | const { getFieldDecorator } = this.props.form |
| | | const { interType } = this.state |
| | | |
| | |
| | | </Radio.Group>)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | <Col span={8}> |
| | | {/* <Col span={8}> |
| | | <Form.Item label="主键"> |
| | | {getFieldDecorator('primaryKey', { |
| | | initialValue: setting.primaryKey || '' |
| | |
| | | </Select> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | </Col> */} |
| | | {interType === 'inner' ? <Col span={8}> |
| | | <Form.Item label="默认sql"> |
| | | {getFieldDecorator('execute', { |
| | |
| | | }) |
| | | let _search = '' |
| | | |
| | | // 日历中的年份替换 |
| | | if (setting.queryType === 'statistics' || _customScript) { |
| | | _regoptions.push({ |
| | | reg: new RegExp('@calendarDate@', 'ig'), |
| | | value: `1970-01-01 00:00:00.000` |
| | | }) |
| | | _regoptions.push({ |
| | | reg: new RegExp('@calendarDate1@', 'ig'), |
| | | value: `2030-12-31 23:59:59.999` |
| | | }) |
| | | } |
| | | |
| | | if (setting.queryType === 'statistics' && _dataresource) { |
| | | _regoptions.forEach(item => { |
| | | _dataresource = _dataresource.replace(item.reg, item.value) |
| | |
| | | }, { |
| | | value: 'equaltab', |
| | | text: Formdict['header.form.refresh.equaltab'] |
| | | }, { |
| | | value: 'mainline', |
| | | text: Formdict['header.form.refresh.mainline'] |
| | | // }, { |
| | | // value: 'mainline', |
| | | // text: Formdict['header.form.refresh.mainline'] |
| | | }) |
| | | } |
| | | |
| | |
| | | value: 'line-chart', |
| | | text: 'line-chart' |
| | | }], |
| | | forbid: type === 'CalendarPage', |
| | | forbid: type === 'CalendarPage' |
| | | }, |
| | | { |
| | | type: 'select', |
| | |
| | | initVal: supMenu, |
| | | required: false, |
| | | options: menus, |
| | | forbid: type === 'CalendarPage', |
| | | forbid: type === 'CalendarPage' |
| | | }, |
| | | { |
| | | type: 'mutilselect', |
| | |
| | | initVal: equalTab, |
| | | required: false, |
| | | options: equalTabs, |
| | | forbid: type === 'CalendarPage', |
| | | forbid: type === 'CalendarPage' |
| | | }, |
| | | { |
| | | type: 'text', |
| | |
| | | label: '外键', |
| | | tooltip: '外键旨在标签页中执行默认函数(添加)时,替换BID字段', |
| | | initVal: card.foreignKey || '', |
| | | required: false |
| | | required: false, |
| | | forbid: type === 'CalendarPage' |
| | | }, |
| | | { |
| | | type: 'number', |