From c977c9fb967a080ca56ac46b1f17ce2c57f2122e Mon Sep 17 00:00:00 2001 From: Fixiaobai <fixiaobai@163.com> Date: 星期四, 10 八月 2023 17:53:53 +0800 Subject: [PATCH] new file: src/api/urlEnum/satisfactionSurveys.js modified: src/views/CNAS/satisfactionSurveys/index.vue --- src/views/standardLibrary/SpecificationDetails.vue | 583 +++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 516 insertions(+), 67 deletions(-) diff --git a/src/views/standardLibrary/SpecificationDetails.vue b/src/views/standardLibrary/SpecificationDetails.vue index 82b069b..8a2c75a 100644 --- a/src/views/standardLibrary/SpecificationDetails.vue +++ b/src/views/standardLibrary/SpecificationDetails.vue @@ -2,12 +2,12 @@ <div class="specificationDetail-main"> <div class="page-header-tips"> <div class="search-bar"> - <span :style="{marginRight:'12px', color:'#409EFF'}"> 浜у搧鍚嶇О锛氶挗鍖呴挗蹇冮摑缁炵嚎</span> - <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" />V12</el-tag> + <span :style="{marginRight:'12px', color:'#409EFF'}"> 椤圭洰鍚嶇О锛歿{ detailInfo.projectClassification }}</span> + <!-- <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" />V12</el-tag> --> </div> <div class="serve-btn"> - <el-button type="primary" icon="el-icon-plus">缂栬緫</el-button> - <el-button type="primary" icon="el-icon-plus">鍒犻櫎</el-button> + <!-- <el-button type="primary" icon="el-icon-plus">缂栬緫</el-button> + <el-button type="primary" icon="el-icon-plus">鍒犻櫎</el-button> --> </div> </div> <div class="content-main"> @@ -17,23 +17,52 @@ <el-row> <el-col :span="19"> <el-input - v-model="filterText" + v-model="searchData.keyword" placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" /> </el-col> <el-col :span="5"> - <el-button type="primary" size="small"><i class="el-icon-plus" /></el-button> + <el-button type="primary" size="small" @click="materialFormVisible = true"><i class="el-icon-plus" /></el-button> </el-col> </el-row> </div> <el-tree ref="tree" class="filter-tree" - :data="data" - :props="defaultProps" + :data="materialTree" default-expand-all :filter-node-method="filterNode" - /> + :highlight-current="true" + node-key="id" + :default-expanded-keys="materialTreeDefault" + @node-click="materialTreeClick" + > + + <span slot-scope="{ node, data }" class="custom-tree-node"> + <span>{{ node.label }}</span> + <span> + <el-popover + placement="top" + width="30" + trigger="click" + > + <div style="text-align: center; margin: 0"> + <div> + <el-button size="mini" type="text" @click="showChangeMaterial(data)">缂栬緫</el-button> + </div> + <div> + <el-button size="mini" type="text" @click="delmaterialFormVisible=true">鍒犻櫎</el-button> + </div> + </div> + <el-button + slot="reference" + type="text" + size="mini" + ><i class="el-icon-more" /></el-button> + </el-popover> + </span> + </span> + </el-tree> </div> <div class="bom-item"> <div class="bom-item-search"> @@ -45,18 +74,44 @@ </div> </el-col> <el-col :span="5"> - <el-button type="primary" size="small" plain><i class="el-icon-plus" /></el-button> + <el-button type="primary" size="small" plain @click="projectFormVisible = true"><i class="el-icon-plus" /></el-button> </el-col> </el-row> </div> <el-tree ref="tree" class="filter-tree" - :data="item" - :props="defaultProps" + :data="projectTree" default-expand-all - :filter-node-method="filterNode" - /> + :highlight-current="true" + :default-expanded-keys="projectTreeDefault" + @node-click="projectTreeClick" + > + <span slot-scope="{ node,data }" class="custom-tree-node"> + <span>{{ node.label }}</span> + <span> + <el-popover + placement="top" + width="30" + trigger="click" + > + <div style="text-align: center; margin: 0"> + <div> + <el-button size="mini" type="text" @click="showChangeProject(data)">缂栬緫</el-button> + </div> + <div> + <el-button size="mini" type="text" @click="delProductFormVisible = true">鍒犻櫎</el-button> + </div> + </div> + <el-button + slot="reference" + type="text" + size="mini" + ><i class="el-icon-more" /></el-button> + </el-popover> + </span> + </span> + </el-tree> </div> </div> <div class="specificationDetail-card"> @@ -66,23 +121,20 @@ <span /> <div>椤圭洰璇︽儏</div> </div> - <div class="tips-btn"> + <!-- <div class="tips-btn"> <span><i class="el-icon-edit" />鎿嶄綔锛�</span> <el-button type="text">缂栬緫</el-button> - </div> + </div> --> </div> <div class="message"> - <div class="message-item"><span><i class="el-icon-edit" />鐢ㄦ埛鍚嶏細</span>121212121212</div> + <div class="message-item"><span><i class="el-icon-edit" />璇曢獙鏂规硶锛歿{ detailInfo.method }}</span></div> <div class="message-item"> - <span><i class="el-icon-edit" />濮撳悕锛�</span> - <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" />{{ 'jack' }}</el-tag> + <span><i class="el-icon-edit" />椤圭洰鍒嗙被锛歿{ detailInfo.projectClassification }}</span> </div> <div class="message-item"> - <span><i class="el-icon-edit" />鐢佃瘽鍙风爜锛�</span> - 19825217196</div> + <span><i class="el-icon-edit" />鏇存柊浜猴細{{ detailInfo.userName }}</span></div> <div class="message-item"> - <span><i class="el-icon-edit" />閭锛�</span> - 1212112</div> + <span><i class="el-icon-edit" />鏇存柊鏃堕棿锛歿{ detailInfo.updateTime }}</span></div> </div> </div> <div class="card-main"> @@ -91,84 +143,465 @@ <span /> <div>娴嬭瘯鏍囧噯</div> </div> - <div class="tips-btn"> - <span><i class="el-icon-edit" />鎿嶄綔锛�</span> - <el-button type="text">缂栬緫</el-button> - </div> </div> <div class="message"> <div class="message-item"> <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" />鍗曚綅锛氭濮�</el-tag> </div> <div class="message-item"> - <span><i class="el-icon-edit" />鎷涙爣浜哄憳瑕佹眰锛氾紲3444</span> + <span><i class="el-icon-edit" />鎷涙爣浜哄憳瑕佹眰锛歿{ detailInfo.required }}</span> </div> <div class="message-item"> - <span><i class="el-icon-edit" />鍐呮帶鍊硷細锛�3444</span> - 1212112</div> + <span><i class="el-icon-edit" />鍐呮帶鍊硷細{{ detailInfo.internal }}</span></div> </div> </div> </div> </div> + <!-- 娣诲姞浠ュ強淇敼鐨勬ā鎬佹 --> + <el-dialog title="娣诲姞鐗╂枡" :visible.sync="materialFormVisible" width="35%"> + <el-form :model="addMaterialForm"> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐗╂枡ID锛�" label-width="100px"> + <el-input v-model="addMaterialForm.id" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鐗╂枡鍚嶇О锛�" label-width="100px"> + <el-input v-model="addMaterialForm.name" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鎵规锛�" label-width="100px"> + <el-input v-model="addMaterialForm.batch" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="瀛樻斁鍦帮細" label-width="100px"> + <el-input v-model="addMaterialForm.location" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐩樺彿锛�" label-width="100px"> + <el-input v-model="addMaterialForm.reelNumber" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鏁伴噺锛�" label-width="100px"> + <el-input v-model="addMaterialForm.num" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <!-- <el-form-item label="鍏宠仈瑙勬牸锛�" label-width="100px"> + <el-input v-model="addMaterialForm.specificationsId" autocomplete="off" /> + </el-form-item> --> + </el-col> + <el-col :span="12"> + <el-form-item label="渚涘簲鍟嗭細" label-width="100px"> + <el-input v-model="addMaterialForm.supplier" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="addNewMaterial">纭� 瀹�</el-button> + <el-button @click="dialogFormVisible = false">鍙� 娑�</el-button> + </div> + </el-dialog> + <el-dialog title="娣诲姞瀛愰」鐩�" :visible.sync="projectFormVisible" width="35%"> + <el-form :model="addProjectForm"> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐖堕」鐩細" label-width="100px"> + <el-select + v-model="addProjectForm.father" + clearable + filterable + :allow-create="true" + placeholder="璇烽�夋嫨鎴栬緭鍏ョ埗椤圭洰" + @blur="productSelect" + > + <el-option + v-for="item in fatherOpetions" + :key="item.id" + :label="item.label" + :value="item.label" + /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍏宠仈鐗╂枡锛�" label-width="100px"> + <el-select + v-model="addProjectForm.materialId" + clearable + placeholder="璇烽�夋嫨鎴栬緭鍏ョ埗椤圭洰" + > + <el-option + v-for="item in materialTree" + :key="item.id" + :label="item.label" + :value="item.id" + /> + </el-select> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="椤圭洰鍚嶇О锛�" label-width="100px"> + <el-input v-model="addProjectForm.name" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍗曚綅锛�" label-width="100px"> + <el-input v-model="addProjectForm.unit" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鎷涙爣浜鸿姹傚�硷細" label-width="100px"> + <el-input v-model="addProjectForm.required" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍐呮帶鍊硷細" label-width="100px"> + <el-input v-model="addProjectForm.internal" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="璇曢獙鏂规硶锛�" label-width="100px"> + <el-input v-model="addProjectForm.method" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="addNewProject">纭� 瀹�</el-button> + <el-button @click="projectFormVisible = false">鍙� 娑�</el-button> + </div> + </el-dialog> + <el-dialog title="淇敼鐗╂枡" :visible.sync="changeMaterialFormVisible" width="35%"> + <el-form :model="changeMaterialForm"> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐗╂枡鍚嶇О锛�" label-width="100px"> + <el-input v-model="changeMaterialForm.name" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="渚涘簲鍟嗭細" label-width="100px"> + <el-input v-model="changeMaterialForm.supplier" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鎵规锛�" label-width="100px"> + <el-input v-model="changeMaterialForm.batch" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="瀛樻斁鍦帮細" label-width="100px"> + <el-input v-model="changeMaterialForm.location" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐩樺彿锛�" label-width="100px"> + <el-input v-model="changeMaterialForm.reelNumber" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鏁伴噺锛�" label-width="100px"> + <el-input v-model="changeMaterialForm.num" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="changeMaterial">纭� 瀹�</el-button> + <el-button @click="changeMaterialFormVisible = false">鍙� 娑�</el-button> + </div> + </el-dialog> + <el-dialog title="淇敼瀛愰」鐩�" :visible.sync="changeProjectFormVisible" width="35%"> + <el-form :model="changeProjectForm"> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鐖堕」鐩細" label-width="100px"> + <el-select + v-model="changeProjectForm.father" + clearable + filterable + :allow-create="true" + placeholder="璇烽�夋嫨鎴栬緭鍏ョ埗椤圭洰" + @blur="productSelect" + > + <el-option + v-for="item in fatherOpetions" + :key="item.id" + :label="item.label" + :value="item.label" + /> + </el-select> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="椤圭洰鍚嶇О锛�" label-width="100px"> + <el-input v-model="changeProjectForm.name" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍗曚綅锛�" label-width="100px"> + <el-input v-model="changeProjectForm.unit" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="鎷涙爣浜鸿姹傚�硷細" label-width="100px"> + <el-input v-model="changeProjectForm.required" autocomplete="off" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍐呮帶鍊硷細" label-width="100px"> + <el-input v-model="changeProjectForm.internal" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="20"> + <el-col :span="12"> + <el-form-item label="璇曢獙鏂规硶锛�" label-width="100px"> + <el-input v-model="changeProjectForm.method" autocomplete="off" /> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="changeProject">纭� 瀹�</el-button> + <el-button @click="projectFormVisible = false">鍙� 娑�</el-button> + </div> + </el-dialog> + <el-dialog + title="鎻愮ず" + :visible.sync="delmaterialFormVisible" + width="30%" + > + <span>纭鍒犻櫎璇ョ墿鏂欏悧锛�</span> + <span slot="footer" class="dialog-footer"> + <el-button type="primary" @click="deleteMaterial">纭� 瀹�</el-button> + <el-button @click="delmaterialFormVisible = false">鍙� 娑�</el-button> + </span> + </el-dialog> + <el-dialog + title="鎻愮ず" + :visible.sync="delProductFormVisible" + width="30%" + > + <span>纭鍒犻櫎璇ュ瓙椤圭洰鍚楋紵</span> + <span slot="footer" class="dialog-footer"> + <el-button type="primary" @click="deleleProduct">纭� 瀹�</el-button> + <el-button @click="delProductFormVisible = false">鍙� 娑�</el-button> + </span> + </el-dialog> </div> </template> <script> +import { getMaterialList, getProductProductId, addMaterial, addProduct, getMaterialDetail, updateMaterial, updateProduct, deleteMaterial, deleteProduct } from '@/api/standardLibrary' export default { name: 'SpecificationDetail', data() { return { // 鏌ユ壘瀵瑰簲璇︽儏id - id: '', + specificationsId: '', // 榛樿鍊� - defaultProps: { + materialDefaultProps: { children: 'children', label: 'label' }, + // 鐗╂枡tree鏁版嵁 + materialTree: [], // 鏍囧噯璇︽儏鍒嗙被 - data: [ - { - id: 1, - label: '涓�绾� 1' - }, - { - id: 2, - label: '涓�绾� 1' - }, - { - id: 3, - label: '涓�绾� 1' - }, - { - id: 4, - label: '涓�绾� 1' - } - ], - item: [{ - id: 1, - label: '涓�绾� 1', - children: [{ - id: 4, - label: '浜岀骇 1-1', - children: [{ - id: 9, - label: '涓夌骇 1-1-1' - }, { - id: 10, - label: '涓夌骇 1-1-2' - }] - }] - }], + projectTree: [], searchData: { keyword: '' + }, + // 璇︽儏淇℃伅 + detailInfo: {}, + // 鐗╂枡tree榛樿閫変腑鍊� + materialTreeDefault: [], + projectTreeDefault: [], + materialFormVisible: false, + delmaterialFormVisible: false, + changeMaterialFormVisible: false, + projectFormVisible: false, + changeProjectFormVisible: false, + delProductFormVisible: false, + addMaterialForm: {}, + changeMaterialForm: {}, + addProjectForm: {}, + changeProjectForm: {}, + fatherOpetions: [], + materialId: '', + productId: '' + } + }, + // 涓轰簡閫変腑绗竴灞傜骇涓嬬殑绗竴涓妭鐐� + watch: { + projectTreeDefault(newVal, oldVal) { + // console.log(newVal) + if (newVal) { + this.$nextTick(() => { + // console.log(document.querySelector('.el-tree-node__children .el-tree-node__content')) + + document + .querySelector('.el-tree-node__children .el-tree-node__content') + ?.click() + }) + } + }, + materialTreeDefault(newVal, oldVal) { + // console.log(newVal) + if (newVal) { + this.$nextTick(() => { + // console.log(document.querySelector('.el-tree-node__content')) + document + .querySelector('.el-tree-node__content') + ?.click() + }) } } }, created() { - console.log(this.$route.params) + // console.log(this.$route.params) + // 杩欓噷鍔犱竴涓牎楠岋紝濡傛灉娌℃湁params.id 杩斿洖鏍囧噯搴撻〉闈� + this.specificationsId = this.$route.params.id + this.addMaterialForm.specificationsId = this.$route.params.id + this.refreshData() }, methods: { - + productSelect(e) { + const value = e.target.value // 杈撳叆妗嗗�� + if (value) { // 浣犺緭鍏ユ墠鏈夎繖涓�� 涓嶄负绌猴紝濡傛灉浣犱笅鎷夋閫夋嫨鐨勮瘽 杩欎釜鍊间负绌� + this.addProjectForm.pcode = value + } + }, + // 鍒锋柊鎴栧垵娆¤幏寰楁暟鎹� + refreshData() { + this.getMaterialTreeData() + }, + // tree鏍戠殑杩囨护鏌ヨ + filterNode(value, data) { + if (!value) return true + return data.label.indexOf(value) !== -1 + }, + // 鑾峰彇鐗╂枡tree + async getMaterialTreeData() { + const { data } = await getMaterialList({ specificationsId: this.specificationsId }) + // console.log(data) + this.materialTree = data.map(item => ({ ...item, label: item.name })) + this.materialTreeDefault = [this.materialTree[0].id] + console.log(this.materialTree, this.materialTreeDefault) + }, + // 鐗╂枡搴撶殑鑺傜偣鐐瑰嚮 + materialTreeClick(data, node, element) { + // 鐐瑰嚮鐗╂枡鑺傜偣锛屾煡璇㈠搴旂殑椤圭洰tree鏁版嵁 + console.log(data) + // 寰楀埌鐗╂枡Id + this.materialId = data.id + }, + // 椤圭洰搴撶殑鑺傜偣鐐瑰嚮 + async projectTreeClick(data, node, element) { + // 鍏堝垽鏂偣鍑荤殑鏄埗鑺傜偣杩樻槸瀛愯妭鐐� + if (('children' in data)) return + console.log('瀛愰」鐩妭鐐�', data) + this.productId = data.id + // + const { data: detailInfo } = await getProductProductId({ productId: data.id }) + // console.log('璇︽儏淇℃伅', detailInfo) + this.detailInfo = detailInfo + this.changeProjectForm = { ...detailInfo } + }, + // 鏂板鐗╂枡 + async addNewMaterial() { + // console.log('浜х湅娣诲姞鐗╂枡鍙傛暟锛�', this.addMaterialForm) + // const res = await addMaterial(this.addMaterialForm) + await addMaterial(this.addMaterialForm) + // console.log(res) + this.$message.success('娣诲姞鐗╂枡鎴愬姛') + this.materialFormVisible = false + this.refreshData() + }, + // 鏂板椤圭洰 + async addNewProject() { + console.log('鏌ョ湅娣诲姞鐨勫瓙椤圭洰鍙傛暟', this.addProjectForm) + const res = await addProduct(this.addProjectForm) + console.log(res) + this.$message.success('娣诲姞鏂伴」鐩垚鍔�') + this.projectFormVisible = false + this.refreshData() + }, + // 淇敼鐗╂枡 + async changeMaterial() { + console.log('淇敼鐗╂枡鍙傛暟', this.changeMaterialForm) + const res = await updateMaterial(this.changeMaterialForm) + this.changeMaterialFormVisible = false + this.$message.success('淇敼鎴愬姛') + this.refreshData() + console.log(res) + }, + // 淇敼椤圭洰 + async changeProject() { + console.log('淇敼椤圭洰鍙傛暟', this.changeProjectForm) + const { data } = await updateProduct(this.changeProjectForm) + console.log(data) + this.changeMaterialFormVisible = false + this.$message.success('淇敼鎴愬姛') + this.refreshData() + }, + // 鏄剧ず淇敼鐗╂枡妯℃�佹鍚屾椂鑾峰彇闇�瑕佷慨鏀圭墿鏂欎俊鎭� + async showChangeMaterial(data) { + const { data: materialInfo } = await getMaterialDetail({ materialId: data.id }) + for (const key in materialInfo) { + // console.log(key, materialInfo[key]) + if (!materialInfo[key]) { + // console.log(materialInfo[key]) + delete materialInfo[key] + } + } + console.log(materialInfo) + this.changeMaterialForm = materialInfo + this.changeMaterialFormVisible = true + }, + // 鏄剧ず淇敼椤圭洰妯℃�佹 + showChangeProject(data) { + // console.log('淇敼鍓�', this.changeProjectForm) + this.changeProjectForm.name = data.name + // console.log('淇敼鍚�', this.changeMaterialForm) + this.changeProjectFormVisible = true + }, + async deleteMaterial() { + await deleteMaterial({ materialId: this.materialId }) + this.delmaterialFormVisible = false + }, + async deleleProduct() { + // console.log('productId', this.productId) + await deleteProduct({ productId: this.productId }) + this.delProductFormVisible = false + } } } </script> @@ -356,4 +789,20 @@ } } } + +// 鏍戣妭鐐圭殑鏍峰紡 +.custom-tree-node { + flex: 1; + display: flex; + align-items: center; + justify-content: space-between; + font-size: 14px; + padding-right: 8px; + &>:nth-child(2){ + display: none; + } + &:hover >:nth-child(2){ + display: block; + } + } </style> -- Gitblit v1.9.3