From ddd32e029e6a5866240d737b4cc268e33e861233 Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期三, 06 三月 2024 13:57:56 +0800 Subject: [PATCH] 完成设备总览和设备工具明细接口联调 --- src/components/view/b2-standard.vue | 480 ++++++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 434 insertions(+), 46 deletions(-) diff --git a/src/components/view/b2-standard.vue b/src/components/view/b2-standard.vue index da441f9..eafc7d1 100644 --- a/src/components/view/b2-standard.vue +++ b/src/components/view/b2-standard.vue @@ -1,6 +1,7 @@ <style scoped> .standard { padding: 20px 0; + display: flex; } .left { @@ -9,17 +10,237 @@ background-color: white; padding: 15px; } + + .custom-tree-node { + width: 100%; + line-height: 32px; + } + + .custom-tree-node .el-icon-delete { + color: #3A7BFA; + opacity: 0; + font-size: 18px; + } + + .custom-tree-node:hover .el-icon-delete { + opacity: 1; + } + + .node_i { + color: orange; + font-size: 18px; + } + + .right { + margin-left: 5px; + width: calc(100% - 305px); + height: calc(100% - 40px); + } + + .right .title { + height: 50px; + line-height: 50px; + padding: 0 10px; + background-color: white; + } + + .standard_table{ + border-top: 1px solid #ebeef5; + background-color: white; + } + + .product_table{ + border-top: 1px solid #ebeef5; + height: calc(100% - 275px); + margin-top: 5px; + background-color: white; + } + + .product_table .el-table{ + height: 100%; + } +</style> +<style> + .standard .el-tree-node__content { + height: 32px; + font-size: 14px; + border-radius: 2px; + } + + .standard .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { + color: #3A7BFA; + } + + .standard .has-gutter .el-table__cell .cell{ + line-height: 38px; + background-color: #fafafa; + } + + .standard .has-gutter .el-table__cell{ + background-color: #fafafa !important; + } + + .standard .standard_table .el-table__row .cell{ + font-size: 14px; + } </style> <template> <div class="standard"> <div class="left"> - <el-input placeholder="杈撳叆鍏抽敭瀛楄繘琛屾悳绱�" suffix-icon="el-icon-search" v-model="search" size="small" style="margin-bottom: 5px;"></el-input> - <el-tree class="filter-tree" :data="data" :props="defaultProps" default-expand-all - :filter-node-method="filterNode" ref="tree"> + <el-row> + <el-col :span="20"> + <el-input placeholder="杈撳叆鍏抽敭瀛楄繘琛屾悳绱�" suffix-icon="el-icon-search" v-model="search" size="small" + style="margin-bottom: 5px;" clearable @blur="searchFilter" @clear="searchFilter"></el-input> + </el-col> + <el-col :span="4" style="text-align: center;line-height: 30px;" v-if="addPower"> + <el-button type="primary" icon="el-icon-plus" size="mini" circle @click="addDia = true"></el-button> + </el-col> + </el-row> + <el-tree :data="list" ref="tree" default-expand-all :props="{ children: 'children', label: 'label' }" + node-key="id" :filter-node-method="filterNode" @node-click="handleNodeClick" highlight-current + @node-expand="nodeOpen" @node-collapse="nodeClose" v-loading="treeLoad"> + <div class="custom-tree-node" slot-scope="{ node, data }"> + <el-row> + <el-col :span="21"> + <span><i + :class="`node_i ${data.children != undefined ? 'el-icon-folder-opened' : 'el-icon-tickets'}`"></i> + {{ data.code }} {{ data.label }}</span> + </el-col> + <el-col :span="2" style="text-align: right;"> + <el-button type="text" size="mini" @click.stop="remove(node, data)"> + <i class="el-icon-delete"></i> + </el-button> + </el-col> + </el-row> + </div> </el-tree> </div> - <div class="right"></div> + <div class="right"> + <el-row class="title"> + <el-col :span="10" style="font-size: 14px;color: #999;">{{selectTree}}</el-col> + <el-col :span="selectTree==''?24:14" style="text-align: right;"> + <el-button size="small" type="primary" @click="addStandardDia = true" v-if="addStandardMethod">鏂板鏍囧噯</el-button> + <el-button size="small" type="primary">鏂板椤圭洰</el-button> + <el-button size="small"> + <i class="el-icon-delete" style="color: #3A7BFA;"></i> + <span style="color: #3A7BFA;">鍒犻櫎</span> + </el-button> + </el-col> + </el-row> + <el-row class="standard_table" v-loading="standardListLoad"> + <el-table class="el-table" :data="standardList" style="width: 100%;" height="220px" tooltip-effect="dark"> + <el-table-column prop="code" label="鏍囧噯缂栧彿" show-overflow-tooltip> + <template slot-scope="scope"> + <span style="color: red;font-size: 14px;">{{scope.row['code']}}</span> + </template> + </el-table-column> + <el-table-column prop="name" label="鏍囧噯鍚嶇О" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="澶囨敞" show-overflow-tooltip></el-table-column> + <el-table-column prop="createUserName" label="鍒涘缓浜�"></el-table-column> + <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" width="250px"></el-table-column> + <el-table-column label="鎿嶄綔" width="100" align="center"> + <template slot-scope="scope"> + <el-button type="text" size="small">鍒犻櫎</el-button> + </template> + </el-table-column> + </el-table> + </el-row> + <el-row class="product_table"> + <el-table :data="productList" style="width: 100%;" height="100%" tooltip-effect="dark" stripe :fit="true" border> + <el-table-column type="selection" width="65"></el-table-column> + <el-table-column prop="code" label="妫�楠岄」" show-overflow-tooltip></el-table-column> + <el-table-column prop="name" label="妫�楠岄」绫诲瀷" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="妫�楠岄」灏忕被" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="瀹為獙瀹�" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="璁¢噺鍗曚綅" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="鍗曚环" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="宸ユ椂" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="宸ユ椂鍒嗙粍" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="璁惧缁�" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="鍖洪棿" show-overflow-tooltip></el-table-column> + <el-table-column prop="remark" label="瑕佹眰鍊�"> + <template slot-scope="scope"> + <el-input size="small" placeholder="瑕佹眰鍊�" v-model="scope.row.ask"></el-input> + </template> + </el-table-column> + </el-table> + </el-row> + </div> + <el-dialog title="鍒嗙被娣诲姞" :visible.sync="addDia" width="400px"> + <div class="body"> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + <span class="required-span">* </span>宸ュ巶锛� + </el-col> + <el-col :span="16" :offset="1"> + <el-select v-model="addOb.factory" size="small" style="width: 100%;" clearable> + <el-option v-for="(a, ai) in factory" :key="ai" :value="a.value" :label="a.label"></el-option> + </el-select> + </el-col> + </el-row> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + <span class="required-span">* </span>瀹為獙瀹わ細 + </el-col> + <el-col :span="16" :offset="1"> + <el-select v-model="addOb.laboratory" size="small" style="width: 100%;" clearable> + <el-option v-for="(a, ai) in laboratory" :key="ai" :value="a.value" :label="a.label"></el-option> + </el-select> + </el-col> + </el-row> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + <span class="required-span">* </span>鏍峰搧澶х被锛� + </el-col> + <el-col :span="16" :offset="1"> + <el-select v-model="addOb.sampleType" size="small" style="width: 100%;" clearable> + <el-option v-for="(a, ai) in sampleType" :key="ai" :value="a.value" :label="a.label"></el-option> + </el-select> + </el-col> + </el-row> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + <span class="required-span">* </span>鏍峰搧鍚嶇О锛� + </el-col> + <el-col :span="16" :offset="1"> + <el-select v-model="addOb.sample" size="small" style="width: 100%;" clearable> + <el-option v-for="(a, ai) in sample" :key="ai" :value="a.value" :label="a.label"></el-option> + </el-select> + </el-col> + </el-row> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + 鍨嬪彿锛� + </el-col> + <el-col :span="16" :offset="1"> + <el-input v-model="addOb.model" placeholder="璇疯緭鍏ュ瀷鍙�" clearable size="small"></el-input> + </el-col> + </el-row> + </div> + <span slot="footer" class="dialog-footer"> + <el-button @click="addDia = false">鍙� 娑�</el-button> + <el-button type="primary" @click="addStandardTree" :loading="addLoad">纭� 瀹�</el-button> + </span> + </el-dialog> + <el-dialog title="鏂板鏍囧噯" :visible.sync="addStandardDia" width="400px"> + <div class="body"> + <el-row style="line-height: 50px;"> + <el-col :span="6" style="text-align: right;"> + <span class="required-span">* </span>鏍囧噯鍚嶇О锛� + </el-col> + <el-col :span="16" :offset="1"> + <el-select v-model="standardId" size="small" style="width: 100%;" clearable> + <el-option v-for="(a, ai) in standardEnum" :key="ai" :value="a.value" :label="a.label"></el-option> + </el-select> + </el-col> + </el-row> + </div> + <span slot="footer" class="dialog-footer"> + <el-button @click="addStandardDia = false">鍙� 娑�</el-button> + <el-button type="primary" @click="addStandardMethodList" :loading="addLoad2">纭� 瀹�</el-button> + </span> + </el-dialog> </div> </template> @@ -28,55 +249,222 @@ data() { return { search: null, - data: [{ - id: 1, - label: '涓�绾� 1', - children: [{ - id: 4, - label: '浜岀骇 1-1', - children: [{ - id: 9, - label: '涓夌骇 1-1-1' - }, { - id: 10, - label: '涓夌骇 1-1-2' - }] - }] - }, { - id: 2, - label: '涓�绾� 2', - children: [{ - id: 5, - label: '浜岀骇 2-1' - }, { - id: 6, - label: '浜岀骇 2-2' - }] - }, { - id: 3, - label: '涓�绾� 3', - children: [{ - id: 7, - label: '浜岀骇 3-1' - }, { - id: 8, - label: '浜岀骇 3-2' - }] - }], - defaultProps: { - children: 'children', - label: 'label' - } + list: [], + selectTree: '', + factory: [], + addDia: false, + addOb: { + factory: null, + laboratory: null, + sampleType: null, + sample: null, + model: null + }, + laboratory: [], + addLoad: false, + sampleType: [], + sample: [], + treeLoad: false, + addPower: false, + standardList: [], + standardEnum: [], + addStandardDia: false, + standardId: null, + addStandardMethod: true, + addLoad2: false, + productList: [], + standardListLoad: false } }, mounted() { - + this.getPower() + this.selectEnumByCategoryForFactory() + this.selectStandardTreeList() + this.obtainItemParameterList() + this.selectEnumByCategoryForsampleType() + this.selectTestObjectByName() + this.selectStandardMethods() }, methods: { filterNode(value, data) { if (!value) return true; return data.label.indexOf(value) !== -1; - } + }, + searchFilter() { + this.$refs.tree.filter(this.search) + }, + refresh() { + this.upIndex++ + }, + handleNodeClick(val, node, el) { //鏍戠殑鍊� + this.selectTree = '' + this.getNodeParent(node) + this.selectTree = this.selectTree.replace(' - ','') + let data = this.selectTree.split(' - ') + let data2 = '' + for(let index = data.length - 1; index >= 0; index--){ + data2 += " - " + data[index] + } + this.selectTree = data2.replace(' - ','') + this.selectsStandardMethodByFLSSM() + }, + getNodeParent(val){ + if(val.parent!=null){ + this.selectTree += ' - ' + val.label + this.getNodeParent(val.parent) + } + }, + 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') + }, + selectEnumByCategoryForFactory() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "宸ュ巶" + }).then(res => { + this.factory = res.data + }) + }, + selectEnumByCategoryForsampleType() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "鏍峰搧澶х被" + }).then(res => { + this.sampleType = res.data + }) + }, + selectStandardTreeList() { + this.treeLoad = true + this.$axios.get(this.$api.standardTree.selectStandardTreeList).then(res => { + this.list = res.data + this.treeLoad = false + }) + }, + obtainItemParameterList() { + this.$axios.get(this.$api.laboratoryScope.obtainItemParameterList).then(res => { + let data = [] + res.data.forEach(a => { + data.push({ + label: a.laboratoryName, + value: a.laboratoryName + }) + }) + this.laboratory = data + }) + }, + selectTestObjectByName() { + this.$axios.get(this.$api.capacityScope.selectTestObjectByName).then(res => { + let data = [] + res.data.forEach(a => { + data.push({ + label: a.specimenName, + value: a.specimenName + }) + }) + this.sample = data + }) + }, + selectStandardMethods() { + this.$axios.get(this.$api.standardMethod.selectStandardMethods).then(res => { + let data = [] + res.data.forEach(a => { + data.push({ + label: a.name, + value: a.id + }) + }) + this.standardEnum = data + }) + }, + addStandardMethodList(){ + if (this.standardId == null || this.standardId == '') { + this.$message.error('鏍囧噯鏂规硶鏈�夋嫨') + return + } + this.addLoad2 = true + this.$axios.post(this.$api.standardTree.addStandardMethodList,{ + standardId: this.standardId, + tree: this.selectTree + }).then(res=>{ + this.addLoad2 = false + this.addStandardDia = false + this.$message.success('娣诲姞鎴愬姛') + this.selectsStandardMethodByFLSSM() + }) + }, + addStandardTree() { + if (this.addOb.factory == null || this.addOb.factory == '') { + this.$message.error('宸ュ巶鏄繀濉」') + return + } + if (this.addOb.laboratory == null || this.addOb.laboratory == '') { + this.$message.error('瀹為獙瀹ゆ槸蹇呭~椤�') + return + } + if (this.addOb.sampleType == null || this.addOb.sampleType == '') { + this.$message.error('鏍峰搧澶х被鏄繀濉」') + return + } + if (this.addOb.sample == null || this.addOb.sample == '') { + this.$message.error('鏍峰搧鏄繀濉」') + return + } + this.addLoad = true + this.$axios.post(this.$api.standardTree.addStandardTree, this.addOb, { + headers: { + 'Content-Type': 'application/json' + } + }).then(res => { + if (res.code === 201) { + this.addLoad = false + return + } + this.$message.success('娣诲姞鎴愬姛') + this.addDia = false + this.selectStandardTreeList() + this.addLoad = false + }).catch(e => { + this.addDia = false + this.addLoad = false + }) + }, + selectsStandardMethodByFLSSM(){ + this.standardListLoad = true + this.$axios.post(this.$api.standardTree.selectsStandardMethodByFLSSM,{ + tree: this.selectTree + }).then(res=>{ + this.standardListLoad = false + this.standardList = res.data + }) + }, + getPower() { + let power = JSON.parse(sessionStorage.getItem('power')) + let add = false + let addStandardMethod = false + for (var i = 0; i < power.length; i++) { + if (power[i].menuMethod == 'addStandardTree') { + add = true + } + if (power[i].menuMethod == 'addStandardMethodList') { + addStandardMethod = true + } + } + this.addPower = add + this.addStandardMethod = addStandardMethod + }, + } } -</script> \ No newline at end of file +</script> -- Gitblit v1.9.3