You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
576 lines
35 KiB
576 lines
35 KiB
<template>
|
|
<div class="home_container">
|
|
<div class="header_menu">
|
|
<div
|
|
:class="
|
|
activeTab == 1 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(1)"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="22"
|
|
height="20.533334732055664"
|
|
viewBox="0 0 22 20.533334732055664"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M18.4054,13.9071L19.2136,14.3737L19.5229,13.8378C19.5736,13.7502,19.6857,13.7201,19.7734,13.7707L20.4085,14.1374C20.4961,14.188,20.5262,14.3002,20.4756,14.3878L19.3068,16.4122C19.2562,16.4998,19.1441,16.5299,19.0564,16.4793L18.4213,16.1126C18.3336,16.062,18.3036,15.9498,18.3542,15.8622L18.6636,15.3263L17.8545,14.8593C17.2544,15.7529,16.4862,16.5211,15.5926,17.1212L16.4263,18.5653L16.9622,18.2559C17.0479,18.2064,17.1575,18.234,17.2097,18.3181L17.2126,18.323L17.5793,18.9581C17.6288,19.0439,17.6012,19.1535,17.5171,19.2056L17.5122,19.2086L15.4878,20.3773C15.4021,20.4268,15.2925,20.3993,15.2403,20.3151L15.2374,20.3102L14.8707,19.6751C14.8212,19.5894,14.8488,19.4798,14.9329,19.4276L14.9378,19.4247L15.4737,19.1153L14.6404,17.6721C13.6978,18.1364,12.6535,18.426,11.55,18.4986L11.55,19.4333L12.1688,19.4333C12.2678,19.4333,12.3489,19.512,12.352,19.6109L12.3521,19.6167L12.3521,20.35C12.3521,20.449,12.2735,20.5301,12.1745,20.5332L12.1688,20.5333L9.83125,20.5333C9.73223,20.5333,9.6511,20.4547,9.64801,20.3557L9.64792,20.35L9.64792,19.6167C9.64792,19.5176,9.72655,19.4365,9.82552,19.4334L9.83125,19.4333L10.45,19.4333L10.45,18.4986C9.34649,18.426,8.30225,18.1364,7.35957,17.6721L6.52632,19.1153L7.06216,19.4247C7.14984,19.4753,7.17989,19.5874,7.12926,19.6751L6.7626,20.3102C6.71197,20.3979,6.59985,20.4279,6.51216,20.3773L4.48784,19.2086C4.40016,19.1579,4.37012,19.0458,4.42074,18.9581L4.78741,18.323C4.83803,18.2354,4.95016,18.2053,5.03784,18.2559L5.57368,18.5653L6.40739,17.1212C5.5138,16.5211,4.74555,15.7529,4.14547,14.8593L3.33644,15.3263L3.64581,15.8622C3.69527,15.9478,3.66787,16.0573,3.58389,16.1095L3.57871,16.1126L2.94362,16.4793C2.85798,16.5287,2.74854,16.5013,2.69628,16.4174L2.69319,16.4122L1.52444,14.3878C1.47498,14.3022,1.50237,14.1928,1.58634,14.1405L1.59154,14.1374L2.22663,13.7707C2.31227,13.7213,2.42169,13.7487,2.47395,13.8326L2.47706,13.8378L2.78644,14.3737L3.5946,13.9071C3.13028,12.9644,2.84068,11.9202,2.76804,10.8167L1.1,10.8167L1.1,11.4354C1.1,11.5367,1.01792,11.6188,0.916667,11.6188L0.183333,11.6188C0.0820812,11.6188,0,11.5367,0,11.4354L0,9.09792C0,8.99667,0.0820812,8.91458,0.183333,8.91458L0.916667,8.91458C1.01792,8.91458,1.1,8.99667,1.1,9.09792L1.1,9.71667L2.76804,9.71667C2.84068,8.61316,3.13028,7.56892,3.59459,6.62624L2.78644,6.15966L2.47706,6.6955C2.42762,6.78116,2.31914,6.81215,2.2319,6.76555L2.22663,6.7626L1.59154,6.39593C1.50589,6.34649,1.4749,6.23802,1.52148,6.15079L1.52444,6.14552L2.69319,4.12117C2.74263,4.03553,2.8511,4.00453,2.93833,4.05112L2.9436,4.05407L3.57871,4.42074C3.66435,4.47019,3.69534,4.57865,3.64875,4.66588L3.64581,4.67115L3.33644,5.20701L4.14547,5.67405C4.74556,4.78047,5.51382,4.01221,6.40741,3.41213L5.5737,1.96802L5.03784,2.27739C4.95016,2.32801,4.83804,2.29797,4.78741,2.21029L4.42074,1.5752C4.37012,1.48752,4.40016,1.3754,4.48784,1.32477L6.51216,0.156018C6.59985,0.105394,6.71197,0.135435,6.7626,0.223118L7.12926,0.858208C7.17989,0.945892,7.14985,1.05801,7.06216,1.10864L6.52633,1.41802L7.35958,2.86126C8.30228,2.39695,9.3465,2.10735,10.45,2.0347L10.45,1.1L9.83125,1.1C9.73,1.1,9.64792,1.01792,9.64792,0.916667L9.64792,0.183333C9.64792,0.0820811,9.73,0,9.83125,0L12.1688,0C12.27,0,12.3521,0.0820811,12.3521,0.183333L12.3521,0.916667C12.3521,1.01792,12.27,1.1,12.1688,1.1L11.55,1.1L11.55,2.0347C12.6535,2.10735,13.6977,2.39695,14.6404,2.86126L15.4737,1.41802L14.9378,1.10864C14.8521,1.05913,14.8211,0.950466,14.8679,0.863203L14.8707,0.858207L15.2374,0.223117C15.2869,0.137357,15.3956,0.106411,15.4828,0.153221L15.4878,0.156017L17.5122,1.32477C17.5979,1.37428,17.6289,1.48294,17.5821,1.5702L17.5793,1.5752L17.2126,2.21029C17.1631,2.29605,17.0544,2.327,16.9672,2.28019L16.9622,2.27739L16.4263,1.96802L15.5926,3.41213C16.4862,4.01222,17.2545,4.78049,17.8545,5.67408L18.6636,5.20704L18.3542,4.67117C18.3036,4.58349,18.3336,4.47137,18.4213,4.42074L19.0564,4.05407C19.1441,4.00345,19.2562,4.03349,19.3068,4.12117L20.4756,6.14549C20.5262,6.23318,20.4961,6.3453,20.4085,6.39593L19.7734,6.7626C19.6857,6.81322,19.5736,6.78318,19.5229,6.6955L19.2136,6.15966L18.4054,6.62624C18.8697,7.56894,19.1593,8.61318,19.232,9.71667L20.9,9.71667L20.9,9.09792C20.9,8.9989,20.9786,8.91777,21.0776,8.91468L21.0833,8.91458L21.8167,8.91458C21.9157,8.91459,21.9968,8.99322,21.9999,9.09219L22,9.09792L22,11.4354C22,11.5344,21.9214,11.6156,21.8224,11.6187L21.8167,11.6188L21.0833,11.6188C20.9843,11.6188,20.9032,11.5401,20.9001,11.4411L20.9,11.4354L20.9,10.8167L19.232,10.8167C19.1593,11.9202,18.8697,12.9644,18.4054,13.9071ZM11,3.48333C7.25368,3.48333,4.21667,6.52034,4.21667,10.2667C4.21667,14.013,7.25368,17.05,11,17.05C14.7463,17.05,17.7833,14.013,17.7833,10.2667C17.7833,6.52034,14.7463,3.48333,11,3.48333ZM11,12.5813C11.6581,12.5813,12.1917,13.1148,12.1917,13.7729C12.1917,14.4311,11.6581,14.9646,11,14.9646C10.3419,14.9646,9.80834,14.4311,9.80834,13.7729C9.80834,13.1148,10.3419,12.5813,11,12.5813ZM7.8375,7.0125C8.59689,7.0125,9.2125,7.62811,9.2125,8.3875C9.2125,9.14689,8.59689,9.7625,7.8375,9.7625C7.07811,9.7625,6.4625,9.14689,6.4625,8.3875C6.4625,7.62811,7.07811,7.0125,7.8375,7.0125ZM14.2771,7.92917C14.7327,7.92917,15.1021,8.29854,15.1021,8.75417C15.1021,9.2098,14.7327,9.57917,14.2771,9.57917C13.8215,9.57917,13.4521,9.2098,13.4521,8.75417C13.4521,8.29854,13.8215,7.92917,14.2771,7.92917Z"
|
|
:fill="activeTab == 1 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">消毒</p>
|
|
</div>
|
|
<div
|
|
:class="
|
|
activeTab == 2 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(2)"
|
|
v-if="[0, 5].includes(operatorStore.disinfectStatus)"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="20"
|
|
height="20"
|
|
viewBox="0 0 20 20"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M10.0113,0Q12.0725,0,13.8958,0.782313Q15.7191,1.56463,17.0781,2.92517Q18.4371,4.28571,19.2186,6.11111Q20,7.93651,20,10Q20,12.0862,19.2186,13.9002Q18.4371,15.7143,17.0781,17.0748Q15.7191,18.4354,13.8958,19.2177Q12.0725,20,10.0113,20Q7.92752,20,6.10419,19.2177Q4.28086,18.4354,2.92186,17.0748Q1.56285,15.7143,0.781427,13.9002Q-2.53134e-7,12.0862,0,10Q0,7.93651,0.781427,6.11111Q1.56285,4.28571,2.92186,2.92517Q4.28086,1.56463,6.10419,0.782313Q7.92752,-5.91316e-7,10.0113,0ZM15.7191,11.3832Q16.308,11.3832,16.7157,10.9637Q17.1234,10.5442,17.1234,9.95465Q17.1234,9.36508,16.7157,8.95692Q16.308,8.54875,15.7191,8.54875L11.4609,8.54875L11.4609,4.28571Q11.4609,3.69615,11.0419,3.27664Q10.6229,2.85714,10.034,2.85714Q9.44507,2.85714,9.03737,3.27664Q8.62967,3.69615,8.62967,4.28571L8.62967,8.54875L4.37146,8.54875Q3.78256,8.54875,3.37486,8.95692Q2.96716,9.36508,2.96716,9.95465Q2.96716,10.5442,3.37486,10.9637Q3.78256,11.3832,4.37146,11.3832L8.62967,11.3832L8.62967,15.6236Q8.62967,16.2132,9.03737,16.6327Q9.44507,17.0522,10.034,17.0522Q10.6229,17.0522,11.0419,16.6327Q11.4609,16.2132,11.4609,15.6236L11.4609,11.3832L15.7191,11.3832Z"
|
|
:fill="activeTab == 2 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">加液</p>
|
|
</div>
|
|
<div
|
|
:class="
|
|
activeTab == 3 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(3)"
|
|
v-if="[0, 5].includes(operatorStore.disinfectStatus)"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="20"
|
|
height="20"
|
|
viewBox="0 0 20 20"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M9.98885,0Q12.0624,0,13.8907,0.791527Q15.7191,1.58305,17.068,2.932Q18.4169,4.28094,19.2085,6.0981Q20,7.91527,20,9.98885Q20,12.0624,19.2085,13.8907Q18.4169,15.7191,17.068,17.068Q15.7191,18.4169,13.8907,19.2085Q12.0624,20,9.98885,20Q7.91527,20,6.0981,19.2085Q4.28094,18.4169,2.932,17.068Q1.58305,15.7191,0.791527,13.8907Q0.00000290714,12.0624,0,9.98885Q-0.00000290714,7.91527,0.791527,6.0981Q1.58306,4.28094,2.932,2.932Q4.28093,1.58305,6.0981,0.791528Q7.91528,0.00000332244,9.98885,0ZM14.961,11.3489Q15.6299,11.3489,16.165,11.0033Q16.7001,10.6577,16.7001,9.96655Q16.7001,9.29766,16.165,8.97436Q15.6299,8.65106,14.961,8.65106L5.10591,8.65106Q4.43701,8.65106,3.8796,8.97436Q3.32218,9.29766,3.32218,9.96655Q3.32218,10.6577,3.8796,11.0033Q4.43701,11.3489,5.10591,11.3489L14.961,11.3489Z"
|
|
:fill="activeTab == 3 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">排液</p>
|
|
</div>
|
|
<!-- <div
|
|
:class="
|
|
activeTab == 7 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(7)"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="17.38603401184082"
|
|
height="21.000097274780273"
|
|
viewBox="0 0 17.38603401184082 21.000097274780273"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M1.90264,0L15.5198,0C16.5493,0,17.386,0.836719,17.386,1.86621L17.386,14.8661C17.386,15.2086,17.1071,15.4875,16.7646,15.4875C16.4222,15.4875,16.1433,15.2086,16.1433,14.8661L16.1433,1.86416C16.1433,1.52168,15.8644,1.24277,15.5219,1.24277L1.90264,1.24277C1.56016,1.24277,1.28125,0.963867,1.28125,0.621387C1.28125,0.278906,1.56016,0,1.90264,0ZM15.4444,16.7796L15.4444,3.68945C15.4444,2.65996,14.6077,1.82324,13.5782,1.82324L1.86621,1.82324C0.836719,1.82324,0,2.65996,0,3.68945L0,19.1339C0,20.1634,0.836719,21.0001,1.86621,21.0001L10.8773,21.0001L15.4444,16.7796ZM9.63457,19.7553L1.86621,19.7553C1.52373,19.7553,1.24482,19.4764,1.24482,19.1339L1.24482,3.68945C1.24482,3.34697,1.52373,3.06807,1.86621,3.06807L13.5803,3.06807C13.9228,3.06807,14.2017,3.34697,14.2017,3.68945L14.2017,15.5184L11.5254,15.4814C11.0229,15.4732,10.5472,15.666,10.1903,16.0187C9.83145,16.3715,9.63457,16.8432,9.63457,17.3477L9.63457,19.7553ZM11.532,12.1097C11.7781,12.4337,11.7474,12.8931,11.4603,13.1802L10.7363,13.9041C10.4349,14.2056,9.96318,14.2261,9.63711,13.9533L8.98086,13.4058L8.87832,14.1707C8.82295,14.5727,8.47637,14.8762,8.07031,14.8762L7.04697,14.8762C6.62041,14.8762,6.27178,14.5562,6.23486,14.1338L6.15898,13.2827L5.5458,13.7503C5.22178,13.9964,4.7624,13.9656,4.47529,13.6785L3.75137,12.9546C3.4499,12.6531,3.42939,12.1814,3.70215,11.8554L4.24971,11.1991L3.48477,11.0966C3.08281,11.0412,2.7793,10.6946,2.7793,10.2886L2.7793,9.26523C2.7793,8.83867,3.09922,8.49004,3.52168,8.45312L4.37275,8.37724L3.90518,7.76406C3.65908,7.44004,3.68984,6.98066,3.97695,6.69355L4.70088,5.96963C5.00234,5.66816,5.47402,5.64766,5.8001,5.92041L6.45635,6.46797L6.55889,5.70303C6.61426,5.30107,6.96084,4.99756,7.36689,4.99756L8.39023,4.99756C8.8168,4.99756,9.16543,5.31748,9.20234,5.73994L9.27822,6.59102L9.89141,6.12344C10.2154,5.87734,10.6748,5.90811,10.9619,6.19522L11.6858,6.91914C11.9873,7.22061,12.0078,7.69229,11.7351,8.01836L11.1875,8.67461L11.9524,8.77715C12.3544,8.83252,12.6579,9.1791,12.6579,9.58516L12.6579,10.6085C12.6579,11.0351,12.338,11.3837,11.9155,11.4206L11.0645,11.4965L11.532,12.1097ZM10.3139,12.5649L9.76836,11.8492C9.57559,11.597,9.54688,11.2545,9.69863,10.9776C9.72734,10.9202,9.75605,10.8607,9.78066,10.8013C9.89756,10.5203,10.158,10.3296,10.4595,10.3029L11.4172,10.2168L11.4172,9.9625L10.523,9.84355C10.2113,9.80254,9.94883,9.579,9.85449,9.27754C9.83604,9.21601,9.81348,9.15449,9.78887,9.09502C9.67197,8.81406,9.72119,8.49414,9.91602,8.2624L10.5313,7.52617L10.3508,7.3457L9.63506,7.89121C9.38281,8.08398,9.03828,8.1127,8.75938,7.96504C8.70195,7.93428,8.64248,7.90557,8.58301,7.88096C8.30205,7.76406,8.11133,7.50361,8.08467,7.20215L7.99854,6.24443L7.74424,6.24443L7.62529,7.13857C7.58428,7.45029,7.36074,7.71279,7.05928,7.80713C6.99775,7.82559,6.93623,7.84814,6.87676,7.87275C6.5958,7.9876,6.27588,7.93838,6.04414,7.74356L5.30791,7.12832L5.12744,7.30879L5.67295,8.02451C5.86572,8.27471,5.89443,8.61924,5.74678,8.89814C5.71602,8.95557,5.68731,9.01504,5.6627,9.07451C5.5458,9.35547,5.28535,9.54619,4.98389,9.57285L4.02617,9.65899L4.02617,9.91328L4.92031,10.0322C5.23203,10.0732,5.49453,10.2968,5.58887,10.5982C5.60733,10.6598,5.62988,10.7213,5.65449,10.7808C5.77139,11.0617,5.72217,11.3816,5.52734,11.6134L4.91211,12.3496L5.09258,12.5301L5.8083,11.9846C6.0585,11.7918,6.40303,11.7631,6.68193,11.9107C6.73936,11.9415,6.79883,11.9702,6.8583,11.9948C7.13926,12.1117,7.32998,12.3722,7.35664,12.6736L7.44277,13.6313L7.69707,13.6313L7.81602,12.7372C7.85703,12.4255,8.08057,12.163,8.38203,12.0687C8.44355,12.0502,8.50508,12.0276,8.56455,12.003C8.84551,11.8861,9.16543,11.9354,9.39717,12.1302L10.1334,12.7454L10.3139,12.5649ZM5.8584,9.93789C5.8584,8.91045,6.69512,8.07373,7.72256,8.07373C8.75,8.07373,9.58672,8.91045,9.58672,9.93789C9.58672,10.9653,8.75,11.8021,7.72256,11.8021C6.69512,11.8021,5.8584,10.9653,5.8584,9.93789ZM7.10322,9.93789C7.10322,10.2783,7.38008,10.5572,7.72256,10.5572C8.06299,10.5572,8.34189,10.2804,8.34189,9.93789C8.34189,9.59746,8.06504,9.31855,7.72256,9.31855C7.38213,9.31855,7.10322,9.59541,7.10322,9.93789ZM10.8773,19.2754L10.8773,17.3477C10.8773,17.1795,10.943,17.0236,11.0619,16.9047C11.1809,16.7857,11.3388,16.7222,11.5069,16.7263L13.6069,16.755L10.8773,19.2754Z"
|
|
fill-rule="evenodd"
|
|
:fill="activeTab == 7 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">配方管理</p>
|
|
</div> -->
|
|
<div
|
|
:class="
|
|
activeTab == 4 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(4)"
|
|
v-if="
|
|
userStore.loginUserPermission != 3 &&
|
|
[0, 5].includes(operatorStore.disinfectStatus)
|
|
"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="20.125"
|
|
height="20.125"
|
|
viewBox="0 0 20.125 20.125"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M12.1038,9.50762C12.2878,10.2034,12.1081,10.9753,11.5618,11.5201C10.7467,12.3352,9.42425,12.3352,8.60919,11.5201C7.79413,10.7051,7.79413,9.38256,8.60919,8.5675C9.19856,7.97813,10.0539,7.81569,10.7913,8.07875L18.3669,1.19888C18.768,0.79925,19.274,0.656938,19.4307,0.812188C19.6233,1.00481,19.4436,1.47488,19.044,1.8745L12.1038,9.50762ZM10.0625,2.51562C5.89519,2.51562,2.51562,5.89519,2.51562,10.0625C2.51562,14.2298,5.89519,17.6094,10.0625,17.6094C14.2298,17.6094,17.6094,14.2298,17.6094,10.0625C17.6094,9.07206,17.4067,8.13194,17.0603,7.26513L18.8888,5.22819C19.6751,6.66425,20.125,8.31019,20.125,10.0625C20.125,15.6199,15.6199,20.125,10.0625,20.125C4.50513,20.125,0,15.6199,0,10.0625C0,4.50513,4.50513,0,10.0625,0C11.8623,0,13.5484,0.478687,15.0089,1.30669L13.0309,3.12656C12.1196,2.73556,11.1176,2.51562,10.0625,2.51562Z"
|
|
:fill="activeTab == 4 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">测试</p>
|
|
</div>
|
|
<div
|
|
:class="
|
|
activeTab == 5 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(5)"
|
|
v-if="
|
|
userStore.loginUserPermission != 3 &&
|
|
[0, 5].includes(operatorStore.disinfectStatus)
|
|
"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="20"
|
|
height="19.999309539794922"
|
|
viewBox="0 0 20 19.999309539794922"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M8.23213,0L7.81352,2.1951C7.2095,2.36438,6.62789,2.60276,6.07979,2.90611L4.29364,1.56408L1.67856,4.17917L2.93507,6.02807C2.62819,6.57288,2.38543,7.15217,2.21165,7.7549L0,8.07007L0,11.7679L2.19579,12.1865C2.36437,12.7898,2.60276,13.3714,2.90611,13.9195L1.56408,15.7057L4.17917,18.3207L6.02876,17.0642C6.57431,17.3717,7.15383,17.6144,7.75559,17.7877L8.07076,19.9993L11.7686,19.9993L12.1872,17.8035C12.792,17.6353,13.3726,17.3966,13.9202,17.0932L15.7064,18.4352L18.3214,15.8201L17.0649,13.9712C17.3723,13.4257,17.6151,12.8462,17.7884,12.2444L20,11.9292L20,8.23144L17.8042,7.81283C17.6359,7.20803,17.3973,6.62736,17.0939,6.07979L18.4359,4.29364L15.8208,1.67856L13.9719,2.93507C13.4271,2.62819,12.8485,2.38543,12.2451,2.21165L11.9299,0L8.23213,0ZM8.99969,3.33368L9.37209,1.37926L10.7327,1.37857L11.0107,3.33368L11.4762,3.43712C12.2384,3.60803,12.9648,3.91123,13.6223,4.33295L14.005,4.57846L15.6519,3.45988L16.6139,4.42192L15.4277,6.00117L15.6829,6.40392C16.1015,7.06339,16.4012,7.79117,16.5684,8.55419L16.6656,8.999L18.62,9.37209L18.62,10.7327L16.6649,11.0107L16.5615,11.4762C16.3906,12.2384,16.0874,12.9648,15.6657,13.6223L15.4202,14.005L16.5387,15.6519L15.5767,16.6139L13.9974,15.4277L13.5947,15.6829C12.9352,16.1015,12.2074,16.4012,11.4444,16.5684L10.9996,16.6656L10.6265,18.62L9.26658,18.62L8.98866,16.6649L8.52315,16.5615C7.76091,16.3906,7.03453,16.0874,6.37702,15.6657L5.99428,15.4202L4.34744,16.5387L3.3854,15.5767L4.57157,13.9974L4.3164,13.5947C3.8978,12.9352,3.5981,12.2074,3.43092,11.4444L3.33368,10.9996L1.37926,10.6265L1.37926,9.26658L3.33437,8.98865L3.43781,8.52315C3.60866,7.76091,3.91187,7.03453,4.33364,6.37702L4.57915,5.99428L3.46057,4.34744L4.42261,3.3854L6.00186,4.57157L6.40461,4.3164C7.06402,3.89769,7.79183,3.59797,8.55488,3.43092L8.99969,3.33368ZM5.86187,9.99965C5.86187,12.2849,7.71442,14.1374,9.99965,14.1374C12.2849,14.1374,14.1374,12.2849,14.1374,9.99965C14.1374,7.71442,12.2849,5.86187,9.99965,5.86187C7.71442,5.86187,5.86187,7.71442,5.86187,9.99965ZM12.7582,9.99965C12.7582,11.5231,11.5231,12.7582,9.99965,12.7582C8.47616,12.7582,7.24113,11.5231,7.24113,9.99965C7.24113,8.47616,8.47616,7.24113,9.99965,7.24113C11.5231,7.24113,12.7582,8.47616,12.7582,9.99965Z"
|
|
fill-rule="evenodd"
|
|
:fill="activeTab == 5 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">设置</p>
|
|
</div>
|
|
<!-- <div
|
|
v-if="
|
|
userStore.loginUserPermission != 3 &&
|
|
[0, 5].includes(operatorStore.disinfectStatus)
|
|
"
|
|
:class="
|
|
activeTab == 6 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
|
|
"
|
|
@click="changeTab(6)"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="18.375"
|
|
height="19.25"
|
|
viewBox="0 0 18.375 19.25"
|
|
>
|
|
<g>
|
|
<path
|
|
d="M15.75,0C17.1997,7.82311e-8,18.375,1.17525,18.375,2.625L18.375,16.625C18.375,18.0747,17.1997,19.25,15.75,19.25L4.375,19.25C3.09406,19.2498,2.00016,18.3255,1.78631,17.0625L2.84375,17.0625C3.91298,17.0625,4.78675,16.2091,4.81194,15.1401C4.83714,14.0712,4.00455,13.1776,2.9365,13.1272L2.84375,13.125L1.75,13.125L1.75,11.5937L2.84375,11.5937C3.895,11.5937,4.76079,10.7678,4.81031,9.71775L4.8125,9.625C4.8125,8.57375,3.98658,7.70796,2.9365,7.65844L2.84375,7.65625L1.75,7.65625L1.75,6.125L2.84375,6.125C3.895,6.125,4.76079,5.29908,4.81031,4.249L4.8125,4.15625C4.8125,3.105,3.98658,2.23921,2.9365,2.18969L2.84375,2.1875L1.78631,2.1875C2.00035,0.924371,3.09425,1.56462e-7,4.375,0L15.75,0ZM2.84375,14.4375C3.20619,14.4375,3.5,14.7313,3.5,15.0937C3.5,15.4562,3.20619,15.75,2.84375,15.75L0.65625,15.75C0.293813,15.75,0,15.4562,0,15.0937C0,14.7313,0.293813,14.4375,0.65625,14.4375L2.84375,14.4375ZM15.2687,5.29375C14.7562,4.78108,13.925,4.78108,13.4124,5.29375L7.12469,11.5824C6.98921,11.7178,6.90191,11.8939,6.87619,12.0837L6.699,13.3927C6.65986,13.6818,6.90927,13.9275,7.19775,13.8841L8.48706,13.6898C8.6721,13.6621,8.84338,13.5757,8.97575,13.4435L15.2683,7.1505C15.7807,6.63797,15.7807,5.80716,15.2683,5.29462L15.2687,5.29375ZM2.84375,8.96875C3.20619,8.96875,3.5,9.26256,3.5,9.625C3.5,9.98744,3.20619,10.2812,2.84375,10.2812L0.65625,10.2812C0.293813,10.2812,0,9.98744,0,9.625C0,9.26256,0.293813,8.96875,0.65625,8.96875L2.84375,8.96875ZM2.84375,3.5C3.20619,3.5,3.5,3.79381,3.5,4.15625C3.5,4.51869,3.20619,4.8125,2.84375,4.8125L0.65625,4.8125C0.293813,4.8125,0,4.51869,0,4.15625C0,3.79381,0.293813,3.5,0.65625,3.5L2.84375,3.5Z"
|
|
:fill="activeTab == 6 ? '#FFFFFF' : '#3D3D3D'"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
<p class="text">审计</p>
|
|
</div> -->
|
|
</div>
|
|
<Operator
|
|
v-if="activeTab == 1 && showOpertor"
|
|
:changeShowOperator="changeShowOperator"
|
|
:handleShowKeyBoard="handleShowKeyBoard"
|
|
:hideKeyBoard="hideKeyBoard"
|
|
:input="input"
|
|
/>
|
|
<Progress
|
|
v-if="activeTab == 1 && !showOpertor"
|
|
:changeShowOperator="changeShowOperator"
|
|
/>
|
|
<LiquidHandle v-if="activeTab == 2" :tabType="1" />
|
|
<LiquidHandle v-if="activeTab == 3" :tabType="2" />
|
|
<Test v-if="activeTab == 4" />
|
|
<Setting
|
|
v-if="activeTab == 5 && [0, 5].includes(operatorStore.disinfectStatus)"
|
|
/>
|
|
<!-- <DisinfectionSetting
|
|
v-if="
|
|
activeTab == 5 && [1, 2, 3, 4].includes(operatorStore.disinfectStatus)
|
|
"
|
|
/> -->
|
|
<Audit v-if="activeTab == 6" />
|
|
<Formula v-if="activeTab == 7" />
|
|
<div class="other_info">
|
|
<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"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
fill="none"
|
|
version="1.1"
|
|
width="76"
|
|
height="29"
|
|
viewBox="0 0 76 29"
|
|
>
|
|
<g>
|
|
<g>
|
|
<path
|
|
d="M34.9,7.65437C36.22,8.27594,37.86,9.23781,38.7,9.89937L39.480000000000004,8.77687C38.62,8.15563,36.92,7.25375,35.66,6.6725L34.9,7.65437ZM33.86,13.18C35.12,13.78,36.74,14.72,37.54,15.36L38.3,14.24C37.46,13.62,35.84,12.74,34.6,12.18L33.86,13.18ZM34.46,23.64L35.58,24.5628C36.76,22.7,38.18,20.16,39.24,18.04L38.28,17.16C37.12,19.44,35.54,22.1,34.46,23.64ZM43.96,6.81281C44.66,7.875,45.38,9.27812,45.68,10.18L46.96,9.63875C46.66,8.75687,45.88,7.39406,45.18,6.37187L43.96,6.81281ZM39.62,10.28L39.62,11.56L44.96,11.56L44.96,16.24L40.38,16.24L40.38,17.52L44.96,17.52L44.96,22.88L38.980000000000004,22.88L38.980000000000004,24.16L52.2,24.16L52.2,22.88L46.34,22.88L46.34,17.52L51,17.52L51,16.24L46.34,16.24L46.34,11.56L51.72,11.56L51.72,10.28L39.62,10.28ZM64.2,7.65625C65,8.84,65.82,10.4,66.16,11.38L67.28,10.8C66.94,9.8,66.06,8.29844,65.25999999999999,7.155L64.2,7.65625ZM73.24000000000001,7.03437C72.72,8.19812,71.78,9.84,71.08,10.84L72.1,11.32C72.82,10.36,73.72,8.86,74.42,7.57625L73.24000000000001,7.03437ZM59,6.51281C58.42,8.35844,57.4,10.14,56.22,11.34C56.44,11.62,56.8,12.26,56.9,12.54C57.519999999999996,11.88,58.120000000000005,11.06,58.66,10.16L63.58,10.16L63.58,8.9L59.34,8.9C59.66,8.23812,59.94,7.53594,60.18,6.85406L59,6.51281ZM56.68,16.4L56.68,17.64L59.6,17.64L59.6,21.7653C59.6,22.6262,59,23.1672,58.66,23.3672C58.879999999999995,23.6478,59.22,24.1884,59.32,24.5087C59.620000000000005,24.1884,60.120000000000005,23.8678,63.44,21.9856C63.34,21.7053,63.22,21.2047,63.18,20.8441L60.84,22.0856L60.84,17.64L63.7,17.64L63.7,16.4L60.84,16.4L60.84,13.56L63.239999999999995,13.56L63.239999999999995,12.34L57.519999999999996,12.34L57.519999999999996,13.56L59.6,13.56L59.6,16.4L56.68,16.4ZM65.7,16.88L72.62,16.88L72.62,19.18L65.7,19.18L65.7,16.88ZM65.7,15.7L65.7,13.44L72.62,13.44L72.62,15.7L65.7,15.7ZM68.6,6.43125L68.6,12.2L64.48,12.2L64.48,24.7819L65.7,24.7819L65.7,20.34L72.62,20.34L72.62,23.02C72.62,23.3,72.5,23.38,72.22,23.38C71.92,23.4,70.9,23.4,69.72,23.38C69.92,23.72,70.1,24.26,70.16,24.6C71.7,24.6,72.62,24.6,73.14,24.36C73.68,24.16,73.84,23.76,73.84,23.04L73.84,12.18L72.62,12.2L69.86,12.2L69.86,6.43125L68.6,6.43125Z"
|
|
fill="#FFFFFF"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
<g>
|
|
<path
|
|
d="M12.8863,21.99L12.8863,24.6672C12.8863,24.6954,12.888,24.7,12.911,24.7L2.21645,24.7C2.23942,24.6994,2.2411,24.696,2.2411,24.6672L2.2411,6.33278C2.2411,6.304600000000001,2.23942,6.3,2.21645,6.3L12.911,6.3C12.888,6.30058,12.8863,6.30403,12.8863,6.33278L12.8863,11.778030000000001C12.8857,12.41359,13.3876,12.92915,14.0069,12.92915C14.6262,12.92915,15.128,12.41359,15.1274,11.778030000000001L15.1274,6.33278C15.1274,5.06203,14.1637,4,12.9328,4L2.1946,4C0.963674,4,0,5.06203,0,6.33278L0,24.6672C0,25.938,0.963674,27,2.1946,27L12.9328,27C14.1637,27,15.1274,25.938,15.1274,24.6672L15.1274,21.99C15.1274,21.3549,14.6257,20.84,14.0069,20.84C13.388,20.84,12.8863,21.3549,12.8863,21.99ZM21.6038,15.8428L18.8306,12.99639Q18.4344,12.5898,18.0383,12.5898Q17.6421,12.58981,17.2459,12.99639Q16.4536,13.80956,17.2459,14.6227L18.1007,15.5L9.52474,15.5Q8.40419,15.5,8.40419,16.65Q8.40419,17.8,9.52474,17.8L18.112,17.8L17.2459,18.6889Q16.4536,19.5021,17.2459,20.3152Q17.6421,20.7218,18.0383,20.7218Q18.4344,20.7218,18.8306,20.3152L21.6038,17.469099999999997Q22,17.0625,22,16.655900000000003Q22,16.249299999999998,21.6038,15.8428Z"
|
|
fill-rule="evenodd"
|
|
fill="#FFFFFF"
|
|
fill-opacity="1"
|
|
/>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<!-- <van-overlay :show="settingStore.initLoading">
|
|
<div class="wrapper" @click.stop>
|
|
<div class="block">
|
|
<van-loading />
|
|
<p class="shutdown_text">初始化系统参数...</p>
|
|
</div>
|
|
</div>
|
|
</van-overlay> -->
|
|
<div class="key_wrap" v-if="showkeyboard">
|
|
<SimpleKeyboard
|
|
:hideKeyBoard="hideKeyBoard"
|
|
@onChange="onChange"
|
|
:input="input"
|
|
/>
|
|
</div>
|
|
<LoginModal v-if="loginModalVisible" :hideLoginModal="hideLoginModal" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
|
import LoginModal from 'cpns/dialogs/LoginModal'
|
|
import SimpleKeyboard from 'cpns/SimpleKeyboard'
|
|
import moment from 'moment'
|
|
import Formula from 'cpns/Formula'
|
|
import Operator from 'cpns/Operator'
|
|
import Audit from 'cpns/Audit'
|
|
import DisinfectionSetting from 'cpns/DisinfectionSetting'
|
|
import Progress from 'cpns/Progress'
|
|
import LiquidHandle from 'cpns/LiquidHandle'
|
|
import Setting from 'cpns/Setting'
|
|
import Test from 'cpns/Test'
|
|
import { storeToRefs } from 'pinia'
|
|
import {
|
|
useOperatorStore,
|
|
useWebSocketStore,
|
|
useSettingStore,
|
|
useUserStore,
|
|
} from '@/store'
|
|
import { logoutJSON, getStateJSON, getAllSettingJSON } from '@/mock/command'
|
|
|
|
import { useRouter } from 'vue-router'
|
|
|
|
const router = useRouter()
|
|
const webSocketStore = useWebSocketStore()
|
|
const settingStore = useSettingStore()
|
|
const userStore = useUserStore()
|
|
const { socketCommandInstance } = storeToRefs(webSocketStore)
|
|
webSocketStore.initCommandSocket()
|
|
webSocketStore.initEventSocket()
|
|
|
|
const loginModalVisible = ref(false)
|
|
|
|
const hideLoginModal = () => {
|
|
loginModalVisible.value = false
|
|
}
|
|
|
|
const showkeyboard = ref(false)
|
|
|
|
const handleShowKeyBoard = () => {
|
|
showkeyboard.value = true
|
|
}
|
|
|
|
const hideKeyBoard = () => {
|
|
showkeyboard.value = false
|
|
}
|
|
|
|
const showOpertor = ref(true)
|
|
|
|
const operatorStore = useOperatorStore()
|
|
const activeTab = ref(1)
|
|
const nowTime = ref('')
|
|
const timer = ref(null)
|
|
|
|
const changeShowOperator = flag => {
|
|
showOpertor.value = flag
|
|
}
|
|
|
|
const input = ref('0')
|
|
const onChange = a => {
|
|
input.value = a
|
|
}
|
|
|
|
const changeTab = index => {
|
|
if (index == 5) {
|
|
// 判断是否为管理员登陆 如果为管理员直接显示，
|
|
if (userStore.loginUserPermission == 3) {
|
|
// 非管理员
|
|
// 如果不为管理员 则弹出登陆框
|
|
loginModalVisible.value = true
|
|
return
|
|
}
|
|
}
|
|
activeTab.value = index
|
|
if ([4, 5].includes(index)) {
|
|
// getAllSetting
|
|
webSocketStore.sendCommandMsg(getAllSettingJSON)
|
|
}
|
|
}
|
|
|
|
const getdateTime = () => {
|
|
nowTime.value = moment().utcOffset(8).format('YYYY-MM-DD HH:mm:ss')
|
|
}
|
|
|
|
onMounted(() => {
|
|
getdateTime()
|
|
timer.value = setInterval(() => {
|
|
getdateTime()
|
|
}, 1000)
|
|
setTimeout(() => {
|
|
webSocketStore.sendCommandMsg(getStateJSON)
|
|
webSocketStore.sendCommandMsg(getAllSettingJSON)
|
|
}, 1000)
|
|
document.addEventListener('click', e => {
|
|
let box = document.getElementById('keyboard')
|
|
let room = document.getElementById('room_size')
|
|
if (!box?.contains(e.target) && e.target != room) {
|
|
hideKeyBoard()
|
|
}
|
|
})
|
|
})
|
|
|
|
onBeforeUnmount(() => {
|
|
timer.value = null
|
|
})
|
|
|
|
const handleLogout = () => {
|
|
webSocketStore?.sendCommandMsg(logoutJSON)
|
|
window.location.href = 'http://127.0.0.1/#/login'
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.home_container {
|
|
background: $theme-color;
|
|
width: 1280px;
|
|
height: 800px;
|
|
box-sizing: border-box;
|
|
padding: 30px;
|
|
.key_wrap {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
height: 230px;
|
|
}
|
|
.header_menu {
|
|
width: 100%;
|
|
height: 80px;
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
padding: 11px;
|
|
border-radius: 40px;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 19px;
|
|
.tab_btn {
|
|
width: 171px;
|
|
height: 58px;
|
|
border-radius: 29px;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 20px;
|
|
font-weight: 350;
|
|
letter-spacing: 0.12em;
|
|
color: #3d3d3d;
|
|
.text {
|
|
margin-left: 9px;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
.active_btn {
|
|
background: linear-gradient(
|
|
90deg,
|
|
#06518b 0%,
|
|
rgba(6, 81, 139, 0.7) 100%
|
|
);
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
.other_info {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
font-weight: normal;
|
|
height: 45px;
|
|
letter-spacing: 0.06em;
|
|
color: #ffffff;
|
|
padding: 0 10px;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
.ip {
|
|
font-family: Source Han Sans CN;
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
line-height: normal;
|
|
letter-spacing: 0.06em;
|
|
color: #ffffff;
|
|
}
|
|
.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: 124px;
|
|
height: 45px;
|
|
border-radius: 23px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #064b81;
|
|
right: 370px;
|
|
top: 0px;
|
|
position: absolute;
|
|
z-index: 1;
|
|
}
|
|
}
|
|
}
|
|
.wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
}
|
|
.block {
|
|
width: 220px;
|
|
height: 220px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 16px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.shutdown_text {
|
|
margin-top: 24px;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
letter-spacing: 0.06em;
|
|
color: #fff;
|
|
}
|
|
}
|
|
</style>
|