优化样式

src/app.vue

@@ -28,10 +28,10 @@ let timer: any = null // 进度条定时器
  */
 onBeforeMount(async () => {
   startProgress() // 启动进度条
-  // 环境数据轮询（每2秒获取一次）
+  // 环境数据轮询（每10秒获取一次）
   setInterval(async () => {
     await readH2o2Data()
-  }, 3000)
+  }, 10 * 1000)
 })
 
 /**

src/components/formula/FormulaConfig.vue

@@ -424,15 +424,15 @@ const openKeyboardType = (labelName: string) => {
       <div v-if="type !== 'home'" class="formula-form-btn" :style="{ marginLeft: '33%' }">
         <slot name="formulaBtn">
           <div class="default-btn">
-            <el-button type="primary" class="config-btn" @click="handleSubmit">
-              确定
-            </el-button>
             <el-button v-if="type === 'setting'" class="config-btn" @click="handleResetDefault">
               恢复默认值
             </el-button>
             <el-button v-else class="config-btn" @click="handleCancel">
               取消
             </el-button>
+            <el-button type="primary" class="config-btn" @click="handleSubmit">
+              确定
+            </el-button>
           </div>
         </slot>
       </div>

src/components/formula/FormulaTable.vue

@@ -17,7 +17,10 @@ onMounted(() => {
 })
 
 watchEffect(() => {
-  recipes.value = formulaStore.formulaList as Formula.FormulaItem[]
+  recipes.value = formulaStore.formulaList
+  if (formulaStore.formulaList) {
+    selectedIndex.value = formulaStore.formulaList.length - 1
+  }
 })
 
 const initFormulaList = () => {
@@ -31,6 +34,7 @@ const initFormulaList = () => {
 
 const selectRecipe = (item: Formula.FormulaItem, index: number) => {
   selectedIndex.value = selectedIndex.value === index ? null : index
+  console.log('selectedIndex--', selectedIndex)
   item = convertValuesToInt(item) as Formula.FormulaItem
   formulaStore.updateSelectedFormulaData(item)
 }

src/components/home/HomeSetting.vue

@@ -261,7 +261,7 @@ const settingWidth = computed(() => {
         <BtButton
           v-else
           button-text="运行参数"
-          text-size="1rem"
+          text-size="1.3rem"
           border-radius="5px"
           :width="settingWidth"
           text-color="#1989fa"
@@ -271,30 +271,30 @@ const settingWidth = computed(() => {
       </div>
     </div>
   </div>
-  <ft-dialog v-model="disinfectFormulaVisible" width="80vw" style="height: 95vh">
+  <ft-dialog v-model="disinfectFormulaVisible" width="80vw" title="消毒设置" class="config">
     <div>
       <Config ref="configRef" />
     </div>
     <template #footer>
       <div class="config-btn">
         <BtButton
-          bg-color="#1989fa"
-          button-text="确认"
+          button-text="取消"
           border-radius="5px"
           width="7rem"
           text-size="1.5rem"
-          text-color="#ffffff"
+          text-color="#1989fa"
           height="3rem"
-          @click="onSave"
+          @click="onClose"
         />
         <BtButton
-          button-text="取消"
+          bg-color="#1989fa"
+          button-text="确认"
           border-radius="5px"
           width="7rem"
           text-size="1.5rem"
-          text-color="#1989fa"
+          text-color="#ffffff"
           height="3rem"
-          @click="onClose"
+          @click="onSave"
         />
       </div>
     </template>
@@ -326,7 +326,14 @@ const settingWidth = computed(() => {
     }
   }
 }
+ ::v-deep .el-dialog__body {
+   padding: 0 0 !important;
+   border: 1px solid red !important;
+ }
+ .config {
+   border: 1px solid red;
+ }
  .config-btn{
-   margin-top: -3rem
+   margin-top: -4rem
  }
 </style>

src/views/home/index.vue

@@ -135,7 +135,7 @@ const nowLiquid = computed(() => {
   .home-grid-container {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
-    gap: 0.5rem;
+    gap: 1rem;
   }
   .home-merged-cell {
     grid-column: 1 / 2;
@@ -145,7 +145,7 @@ const nowLiquid = computed(() => {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: repeat(2, auto);
-    gap:1.5rem;
+    gap:1rem;
     .card {
       text-align: center;
       height: 40.5vh;

src/views/liquid/index.vue

@@ -182,7 +182,7 @@ const onStopDrainLiquid = async () => {
                 type="primary"
                 :button-text="`${liquidTotoal}g`"
                 bg-color="#2892F3"
-                border-radius="0"
+                border-radius="0 5px 5px 0"
                 text-color="#ffffff"
                 height="4rem"
                 text-size="24px"

src/views/setting/index.vue

@@ -67,7 +67,7 @@ const selectItem = (menuCode: string) => {
     .setting-right{
       grid-column:  2 / 4;
       box-shadow: 0px 1px 5px 0px rgba(9, 39, 62, 0.15);
-      background: $gradient-color;
+      background: #ffffff;
     }
   }
   .menu-container {

vite.config.ts

@@ -23,7 +23,7 @@ export default defineConfig(({ mode }) => {
     },
     build: {
       sourcemap: false,
-      outDir: `dist-v${packageJson.version}`,
+      outDir: `dist`,
       rollupOptions: {
         output: {
           manualChunks(id) {