From 96b73e0c5e4bef9fadbf7f08eb8a5a49d617b292 Mon Sep 17 00:00:00 2001 From: zouyu <2723363702@qq.com> Date: 星期一, 11 九月 2023 09:26:54 +0800 Subject: [PATCH] Merge branch 'master' of http://192.168.0.22:9001/r/mom-before --- src/components/view/standard.vue | 537 ++++++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 360 insertions(+), 177 deletions(-) diff --git a/src/components/view/standard.vue b/src/components/view/standard.vue index 853d4a2..2d72360 100644 --- a/src/components/view/standard.vue +++ b/src/components/view/standard.vue @@ -1,109 +1,12 @@ -<style scoped> - .standard {} - - .standard .title .el-button { - height: 32px; - border: 1px solid rgba(190, 190, 190, 0.44); - box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41); - padding: 0 12px; - } - - .standard .title { - margin-bottom: 10px; - padding: 0 20px; - } - - .thing { - width: 100%; - height: calc(100% - 48px); - background-color: #fff; - display: flex; - } - - .thing .left { - width: 295px; - height: calc(100% - 32px); - border-right: 3px solid rgb(245, 247, 251); - padding: 16px; - } - - .thing .left .custom-tree-node span { - font-size: 14px; - } - - .thing .left .custom-tree-node { - flex: 1; - display: flex; - align-items: center; - justify-content: space-between; - font-size: 14px; - padding-right: 8px; - } - - .node_i { - color: orange; - } - - .el-icon-delete { - display: none; - color: #004EA2; - } - - .custom-tree-node:hover .el-icon-delete { - display: inline; - } - - .thing .right { - width: calc(100% - 295px); - height: 100%; - overflow: hidden; - } - - .thing .right .choose { - padding: 21px 24px; - display: flex; - align-items: center; - } - - .thing .right .choose * { - font-size: 14px; - } - - .thing .right .choose .el-button { - height: 32px; - border: 1px solid rgba(190, 190, 190, 0.44); - box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41); - padding: 0 12px; - } - - .thing .right .table{ - margin-right: 24px; - height: calc(100% - 74px); - } -</style> -<style> - .standard .title .el-button * { - font-size: 14px; - } - - .standard .thing .left .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { - background: rgba(58, 124, 253, 0.3); - color: #004EA2; - } - - .el-tree-node__content { - height: 30px; - border-radius: 2px; - } -</style> - <template> <div class="standard"> <div class="title"> <el-row> - <el-col :span="12">鏍囧噯BOM</el-col> + <el-col :span="12" style="line-height: 32px;">鏍囧噯BOM</el-col> <el-col :span="12" style="text-align: right;"> - <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;">鏂板</el-button> + <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;" + @click="bomAddModelVisible = true">鏂板</el-button> + <el-button icon="el-icon-plus">鏂板鐗堟湰</el-button> <el-button icon="el-icon-edit-outline">淇敼</el-button> <el-button icon="el-icon-delete">鍒犻櫎</el-button> </el-col> @@ -112,106 +15,386 @@ <div class="thing"> <div class="left"> <el-input v-model="search" suffix-icon="el-icon-search" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" size="small" clearable></el-input> - <el-tree :data="list" ref="tree" :props="{children: 'children',label: 'name'}" node-key="id" default-expand-all - :filter-node-method="filterNode" @node-click="handleNodeClick" highlight-current @node-expand="nodeOpen" - @node-collapse="nodeClose"> + + <el-tree :data="list" ref="tree" default-expand-all :props="{ children: 'children', label: 'name' }" + node-key="id" :filter-node-method="filterNode" @node-click="handleNodeClick" highlight-current> <div class="custom-tree-node" slot-scope="{ node, data }"> - <span><i :class="`node_i ${data.code != '[4]'?'el-icon-folder-opened':'el-icon-tickets'}`"></i> - {{data.code}}{{ data.name }}</span> + <span><i :class="`node_i ${data.code != '[5]' ? 'el-icon-folder-opened' : 'el-icon-tickets'}`"></i> + {{ data.name }}</span> <el-button type="text" size="mini" @click.stop="remove(node, data)"> <i class="el-icon-delete"></i> </el-button> </div> </el-tree> </div> + + <div class="right"> <div class="choose"> <span>绫诲瀷锛�</span> - <el-select v-model="tableType" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 52px;"> - <el-option value="宸ヨ壓鏂囦欢"></el-option> - <el-option value="鎶�鏈寚鏍�"></el-option> + <el-select v-model="tableType" size="small" placeholder="璇烽�夋嫨" @change="TYPE" + style="width: 224px;margin-right: 52px;"> + <el-option :value="0" label="宸ヨ壓璺嚎"></el-option> + <el-option :value="1" label="鎶�鏈寚鏍�"></el-option> + <el-option :value="2" label="鐗╂枡娓呭崟"></el-option> + <el-option :value="3" label="鐢熶骇宸ヨ壓"></el-option> </el-select> - <span>{{tableType=='鎶�鏈寚鏍�'?'椤圭洰锛�':'宸ヨ壓鍚嶇О锛�'}}</span> - <el-input v-model="searchName" size="small" placeholder="璇疯緭鍏�" style="width: 224px;margin-right: 24px;" clearable></el-input> - <el-button size="mini"><span>閲� 缃�</span></el-button> - <el-button size="mini" type="primary" style="background: #004EA2;"><span>鏌� 璇�</span></el-button> + <span>{{ tableType == 1 ? '椤圭洰锛�' : '宸ヨ壓鍚嶇О锛�' }}</span> + <el-input v-model="searchName" size="small" placeholder="璇疯緭鍏�" style="width: 224px;margin-right: 24px;" + clearable></el-input> + <span>{{ tableType == 1 ? '鐗堟湰锛�' : '鐗堟湰锛�' }}</span> + <el-select v-model="VER" @change="verevent" style="width: 280px;" placeholder="璇烽�夋嫨"> + <el-option v-for="item in version" :key="item" :label="item" :value="item"> + </el-option> + </el-select> + <el-button size="mini" @click="() => { searchName = ''; selectProductTableData() }"><span>閲� 缃�</span></el-button> + <el-button size="mini" type="primary" style="background: #004EA2;" @click="selectProductTableData"><span>鏌� + 璇�</span></el-button> </div> - <div class="table"> - <technology></technology> + + <div class="contentTable" v-if="this.typeselect == 0"> + <technology :tableType="tableType" :tableData="tableData"></technology> </div> + <div v-if="this.typeselect == 1">鎶�鏈寚鏍�</div> + <div v-if="this.typeselect == 2"> + <material :tableType="tableType" :tableData="tableData"></material> + </div> + <div v-if="this.typeselect == 3">鐢熶骇宸ヨ壓</div> + <!-- <div class="table"> + <technology v-if="tableData.length !== 0" :tableType="tableType" :tableData="tableData"></technology> + </div> --> + <!-- <div class="table"> + <technology v-if="tableData.length !== 0" :tableType="tableType" :tableData="tableData"></technology> + </div> --> </div> + </div> + + + <div class="bom-add-model"> + <el-dialog title="BOM鏂板" :visible.sync="bomAddModelVisible" width="30%"> + <el-form> + + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="bomAddModelVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="bomAddModelVisible = false">纭� 瀹�</el-button> + </span> + </el-dialog> </div> </div> </template> <script> - import technology from "./standard-table/technology.vue" - export default { - components: {technology}, - data() { - return { - list: [{ - id: 0, - name: "鍘熸潗鏂�", - code: "[1]", - children: [] - }, { - id: 1, - name: "鎴愬搧", - code: "[1]", - children: [] - }, { - id: 2, - name: "鍗婃垚鍝�", - code: "[1]", - children: [] - }], - search: null, - tableType: "鎶�鏈寚鏍�", - searchName: "" - } +import technology from "./standard-table/technology.vue" +import material from "./standard-table/material.vue" +export default { + components: { technology,material }, + + data() { + return { + // BOM鏍戞暟鎹粨鏋� + list: [], + search: null, + tableType: 1, // 琛ㄦ牸绫诲瀷 1锛氭妧鏈寚鏍囷紝0锛氬伐鑹鸿矾绾� + searchName: "",// 鏌ヨ鏉′欢-鍚嶇О + checkTreeNode: {},// 鐐瑰嚮閫変腑鏍戣妭鐐� + tableData: [], + bomAddModelVisible: false,// 鎺у埗bom鏂板妯℃�佹鏄惁鏄剧ず + typeselect: 0, + returntree: { + id:28, + }, + version: {}, + VER: {}, + verdata: {}, + character: 0, + } + }, + // watch: { + // search(val) { + // this.$refs.tree.filter(val); + // }, + // tableType(val){ + // this.selectProductTableData() + // } + // }, + mounted() { + this.selectMaterialTree() + // this.selectAll() + this.selectVersion() + }, + methods: { + selectDataList() { + this.list.forEach(a => { + a.code = '[1]' + if (a.children != undefined) { + a.children.forEach(b => { + b.code = '[2]' + if (b.children != undefined) { + b.children.forEach(c => { + c.code = '[3]' + if (c.children != undefined) { + c.children.forEach(d => { + d.code = '[4]' + if (d.children != undefined) { + d.children.forEach(e => { + e.code = '[5]' + }) + } + }) + } + }) + } + }) + } + }) + }, + handleSelectionChange() { + }, - watch: { - search(val) { - this.$refs.tree.filter(val); - } + TYPE(val) {//绫诲瀷.鏁版嵁 + console.log(val); + this.typeselect = val + + // console.log(this.typeselect); + this.selectVersion() }, - mounted() { - this.selectMaterialTree() + handleNodeClick(val) {//鏍戠殑鍊� + console.log(val); + this.returntree = val }, - methods: { - handleNodeClick(data) { - console.log(data); - }, - filterNode(value, data) { - if (!value) return true; - return data.label.indexOf(value) !== -1; - }, - remove(node, data) { - this.$confirm("鏄惁鍒犻櫎", "璀﹀憡", { - type: "warning" - }).then(res => { - const parent = node.parent; - const children = parent.data.children || parent.data; - const index = children.findIndex(d => d.id === data.id); - children.splice(index, 1); - }).catch(e => {}) - }, - nodeOpen(data, node, el) { - $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder-opened') - }, - nodeClose(data, node, el) { - $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder') - }, - selectMaterialTree() { - this.$axios.get(this.$api.url.selectTreeByMaterial).then(res => { - res.data.forEach(a => { - this.list.forEach(b => { - if (a.type == b.id) b.children = [a] - }) - }) + selectVersion() {//鐗堟湰 + this.$axios.get(this.$api.url.selectVersion, { + params: { + specificationsId: this.returntree.id, + type: this.typeselect, + } + }).then(res => { + this.verdata = res.data + this.version = this.verdata.map(el => { + return el = `v${el}` }) + console.log(this.verdata); + }) + }, + //鍙充晶鏁版嵁 + selectAll() { + this.$axios.get(this.$api.url.selectAll, { + params: { + specificationsId: this.returntree.id,//tree鐨勭偣鍑诲弽棣� + type: this.typeselect,//绫诲瀷 + version: this.character,//鐗堟湰 + } + }).then(res => { + let arr = res.data; + for(var i=0;i<arr.length;i++){ + arr[i].id = "0" + i; + } + this.tableData = arr; + }) + }, + verevent(val) { + console.log(val); + let cc = val.replace('v', '') + console.log(cc); + this.character = cc + this.selectAll() + // const { v, ...newObj } = val; + // delete newObj.v + // console.log(newObj); + }, + //浜旂骇鏍� + selectMaterialTree() { + this.$axios.get(this.$api.url.selectTreeByMaterial).then(res => { + this.list = res.data + this.list.forEach((el, idx, arr) => { + if (idx == 0) { + arr[idx].name = '鎴愬搧' + } + if (idx == 1) { + arr[idx].name = '鍗婃垚鍝�' + } + }) + this.selectDataList() + // 榛樿绗竴涓簲绾ц妭鐐规悳绱紝鏂板閰嶇疆椤� + const treeOptions = JSON.parse(JSON.stringify(this.list)); + this.getDefault(treeOptions, 0); + this.formTypeOptions = treeOptions; + this.$nextTick().then(() => { + const firstNode = document.querySelector( + ".el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node" + ); + try { + firstNode.click(); + } catch (e) { + //TODO handle the exception + } + }); + }) + }, + getDefault(arr, index) { + for (const item of arr) { + if (item.children && item.children.length > 0) { + // 鏈夊瓙鑺傜偣 + this.getDefault(item.children, index + 1); + if (index === 2) { + item.children = null; + } + } + } + }, + filterNode(value, data) { + if (!value) return true; + return data.label.indexOf(value) !== -1; + }, + remove(node, data) { + this.$confirm("鏄惁鍒犻櫎", "璀﹀憡", { + type: "warning" + }).then(res => { + const parent = node.parent; + const children = parent.data.children || parent.data; + const index = children.findIndex(d => d.id === data.id); + children.splice(index, 1); + }).catch(e => { }) + }, + nodeOpen(data, node, el) { + $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder-opened') + }, + nodeClose(data, node, el) { + $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder') + }, + async selectProductTableData() { + switch (this.tableType) { + case 0: + const { data: technologyList } = await this.$axios.get(this.$api.url.selectTechnologyByMaterial, { params: { specificationId: this.checkTreeNode.id, technologyName: this.searchName } }) + this.tableData = technologyList + break; + case 1: + const { data: productList } = await this.$axios.get(this.$api.url.selectProductByMaterial, { params: { specifications: this.checkTreeNode.id, project: this.searchName } }) + productList.forEach((item, index) => { + item.name = item.father + item.index = index + 1 + item.id = item.father + if (item.children.length === 1) { + productList[index] = { ...item.children[0], index: index + 1, name: item.father } + } + }) + this.tableData = productList + break; } } } +} </script> + + +<style scoped> +.standard {} + +.standard .contentTable{ +} + +.standard .title .el-button { + height: 32px; + border: 1px solid rgba(190, 190, 190, 0.44); + box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41); + padding: 0 12px; +} + +.standard .title { + margin-bottom: 10px; + padding: 0 20px; +} + +.standard .title * { + font-size: 16px; +} + +.thing { + width: 100%; + height: calc(100% - 48px); + background-color: #fff; + display: flex; +} + +.thing .left { + width: 295px; + height: calc(100% - 32px); + border-right: 3px solid rgb(245, 247, 251); + padding: 16px; +} + +.thing .left .custom-tree-node span { + font-size: 14px; +} + +.thing .left .custom-tree-node { + flex: 1; + display: flex; + align-items: center; + justify-content: space-between; + font-size: 14px; + padding-right: 8px; +} + +.node_i { + color: orange; +} + +.el-icon-delete { + display: none; + color: #004EA2; +} + +.custom-tree-node:hover .el-icon-delete { + display: inline; +} + +.thing .right { + width: calc(100% - 295px); + height: 100%; + overflow: hidden; +} + +.thing .right .choose { + padding: 21px 24px; + display: flex; + align-items: center; +} + +.thing .right .choose * { + font-size: 14px; +} + +.thing .right .choose .el-button { + height: 32px; + border: 1px solid rgba(190, 190, 190, 0.44); + box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41); + padding: 0 12px; +} + +.thing .right .table { + margin-right: 24px; + height: calc(100% - 74px); +} +</style> +<style> +.standard .title .el-button * { + font-size: 14px; +} + +.standard .title .el-button--default { + color: #004EA2; +} + +.standard .thing .left .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { + background: rgba(58, 124, 253, 0.3); + color: #004EA2; +} + +.el-tree-node__content { + height: 30px; + border-radius: 2px; +} +</style> + -- Gitblit v1.9.3