From 02ff4d3b3c4829e6f97a704c60fe76433e65c4e6 Mon Sep 17 00:00:00 2001 From: 王震 <10952869+daywangzhen@user.noreply.gitee.com> Date: 星期四, 07 九月 2023 18:03:36 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/components/view/standard.vue | 511 ++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 329 insertions(+), 182 deletions(-) diff --git a/src/components/view/standard.vue b/src/components/view/standard.vue index fc2549f..731daef 100644 --- a/src/components/view/standard.vue +++ b/src/components/view/standard.vue @@ -1,117 +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; - } - - .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> - <template> <div class="standard"> <div class="title"> <el-row> <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> @@ -120,106 +15,358 @@ <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="false" :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 != '[4]' ? '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> + <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="name" border + @selection-change="handleSelectionChange" default-expand-all + :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"> + <el-table-column type="selection" width="55"> + </el-table-column> + <el-table-column type="index" width="50" label="搴忓彿"> + </el-table-column> + <el-table-column prop="name" label="宸ュ簭" sortable width="300px"> + <!-- <template slot-scope="scope"> + <el-tag> + <div class="firstDiv" :style="`color: ${scope.row.children? '#16a7ff' : '#58c173'}`"> + {{ scope.row.children ? "01" : "02" }} + </div> + </el-tag> + <span style="color: black">{{ scope.row.name }}</span> + + </template> --> + </el-table-column> + <el-table-column prop="" sortable label="宸ヨ壓鍚嶇О"> + </el-table-column> + <el-table-column prop="" label="鎸囨爣鍚嶇О"> + </el-table-column> + <el-table-column prop="" label="鍗曚綅"> + </el-table-column> + <el-table-column prop="" label="鍐呮帶鍊�"> + </el-table-column> + <el-table-column prop="unit" label="鏍囧噯鍊�"> + </el-table-column> + </el-table> </div> <div class="table"> - <technology></technology> + <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" +export default { + components: { technology }, + data() { + return { + // BOM鏍戞暟鎹粨鏋� + list: [], + search: null, + tableType: 1, // 琛ㄦ牸绫诲瀷 1锛氭妧鏈寚鏍囷紝0锛氬伐鑹鸿矾绾� + searchName: "",// 鏌ヨ鏉′欢-鍚嶇О + checkTreeNode: {},// 鐐瑰嚮閫変腑鏍戣妭鐐� + tableData: [], + bomAddModelVisible: false,// 鎺у埗bom鏂板妯℃�佹鏄惁鏄剧ず + list: [], + typeselect: {}, + returntree: {}, + version: {}, + VER: {}, + verdata: {}, + character: '', + } + }, + // watch: { + // search(val) { + // this.$refs.tree.filter(val); + // }, + // tableType(val){ + // this.selectProductTableData() + // } + // }, + mounted() { + this.selectMaterialTree() + }, + methods: { + 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); + }) + }, + 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); + }, + //鍙充晶鏁版嵁 + selectAll() { + console.log(this.$axios.get(this.$api.url.selectAll)); + this.$axios.get(this.$api.url.selectAll, { + params: { + specificationsId: this.returntree.id, + type: this.typeselect, + version: this.character, + } + }).then(res => { + this.tableData = res.data + }) + }, + //浜旂骇鏍� + 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 = '鍗婃垚鍝�' + } + el.children.forEach((newEl, newIdx, newArr) => { + if (newIdx == 0) { + newArr[newIdx].name = '姗¤兌杩炴帴鍣�' + } + if (newIdx == 1) { + newArr[newIdx].name = '閲戝睘杩炴帴鍣�' + } + if (newIdx == 2) { + newArr[newIdx].name = '婀挎彃鎷旂數杩炴帴鍣�' + } + if (newIdx == 3) { + newArr[newIdx].name = '鍒嗘敮缁勪欢' + } }) }) + console.log(this.list); + }) + }, + 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 .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