139 lines
2.9 KiB
Plaintext
139 lines
2.9 KiB
Plaintext
|
<template>
|
|||
|
|
<view class="index_wrap">
|
|||
|
|
<text class="index_title">运行状态</text>
|
|||
|
|
<view class="index_list">
|
|||
|
|
<view
|
|||
|
|
class="index_inline"
|
|||
|
|
v-for="item in listData"
|
|||
|
|
>
|
|||
|
|
<view class="inline_item">
|
|||
|
|
<text class="inline_item_text">{{item.circuitName}}</text>
|
|||
|
|
<text class="inline_item_text">{{item.current}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="inline_item">
|
|||
|
|
<text class="inline_item_text">{{item.typeName}}</text>
|
|||
|
|
<text :class="item.isTypeOpen?'inline_item_circle_open':'inline_item_circle_close'"></text>
|
|||
|
|
<text class="inline_item_text">{{item.isTypeOpen?'开':'关'}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="index_footer">
|
|||
|
|
<text class="footer_set" @click="handleToSet">设置</text>
|
|||
|
|
<text class="footer_history" @click="handleToHistory">操作历史</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
name: 'main',
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
listData:[
|
|||
|
|
{circuitName:'1路电流：',current:'3.21A',typeName:'高压风冷：',isTypeOpen:false},
|
|||
|
|
{circuitName:'2路电流：',current:'3.21A',typeName:'中压风冷：',isTypeOpen:true},
|
|||
|
|
{circuitName:'3路电流：',current:'3.21A',typeName:'低压风冷：',isTypeOpen:false},
|
|||
|
|
{circuitName:'4路电流：',current:'3.21A',typeName:'闭锁调压：',isTypeOpen:true}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
//初始化
|
|||
|
|
apiready(){
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
//跳转到设置页面
|
|||
|
|
handleToSet(){
|
|||
|
|
api.openWin({
|
|||
|
|
name: 'set',
|
|||
|
|
url:'./main/set.stml'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//跳转到历史记录页
|
|||
|
|
handleToHistory(){
|
|||
|
|
api.openWin({
|
|||
|
|
name: 'history',
|
|||
|
|
url:'./main/history.stml'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
<style>
|
|||
|
|
.index_wrap{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 20px;
|
|||
|
|
background-image: url("../image/login.png");
|
|||
|
|
background-size: 120%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: center;
|
|||
|
|
}
|
|||
|
|
.index_title{
|
|||
|
|
width: 100%;
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 60px;
|
|||
|
|
color: #ffffff;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
.index_list{
|
|||
|
|
margin-top: 50px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.index_inline{
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
margin: 10px 0;
|
|||
|
|
}
|
|||
|
|
.inline_item{
|
|||
|
|
margin: 0 40px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.inline_item_text{
|
|||
|
|
font-size: 40px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #ffffff;
|
|||
|
|
margin: 0 10px;
|
|||
|
|
}
|
|||
|
|
.inline_item_circle_open{
|
|||
|
|
width: 40px;
|
|||
|
|
height: 40px;
|
|||
|
|
background-color: #09be30;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
margin: 0 10px;
|
|||
|
|
}
|
|||
|
|
.inline_item_circle_close{
|
|||
|
|
width: 40px;
|
|||
|
|
height: 40px;
|
|||
|
|
background-color: #fd0101;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
margin: 0 10px;
|
|||
|
|
}
|
|||
|
|
.index_footer{
|
|||
|
|
width: 80%;
|
|||
|
|
margin: 50px auto 0;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.footer_set{
|
|||
|
|
font-size: 40px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 10px 20px;
|
|||
|
|
color: #ffffff;
|
|||
|
|
}
|
|||
|
|
.footer_history{
|
|||
|
|
font-size: 40px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin-left: 50px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 10px 20px;
|
|||
|
|
color: #ffffff;
|
|||
|
|
}
|
|||
|
|
</style>
|