修改异常管理页面

src/views/anomaly/index.vue

@@ -2,22 +2,20 @@
     <div class="hc-layout-box anonaly-page">
         <hc-card :scrollbar="false" action-size="lg">
             <template #extra>
-                <el-select v-model="searchForm.key1" class="w-60" placeholder="异常类型">
+                <el-select v-model="searchForm.key1" class="w-[148px]" placeholder="异常类型">
                     <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
                 </el-select>
-                <el-select v-model="searchForm.key2" class="ml-2 w-60" placeholder="异常等级">
+                <el-select v-model="searchForm.key2" class="ml-2 w-[100px]" placeholder="异常等级">
                     <el-option v-for="item in levelOptions" :key="item.value" :label="item.label" :value="item.value" />
                 </el-select>
-                <el-select v-model="searchForm.key3" class="ml-2 w-60" placeholder="是否撤销">
+                <el-select v-model="searchForm.key3" class="ml-2 w-[100px]" placeholder="是否撤销">
                     <el-option :value="1" label="是" />
                     <el-option :value="2" label="否" />
                 </el-select>
-                <el-input v-model="searchForm.queryValue" class="ml-2 w-60" clearable placeholder="请输入" />
-                <el-button class="ml-2" color=" #6DC2FF" type="primary">
-                    <hc-icon class="text-white" name="search" />
-                    <span class="text-white">搜索</span>
-                </el-button>
-                <el-button :disabled="tableCheckedKeys.length === 0" class="ml-2" color=" #6DC2FF" type="info" @click="exportClick">
+                <div class="relative ml-3 w-[300px]">
+                    <hc-search-input v-model="searchForm.queryValue" text="搜索" @search="searchClick" />
+                </div>
+                <el-button v-yes-com:[batchExportClick] :disabled="tableCheckedKeys.length === 0" class="ml-2" color=" #6DC2FF" type="info">
                     <hc-icon class="text-white" name="download" />
                     <span class="text-white">批量导出</span>
                 </el-button>
@@ -43,9 +41,10 @@
             </template>
         </hc-card>
         <!-- 撤销弹窗 -->
-        <hc-dialog v-model="cancelModal" title="撤销">
-            <el-alert :closable="false" class="mb-4" show-icon title="请选择撤销结束时间" type="warning" />
-            <el-date-picker v-model="cancelTime" placeholder="撤销结束时间" type="date" />
+        <hc-dialog v-model="cancelModal" title="请选择撤销结束时间" widths="400px">
+            <div class="relative pb-[8px] pt-[8px]">
+                <el-date-picker v-model="cancelTime" class="block" placeholder="撤销结束时间" type="date" />
+            </div>
         </hc-dialog>
         <!-- 导出弹窗 -->
         <hc-dialog v-model="exportModal" title="导出">
@@ -143,6 +142,10 @@ const tableCellStyle = ({ row, column, rowIndex, columnIndex }) => {
 }
 const getTableData = () => {
 
+}
+
+const searchClick = () => {
+
 }
 //分页被点击
 const pageChange = ({ current, size }) => {
@@ -161,6 +164,14 @@ const cancleClick = (row) => {
 }
 const cancelTime = ref('')
 const exportModal = ref(false)
+
+//批量导出
+const batchExportClick = (_, resolve) => {
+    //这里可以写一些操作
+    resolve() //这个一定要存在，否则不会关闭弹窗
+}
+
+//单个导出
 const exportClick = async (_, resolve) => {
     //这里可以写一些操作
     resolve() //这个一定要存在，否则不会关闭弹窗