配置页面

.env

@@ -1,5 +1,5 @@
-VITE_BASE_WS1_URL=ws://192.168.8.10:19001/
-VITE_BASE_WS2_URL=ws://192.168.8.10:19002/
+# VITE_BASE_WS1_URL=ws://192.168.8.10:19001/
+# VITE_BASE_WS2_URL=ws://192.168.8.10:19002/
 
-# VITE_BASE_WS1_URL=ws://127.0.0.1:19001/
-# VITE_BASE_WS2_URL=ws://127.0.0.1:19002/
+VITE_BASE_WS1_URL=ws://127.0.0.1:19001/
+VITE_BASE_WS2_URL=ws://127.0.0.1:19002/

src/components/Setting/components/PreSetting.vue → src/components/PreSetting.vue

@@ -217,6 +217,10 @@
       :show="continued_humiShow"
       @blur="continued_humiShow = false"
     />
+    <div class="btns">
+      <div class="btn">保存</div>
+      <div class="btn ml" @click="hiddleSettingModal">返回</div>
+    </div>
   </div>
 </template>
 
@@ -257,6 +261,16 @@ const continued_humiShow = ref(false)
 
 const isFirstClick = ref(true)
 
+const props = defineProps({
+  hideSettingModal: {
+    type: Function,
+  },
+})
+
+const hiddleSettingModal = () => {
+  props.hideSettingModal()
+}
+
 const hideClickKey = flag => {
   isFirstClick.value = true
   stoped_humiShow.value = false
@@ -653,9 +667,40 @@ const setSprayLiquidVal = () => {
   height: 580px;
   display: grid;
   overflow: scroll;
-  grid-template-columns: repeat(1, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   row-gap: 20px;
-  padding-bottom: 40px;
+  column-gap: 20px;
+  padding: 20px;
+  padding-bottom: 180px;
+  position: relative;
+  .btns {
+    position: absolute;
+    right: 20px;
+    bottom: 20px;
+    width: 300px;
+    height: 68px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    .btn {
+      width: 111px;
+      height: 38px;
+      border-radius: 19px;
+      background: #06518b;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-family: Source Han Sans CN;
+      font-size: 14px;
+      font-weight: normal;
+      line-height: normal;
+      letter-spacing: 0.1em;
+      color: #ffffff;
+    }
+    .ml {
+      margin-left: 20px;
+    }
+  }
   .row_wrap {
     // width: 726px;
     height: 80px;
@@ -668,6 +713,7 @@ const setSprayLiquidVal = () => {
     justify-content: space-between;
     .title {
       font-family: Zona Pro;
+      white-space: nowrap;
       font-size: 20px;
       font-weight: normal;
       letter-spacing: 0.06em;

src/components/Setting/index.vue

@@ -26,11 +26,11 @@
         <p :class="activeTab == 5 ? 'title active' : 'title'">操作日志导出</p>
         <div :class="activeTab == 5 ? 'btn style-btn' : 'dis_btn'">导出</div>
       </div>
-      <div class="tab_wrap" @click="changeActiveTab(6)">
+      <!-- <div class="tab_wrap" @click="changeActiveTab(6)">
         <p class="active_line" v-show="activeTab == 6"></p>
         <p :class="activeTab == 6 ? 'title active' : 'title'">消毒预设</p>
         <div :class="activeTab == 6 ? 'btn style-btn' : 'dis_btn'">设置</div>
-      </div>
+      </div> -->
     </div>
     <div class="right_container">
       <Admin v-if="activeTab == 2" />
@@ -38,7 +38,6 @@
       <Device v-if="activeTab == 1" />
       <User v-if="activeTab == 3" />
       <ExportExcel v-if="activeTab == 5" />
-      <PreTable v-if="activeTab == 6" />
     </div>
   </div>
 </template>
@@ -50,7 +49,6 @@ import Date from './components/Date.vue'
 import Device from './components/Device.vue'
 import User from './components/User.vue'
 import ExportExcel from './components/ExportExcel.vue'
-import PreTable from './components/PreTable.vue'
 import { getAllUserJSON } from '@/mock/command'
 import { useWebSocketStore } from '@/store'
 

src/pages/Home.vue

@@ -166,6 +166,31 @@
         </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="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 == 7 ? '#FFFFFF' : '#3D3D3D'"
+              fill-opacity="1"
+            />
+          </g>
+        </svg>
+        <p class="text">配方管理</p>
+      </div>
     </div>
     <Operator
       v-if="activeTab == 1 && showOpertor"
@@ -186,6 +211,7 @@
       v-if="activeTab == 5 && operatorStore.disinfectStatus == 1"
     />
     <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">
@@ -284,6 +310,7 @@ 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'
@@ -416,7 +443,7 @@ const handleLogout = () => {
     align-items: center;
     margin-bottom: 19px;
     .tab_btn {
-      width: 199px;
+      width: 171px;
       height: 58px;
       border-radius: 29px;
       box-sizing: border-box;