From 0bd64cdb66957d78202e96517d52cb100369b5af Mon Sep 17 00:00:00 2001
From: XiaoRuby <3114200645@qq.com>
Date: 星期六, 09 九月 2023 14:51:22 +0800
Subject: [PATCH] Crunchy-09/09
---
src/view/index.vue | 206 ++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 187 insertions(+), 19 deletions(-)
diff --git a/src/view/index.vue b/src/view/index.vue
index 3d5a9e8..09cfbd5 100644
--- a/src/view/index.vue
+++ b/src/view/index.vue
@@ -54,20 +54,25 @@
}
.left {
- width: 92px;
height: calc(100vh - 58px - 40px);
background-color: #004ea2;
display: flex;
align-items: center;
flex-direction: column;
padding: 20px 0;
+ transition: 0.3s;
+ overflow-y: auto;
+}
+
+.left::-webkit-scrollbar {
+ width: 0;
}
.left .box {
color: #fff;
width: 68px;
height: 68px;
- margin: 20px 0;
+ margin: 8px 0;
cursor: pointer;
display: flex;
align-items: center;
@@ -120,8 +125,8 @@
}
.right {
- width: calc(100% - 92px);
height: calc(100vh - 58px);
+ transition: 0.3s;
}
.tag {
@@ -136,7 +141,8 @@
font-size: 14px;
}
-.tag .el-icon-s-unfold {
+.tag > .el-icon-s-unfold,
+.el-icon-s-fold {
font-size: 18px;
cursor: pointer;
margin: 0 8px;
@@ -182,6 +188,7 @@
width: calc(100% - 48px);
padding: 11px 24px;
background: rgb(245, 247, 251);
+ overflow-y: auto;
}
.com_index {
@@ -196,14 +203,14 @@
<div class="logo">
<img src="../../static/img/logo 1.png" />
</div>
- <div class="label">鐢电紗闄勪欢鏂颁竴浠om绯荤粺</div>
+ <div class="label">涓ぉ娴锋磱鏂颁竴浠om绯荤粺</div>
<div class="user">
<el-avatar :size="24">{{ userName.substring(0, 1) }}</el-avatar>
<span>{{ userName }}</span>
<img src="../../static/img/閫�鍑�.png" @click="out" />
</div>
</div>
- <div class="left">
+ <div class="left" :style="`width: ${leftOpen ? '92' : '0'}px;`">
<div
:class="`box ${activeBox == 0 ? 'active_box' : ''}`"
@click="addTab(menu[0].c[0])"
@@ -247,9 +254,15 @@
</div>
</el-popover>
</div>
- <div class="right">
+ <div
+ class="right"
+ :style="`width: calc(100% - ${leftOpen ? '92' : '0'}px);`"
+ >
<div class="tag">
- <i class="el-icon-s-unfold"></i>
+ <i
+ :class="`${leftOpen ? 'el-icon-s-unfold' : 'el-icon-s-fold'}`"
+ @click="leftOpen = !leftOpen"
+ ></i>
<div class="tabs">
<div
:class="`tab ${tabActive == a.k ? 'active_tab' : ''}`"
@@ -258,7 +271,11 @@
@click="upTabActive(a.k)"
>
{{ a.v }}
- <i class="el-icon-close" @click="removeTab(ai)"></i>
+ <i
+ class="el-icon-close"
+ @click="removeTab(ai)"
+ v-if="tabActive != 0"
+ ></i>
</div>
</div>
</div>
@@ -292,6 +309,7 @@
data() {
return {
userName: "value",
+ leftOpen: true,
menu: [
{
k: 0,
@@ -322,7 +340,7 @@
{
k: 1,
v: "鎶�鏈鐞�",
- i: "font icon-shouye",
+ i: "font icon-ic_form_set24px",
c: [
{
k: 1,
@@ -332,16 +350,84 @@
},
{
k: 2,
- v: "鎶�鏈枃浠�",
+ v: "璁㈠崟BOM",
i: "font icon-shouye",
u: "technical"
}
]
},
{
+ k: 4,
+ v: "鐢熶骇绠＄悊",
+ i: "font icon-shengchanguanli",
+ c: [
+ {
+ k: 12,
+ v: "鐢熶骇璁㈠崟",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 13,
+ v: "鐢熶骇璁″垝",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 14,
+ v: "鐢熶骇鎶ュ伐",
+ i: "font icon-shouye",
+ u: ""
+ }
+ ]
+ },
+ {
+ k: 5,
+ v: "WMS绠＄悊",
+ i: "font icon-a-Inventorydumprequest",
+ c: [
+ {
+ k: 15,
+ v: "鍘熸潗鏂欏簱瀛�",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 16,
+ v: "鍥炲崟绠＄悊",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 17,
+ v: "鍗婃垚鍝佸簱瀛�",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 18,
+ v: "鎴愬搧搴撳瓨",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 19,
+ v: "鎴愬搧鍙戣揣",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 20,
+ v: "鎴愬搧鍏ュ簱",
+ i: "font icon-shouye",
+ u: ""
+ }
+ ]
+ },
+ {
k: 2,
v: "QMS绠＄悊",
- i: "font icon-shouye",
+ i: "font icon-xunhuan",
c: [
{
k: 3,
@@ -374,12 +460,6 @@
u: "unqualifiedManagement"
},
{
- k: 8,
- v: "瀹為獙瀹ょ鐞�",
- i: "font icon-shouye",
- u: "laboratoryManagement"
- },
- {
k: 9,
v: "璐ㄩ噺缁熻",
i: "font icon-shouye",
@@ -390,6 +470,86 @@
v: "璁￠噺绠＄悊",
i: "font icon-shouye",
u: "measurementManagement"
+ },
+ {
+ k: 10.1,
+ v: "涓嶅悎鏍煎搧澶勭疆",
+ i: "font icon-shouye",
+ u: "Processingproducts"
+ }
+ ]
+ },
+ {
+ k: 6,
+ v: "鏍哥畻绠＄悊",
+ i: "font icon-caiwuhesuanxitong",
+ c: [
+ {
+ k: 21,
+ v: "浜ч噺宸ヨ祫",
+ i: "font icon-shouye",
+ u: ""
+ },
+ {
+ k: 22,
+ v: "鍛樺伐鍑哄嫟",
+ i: "font icon-shouye",
+ u: ""
+ }
+ ]
+ },
+ {
+ k: 7,
+ v: "鍩虹鏁版嵁",
+ i: "font icon-a-ziyuan20",
+ c: [
+ {
+ k: 23,
+ v: "鐢熶骇璁板綍缁存姢",
+ i: "font icon-shouye",
+ u: "record-content"
+ },
+ {
+ k: 24,
+ v: "鑷椤圭洰缁存姢",
+ i: "font icon-shouye",
+ u: "self-inspection"
+ },
+ {
+ k: 25,
+ v: "鎶�鏈寚鏍囩淮鎶�",
+ i: "font icon-shouye",
+ u: "Technicalindex"
+ },
+ {
+ k: 26,
+ v: "宸ヨ壓璺嚎缁存姢",
+ i: "font icon-shouye",
+ u: "technology"
+ },
+ {
+ k: 27,
+ v: "璁惧缁存姢",
+ i: "font icon-shouye",
+ u: "laboratoryManagement"
+ },
+ {
+ k: 28,
+ v: "鐗╂枡娓呭崟缁存姢",
+ i: "font icon-shouye",
+ u: "mbom"
+ },
+ // {
+ // k: 29,
+ // v: "宸℃椤圭洰缁存姢",
+ // i: "font icon-shouye",
+ // u: "routinginspection"
+ // },
+ {
+ k: 30,
+ v: "鐢熶骇宸ヨ壓缁存姢",
+ i: "font icon-shouye",
+ u: "equipmentmaintain"
}
]
}
@@ -445,10 +605,18 @@
this.activeBox = 0;
} else if (num > 0 && num <= 2) {
this.activeBox = 1;
- } else if (num > 2 && num <= 10) {
+ } else if (num > 2 && num < 11) {
this.activeBox = 2;
} else if (num == 11) {
this.activeBox = 3;
+ } else if (num > 11 && num <= 14) {
+ this.activeBox = 4;
+ } else if (num > 14 && num <= 20) {
+ this.activeBox = 5;
+ } else if (num > 20 && num <= 22) {
+ this.activeBox = 6;
+ } else if (num > 22 && num <= 30) {
+ this.activeBox = 7;
}
},
out() {
--
Gitblit v1.9.3