From ffd461f541b355d2d5124a0735d9c6fd557d21a5 Mon Sep 17 00:00:00 2001
From: XiaoRuby <3114200645@qq.com>
Date: 星期四, 10 八月 2023 13:13:06 +0800
Subject: [PATCH] Crunchy-08/10中午
---
src/components/view/standard.vue | 10 +-
src/components/view/laboratoryManagement.vue | 229 +++++++++++++++++++++++++++++++++++++++++++++
src/view/index.vue | 2
3 files changed, 235 insertions(+), 6 deletions(-)
diff --git a/src/components/view/laboratoryManagement.vue b/src/components/view/laboratoryManagement.vue
new file mode 100644
index 0000000..85ddfc8
--- /dev/null
+++ b/src/components/view/laboratoryManagement.vue
@@ -0,0 +1,229 @@
+<template>
+ <div>
+ <el-row>
+ <el-col :span="12" style="padding-left: 20px; line-height: 32px;">瀹為獙瀹ょ鐞�</el-col>
+ <el-col :span="12" style="text-align: right;">
+ <el-button @click="handleAddNew" type="primary" size="mini" icon="el-icon-plus" style="background: #004EA2; ">鏂板浠櫒璁惧</el-button>
+ </el-col>
+ </el-row>
+ <el-row style="height: calc(100vh - 165px); margin-top: 9px;">
+ <div :style="`width: ${isCollapse?300:0}px;transition: 1s;`" class="class_sidebar">
+ <el-radio-group class="ai-tab-change" style="width: 270px; margin-top: 5px" v-model="radio1">
+ <el-radio-button size="small" label="true">
+ <div class="el_radio_button_div">鐢熶骇璁惧</div>
+ </el-radio-button>
+ <el-radio-button size="small" label="false">
+ <div class="el_radio_button_div">妫�娴嬭澶�</div>
+ </el-radio-button>
+ </el-radio-group>
+ <el-input v-model="search" :style="`width: 90%; margin: 10px 0;opacity: ${isCollapse?1:0};transition: 1.5s;`" suffix-icon="el-icon-search" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" size="small" clearable></el-input>
+ <el-tree :data="list" ref="tree" :props="{children: 'children',label: 'label'}" node-key="id" default-expand-all
+ :filter-node-method="filterNode" @node-click="handleNodeClick" highlight-current @node-expand="nodeOpen"
+ @node-collapse="nodeClose">
+ <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.label }}</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 :style="`width: calc(100vw - ${isCollapse?'475':'170'}px); padding-left: 5px;transition: 1s;float: left;`">
+ <div :title="isCollapse ? '鐐瑰嚮灞曞紑' : '鐐瑰嚮鏀惰捣'" class="box_bgd" @click="isC">
+ <!-- 鐐瑰嚮灞曞紑鏀惰捣瀵艰埅鍜屽垏鎹㈠搴斿浘鏍� -->
+ <i :class="!isCollapse ? 'el-icon-arrow-left' : 'el-icon-arrow-right'"></i>
+ </div>
+ <div style="background-color: #fbfbfd; height: 100%;">
+ <div style="margin-left: 20px; padding-top: 15px; padding-bottom: 15px">
+ <el-input v-model="searchName" size="small" prefix-icon="el-icon-search" placeholder="璇疯緭鍏ョ紪鍙�/璁惧鍚嶇О/鍨嬪彿瑙勬牸" style="width: 20%;margin-right: 24px;" clearable></el-input>
+ <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>
+ <el-select v-model="tableType" size="small" placeholder="璇烽�夋嫨" style="float: right; width: 224px;margin-right: 52px;">
+ <el-option :value="0" label="宸ヨ壓鏂囦欢"></el-option>
+ <el-option :value="1" label="鎶�鏈寚鏍�"></el-option>
+ </el-select>
+ </div>
+ <el-table
+ :data="tableData"
+ border
+ height="calc(100vh - 220px)"
+ style="width: 100%; padding: 10px; position: absolute">
+ <el-table-column
+ prop="date"
+ label="鏃ユ湡"
+ width="180">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="濮撳悕"
+ width="180">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鍦板潃">
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ </el-row>
+ </div>
+</template>
+
+<script>
+export default {
+ name: "LaboratoryManagement",
+ data() {
+ return {
+ isCollapse: true, //榛樿涓哄睍寮�
+ radio1: 'true',
+ tableData: [{
+ date: '2016-05-02',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�'
+ }, {
+ date: '2016-05-04',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�'
+ }, {
+ date: '2016-05-01',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }, {
+ date: '2016-05-03',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
+ }],
+ // BOM鏍戞暟鎹粨鏋�
+ list: [{
+ label: '涓�绾� 1',
+ children: [{
+ label: '浜岀骇 1-1'
+ }]
+ }, {
+ label: '涓�绾� 2',
+ children: [{
+ label: '浜岀骇 2-1'
+ }, {
+ label: '浜岀骇 2-2'
+ }]
+ }, {
+ label: '涓�绾� 3',
+ children: [{
+ label: '浜岀骇 3-1'
+ }, {
+ label: '浜岀骇 3-2'
+ }]
+ }],
+ }
+ },
+ methods: {
+ // 鍔ㄦ�佹帶鍒跺睍寮�涓庢敹璧峰拰鍒囨崲瀵瑰簲鍥炬爣
+ isC() {
+ this.isCollapse = !this.isCollapse;
+ },
+ },
+}
+</script>
+
+<style scoped>
+.custom-tree-node {
+ flex: 1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ font-size: 14px;
+ padding-right: 8px;
+}
+.el-icon-delete {
+ display: none;
+ color: #004EA2;
+}
+.custom-tree-node:hover .el-icon-delete {
+ display: inline;
+}
+.node_i {
+ color: orange;
+}
+::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+ background: #f2f2f2;
+ border: 0 !important;
+ color: #696969;
+ line-height: 14px;
+ outline: none;
+ box-shadow: none;
+}
+.class_sidebar {
+ overflow: hidden;
+ height: calc(100vh - 159px);
+ text-align: center;
+ padding: 8px;
+ float: left;
+ background-color: #fdfdfe;
+}
+.box_bgd {
+ width: 15px;
+ height: 40px;
+ position: relative;
+ float: left;
+ top: 50%!important;
+ left: -20px;
+ background: blue;
+}
+.ai-tab-change {
+ .el-radio-button__inner {
+ border: 1px solid #ececed;
+ line-height: 14px;
+ }
+ .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+ background: #fdfdfe;
+ border: 1px solid #004da2;
+ color: #004da2;
+ line-height: 14px;
+ }
+}
+</style>
diff --git a/src/components/view/standard.vue b/src/components/view/standard.vue
index 4ffb29a..3a9c15a 100644
--- a/src/components/view/standard.vue
+++ b/src/components/view/standard.vue
@@ -12,7 +12,7 @@
margin-bottom: 10px;
padding: 0 20px;
}
-
+
.standard .title *{
font-size: 16px;
}
@@ -89,7 +89,7 @@
.standard .title .el-button * {
font-size: 14px;
}
-
+
.standard .title .el-button--default{
color: #004EA2;
}
@@ -155,7 +155,7 @@
:visible.sync="bomAddModelVisible"
width="30%">
<el-form>
-
+
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="bomAddModelVisible = false">鍙� 娑�</el-button>
@@ -250,13 +250,13 @@
firstNode.click()
})
})
-
+
},
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
+ 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}})
diff --git a/src/view/index.vue b/src/view/index.vue
index d00260b..434a923 100644
--- a/src/view/index.vue
+++ b/src/view/index.vue
@@ -331,7 +331,7 @@
k: 8,
v: "瀹為獙瀹ょ鐞�",
i: "font icon-shouye",
- u: ""
+ u: "laboratoryManagement"
}, {
k: 9,
v: "璐ㄩ噺缁熻",
--
Gitblit v1.9.3