消毒页面按钮设置

src/components/home/HomeSetting.vue

@@ -248,8 +248,9 @@ const deviceType = computed(() => {
 
 <template>
   <div class="home-start-opt">
+    <el-row class="row-bg" justify="space-around">
+      <el-col v-if="deviceType === deviceStore.deviceTypeMap.PipeDM" :span="6">
         <div class="home-opt-flex">
-      <div v-if="deviceType === deviceStore.deviceTypeMap.PipeDM">
           <BtButton
             button-text="压力控制"
             text-size="1.3rem"
@@ -260,6 +261,8 @@ const deviceType = computed(() => {
             @click="onSetPressure"
           />
         </div>
+      </el-col>
+      <el-col :span="6">
         <div class="home-opt-ml">
           <BtButton
             button-text="查看图表"
@@ -272,6 +275,8 @@ const deviceType = computed(() => {
             @click="onShowChart"
           />
         </div>
+      </el-col>
+      <el-col :span="6">
         <div class="home-opt-ml">
           <BtButton
             v-if="deviceState"
@@ -294,7 +299,8 @@ const deviceType = computed(() => {
             @click="onDisinfectConfig('运行参数')"
           />
         </div>
-    </div>
+      </el-col>
+    </el-row>
   </div>
   <ft-dialog v-model="disinfectFormulaVisible" :title="disinfectFormulaTitle" width="80vw">
     <div style="height: 80vh; overflow: auto">
@@ -342,7 +348,7 @@ const deviceType = computed(() => {
   gap: 5px;
   width: 100%;
   .home-opt-flex {
-    display: grid;
+    display: flex;
     grid-template-columns: 1fr 1fr 1fr;
     .home-opt-ml {
       margin-left: 5px;