代码提交
This commit is contained in:
parent
bd7259b9f7
commit
b873ad0b97
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 636 B |
Binary file not shown.
|
After Width: | Height: | Size: 672 B |
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 643 B |
|
|
@ -24,5 +24,10 @@ export default new Router({
|
||||||
name: 'index',
|
name: 'index',
|
||||||
component: () => import ('./view/index.vue')
|
component: () => import ('./view/index.vue')
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/equipmentAssets',
|
||||||
|
name: 'equipmentAssets',
|
||||||
|
component: () => import ('./view/equipmentAssets.vue')
|
||||||
|
},
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,574 @@
|
||||||
|
<template>
|
||||||
|
<div class="equipmentAssets">
|
||||||
|
<transition name="left">
|
||||||
|
<div class="assetsLeft" v-show="menuShow">
|
||||||
|
<div class="btnLeft">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in menusArr"
|
||||||
|
:key="index"
|
||||||
|
:style="{
|
||||||
|
backgroundImage:
|
||||||
|
btnAc != index
|
||||||
|
? 'url(' + btnBG.pic + ')'
|
||||||
|
: 'url(' + btnBG.actPic + ')',
|
||||||
|
marginLeft: btnAc == index ? '15px' : '0px',
|
||||||
|
}"
|
||||||
|
class="btnList"
|
||||||
|
@click="handelBtn(index)"
|
||||||
|
>
|
||||||
|
<div class="textArr">
|
||||||
|
<p :text="item.text">{{ item.text }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<img
|
||||||
|
src="../assets/images/shebeijiantou.png"
|
||||||
|
class="jiantou"
|
||||||
|
@click="menuHandel"
|
||||||
|
v-show="arrow"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</transition>
|
||||||
|
<transition name="right">
|
||||||
|
<div class="assetsRight" v-show="menuShow">
|
||||||
|
<div class="rightOne" v-if="btnAc == 0">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightOne" v-if="btnAc == 1">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称二</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightOne" v-if="btnAc == 2">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称三</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightOne" v-if="btnAc == 3">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称四</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightOne" v-if="btnAc == 4">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称五</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightOne" v-if="btnAc == 5">
|
||||||
|
<div class="assetsTitle">
|
||||||
|
<p text="设备名称" style="font-family: 'maleGod'">设备名称六</p>
|
||||||
|
</div>
|
||||||
|
<div class="asstesContent1">
|
||||||
|
<div class="models">
|
||||||
|
<div class="assetsStatus">
|
||||||
|
<p style="margin-left: 15px">正常</p>
|
||||||
|
</div>
|
||||||
|
<div class="modelsImg">
|
||||||
|
<img src="@/assets/images/shebeimoxing.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modelIntroduction">
|
||||||
|
{{ modelIntroduction }}
|
||||||
|
</div>
|
||||||
|
<div class="assetsList">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in assetsList"
|
||||||
|
:key="index"
|
||||||
|
class="assetsArr"
|
||||||
|
>
|
||||||
|
<div class="listContent">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
font-family: 'maleGod';
|
||||||
|
color: rgb(76, 181, 209);
|
||||||
|
font-size: 20px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item.count }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</transition>
|
||||||
|
<img
|
||||||
|
src="../assets/images/shebeijiantoufan.png"
|
||||||
|
class="jiantoufan"
|
||||||
|
@click="menuHandelShow"
|
||||||
|
v-show="!arrow"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import index from "./index.vue";
|
||||||
|
export default {
|
||||||
|
// components: { index },
|
||||||
|
name: "equipmentAssets",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
arrow: false, //箭头隐藏
|
||||||
|
menuShow: false, //菜单隐藏动画
|
||||||
|
modelIntroduction: `具有自助交电费、查询账单、
|
||||||
|
打印发票以及智能管理功能，具备24小时无人值守的自助服务特性，
|
||||||
|
最大限度拓宽业务办理渠道、业务场所及最大限度拓宽业务办理渠道、业务场所及最大程度
|
||||||
|
的人性化服务。`, //模型介绍
|
||||||
|
btnAc: 0,
|
||||||
|
btnBG: {
|
||||||
|
pic: require("@/assets/images/assetsBtn.png"),
|
||||||
|
actPic: require("@/assets/images/assetsBtnAc.png"),
|
||||||
|
},
|
||||||
|
menusArr: [
|
||||||
|
{
|
||||||
|
text: "设备名称一",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "设备名称二",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "设备名称三",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "设备名称四",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "设备名称五",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "设备名称六",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
assetsList: [
|
||||||
|
{
|
||||||
|
name: "当日业务量(个)：",
|
||||||
|
count: "24",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "当日平均办理时间(分钟)：",
|
||||||
|
count: "26",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "当日最长办理时间(分钟)：",
|
||||||
|
count: "68",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "当日最长等待时间(分钟)：",
|
||||||
|
count: "23",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "平均等待时间(分钟)：",
|
||||||
|
count: "17",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.menuHandelShow()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handelBtn(index) {
|
||||||
|
this.btnAc = index;
|
||||||
|
},
|
||||||
|
//隐藏菜单按钮
|
||||||
|
menuHandel() {
|
||||||
|
let that = this;
|
||||||
|
this.menuShow = false;
|
||||||
|
window.setTimeout(() => {
|
||||||
|
that.arrow = false;
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
//显示菜单按钮
|
||||||
|
menuHandelShow() {
|
||||||
|
this.arrow = true;
|
||||||
|
this.menuShow = true;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.equipmentAssets {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
.assetsLeft {
|
||||||
|
width: 15.5%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
background: url("../assets/images/assetsLeft.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
.btnLeft {
|
||||||
|
height: 60%;
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 18%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.btnList {
|
||||||
|
width: 224px;
|
||||||
|
height: 50px;
|
||||||
|
.textArr {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.textArr ::before {
|
||||||
|
content: attr(text);
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
// bottom: 0;
|
||||||
|
color: rgb(163, 227, 245);
|
||||||
|
-webkit-mask: linear-gradient(
|
||||||
|
to top,
|
||||||
|
rgba(163, 227, 245, 0.7),
|
||||||
|
transparent
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.jiantou {
|
||||||
|
position: absolute;
|
||||||
|
width: 14px;
|
||||||
|
height: 29px;
|
||||||
|
top: 48%;
|
||||||
|
right: 3%;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.assetsRight {
|
||||||
|
width: 20.6%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
.rightOne {
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: url("../assets/images/assetsRight.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
.assetsTitle {
|
||||||
|
color: #ffffff;
|
||||||
|
height: 5.5%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
padding-left: 10%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.assetsTitle ::before {
|
||||||
|
content: attr(text);
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
color: rgb(135, 216, 238);
|
||||||
|
-webkit-mask: linear-gradient(
|
||||||
|
to top,
|
||||||
|
rgba(163, 227, 245, 0.7),
|
||||||
|
transparent
|
||||||
|
);
|
||||||
|
}
|
||||||
|
.asstesContent1 {
|
||||||
|
height: calc(100% - 5.5%);
|
||||||
|
width: 100%;
|
||||||
|
padding: 0% 3%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.models {
|
||||||
|
width: 100%;
|
||||||
|
height: 50.5%;
|
||||||
|
background: url("../assets/images/assets1.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
position: relative;
|
||||||
|
.assetsStatus {
|
||||||
|
width: 81px;
|
||||||
|
height: 31px;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
background: url("../assets/images/zhuangtaikuang.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
color: chartreuse;
|
||||||
|
font-size: 15px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.modelsImg {
|
||||||
|
width: 41%;
|
||||||
|
height: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.modelIntroduction {
|
||||||
|
height: 18%;
|
||||||
|
color: #ffffff;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
text-align: justify;
|
||||||
|
text-indent: 30px;
|
||||||
|
margin-top: 10px;
|
||||||
|
line-height: 30px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.modelIntroduction::-webkit-scrollbar {
|
||||||
|
width: 0 !important;
|
||||||
|
}
|
||||||
|
.assetsList {
|
||||||
|
height: calc(100% - 70.5%);
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-content: space-between;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
overflow-y: auto;
|
||||||
|
.assetsArr {
|
||||||
|
background: url("../assets/images/assetsArr.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 16%;
|
||||||
|
.listContent {
|
||||||
|
margin-left: 10%;
|
||||||
|
width: 80%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.assetsList::-webkit-scrollbar {
|
||||||
|
width: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//箭头
|
||||||
|
.jiantoufan {
|
||||||
|
position: absolute;
|
||||||
|
width: 14px;
|
||||||
|
height: 29px;
|
||||||
|
top: 48%;
|
||||||
|
left: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//left动画
|
||||||
|
@keyframes donghua1 {
|
||||||
|
from {
|
||||||
|
transform: translateX(0%);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translateX(-100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left-leave,
|
||||||
|
.left-leave-active,
|
||||||
|
.left-leave-to {
|
||||||
|
animation: donghua1 1s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-enter,
|
||||||
|
.left-enter-active,
|
||||||
|
.left-enter-to {
|
||||||
|
animation: donghua1 1s linear reverse;
|
||||||
|
}
|
||||||
|
//right动画
|
||||||
|
@keyframes donghua2 {
|
||||||
|
from {
|
||||||
|
transform: translateX(0%);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translateX(100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right-leave,
|
||||||
|
.right-leave-active,
|
||||||
|
.right-leave-to {
|
||||||
|
animation: donghua2 1s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-enter,
|
||||||
|
.right-enter-active,
|
||||||
|
.right-enter-to {
|
||||||
|
animation: donghua2 1s linear reverse;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -205,11 +205,10 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="middleBottom">
|
<div class="middleBottom">
|
||||||
<div class="menuBtn" :class="{'menuBtn1' : menuAc == index}" v-for="(item,index) in menu" :key="index" @click="handelBtn(index)">
|
<div class="menuBtn" :class="{'menuBtn1' : menuAc == index}" v-for="(item,index) in menu" :key="index" @click="handelBtn(index)">
|
||||||
<img :src="item.icon"/>
|
<img :src="menuAc != index ? item.icon : item.iconAc"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="middleBottomIcon">
|
<div class="middleBottomIcon">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -372,15 +371,19 @@ export default {
|
||||||
],
|
],
|
||||||
menu:[
|
menu:[
|
||||||
{
|
{
|
||||||
icon: require("@/assets/images/zongti.png")
|
icon: require("@/assets/images/zongti.png"),
|
||||||
|
iconAc:require("@/assets/images/zongtiAc.png")
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: require("@/assets/images/zhihui.png")
|
icon: require("@/assets/images/zhihui.png"),
|
||||||
|
iconAc:require("@/assets/images/zhihuiAc.png")
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: require("@/assets/images/shebei.png")
|
icon: require("@/assets/images/shebei.png"),
|
||||||
|
iconAc:require("@/assets/images/shebeiAc.png")
|
||||||
}
|
}
|
||||||
]
|
],
|
||||||
|
menuAc:0
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
@ -397,17 +400,11 @@ export default {
|
||||||
handelBtn(index){
|
handelBtn(index){
|
||||||
this.menuAc = index
|
this.menuAc = index
|
||||||
if (index == 0) {
|
if (index == 0) {
|
||||||
this.menu[0].icon = require("@/assets/images/zongtiAc.png")
|
|
||||||
this.menu[1].icon = require("@/assets/images/zhihui.png")
|
|
||||||
this.menu[2].icon = require("@/assets/images/shebei.png")
|
|
||||||
}else if (index == 1) {
|
}else if (index == 1) {
|
||||||
this.menu[0].icon = require("@/assets/images/zongti.png")
|
|
||||||
this.menu[1].icon = require("@/assets/images/zhihuiAc.png")
|
|
||||||
this.menu[2].icon = require("@/assets/images/shebei.png")
|
|
||||||
}else if (index == 2) {
|
}else if (index == 2) {
|
||||||
this.menu[0].icon = require("@/assets/images/zongti.png")
|
this.$router.push('./equipmentAssets')
|
||||||
this.menu[1].icon = require("@/assets/images/zhihui.png")
|
|
||||||
this.menu[2].icon = require("@/assets/images/shebeiAc.png")
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue