chenjinliang
/
disinfection_high_front_end
forked from maochaoying/disinfection_high_front_end
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

底部布局

master
maochaoying 2 years ago
parent
90b235e015
commit
e85b788509
2 changed files with 90 additions and 14 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/components/Operator.vue
  2. 102
      src/pages/Home.vue

2
src/components/Operator.vue
View File

@ -217,7 +217,7 @@ onUnmounted(() => {
<style lang="scss" scoped>
.operator_main_content {
margin-bottom: 30px;
margin-bottom: 19px;
height: 580px;
box-sizing: border-box;
display: flex;

102
src/pages/Home.vue
View File

@ -151,12 +151,52 @@
/>
<LiquidHandle v-if="activeTab == 2" :tabType="1" />
<LiquidHandle v-if="activeTab == 3" :tabType="2" />
<!-- <Test v-if="activeTab == 4" /> -->
<Test />
<Test v-if="activeTab == 4" />
<Setting v-if="activeTab == 5" />
<div class="other_info">
<p>IP {{ settingStore.deviceIp }}</p>
<p class="time">{{ nowTime }}</p>
<p class="ip">IP {{ settingStore.deviceIp }}</p>
<div class="time_wrap">
<div class="date_wrap">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
fill="none"
version="1.1"
width="23"
height="23"
viewBox="0 0 23 23"
>
<g>
<path
d="M0.0000112331,21.1495C0.0000111223,22.1715,0.82871,23,1.85096,23L21.149,23C22.1713,23,23,22.1715,23,21.1495L23,8.16307L0.0000112331,8.16307L0.0000112331,21.1495ZM15.6071,11.5028L17.25,11.5028C17.702,11.5051,18.0671,11.8721,18.0671,12.324C18.0671,12.7759,17.702,13.1428,17.25,13.1452L15.6071,13.1452C15.1552,13.1428,14.79,12.7759,14.79,12.324C14.79,11.8721,15.1552,11.5051,15.6071,11.5028ZM10.6786,11.5028L12.3214,11.5028C12.7734,11.5051,13.1385,11.8721,13.1385,12.324C13.1385,12.7759,12.7734,13.1428,12.3214,13.1452L10.6786,13.1452C10.2266,13.1428,9.86145,12.7759,9.86145,12.324C9.86145,11.8721,10.2266,11.5051,10.6786,11.5028ZM10.6786,16.4849L12.3214,16.4849C12.7734,16.4872,13.1386,16.8542,13.1386,17.3061C13.1386,17.758,12.7734,18.125,12.3214,18.1274L10.6786,18.1274C10.2266,18.125,9.86138,17.758,9.86138,17.3061C9.86138,16.8542,10.2266,16.4872,10.6786,16.4849ZM5.75003,11.5028L7.3929,11.5028C7.84487,11.5051,8.21001,11.8721,8.21001,12.324C8.21001,12.7759,7.84487,13.1428,7.3929,13.1452L5.75003,13.1452C5.29805,13.1428,4.93291,12.7759,4.93291,12.324C4.93291,11.8721,5.29805,11.5051,5.75003,11.5028ZM5.75003,16.4849L7.3929,16.4849C7.8449,16.4872,8.21009,16.8542,8.21009,17.3061C8.21009,17.758,7.8449,18.125,7.3929,18.1274L5.75003,18.1274C5.29803,18.125,4.93284,17.758,4.93284,17.3061C4.93284,16.8542,5.29803,16.4872,5.75003,16.4849ZM23,3.49847C23,2.47646,22.1713,1.64796,21.1491,1.64796L18.0714,1.64796L18.0714,0.925278C18.0714,0.414274,17.6571,0.0000222804,17.146,0.0000222804C16.6348,0.0000222804,16.2205,0.414273,16.2205,0.925278L16.2205,1.64796L6.77952,1.64796L6.77952,0.925278C6.77952,0.414274,6.36517,0.0000226113,5.85405,0.0000226113C5.34292,0.0000226113,4.92857,0.414274,4.92857,0.925278L4.92857,1.64796L1.85096,1.64796C0.82871,1.64796,0.0000112442,2.47646,0.0000112331,3.49847L0.0000112331,6.37826L23,6.37826L23,3.49847Z"
fill="#FFFFFF"
fill-opacity="1"
/>
</g>
</svg>
<p class="ml">{{ moment(nowTime).format('YYYY-MM-DD') }}</p>
</div>
<div class="min_wrap">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
fill="none"
version="1.1"
width="22"
height="22"
viewBox="0 0 22 22"
>
<g>
<path
d="M11,22C17.075,22,22,17.075,22,11C22,4.92497,17.075,0,11,0C4.92497,0,0,4.92497,0,11C0,17.075,4.92497,22,11,22ZM6.29173,14.5417L10.175,10.6582L10.175,6.05C10.175,5.59436,10.5444,5.225,11,5.225C11.4556,5.225,11.825,5.59436,11.825,6.05L11.825,11C11.825,11.2188,11.738,11.4286,11.5833,11.5833L7.45828,15.7083C7.13785,16.0401,6.60764,16.0447,6.28149,15.7185C5.95534,15.3924,5.95995,14.8622,6.29173,14.5417Z"
fill="#FFFFFF"
fill-opacity="1"
/>
</g>
</svg>
<p class="ml time_txt">{{ moment(nowTime).format('HH:mm:ss') }}</p>
</div>
</div>
<div class="log_out_btn style-btn" @click="handleLogout">
<svg
xmlns="http://www.w3.org/2000/svg"
@ -357,29 +397,65 @@ const handleLogout = () => {
justify-content: space-between;
align-items: center;
font-family: Source Han Sans CN;
font-size: 14px;
font-size: 20px;
font-weight: bold;
font-weight: normal;
height: 45px;
letter-spacing: 0.06em;
color: #ffffff;
padding: 0 30px;
padding: 0 10px;
position: relative;
box-sizing: border-box;
.time_wrap {
display: flex;
align-items: center;
margin-left: 30px;
.date_wrap {
display: flex;
align-items: center;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: bold;
line-height: normal;
letter-spacing: 0.06em;
color: #ffffff;
margin-left: 10px;
margin-right: 24px;
.ml {
margin-left: 10px;
}
}
.min_wrap {
margin-right: 10px;
display: flex;
align-items: center;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: bold;
line-height: normal;
letter-spacing: 0.06em;
color: #ffffff;
.ml {
margin-left: 10px;
}
.time_txt {
width: 94px;
}
}
}
.log_out_btn {
width: 123px;
width: 124px;
height: 45px;
border-radius: 23px;
display: flex;
align-items: center;
justify-content: center;
background: #064b81;
right: 276px;
top: -17px;
right: 370px;
top: 0px;
position: absolute;
z-index: 1;
}
.time {
width: 156px;
white-space: nowrap;
}
}
}
.wrapper {

Write Preview
Loading…
Cancel
Save