From 05d06b983f90d5f17150f4e38200ed8b3830cefa Mon Sep 17 00:00:00 2001 From: ky_yusj <2655568377@qq.com> Date: Tue, 22 Jun 2021 13:35:01 +0800 Subject: [PATCH 1/2] =?UTF-8?q?update=20=E6=92=A4=E5=9B=9E=E4=B8=8A?= =?UTF-8?q?=E4=B8=80=E7=89=88=E6=9C=AC=E8=AF=AF=E6=8F=90=E4=BA=A4=E7=9A=84?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-react/craco.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-react/craco.config.js b/web-react/craco.config.js index a83f185..59d3aa2 100644 --- a/web-react/craco.config.js +++ b/web-react/craco.config.js @@ -28,7 +28,7 @@ module.exports = { ], webpack: { plugins: [ - // new MonacoWebpackPlugin() + new MonacoWebpackPlugin() ] } } \ No newline at end of file From 023897122d5337a4197d6468a90de7a73522a2aa Mon Sep 17 00:00:00 2001 From: ky_yusj <2655568377@qq.com> Date: Tue, 22 Jun 2021 17:02:38 +0800 Subject: [PATCH 2/2] update patrol --- .../pages/business/house/info/form/index.jsx | 13 +- .../business/house/info/form/patrol/base.jsx | 112 ++++++++++++++ .../business/house/info/form/patrol/index.jsx | 99 +++++++++++++ .../src/pages/business/house/project/form.jsx | 138 ++++++++++-------- 4 files changed, 297 insertions(+), 65 deletions(-) create mode 100644 web-react/src/pages/business/house/info/form/patrol/base.jsx create mode 100644 web-react/src/pages/business/house/info/form/patrol/index.jsx diff --git a/web-react/src/pages/business/house/info/form/index.jsx b/web-react/src/pages/business/house/info/form/index.jsx index b57d8c3..fb3d206 100644 --- a/web-react/src/pages/business/house/info/form/index.jsx +++ b/web-react/src/pages/business/house/info/form/index.jsx @@ -39,13 +39,12 @@ const tabs = [ // active: false, // show: false, // }, - // { - // title: '巡查登记', - // name: 'patrol', - // path: 'patrol', - // active: false, - // show: true, - // }, + { + title: '巡查登记', + component: () => import('./patrol'), + active: false, + show: true, + }, ] export default class index extends Component { diff --git a/web-react/src/pages/business/house/info/form/patrol/base.jsx b/web-react/src/pages/business/house/info/form/patrol/base.jsx new file mode 100644 index 0000000..996ca1f --- /dev/null +++ b/web-react/src/pages/business/house/info/form/patrol/base.jsx @@ -0,0 +1,112 @@ +import React, { Component } from 'react' +import { Row, Col, Form, Input, DatePicker, Spin } from 'antd' +import { cloneDeep, isEqual } from 'lodash' +import { AntIcon } from 'components' +import moment from 'moment' +import { CITY } from 'util/global' + +const layout = { + labelCol: { flex: '150px' }, + wrapperCol: { flex: '1' }, +} + +export default class base extends Component { + state = { + loading: true, + } + + form = React.createRef() + + shouldComponentUpdate(props, state) { + return !isEqual(this.state, state) + } + + componentDidMount() { + this.fillData({ + record: this.props.record, + }) + } + + call() { + if (this.props.onRef) { + this.props.onRef(this) + } + } + + /** + * 填充数据 + * 可以在设置this.record之后对其作出数据结构调整 + * [异步,必要] + * @param {*} params + */ + async fillData(params) { + this.record = cloneDeep(params.record) + //#region 从后端转换成前段所需格式 + if (this.record) { + const { patrolDate } = this.record.patrolInfo + this.record.patrolInfo.patrolDate = patrolDate ? moment(patrolDate) : patrolDate + } + //#endregion + this.form.current.setFieldsValue(this.record) + + this.setState({ loading: false }) + this.call() + } + + /** + * 获取数据 + * 可以对postData进行数据结构调整 + * [异步,必要] + * @returns + */ + async getData() { + const form = this.form.current + + const valid = await form.validateFields() + if (valid) { + const postData = form.getFieldsValue() + //#region 从前段转换后端所需格式 + if (postData.patrolInfo.patrolDate) { + postData.patrolInfo.patrolDate = postData.patrolInfo.patrolDate.format('YYYY-MM-DD') + } + //#endregion + return postData + } + } + + render() { + const { loading } = this.state + return ( + }> +
+ + + + { + /*$root.transfer.completedYear = date.format('YYYY') */ + }} + className="w-100-p" + placeholder="请选择巡查日期" + /> + + + + + + + + +
+ + ) + } +} diff --git a/web-react/src/pages/business/house/info/form/patrol/index.jsx b/web-react/src/pages/business/house/info/form/patrol/index.jsx new file mode 100644 index 0000000..a07d549 --- /dev/null +++ b/web-react/src/pages/business/house/info/form/patrol/index.jsx @@ -0,0 +1,99 @@ +import React, { Component } from 'react' +import ReactDOM from 'react-dom' +import { Row, Col, Card, Anchor, Spin } from 'antd' +import { defaultsDeep, merge } from 'lodash' +import { AntIcon, ComponentDynamic, Container } from 'components' + +const parts = [ + { + title: '巡查基本情况', + component: () => import('./base'), + }, +] + +export default class index extends Component { + container = window + + children = [] + + formData = {} + + shouldComponentUpdate(props) { + return this.props.loading !== props.loading + } + + // 通知上层组件已加载完毕 + call(child, index) { + this.children[index] = child + if (this.children.filter(p => p).length === parts.length) { + if (this.props.onRef) { + this.props.onRef(this) + } + } + } + + getContainer = () => { + return this.container + } + + setContainer = container => { + this.container = (ReactDOM.findDOMNode(container) || {}).parentNode + } + + async getData() { + for (const child of this.children) { + const data = await child.getData() + merge(this.formData, data) + } + + return this.formData + } + + render() { + const { id, loading } = this.props + + return ( + + + +
+
+ + {parts.map((part, i) => ( +
+ {part.title &&
{part.title}
} + } + wrapperClassName={loading && 'h-400-min'} + > + {!loading && ( + this.call(child, i)} + /> + )} + +
+ ))} + + + + e.preventDefault()} + > + {parts.map((part, i) => ( + + ))} + + + + + ) + } +} diff --git a/web-react/src/pages/business/house/project/form.jsx b/web-react/src/pages/business/house/project/form.jsx index 25446df..7ba461d 100644 --- a/web-react/src/pages/business/house/project/form.jsx +++ b/web-react/src/pages/business/house/project/form.jsx @@ -3,11 +3,11 @@ import { Cascader, Form, Input, InputNumber, Radio, Spin, TreeSelect } from 'ant import { AntIcon } from 'components' import { cloneDeep } from 'lodash' import { api } from 'common/api' -import { numberToChinese } from 'util/format'; +import { numberToChinese } from 'util/format' const initialValues = { sort: 100, - type: 1 + type: 1, } export default class form extends Component { state = { @@ -16,8 +16,8 @@ export default class form extends Component { exist: false, options: { - areaData: [] - } + areaData: [], + }, } areaCode = '' houseType = 1 @@ -35,14 +35,18 @@ export default class form extends Component { } /** - * 填充数据 - * 可以在设置this.record之后对其作出数据结构调整 - * [异步,必要] - * @param {*} params - */ + * 填充数据 + * 可以在设置this.record之后对其作出数据结构调整 + * [异步,必要] + * @param {*} params + */ async fillData(params) { - const areaCodeDefault = params.record ? params.record.areaCode : params.pid ? params.pid : ''; - this.houseType = params.record ? params.record.type : 1; + const areaCodeDefault = params.record + ? params.record.areaCode + : params.pid + ? params.pid + : '' + this.houseType = params.record ? params.record.type : 1 this.record = cloneDeep(params.record) this.initRecord = cloneDeep(params.record) //#region 从后端转换成前段所需格式 @@ -50,54 +54,54 @@ export default class form extends Component { this.setState({ exist: !!params.record, - options: { areaData } + options: { areaData }, }) - const areaCode = []; + const areaCode = [] const findCode = (data, level) => { - level = level || 0; + level = level || 0 for (let i = 0; i < data.length; i++) { - const item = data[i]; - areaCode[level] = item.code; + const item = data[i] + areaCode[level] = item.code if (item.code === areaCodeDefault) { - areaCode.length = level + 1; - return true; + areaCode.length = level + 1 + return true } if (item.children && item.children.length) { - const found = findCode(item.children, level + 1); + const found = findCode(item.children, level + 1) if (found) { - return true; + return true } } } - }; + } if (areaCodeDefault) { - findCode(areaData); + findCode(areaData) this.areaCode = areaCodeDefault - this.nextSort(this.areaCode, this.houseType); + this.nextSort(this.areaCode, this.houseType) } this.record = { pid: params.pid, ...this.record, - areaCode: areaCode.length == 4 ? areaCode : [] + areaCode: areaCode.length == 4 ? areaCode : [], } //#endregion this.form.current.setFieldsValue(this.record) this.setState({ - loading: false + loading: false, }) } /** * 获取数据 * 可以对postData进行数据结构调整 * [异步,必要] - * @returns + * @returns */ async getData() { const form = this.form.current @@ -117,78 +121,83 @@ export default class form extends Component { async loadAreaData() { const { data } = await api.getAreaTree() - const clearChiildren = (data) => { - data.forEach((item) => { + const clearChiildren = data => { + data.forEach(item => { if (item.children && item.children.length) { - clearChiildren(item.children); + clearChiildren(item.children) } else { - delete item.children; + delete item.children } - }); - }; - clearChiildren(data); + }) + } + clearChiildren(data) return data } async nextSort(areaCode, houseType) { - this.loading = true; - if (!!this.initRecord && this.initRecord.areaCode == areaCode && this.initRecord.type == houseType) { + this.loading = true + if ( + !!this.initRecord && + this.initRecord.areaCode == areaCode && + this.initRecord.type == houseType + ) { this.form.current.setFieldsValue({ name: this.initRecord.name, - sort: this.initRecord.sort + sort: this.initRecord.sort, }) } else if (areaCode.length < 12) { this.form.current.setFieldsValue({ name: '', sort: 0, - areaCode: [] + areaCode: [], }) } else { - await api.houseProjectNextSort({ areaCode, type: houseType }) + await api + .houseProjectNextSort({ areaCode, type: houseType }) .then(({ data }) => { this.form.current.setFieldsValue({ name: `项目${numberToChinese(data)}`, - sort: data + sort: data, }) }) .catch(() => { this.form.current.setFieldsValue({ name: '', sort: 0, - areaCode: [] + areaCode: [], }) }) .finally(() => { - this.loading = false; - }); + this.loading = false + }) } } onHouseTypeChange(e) { - this.houseType = e.target.value; + this.houseType = e.target.value if (this.areaCode != '') { - this.nextSort(this.areaCode, this.houseType); + this.nextSort(this.areaCode, this.houseType) } } onAreaCodeChange(value) { this.areaCode = value[value.length - 1] if (this.houseType > 0) { - this.nextSort(this.areaCode, this.houseType); + this.nextSort(this.areaCode, this.houseType) } } render() { return ( -
+ }>
- - this.onHouseTypeChange(e)}> + + this.onHouseTypeChange(e)} + > 住宅 @@ -197,13 +206,17 @@ export default class form extends Component { - + this.onAreaCodeChange(val)} /> - - + + + placeholder="填写房屋所属单位的名称、道路的名称或大厦的名称，比如XX中学、XX大厦、XX小区等。登记项目时，应在项目备注中明确项目所指对象。" + />
) } -} \ No newline at end of file +}