root/aio-hl-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式

Browse Source
This commit is contained in:
caill
2023-05-19 13:51:43 +08:00
parent da23c161bb
commit abef67aa55
8 changed files with 287 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
src/pages/homeset/Home.vue
View File

@@ -1,5 +1,5 @@
<template>
<div>
<div class="home-wraper">
<section class="content">
<div class="device-status">
<p><span class="icon white"></span><span class="txt">关机</span></p>
@@ -8,21 +8,23 @@
<p><span class="icon yellow"></span><span class="txt">待机</span></p>
<p><span class="icon red"></span><span class="txt">故障</span></p>
</div>
<div class="list-box">
<div class="device" v-for="e in dataList" :key="e.device_code" :class="{bg1:e.is_run=='1',bg2:e.is_run=='0'}" @click="toOperation(e)"
>
<div class="device-top">
<div class="img">
<img v-if="e.device_icon !== ''" :src="e.device_icon" alt="">
<img v-else src="../../images/1.png" alt="">
<div class="list-box-wraper">
<div class="list-box">
<div class="device" v-for="e in dataList" :key="e.device_code" :class="{bg1:e.is_run=='1',bg2:e.is_run=='0'}" @click="toOperation(e)"
>
<div class="device-top">
<div class="img">
<img v-if="e.device_icon !== ''" :src="e.device_icon" alt="">
<img v-else src="../../images/1.png" alt="">
</div>
</div>
<div class="fl icon" :class="['white', 'blue', 'green', 'yellow', 'red'][Number(e.device_status) - 1]">
</div>
<div class="fl desc">
<p class="device_name">{{e.deviceName}}</p>
<p class="ellipsis">工单数: {{e.job_count}}</p>
<p class="ellipsis">当前工单: {{e.workorderCode}}</p>
</div>
</div>
<div class="fl icon" :class="['white', 'blue', 'green', 'yellow', 'red'][Number(e.device_status) - 1]">
</div>
<div class="fl desc">
<p class="device_name">{{e.deviceName}}</p>
<p class="ellipsis">工单数: {{e.job_count}}</p>
<p class="ellipsis">当前工单: {{e.workorderCode}}</p>
</div>
</div>
</div>
@@ -96,39 +98,49 @@ export default {
.bg2
background rgba(0,0,0,0.50)
border 1px solid #7B7B7B
.home-wraper
width 100%
height calc(100% - 46px)
.content
clear both
box-sizing border-box
// height 5rem
width 7.9rem
width 100%
height 100%
padding 15px
.device-status
text-align right
font-size .18rem
padding .1rem 0 0 .1rem
display flex
justify-content flex-end
height 32px
margin-bottom 15px
p
display inline-block
text-align left
display flex
justify-content flex-start
align-items center
margin-left 5px
.icon
display inline-block
width .2rem
height .2rem
border-radius .1rem
margin-top .08rem
width 14px
height 14px
border-radius 50%
line-height 32px
margin-right 5px
.txt
display inline-block
line-height .4rem
margin-left .11rem
line-height 32px
font-size 14px
float right
color #fff
.list-box-wraper
height calc(100% - 47px)
overflow-y auto
.list-box
padding-bottom .2rem
// height 4.6rem
// overflow-y scroll
width 100%
.device
display inline-block
width 1.75rem
margin 0 0 .15rem .19rem
overflow hidden
background #1e307e
.device-top
box-sizing border-box
height 1rem