[Mod 0000]修改可配置首页列表组件的逻辑

src/views/vent/home/configurable/components/preset/buttonList.vue

@@ -21,9 +21,13 @@
       </div>
     </div>
   </div>
-  <ConfirmModal v-model:visible="modalVisible" @ok="handleConfirm">
+  <ConfirmModal v-model:visible="modalVisible" @ok="handleConfirm" @cancel="handleCancel" class="btn-confirm-modal">
     <SvgIcon class="icon" size="34" name="warning-icon-gas" />
     <span> {{ currentButton?.content }} </span>
+    <inputPassword v-model:value="password" placeholder="请输入密码校验(必填)" class="pswInput" />
+    <div class="warn-text">
+      <span>{{ inputWarn }}</span>
+    </div>
   </ConfirmModal>
 </template>
 
@@ -31,6 +35,7 @@
   defineOptions({ name: 'ButtonList' });
   import ConfirmModal from '@/views/vent/gas/components/modal/confirmModal.vue';
   import { computed, ref, inject } from 'vue';
+  import { InputPassword } from 'ant-design-vue';
   // 定义组件属性
   const props = defineProps<{
     type: string;
@@ -47,6 +52,8 @@
     content: string;
     // 可以根据实际需求添加其他属性
   }
+  const password = ref('');
+  const inputWarn = ref('密码错误请重新输入');
   const modalVisible = ref(false);
   const currentButton = ref<ButtonItem | null>(null); // 记录当前点击的按钮
 
@@ -69,11 +76,17 @@
   };
   const handleConfirm = () => {
     if (!currentButton.value) return;
+    password.value = '';
+    inputWarn.value = '';
     handleButtonConfirm(currentButton.value);
   };
+  const handleCancel = () => {
+    password.value = '';
+    inputWarn.value = '';
+  };
 </script>
 
-<style lang="less" scoped>
+<style lang="less">
   .button-block_A {
     display: flex;
     justify-content: space-between;
@@ -121,4 +134,25 @@
       padding: 10px 0;
     }
   }
+  .btn-confirm-modal {
+    .zxm-modal-content {
+      height: 330px !important;
+      background-size: 100% 100%;
+      .zxm-modal-body {
+        height: 260px;
+        padding-top: 85px;
+      }
+      .zxm-modal-footer {
+        text-align: center;
+      }
+    }
+  }
+  .pswInput {
+    margin-top: 55px;
+    width: 80%;
+  }
+  .warn-text {
+    color: red;
+    font-size: 15px;
+  }
 </style>