From 23d29d43b8fd1022464814da2f9b05be13c3c24f Mon Sep 17 00:00:00 2001 From: 王震 <10952869+daywangzhen@user.noreply.gitee.com> Date: 星期三, 30 八月 2023 09:37:36 +0800 Subject: [PATCH] 基础数据 --- src/components/view/mbom.vue | 486 +++++++++++++++++++++++++++++++---------------------- 1 files changed, 286 insertions(+), 200 deletions(-) diff --git a/src/components/view/mbom.vue b/src/components/view/mbom.vue index 21dfc73..05d29af 100644 --- a/src/components/view/mbom.vue +++ b/src/components/view/mbom.vue @@ -1,3 +1,282 @@ +<template> + <div class="record_content"> + <div class="title"> + <el-row> + <el-col :span="12" style="line-height: 32px;">鐗╂枡娓呭崟缁存姢</el-col> + <el-col :span="12" style="text-align: right;"> + <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;" @click="event">鏂板</el-button> + <el-button icon="el-icon-delete" @click="dels" >鍒犻櫎</el-button> + </el-col> + </el-row> + </div> + <div> + <el-dialog + title="鐗╂枡娓呭崟鐨勭淮鎶�" + :visible.sync="dialogVisible" + width="80%" + :before-close="handleClose" :center="true"> + <div> + <el-form> + <el-row :gutter="2"> + <el-col :span="8"> + <el-form-item label="绫诲瀷:"> + <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> + <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option> + <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option> + <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option> + <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="宸ュ簭:"> + <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> + <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option> + <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option> + <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option> + <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="宸ヨ壓鍚嶇О:"> + <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> + <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option> + <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option> + <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option> + <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option> + </el-select> + </el-form-item> + </el-col> + </el-row> + </el-form> + <el-button size="mini" @click="Addrow" >娣诲姞琛�</el-button> + </div> + <div style="margin: 10px 0px;"> + <template> + <el-table + border + :data="tableData" + height="calc(80vh - 250px)" + style="width: 100%"> + <el-table-column type="index" label="搴忓彿" width="70"> + </el-table-column> + <el-table-column + prop="date" + label="渚涘簲鍟嗗悕绉�" + width="180"> + <template slot-scope="scope"> + <el-input v-model="scope.row.input" placeholder="璇疯緭鍏ュ唴瀹�" ></el-input> + </template> + </el-table-column> + <el-table-column + prop="name" + label="璐ㄩ噺杩芥函鍙�" + width="180"> + <template slot-scope="scope"> + <el-input v-model="scope.row.name" placeholder="璇疯緭鍏ュ唴瀹�" ></el-input> + </template> + </el-table-column> + <el-table-column + prop="address" + label="鍘熸潗鏂欏悕绉�"> + </el-table-column> + <el-table-column + prop="address" + label="瑙勬牸鍨嬪彿"> + </el-table-column> + <el-table-column + prop="address" + label="鍗曚綅"> + </el-table-column> + </el-table> + </template> + </div> + <span slot="footer" class="dialog-footer"> + <el-button @click="dialogVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="skipshow">纭� 瀹�</el-button> + </span> + </el-dialog> + </div> + + <div class="choose"> + <span>绫诲瀷锛�</span> + <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> + <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option> + <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option> + <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option> + <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option> + </el-select> + <span>鍘熸潗鏂欏悕绉帮細</span> + <el-select v-model="search.name" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> + <el-option v-for="(a, ai) in process" key="ai" :label="a.name" :value="a.id"></el-option> + </el-select> + <el-button size="mini"><span>閲� 缃�</span></el-button> + <el-button size="mini" type="primary" style="background: #004EA2;"><span>鏌ヨ</span></el-button> + </div> + <div class="thing"> + <div class="left"> + <el-input v-model="search.technology" 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> + <div class="custom-tree-node" slot-scope="{ node, data }"> + <span><i :class="`node_i ${data.code != '[3]'?'el-icon-folder-opened':'el-icon-tickets'}`"></i> + {{data.code}} {{ 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"> + <el-table :data="tableData" border style="width: 100%;overflow-y: auto;min-height: 100%" max-height="100%" + @selection-change="handleSelectionChange" default-expand-all> + <el-table-column type="selection" width="50"> + </el-table-column> + <el-table-column type="index" label="搴忓彿" width="70"> + </el-table-column> + <el-table-column prop="name" label="鍘熸潗鏂欏悕绉�"> + </el-table-column> + <el-table-column prop="unit" label="鍗曚綅"> + </el-table-column> + <el-table-column label="鎿嶄綔" width="130"> + <template slot-scope="scope"> + <!-- <span class="table_do" @click="upContent(scope.row)">缂栬緫 </span> --> + <span class="table_do" @click="deleteRow(scope.$index, tableData)">鍒犻櫎</span> + </template> + </el-table-column> + </el-table> + </div> + </div> + <!-- <el-dialog title="缂栬緫璁板綍鍐呭" :visible.sync="upDia" width="500px"> + <div class="body"> + + </div> + + </el-dialog> --> + </div> +</template> +<script> +export default { + data() { + return { + search:{}, + list: [{ + id: 0, + name: "鍘熸潗鏂�", + children: [{ + id: 3, + name: "宸ヨ壓", + children: [{ + id: 6, + name: "璁惧1" + }] + }] + }, { + id: 1, + name: "鎴愬搧", + children: [{ + id: 4, + name: "宸ヨ壓" + }] + }, { + id: 2, + name: "鍗婃垚鍝�", + children: [{ + id: 5, + name: "宸ヨ壓" + }] + }], + process:[], + // handleClose:[], + search:{}, + form:{}, + dialogVisible:false, + tableData: [{ + id: 1, + name: "璐ㄩ噺杩芥函鍙�", + unit: "鍗曚綅", + thing: "dajskda", + input:'浣犲ソ1' + }, { + id: 2, + name: "浣滀笟浜哄憳", + unit: "鍗曚綅", + thing: "dajskda", + input:'浣犲ソ2' + + }, { + id: 3, + name: "瑙勬牸", + unit: "鍗曚綅", + thing: "dajskda", + input:'浣犲ソ3' + + }, { + id: 4, + name: "瑙勬牸", + unit: "鍗曚綅", + thing: "dajskda", + input:'浣犲ソ4' + + }, { + id: 5, + name: "瑙勬牸", + unit: "鍗曚綅", + thing: "dajskda", + input:'浣犲ソ5' + + }], + input:'' + } + }, + methods:{ + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + done(); + }) + .catch(_ => {}); + }, + event(){ + this.dialogVisible = true + }, + Addrow() { + if (this.tableData == undefined) { + this.tableData = new Array(); + } + let obj = []; + + this.tableData.push(obj); + }, + skipshow(){ + console.log('666'); + const data = this.tableData.at(-1) + console.log(data); + + this.dialogVisible = false + }, + dels() { + this.selects.forEach(a => { + for (var b = 0; b < this.tableData.length; b++) { + if (this.tableData[b].id == a.id) { + this.tableData.splice(b, 1) + b-- + } + } + }) + this.$message.success('鍒犻櫎瀹屾垚') + }, + handleSelectionChange(val) { + this.selects = val; + }, + deleteRow(index, rows) { + rows.splice(index, 1); + }, + + } + } +</script> + <style scoped> .title .el-button { height: 32px; @@ -13,6 +292,13 @@ .title * { font-size: 16px; + } + .choose-1{ + padding: 5px 24px; + display: flex; + align-items: center; + background-color: #fff; + border-bottom: 3px solid rgb(245, 247, 251); } .choose { @@ -105,203 +391,3 @@ border-radius: 2px; } </style> - -<template> - <div class="record_content"> - <div class="title"> - <el-row> - <el-col :span="12" style="line-height: 32px;">鐗╂枡娓呭崟缁存姢</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 icon="el-icon-edit-outline">淇敼</el-button> - <el-button icon="el-icon-delete" @click="dels">鍒犻櫎</el-button> - </el-col> - </el-row> - </div> - <div class="choose"> - <span>绫诲瀷锛�</span> - <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> - <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option> - <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option> - <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option> - <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option> - </el-select> - <span>鍘熸潗鏂欏悕绉帮細</span> - <el-select v-model="search.name" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;"> - <el-option v-for="(a, ai) in product" key="ai" :label="a.name" :value="a.id"></el-option> - </el-select> - <el-button size="mini" @click="clean()"><span>閲� 缃�</span></el-button> - <el-button size="mini" type="primary" style="background: #004EA2;"><span>鏌� - 璇�</span></el-button> - </div> - <div class="thing"> - <div class="left"> - <el-input v-model="search.technology" suffix-icon="el-icon-search" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" size="small" clearable @input="(val)=>$refs.tree.filter(val)"></el-input> - <el-tree :data="list" ref="tree" :props="{children: 'children',label: 'name'}" node-key="id" default-expand-all - @node-click="handleNodeClick" highlight-current @node-expand="nodeOpen" @node-collapse="nodeClose" :filter-node-method="filterNode" - :key="upIndex"> - <div class="custom-tree-node" slot-scope="{ node, data }"> - <span><i :class="`node_i ${data.code != '[2]'?'el-icon-folder-opened':'el-icon-tickets'}`"></i> - {{data.code}} {{ 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"> - <el-table :data="tableData" border style="width: 100%;overflow-y: auto;min-height: 100%" max-height="100%" - @selection-change="handleSelectionChange" default-expand-all> - <el-table-column type="selection" width="50"> - </el-table-column> - <el-table-column type="index" label="搴忓彿" width="70"> - </el-table-column> - <el-table-column prop="name" label="鍘熸潗鏂欏悕绉�"> - </el-table-column> - <el-table-column prop="unit" label="鍗曚綅" width="150"> - </el-table-column> - <el-table-column prop="num" label="鏁伴噺" width="300"> - <template slot-scope="scope"> - <el-input v-model="scope.row.num" size="medium" placeholder="璇疯緭鍏ュ崟浣�" clearable @change="(val)=>submitUpData(scope.row.id, val)"></el-input> - </template> - </el-table-column> - <el-table-column label="鎿嶄綔" width="100"> - <template slot-scope="scope"> - <span class="table_do" @click="deleteRow(scope.$index, tableData)">鍒犻櫎</span> - </template> - </el-table-column> - </el-table> - </div> - </div> - </div> -</template> - -<script> - export default { - data() { - return { - search: { - type: 0, - name: null - }, - process: [], - product: [], - list: [{ - id: 0, - name: "宸ヨ壓", - children: [{ - id: 5, - name: "宸ュ簭" - }] - }, { - id: 1, - name: "鎴愬搧" - }, { - id: 2, - name: "鍗婃垚鍝�" - }], - checkTreeNode: {}, - tableData: [{ - id: 1, - name: "鍘熸潗鏂欏悕绉�", - unit: "鍗曚綅", - num: "鏁伴噺" - }, { - id: 2, - name: "浣滀笟浜哄憳", - unit: "dajskda", - num: "12348" - }, { - id: 3, - name: "瑙勬牸", - unit: "dajskda", - num: "12348" - }, { - id: 4, - name: "瑙勬牸", - unit: "dajskda", - num: "12348" - }, { - id: 5, - name: "瑙勬牸", - unit: "dajskda", - num: "12348" - }], - upIndex: 0, - selects: [], - upData: { - id: 0, - num: null - } - } - }, - mounted() { - this.selectDataList() - }, - methods: { - filterNode(value, data) { - if (!value) return true; - return data.name.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 => {}) - }, - selectDataList() { - this.list.forEach(a => { - a.code = '[1]' - if (a.children != undefined) { - a.children.forEach(b => { - b.code = '[2]' - }) - } - }) - this.upIndex++ - }, - handleNodeClick(data) { - this.checkTreeNode = data - if (data.code == '[2]') { - console.log(data); - } - }, - 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') - }, - handleSelectionChange(val) { - this.selects = val; - }, - dels() { - this.selects.forEach(a => { - for (var b = 0; b < this.tableData.length; b++) { - if (this.tableData[b].id == a.id) { - this.tableData.splice(b, 1) - b-- - } - } - }) - this.$message.success('鍒犻櫎瀹屾垚') - }, - deleteRow(index, rows) { - rows.splice(index, 1); - }, - submitUpData(id,val) { - this.tableData.forEach(a => { - if (a.id == id) { - a.num = val - } - }) - this.$message.success('淇敼鎴愬姛') - this.upIndex++ - } - } - } -</script> \ No newline at end of file -- Gitblit v1.9.3