From ac71a144eeac2a5586c37686e72442173bfb1407 Mon Sep 17 00:00:00 2001 From: Houjie <714924425@qq.com> Date: 星期三, 27 八月 2025 13:56:09 +0800 Subject: [PATCH] 保养标准:调整 --- src/views/andon/modules/AndonResponseConfigForm.vue | 338 +++++++++++++++++++++++++++++++++---------------------- 1 files changed, 202 insertions(+), 136 deletions(-) diff --git a/src/views/andon/modules/AndonResponseConfigForm.vue b/src/views/andon/modules/AndonResponseConfigForm.vue index 131a263..c6e57ec 100644 --- a/src/views/andon/modules/AndonResponseConfigForm.vue +++ b/src/views/andon/modules/AndonResponseConfigForm.vue @@ -1,49 +1,71 @@ <template> <a-spin :spinning="confirmLoading"> - <j-form-container :disabled="formDisabled"> + <j-form-container :disabled="disabled" class="andon-response-form"> <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail"> - <a-row> - <a-col :span="24"> + + <!-- 浜х嚎閫夋嫨 --> + <a-row :gutter="24"> + <a-col :span="12"> <a-form-model-item label="浜х嚎" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="factoryId"> - <a-row :gutter="24"> - <a-col :span="24"> - <a-form-item - :labelCol="labelCol" - :wrapperCol="wrapperCol" - label="" - > - <j-select-factory - :disabled="disabled" - v-model="model.factoryId" - :multi="true" - @back="backFactoryInfo" - :backProduction="true" - :treeProductOpera="true" - ></j-select-factory> - </a-form-item> - </a-col> - </a-row> + <a-tree-select + :disabled="disabled" + v-model="model.factoryId" + :tree-data="factoryTreeData" + :allow-clear="true" + :show-search="false" + :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" + :tree-check-strictly="true" + placeholder="璇烽�夋嫨" + style="width: 100%" + @change="handleFactoryChange" + class="custom-tree-select"> + <template slot="title" slot-scope="item"> + {{ item.title }} + </template> + </a-tree-select> </a-form-model-item> </a-col> + </a-row> + + <!-- 瀹夌伅绫诲瀷鍜屽搷搴斾汉閰嶇疆 --> + <a-row :gutter="24"> <a-col :span="12"> <a-form-model-item label="瀹夌伅绫诲瀷" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="buttonId"> - <j-search-select-tag v-model="model.buttonId" placeholder="璇疯緭鍏ュ畨鐏被鍨�" - dict="andon_button_config,button_name,id"></j-search-select-tag> + <j-search-select-tag + v-model="model.buttonId" + placeholder="璇烽�夋嫨" + dict="andon_button_config,button_name,id" + ></j-search-select-tag> </a-form-model-item> </a-col> <a-col :span="12"> - <a-form-model-item label="鍒濆鍝嶅簲浜�" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="firsterResponder"> - <j-select-user-by-dep :multi="false" v-model="model.firsterResponder" placeholder="璇疯緭鍏ュ垵濮嬪搷搴斾汉" ></j-select-user-by-dep> + <a-form-model-item label="鍒濆鍝嶅簲浜�" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="firstResponder"> + <j-select-user-by-dep + :multi="false" + v-model="model.firstResponder" + placeholder="璇烽�夋嫨" + ></j-select-user-by-dep> + </a-form-model-item> + </a-col> + </a-row> + + <a-row :gutter="24"> + <a-col :span="12"> + <a-form-model-item label="浜岀骇鍝嶅簲浜�" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="secondResponder"> + <j-select-user-by-dep + :multi="false" + v-model="model.secondResponder" + placeholder="璇烽�夋嫨" + ></j-select-user-by-dep> </a-form-model-item> </a-col> <a-col :span="12"> - <a-form-model-item label="浜岀骇鍝嶅簲浜�(鍗囩骇涓�娆�)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="secondResponder"> - <j-select-user-by-dep :multi="false" v-model="model.secondResponder" placeholder="璇疯緭鍏ヤ簩绾у搷搴斾汉(鍗囩骇涓�娆�)" ></j-select-user-by-dep> - </a-form-model-item> - </a-col> - <a-col :span="12"> - <a-form-model-item label="涓夌骇鍝嶅簲浜�(鍗囩骇涓ゆ)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="thirdResponder"> - <j-select-user-by-dep :multi="false" v-model="model.thirdResponder" placeholder="璇疯緭鍏ヤ笁绾у搷搴斾汉(鍗囩骇涓ゆ)" ></j-select-user-by-dep> + <a-form-model-item label="涓夌骇鍝嶅簲浜�" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="thirdResponder"> + <j-select-user-by-dep + :multi="false" + v-model="model.thirdResponder" + placeholder="璇烽�夋嫨" + ></j-select-user-by-dep> </a-form-model-item> </a-col> </a-row> @@ -53,113 +75,157 @@ </template> <script> +import { httpAction, getAction } from '@/api/manage' +import { TreeSelect } from 'ant-design-vue' - import { httpAction, getAction } from '@/api/manage' - import { validateDuplicateValue } from '@/utils/util' - import JSelectFactory from '@comp/jeecgbiz/JSelectFactory.vue' - export default { - name: 'AndonResponseConfigForm', - components: { - JSelectFactory - }, - props: { - //琛ㄥ崟绂佺敤 - disabled: { - type: Boolean, - default: false, - required: false +export default { + name: 'AndonResponseConfigForm', + components: { + 'a-tree-select': TreeSelect + }, + props: { + disabled: { + type: Boolean, + default: false + } + }, + data() { + return { + model: { + factoryId: '', + buttonId: '', + firstResponder: '', + secondResponder: '', + thirdResponder: '' + }, + factoryTreeData: [], + labelCol: { xs: { span: 24 }, sm: { span: 6 } }, + wrapperCol: { xs: { span: 24 }, sm: { span: 18 } }, + confirmLoading: false, + validatorRules: { + factoryId: [{ required: true, message: '浜х嚎鏄繀閫夐」', trigger: 'change' }], + buttonId: [{ required: true, message: '瀹夌伅绫诲瀷鏄繀閫夐」', trigger: 'change' }], + firstResponder: [{ required: true, message: '鍒濆鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' }], + secondResponder: [{ required: true, message: '浜岀骇鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' }], + thirdResponder: [{ required: true, message: '涓夌骇鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' }] + }, + url: { + add: "/andonresponseconfig/andonResponseConfig/add", + edit: "/andonresponseconfig/andonResponseConfig/edit", + factoryTree: "/base/factory/queryTreeList" } - }, - data () { - return { - model:{ - }, - labelCol: { - xs: { span: 24 }, - sm: { span: 5 }, - }, - wrapperCol: { - xs: { span: 24 }, - sm: { span: 16 }, - }, - confirmLoading: false, - validatorRules: { - factoryId: [ - { required: true, message: '浜х嚎鏄繀閫夐」', trigger: 'change' } - ], - buttonId: [ - { required: true, message: '瀹夌伅绫诲瀷鏄繀閫夐」', trigger: 'change' } - ], - firsterResponder: [ - { required: true, message: '鍒濆鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' } - ], - secondResponder: [ - { required: true, message: '浜岀骇鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' } - ], - thirdResponder: [ - { required: true, message: '涓夌骇鍝嶅簲浜烘槸蹇呴�夐」', trigger: 'change' } - ], - }, - url: { - add: "/andonresponseconfig/andonResponseConfig/add", - edit: "/andonresponseconfig/andonResponseConfig/edit", - queryById: "/andonresponseconfig/andonResponseConfig/queryById" - } - } - }, - computed: { - formDisabled(){ - return this.disabled - }, - }, - created () { - //澶囦唤model鍘熷鍊� - this.modelDefault = JSON.parse(JSON.stringify(this.model)); - }, - methods: { - backFactoryInfo(info) { - this.model.factoryIds = this.model.factoryId - this.nextFactoryOptions = info.map((item, index, arr) => { - let c = { label: item.text, value: item.value + '' } - return c - }) - }, - add () { - this.edit(this.modelDefault); - }, - edit (record) { - this.model = Object.assign({}, record); - this.visible = true; - }, - submitForm () { - const that = this; - // 瑙﹀彂琛ㄥ崟楠岃瘉 - this.$refs.form.validate(valid => { - if (valid) { - that.confirmLoading = true; - let httpurl = ''; - let method = ''; - if(!this.model.id){ - httpurl+=this.url.add; - method = 'post'; - }else{ - httpurl+=this.url.edit; - method = 'put'; - } - httpAction(httpurl,this.model,method).then((res)=>{ - if(res.success){ - that.$message.success(res.message); - that.$emit('ok'); - }else{ - that.$message.warning(res.message); - } - }).finally(() => { - that.confirmLoading = false; - }) + } + }, + created() { + this.modelDefault = { ...this.model } + this.loadFactoryTree() + }, + methods: { + loadFactoryTree() { + this.confirmLoading = true + getAction(this.url.factoryTree) + .then(res => { + if (res.success && Array.isArray(res.result)) { + this.factoryTreeData = this.transformData(res.result) + console.log('浜х嚎鏁版嵁鍔犺浇鎴愬姛锛�', this.factoryTreeData) + } else { + this.$message.warning('浜х嚎鏁版嵁涓虹┖鎴栨牸寮忓紓甯�') + this.factoryTreeData = [] } - }) - }, + .catch(err => { + console.error('浜х嚎鏁版嵁鍔犺浇澶辫触锛�', err) + this.$message.error('鍔犺浇浜х嚎鏁版嵁澶辫触锛岃閲嶈瘯') + }) + .finally(() => { + this.confirmLoading = false + }) + }, + + transformData(nodes) { + return nodes.map(node => ({ + key: node.id, + title: node.factoryName, + value: node.id, + children: node.children && node.children.length > 0 ? this.transformData(node.children) : [] + })) + }, + + handleFactoryChange(value) { + this.model.factoryId = value + }, + + add() { + this.model = { ...this.modelDefault } + this.visible = true + }, + edit(record) { + this.model = { ...record } + this.visible = true + }, + + submitForm() { + this.$refs.form.validate(valid => { + if (valid) { + this.confirmLoading = true + const httpurl = this.model.id ? this.url.edit : this.url.add + const method = this.model.id ? 'put' : 'post' + + httpAction(httpurl, this.model, method) + .then(res => { + if (res.success) { + this.$message.success(res.message) + this.$emit('ok') + } else { + this.$message.warning(res.message) + } + }) + .finally(() => { + this.confirmLoading = false + }) + } + }) } } -</script> \ No newline at end of file +} +</script> + +<style scoped> +.andon-response-form { + padding: 24px; + background: #fff; + border-radius: 8px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); +} +.a-form-model-item { + margin-bottom: 20px !important; +} +.ant-tree-select-selection { + min-height: 32px !important; +} + +/* 鏍戝舰閫夋嫨缁勪欢鑷畾涔夋牱寮� */ +.custom-tree-select { + /* 璋冩暣涓嬫媺鑿滃崟瀹藉害锛屼娇鍏舵洿閫傞厤鍐呭 */ + & .ant-tree-select-dropdown .ant-tree-select-tree { + width: 220px; + } + /* 鑺傜偣 hover 鏁堟灉 */ + & .ant-tree-select-tree-node:hover { + background-color: #e6f7ff !important; + } + /* 鑺傜偣閫変腑鏁堟灉 */ + & .ant-tree-select-tree-node-selected { + background-color: #bae7ff !important; + } + /* 璋冩暣瀛椾綋澶у皬鍜岃楂� */ + & .ant-tree-select-tree-title { + font-size: 14px; + line-height: 24px; + } + /* 璋冩暣缂╄繘锛屼紭鍖栧眰绾ц瑙夋晥鏋� */ + & .ant-tree-select-tree-indent { + width: 16px; + } +} +</style> \ No newline at end of file -- Gitblit v1.9.3