拉杆箱消毒机
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.

669 lines
43 KiB

2 years ago
1 year ago
2 years ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
1 year ago
2 years ago
1 year ago
2 years ago
2 years ago
  1. <template>
  2. <div class="home_container">
  3. <div class="header_menu">
  4. <div
  5. :class="
  6. activeTab == 1 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  7. "
  8. @click="changeTab(1)"
  9. >
  10. <svg
  11. xmlns="http://www.w3.org/2000/svg"
  12. xmlns:xlink="http://www.w3.org/1999/xlink"
  13. fill="none"
  14. version="1.1"
  15. width="22"
  16. height="20.533334732055664"
  17. viewBox="0 0 22 20.533334732055664"
  18. >
  19. <g>
  20. <path
  21. 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.71667L
  22. :fill="activeTab == 1 ? '#FFFFFF' : '#3D3D3D'"
  23. fill-opacity="1"
  24. />
  25. </g>
  26. </svg>
  27. <p class="text">消毒</p>
  28. </div>
  29. <!-- <div
  30. :class="
  31. activeTab == 2 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  32. "
  33. @click="changeTab(2)"
  34. v-if="[0, 5].includes(operatorStore.disinfectStatus)"
  35. >
  36. <svg
  37. xmlns="http://www.w3.org/2000/svg"
  38. xmlns:xlink="http://www.w3.org/1999/xlink"
  39. fill="none"
  40. version="1.1"
  41. width="20"
  42. height="20"
  43. viewBox="0 0 20 20"
  44. >
  45. <g>
  46. <path
  47. 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"
  48. :fill="activeTab == 2 ? '#FFFFFF' : '#3D3D3D'"
  49. fill-opacity="1"
  50. />
  51. </g>
  52. </svg>
  53. <p class="text">加液</p>
  54. </div> -->
  55. <!-- <div
  56. :class="
  57. activeTab == 3 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  58. "
  59. @click="changeTab(3)"
  60. v-if="[0, 5].includes(operatorStore.disinfectStatus)"
  61. >
  62. <svg
  63. xmlns="http://www.w3.org/2000/svg"
  64. xmlns:xlink="http://www.w3.org/1999/xlink"
  65. fill="none"
  66. version="1.1"
  67. width="20"
  68. height="20"
  69. viewBox="0 0 20 20"
  70. >
  71. <g>
  72. <path
  73. 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"
  74. :fill="activeTab == 3 ? '#FFFFFF' : '#3D3D3D'"
  75. fill-opacity="1"
  76. />
  77. </g>
  78. </svg>
  79. <p class="text">排液</p>
  80. </div> -->
  81. <!-- <div
  82. :class="
  83. activeTab == 8 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  84. "
  85. v-if="[0, 5].includes(operatorStore.disinfectStatus)"
  86. @click="changeTab(8)"
  87. >
  88. <svg
  89. xmlns="http://www.w3.org/2000/svg"
  90. xmlns:xlink="http://www.w3.org/1999/xlink"
  91. fill="none"
  92. version="1.1"
  93. width="21"
  94. height="21"
  95. viewBox="0 0 21 21"
  96. >
  97. <g>
  98. <g>
  99. <path
  100. d="M0,10.5C0,4.70167,4.70167,0,10.5,0C16.2983,0,21,4.70167,21,10.5C21,16.2983,16.2983,21,10.5,21C4.70167,21,0,16.2983,0,10.5ZM13.9697,2.28667C12.8707,1.82233,11.704,1.58667,10.5,1.58667C9.296,1.58667,8.12933,1.82233,7.03033,2.28667C5.971,2.73467,5.01667,3.37867,4.19767,4.19767C3.37867,5.01667,2.73467,5.96867,2.28667,7.03033C1.82233,8.12933,1.58667,9.296,1.58667,10.5C1.58667,11.704,1.82233,12.8707,2.28667,13.9697C2.73467,15.029,3.37867,15.9833,4.19767,16.8023C5.01667,17.6213,5.96867,18.2653,7.03033,18.7133C8.12933,19.1777,9.296,19.4133,10.5,19.4133C11.704,19.4133,12.8707,19.1777,13.9697,18.7133C15.029,18.2653,15.9833,17.6213,16.8023,16.8023C17.6213,15.9833,18.2653,15.0313,18.7133,13.9697C19.1777,12.8707,19.4133,11.704,19.4133,10.5C19.4133,9.296,19.1777,8.12933,18.7133,7.03033C18.2653,5.971,17.6213,5.01667,16.8023,4.19767C15.9833,3.37867,15.0313,2.73467,13.9697,2.28667ZM8.71023,4.41477C8.71023,3.42682,9.51204,2.625,10.5,2.625C11.488,2.625,12.2898,3.42682,12.2898,4.41477C12.2898,5.40273,11.488,6.20455,10.5,6.20455C9.51204,6.20455,8.71023,5.40273,8.71023,4.41477ZM11.0966,4.41477C11.0966,4.08545,10.8293,3.81818,10.5,3.81818C10.1707,3.81818,9.90341,4.08545,9.90341,4.41477C9.90341,4.74409,10.1707,5.01136,10.5,5.01136C10.8293,5.01136,11.0966,4.74409,11.0966,4.41477ZM4.93261,4.93261C5.28102,4.58182,5.7392,4.40761,6.19739,4.40761C6.65557,4.40761,7.11375,4.58182,7.46216,4.93261C8.16136,5.63182,8.16136,6.76534,7.46216,7.46454C7.11375,7.81534,6.65557,7.98954,6.19739,7.98954C5.7392,7.98954,5.28102,7.81295,4.93261,7.46454C4.23341,6.76534,4.23341,5.63182,4.93261,4.93261ZM13.5378,4.93261C13.8862,4.58182,14.3444,4.40761,14.8026,4.40761C15.2608,4.40761,15.719,4.58182,16.0674,4.93261C16.7666,5.63182,16.7666,6.76534,16.0674,7.46455C15.719,7.81534,15.2608,7.98955,14.8026,7.98955C14.3444,7.98955,13.8862,7.81295,13.5378,7.46455C12.8386,6.76534,12.8386,5.63182,13.5378,4.93261ZM6.61977,5.775C6.46704,5.62466,6.29045,5.60079,6.19739,5.60079C6.10432,5.60079,5.92773,5.62466,5.775,5.775C5.62466,5.92773,5.6008,6.10432,5.6008,6.19738C5.6008,6.29045,5.62227,6.46704,5.775,6.61977C5.92773,6.77011,6.10432,6.79398,6.19739,6.79398C6.29046,6.79398,6.46705,6.7725,6.61977,6.61977C6.85125,6.38591,6.85125,6.00648,6.61977,5.775ZM15.225,5.775C15.0723,5.62466,14.8957,5.60079,14.8026,5.60079C14.7095,5.6008,14.533,5.62466,14.3802,5.775C14.1487,6.00886,14.1487,6.3883,14.3802,6.61977C14.533,6.77011,14.7095,6.79398,14.8026,6.79398C14.8957,6.79398,15.0747,6.7725,15.225,6.61977C15.3753,6.46704,15.3992,6.29045,15.3992,6.19739C15.3992,6.10432,15.3777,5.92773,15.225,5.775ZM7.63636,10.5C7.63636,8.91784,8.91784,7.63636,10.5,7.63636C12.0822,7.63636,13.3636,8.91784,13.3636,10.5C13.3636,12.0822,12.0822,13.3636,10.5,13.3636C8.91784,13.3636,7.63636,12.0822,7.63636,10.5ZM2.625,10.5C2.625,9.51204,3.42682,8.71023,4.41477,8.71023C5.40273,8.71023,6.20455,9.51204,6.20455,10.5C6.20455,11.488,5.40273,12.2898,4.41477,12.2898C3.42682,12.2898,2.625,11.488,2.625,10.5ZM14.7955,10.5C14.7955,9.51204,15.5973,8.71023,16.5852,8.71023C17.5732,8.71023,18.375,9.51204,18.375,10.5C18.375,11.488,17.5732,12.2898,16.5852,12.2898C15.5973,12.2898,14.7955,11.488,14.7955,10.5ZM11.7409,10.5C11.7409,9.81511,11.1849,9.25909,10.5,9.25909C9.81511,9.25909,9.25909,9.8175,9.25909,10.5C9.25909,11.1849,9.81511,11.7409,10.5,11.7409C11.1849,11.7409,11.7409,11.1849,11.7409,10.5ZM5.01136,10.5C5.01136,10.1707,4.74409,9.90341,4.41477,9.90341C4.08545,9.90341,3.81818,10.1707,3.81818,10.5C3.81818,10.8293,4.08545,11.0966,4.41477,11.0966C4.74409,11.0966,5.01136,10.8293,5.01136,10.5ZM17.1818,10.5C17.1818,10.1707,16.9145,9.90341,16.5852,9.90341C16.2559,9.90341,15.9886,10.1707,15.9886,10.5C15.9886,10.8293,16.2559,11.0966,16.5852,11.0966C16.9145,11.0966,17.1818,10.8293,17.1818,10.5ZM4.95648,13.5378C5.30489,13.187,5.76307,13.0128,6.22125,13.0128C6.67943,13.0128,7.13761,13.1894,7.48602,13.5378C8.18523,14.237,8.18523,15.3706,7.48602,16.0698C7.13761,16.4206,6.67943,16.5948,6.22125,16.5948C5.76307,16.5948,5.30489,16.4182,4.95648,16.0698C4.25727,15.3706,4.25727,14.237,4.95648,13.5378ZM13.5617,13.5378C13.9101,13.187,14.3683,13.
  101. fill-rule="evenodd"
  102. :fill="activeTab == 8 ? '#FFFFFF' : '#3D3D3D'"
  103. fill-opacity="1"
  104. />
  105. </g>
  106. </g>
  107. </svg>
  108. <p class="text">密封测试</p>
  109. </div> -->
  110. <div
  111. :class="
  112. activeTab == 7 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  113. "
  114. @click="changeTab(7)"
  115. v-if="
  116. userStore.loginUserPermission != 2 &&
  117. [0, 5].includes(operatorStore.disinfectStatus)
  118. "
  119. >
  120. <svg
  121. xmlns="http://www.w3.org/2000/svg"
  122. xmlns:xlink="http://www.w3.org/1999/xlink"
  123. fill="none"
  124. version="1.1"
  125. width="17.38603401184082"
  126. height="21.000097274780273"
  127. viewBox="0 0 17.38603401184082 21.000097274780273"
  128. >
  129. <g>
  130. <path
  131. 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.06
  132. fill-rule="evenodd"
  133. :fill="activeTab == 7 ? '#FFFFFF' : '#3D3D3D'"
  134. fill-opacity="1"
  135. />
  136. </g>
  137. </svg>
  138. <p class="text">配方管理</p>
  139. </div>
  140. <div
  141. :class="
  142. activeTab == 4 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  143. "
  144. @click="changeTab(4)"
  145. v-if="
  146. userStore.loginUserPermission != 3 &&
  147. [0, 5].includes(operatorStore.disinfectStatus)
  148. "
  149. >
  150. <svg
  151. xmlns="http://www.w3.org/2000/svg"
  152. xmlns:xlink="http://www.w3.org/1999/xlink"
  153. fill="none"
  154. version="1.1"
  155. width="20.125"
  156. height="20.125"
  157. viewBox="0 0 20.125 20.125"
  158. >
  159. <g>
  160. <path
  161. 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"
  162. :fill="activeTab == 4 ? '#FFFFFF' : '#3D3D3D'"
  163. fill-opacity="1"
  164. />
  165. </g>
  166. </svg>
  167. <p class="text">测试</p>
  168. </div>
  169. <div
  170. :class="
  171. activeTab == 5 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  172. "
  173. v-if="
  174. userStore.loginUserPermission <= 1 ||
  175. [1, 2, 3, 4].includes(operatorStore.disinfectStatus)
  176. "
  177. @click="changeTab(5)"
  178. >
  179. <svg
  180. xmlns="http://www.w3.org/2000/svg"
  181. xmlns:xlink="http://www.w3.org/1999/xlink"
  182. fill="none"
  183. version="1.1"
  184. width="20"
  185. height="19.999309539794922"
  186. viewBox="0 0 20 19.999309539794922"
  187. >
  188. <g>
  189. <path
  190. 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"
  191. fill-rule="evenodd"
  192. :fill="activeTab == 5 ? '#FFFFFF' : '#3D3D3D'"
  193. fill-opacity="1"
  194. />
  195. </g>
  196. </svg>
  197. <p class="text">设置</p>
  198. </div>
  199. <div
  200. v-if="
  201. userStore.loginUserPermission <= 1 &&
  202. [0, 5].includes(operatorStore.disinfectStatus)
  203. "
  204. :class="
  205. activeTab == 6 ? 'tab_btn style-btn active_btn' : 'style-btn tab_btn'
  206. "
  207. @click="changeTab(6)"
  208. >
  209. <svg
  210. xmlns="http://www.w3.org/2000/svg"
  211. xmlns:xlink="http://www.w3.org/1999/xlink"
  212. fill="none"
  213. version="1.1"
  214. width="18.375"
  215. height="19.25"
  216. viewBox="0 0 18.375 19.25"
  217. >
  218. <g>
  219. <path
  220. 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"
  221. :fill="activeTab == 6 ? '#FFFFFF' : '#3D3D3D'"
  222. fill-opacity="1"
  223. />
  224. </g>
  225. </svg>
  226. <p class="text">审计</p>
  227. </div>
  228. </div>
  229. <Operator
  230. v-if="activeTab == 1 && showOpertor"
  231. :changeShowOperator="changeShowOperator"
  232. :handleShowKeyBoard="handleShowKeyBoard"
  233. :hideKeyBoard="hideKeyBoard"
  234. :input="input"
  235. />
  236. <Progress
  237. v-if="activeTab == 1 && !showOpertor"
  238. :changeShowOperator="changeShowOperator"
  239. />
  240. <LiquidHandle v-if="activeTab == 2" :tabType="1" />
  241. <LiquidHandle v-if="activeTab == 3" :tabType="2" />
  242. <Test v-if="activeTab == 4" />
  243. <Setting
  244. v-if="activeTab == 5 && [0, 5].includes(operatorStore.disinfectStatus)"
  245. />
  246. <DisinfectionSetting
  247. v-if="
  248. activeTab == 5 && [1, 2, 3, 4].includes(operatorStore.disinfectStatus)
  249. "
  250. />
  251. <Audit v-if="activeTab == 6" />
  252. <Formula
  253. v-if="activeTab == 7"
  254. :changeTab="changeTab"
  255. :changeShowOperator="changeShowOperator"
  256. />
  257. <SealTest v-if="activeTab == 8" />
  258. <div class="other_info">
  259. <p class="ip">IP {{ settingStore.deviceIp }}</p>
  260. <div class="time_wrap">
  261. <div class="date_wrap">
  262. <svg
  263. xmlns="http://www.w3.org/2000/svg"
  264. xmlns:xlink="http://www.w3.org/1999/xlink"
  265. fill="none"
  266. version="1.1"
  267. width="23"
  268. height="23"
  269. viewBox="0 0 23 23"
  270. >
  271. <g>
  272. <path
  273. 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"
  274. fill="#FFFFFF"
  275. fill-opacity="1"
  276. />
  277. </g>
  278. </svg>
  279. <p class="ml">{{ moment(nowTime).format('YYYY-MM-DD') }}</p>
  280. </div>
  281. <div class="min_wrap">
  282. <svg
  283. xmlns="http://www.w3.org/2000/svg"
  284. xmlns:xlink="http://www.w3.org/1999/xlink"
  285. fill="none"
  286. version="1.1"
  287. width="22"
  288. height="22"
  289. viewBox="0 0 22 22"
  290. >
  291. <g>
  292. <path
  293. 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"
  294. fill="#FFFFFF"
  295. fill-opacity="1"
  296. />
  297. </g>
  298. </svg>
  299. <p class="ml time_txt">{{ moment(nowTime).format('HH:mm:ss') }}</p>
  300. </div>
  301. </div>
  302. <div
  303. v-if="[0, 5].includes(operatorStore.disinfectStatus)"
  304. class="log_out_btn style-btn"
  305. @click="handleLogout"
  306. >
  307. <svg
  308. xmlns="http://www.w3.org/2000/svg"
  309. xmlns:xlink="http://www.w3.org/1999/xlink"
  310. fill="none"
  311. version="1.1"
  312. width="76"
  313. height="29"
  314. viewBox="0 0 76 29"
  315. >
  316. <g>
  317. <g>
  318. <path
  319. 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"
  320. fill="#FFFFFF"
  321. fill-opacity="1"
  322. />
  323. </g>
  324. <g>
  325. <path
  326. 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"
  327. fill-rule="evenodd"
  328. fill="#FFFFFF"
  329. fill-opacity="1"
  330. />
  331. </g>
  332. </g>
  333. </svg>
  334. </div>
  335. </div>
  336. <!-- <van-overlay :show="settingStore.initLoading">
  337. <div class="wrapper" @click.stop>
  338. <div class="block">
  339. <van-loading />
  340. <p class="shutdown_text">初始化系统参数...</p>
  341. </div>
  342. </div>
  343. </van-overlay> -->
  344. <div class="key_wrap" v-if="showkeyboard">
  345. <SimpleKeyboard
  346. :hideKeyBoard="hideKeyBoard"
  347. @onChange="onChange"
  348. :input="input"
  349. />
  350. </div>
  351. <LoginModal
  352. :changeTab="changeTab"
  353. v-if="loginModalVisible"
  354. :hideLoginModal="hideLoginModal"
  355. />
  356. <LeaveModal
  357. :changeTabReal="changeTabReal"
  358. :clickType="clickType"
  359. :handleLogoutReal="handleLogoutReal"
  360. :hiddenLeaveModal="hiddenLeaveModal"
  361. v-if="leaveModalVisible"
  362. />
  363. </div>
  364. </template>
  365. <script setup>
  366. import { ref, onMounted, onBeforeUnmount } from 'vue'
  367. import LoginModal from 'cpns/dialogs/LoginModal'
  368. import SimpleKeyboard from 'cpns/SimpleKeyboard'
  369. import moment from 'moment'
  370. import Formula from 'cpns/Formula'
  371. import Operator from 'cpns/Operator'
  372. import Audit from 'cpns/Audit'
  373. import SealTest from 'cpns/SealTest'
  374. import LeaveModal from 'cpns/dialogs/LeaveModal'
  375. import DisinfectionSetting from 'cpns/DisinfectionSetting'
  376. import Progress from 'cpns/Progress'
  377. import LiquidHandle from 'cpns/LiquidHandle'
  378. import Setting from 'cpns/Setting'
  379. import Test from 'cpns/Test'
  380. import { storeToRefs } from 'pinia'
  381. import {
  382. useOperatorStore,
  383. useWebSocketStore,
  384. useSettingStore,
  385. useUserStore,
  386. useSealStore,
  387. } from '@/store'
  388. import {
  389. logoutJSON,
  390. getStateJSON,
  391. getAllSettingJSON,
  392. getAllUserJSON,
  393. getDisinfectionConfigJSON,
  394. } from '@/mock/command'
  395. import { useRouter } from 'vue-router'
  396. const router = useRouter()
  397. const webSocketStore = useWebSocketStore()
  398. const settingStore = useSettingStore()
  399. const sealStore = useSealStore()
  400. const userStore = useUserStore()
  401. const { socketCommandInstance } = storeToRefs(webSocketStore)
  402. webSocketStore.initCommandSocket()
  403. webSocketStore.initEventSocket()
  404. const loginModalVisible = ref(false)
  405. const hideLoginModal = () => {
  406. loginModalVisible.value = false
  407. }
  408. const showkeyboard = ref(false)
  409. const handleShowKeyBoard = () => {
  410. showkeyboard.value = true
  411. }
  412. const hideKeyBoard = () => {
  413. showkeyboard.value = false
  414. }
  415. const showOpertor = ref(true)
  416. const operatorStore = useOperatorStore()
  417. const activeTab = ref(1)
  418. const nowTime = ref('')
  419. const timer = ref(null)
  420. const changeShowOperator = flag => {
  421. showOpertor.value = flag
  422. }
  423. const input = ref('0')
  424. const onChange = a => {
  425. input.value = a
  426. }
  427. const leaveModalVisible = ref(false)
  428. const hiddenLeaveModal = () => {
  429. leaveModalVisible.value = false
  430. }
  431. const changeTabReal = index => {
  432. if (index == 5) {
  433. // 判断是否为管理员登陆 如果为管理员直接显示,
  434. webSocketStore.sendCommandMsg(getDisinfectionConfigJSON)
  435. if (userStore.loginUserPermission == 3) {
  436. // 非管理员
  437. // 如果不为管理员 则弹出登陆框
  438. webSocketStore?.sendCommandMsg(getAllUserJSON)
  439. loginModalVisible.value = true
  440. return
  441. }
  442. }
  443. activeTab.value = index
  444. if ([4, 5].includes(index)) {
  445. // getAllSetting
  446. webSocketStore.sendCommandMsg(getAllSettingJSON)
  447. }
  448. }
  449. const clickType = ref(-1)
  450. const changeTab = index => {
  451. // 判断如果tab不是密封测试 且 当前已经开始测试则需要弹窗提醒 以便关闭阀门
  452. if (index != 8 && sealStore.isStartTest) {
  453. // show modal 和 点击注销按钮同逻辑
  454. clickType.value = index
  455. leaveModalVisible.value = true
  456. return
  457. }
  458. changeTabReal(index)
  459. }
  460. const getdateTime = () => {
  461. nowTime.value = moment().utcOffset(8).format('YYYY-MM-DD HH:mm:ss')
  462. }
  463. onMounted(() => {
  464. getdateTime()
  465. timer.value = setInterval(() => {
  466. getdateTime()
  467. }, 200)
  468. setTimeout(() => {
  469. // webSocketStore.sendCommandMsg(getStateJSON)
  470. webSocketStore.sendCommandMsg(getAllSettingJSON)
  471. }, 1000)
  472. document.addEventListener('click', e => {
  473. let box = document.getElementById('keyboard')
  474. let room = document.getElementById('room_size')
  475. if (!box?.contains(e.target) && e.target != room) {
  476. hideKeyBoard()
  477. }
  478. })
  479. })
  480. onBeforeUnmount(() => {
  481. timer.value = null
  482. })
  483. const handleLogout = () => {
  484. if (sealStore.isStartTest) {
  485. // show modal 和 点击注销按钮同逻辑
  486. leaveModalVisible.value = true
  487. clickType.value = -2
  488. return
  489. }
  490. handleLogoutReal()
  491. }
  492. const handleLogoutReal = () => {
  493. webSocketStore?.sendCommandMsg(logoutJSON)
  494. window.location.href = 'http://127.0.0.1/#/'
  495. }
  496. </script>
  497. <style lang="scss" scoped>
  498. .home_container {
  499. background: $theme-color;
  500. width: 1280px;
  501. height: 800px;
  502. box-sizing: border-box;
  503. padding: 30px;
  504. .key_wrap {
  505. position: absolute;
  506. left: 0;
  507. right: 0;
  508. bottom: 0;
  509. height: 230px;
  510. }
  511. .header_menu {
  512. width: 100%;
  513. height: 80px;
  514. background: #fff;
  515. box-sizing: border-box;
  516. padding: 11px;
  517. border-radius: 40px;
  518. display: flex;
  519. align-items: center;
  520. margin-bottom: 19px;
  521. .tab_btn {
  522. width: 171px;
  523. height: 58px;
  524. border-radius: 29px;
  525. box-sizing: border-box;
  526. display: flex;
  527. align-items: center;
  528. justify-content: center;
  529. padding: 0;
  530. font-family: Source Han Sans CN;
  531. font-size: 20px;
  532. font-weight: 350;
  533. letter-spacing: 0.12em;
  534. color: #3d3d3d;
  535. .text {
  536. margin-left: 9px;
  537. white-space: nowrap;
  538. }
  539. }
  540. .active_btn {
  541. background: linear-gradient(
  542. 90deg,
  543. #06518b 0%,
  544. rgba(6, 81, 139, 0.7) 100%
  545. );
  546. color: #ffffff;
  547. }
  548. }
  549. .other_info {
  550. display: flex;
  551. justify-content: space-between;
  552. align-items: center;
  553. font-family: Source Han Sans CN;
  554. font-size: 20px;
  555. font-weight: bold;
  556. font-weight: normal;
  557. height: 45px;
  558. letter-spacing: 0.06em;
  559. color: #ffffff;
  560. padding: 0 10px;
  561. position: relative;
  562. box-sizing: border-box;
  563. .ip {
  564. font-family: Source Han Sans CN;
  565. font-size: 20px;
  566. font-weight: bold;
  567. line-height: normal;
  568. letter-spacing: 0.06em;
  569. color: #ffffff;
  570. }
  571. .time_wrap {
  572. display: flex;
  573. align-items: center;
  574. margin-left: 30px;
  575. .date_wrap {
  576. display: flex;
  577. align-items: center;
  578. font-family: Source Han Sans CN;
  579. font-size: 20px;
  580. font-weight: bold;
  581. line-height: normal;
  582. letter-spacing: 0.06em;
  583. color: #ffffff;
  584. margin-left: 10px;
  585. margin-right: 24px;
  586. .ml {
  587. margin-left: 10px;
  588. }
  589. }
  590. .min_wrap {
  591. margin-right: 10px;
  592. display: flex;
  593. align-items: center;
  594. font-family: Source Han Sans CN;
  595. font-size: 20px;
  596. font-weight: bold;
  597. line-height: normal;
  598. letter-spacing: 0.06em;
  599. color: #ffffff;
  600. .ml {
  601. margin-left: 10px;
  602. }
  603. .time_txt {
  604. width: 94px;
  605. }
  606. }
  607. }
  608. .log_out_btn {
  609. width: 124px;
  610. height: 45px;
  611. border-radius: 23px;
  612. display: flex;
  613. align-items: center;
  614. justify-content: center;
  615. background: #064b81;
  616. right: 370px;
  617. top: 0px;
  618. position: absolute;
  619. z-index: 1;
  620. }
  621. }
  622. }
  623. .wrapper {
  624. display: flex;
  625. align-items: center;
  626. justify-content: center;
  627. height: 100%;
  628. }
  629. .block {
  630. width: 220px;
  631. height: 220px;
  632. display: flex;
  633. flex-direction: column;
  634. padding: 16px;
  635. align-items: center;
  636. justify-content: center;
  637. .shutdown_text {
  638. margin-top: 24px;
  639. font-family: Source Han Sans CN;
  640. font-size: 16px;
  641. font-weight: normal;
  642. line-height: normal;
  643. letter-spacing: 0.06em;
  644. color: #fff;
  645. }
  646. }
  647. </style>