basic-search抽离出来当作sfy安全防范大项目的公共组件

src/views/disaster/components/Search.vue

@@ -26,7 +26,7 @@
 </template>
 
 <script lang="ts" setup>
-  import type { SearchConfig } from '@/views/disaster/types';
+import type { SearchConfig } from '@/types/basic-search';
   const props = defineProps<{
     searchConfig: SearchConfig[];
     searchData: any;

src/router/routers/emergency.ts

@@ -84,7 +84,7 @@ const emergencyManagementRoute = {
       parentId: 2000,
       name: 'emergency-supplies',
       path: 'emergency-supplies',
-      component: '/emergency/emergency-supplies/PageEmergencyList',
+      component: '',
       redirect: '',
       meta: {
         activeMenu: null,
@@ -98,6 +98,28 @@ const emergencyManagementRoute = {
         query: '',
         title: '应急物资',
       },
+      children: [
+        {
+          id: 200401,
+          parentId: 2004,
+          name: 'supplies-list',
+          path: 'supplies-list',
+          component: '/emergency/emergency-supplies/PageEmergencyList',
+          redirect: '',
+          meta: {
+            activeMenu: null,
+            alwaysShow: false,
+            frameSrc: '',
+            hidden: false,
+            icon: '',
+            isFrame: 0,
+            isRoot: false,
+            noCache: false,
+            query: '',
+            title: '物资清单',
+          },
+        },
+      ],
     },
   ],
 };

src/types/basic-search/index.ts

@@ -0,0 +1,9 @@
+export interface SearchConfig {
+  label: string;
+  prop: string;
+  component?: string;
+  selectOptions?: any[];
+  componentProps?: any;
+  slot?: string;
+  [key: string]: any; // 添加索引签名
+}

src/views/disaster/disaster-control/PageDisposalManagement.vue

@@ -15,7 +15,7 @@
           >
             创建灾害处置任务
           </el-button>
-          <Search
+          <BasicSearch
             :searchConfig="DISPOSAL_MANAGEMENT_SEARCH_CONFIG"
             :searchData="searchData"
             @update:searchData="handleSearch"
@@ -35,7 +35,7 @@
                 <el-option v-for="item in firstLevelDepts" :key="item.id" :label="item.deptName" :value="item.id" />
               </el-select>
             </template>
-          </Search>
+          </BasicSearch>
         </header>
         <section class="disaster-precaution__section">
           <div
@@ -197,7 +197,7 @@
   import { onMounted, reactive, ref } from 'vue';
   import { ElMessage } from 'element-plus';
   import { Plus } from '@element-plus/icons-vue';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import CollapseItem from './src/components/CollapseItem.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import BasicTable from '@/components/BasicTable.vue';

src/views/disaster/disaster-control/PageDisposalRectification.vue

@@ -6,7 +6,7 @@
     <main class="safety-platform-container__main">
       <div class="search-table-container">
         <header class="disaster-precaution__header">
-          <Search
+          <BasicSearch
             :searchConfig="DISPOSAL_RECTIFICATION_SEARCH_CONFIG"
             :searchData="searchData"
             @update:searchData="handleSearch"
@@ -21,7 +21,7 @@
                 />
               </el-select>
             </template>
-          </Search>
+          </BasicSearch>
         </header>
         <section class="disaster-precaution__section">
           <div class="collapse-container" v-loading="collapseLoading">
@@ -153,7 +153,7 @@
   import { useRouter } from 'vue-router';
   import { onMounted, reactive, ref } from 'vue';
   import { ElMessage } from 'element-plus';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import CollapseItem from './src/components/CollapseItem.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import InspectorSelect from '@/views/disaster/components/InspectorSelect.vue';

src/views/disaster/disaster-control/src/components/LossRecord.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="search-table-container">
     <header class="disaster-precaution__header">
-      <Search
+      <BasicSearch
         :searchConfig="LOSS_RECORD_LOSS_RECORD_SEARCH_CONFIG"
         :searchData="searchData"
         @update:searchData="handleSearch"
@@ -21,7 +21,7 @@
             <el-option v-for="item in firstLevelDepts" :key="item.id" :label="item.deptName" :value="item.id" />
           </el-select>
         </template>
-      </Search>
+      </BasicSearch>
     </header>
     <section class="disaster-precaution__section">
       <div class="collapse-container" v-loading="collapseLoading">
@@ -171,7 +171,7 @@
   import { ref, reactive, onMounted, onUnmounted, computed } from 'vue';
   import { Plus } from '@element-plus/icons-vue';
   import { ElMessage } from 'element-plus';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import CollapseItem from './CollapseItem.vue';

src/views/disaster/disaster-control/src/components/ReportTask.vue

@@ -1,12 +1,12 @@
 <template>
   <div class="search-table-container">
     <header class="disaster-precaution__header">
-      <Search
+      <BasicSearch
         :searchConfig="LOSS_REPORT_REPORT_TASK_SEARCH_CONFIG"
         :searchData="searchData"
         @update:searchData="handleSearch"
       >
-      </Search>
+      </BasicSearch>
     </header>
     <BasicTable
       :tableConfig="tableConfig"
@@ -71,7 +71,7 @@
   import { useRouter } from 'vue-router';
   import { ref, reactive, onMounted, onUnmounted } from 'vue';
   import { ElMessage } from 'element-plus';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import InspectorSelect from '@/views/disaster/components/InspectorSelect.vue';

src/views/disaster/disaster-control/src/config/search.ts

@@ -1,7 +1,7 @@
 /**
  * 灾害处理搜索配置
  */
-import type { SearchConfig } from '@/views/disaster/types';
+import type { SearchConfig } from '@/types/basic-search';
 import { ACTIVE_STATUS_OPTIONS } from '@/views/disaster/constant';
 import {
   TASK_STAGE_OPTIONS_DISPOSAL_MANAGEMENT,

src/views/disaster/disaster-precaution/PageTaskExecution.vue

@@ -6,7 +6,7 @@
     <main class="safety-platform-container__main">
       <div class="search-table-container">
         <header class="disaster-precaution__header">
-          <Search
+          <BasicSearch
             :searchConfig="TASK_EXECUTION_SEARCH_CONFIG"
             :searchData="searchData"
             @update:searchData="handleSearch"
@@ -107,7 +107,7 @@
   import { ElMessage } from 'element-plus';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import InspectorSelect from '@/views/disaster/components/InspectorSelect.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';
   import { isToolTip } from './src/utils';

src/views/disaster/disaster-precaution/PageTaskManagement.vue

@@ -15,7 +15,7 @@
           >
             创建检查任务单
           </el-button>
-          <Search
+          <BasicSearch
             :searchConfig="TASK_MANAGEMENT_SEARCH_CONFIG"
             :searchData="searchData"
             @update:searchData="handleSearch"
@@ -141,7 +141,7 @@
   import { ElMessage } from 'element-plus';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';
   import { useUserInfoHook } from '@/views/disaster/hooks';
   import { openMessageBox } from '@/utils/element-plus/messageBox';

src/views/disaster/disaster-precaution/src/config/search.ts

@@ -1,7 +1,7 @@
 /**
  * 预防检查任务单搜索配置
  */
-import type { SearchConfig } from '@/views/disaster/types';
+import type { SearchConfig } from '@/types/basic-search';
 import {
   INSPECT_TYPE_OPTIONS,
   TASK_STAGE_OPTIONS_MANAGEMENT,

src/views/disaster/disaster-warning/PageDefenseNotice.vue

@@ -14,7 +14,7 @@
             v-if="defenseNoticePermissions"
             >创建规定与通知
           </el-button>
-          <Search
+          <BasicSearch
             :searchConfig="
               defenseNoticePermissions ? DEFENSE_NOTICE_SEARCH_CONFIG_PERMISSION : DEFENSE_NOTICE_SEARCH_CONFIG_DEFAULT
             "
@@ -41,7 +41,7 @@
                 />
               </el-select>
             </template>
-          </Search>
+          </BasicSearch>
         </header>
         <BasicTable
           :tableConfig="tableConfig"
@@ -109,7 +109,7 @@
   import { ref, onMounted, reactive } from 'vue';
   import { Plus } from '@element-plus/icons-vue';
   import { ElMessage } from 'element-plus';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';

src/views/disaster/disaster-warning/PageWarningInfo.vue

@@ -15,7 +15,7 @@
           >
             创建灾害预警信息
           </el-button>
-          <Search
+          <BasicSearch
             :searchConfig="
               warningInfoPermissions ? WARNING_INFO_SEARCH_CONFIG_PERMISSION : WARNING_INFO_SEARCH_CONFIG_DEFAULT
             "
@@ -42,7 +42,7 @@
                 />
               </el-select>
             </template>
-          </Search>
+          </BasicSearch>
         </header>
         <BasicTable
           :tableConfig="tableConfig"
@@ -126,7 +126,7 @@
   import { ref, onMounted, reactive, nextTick } from 'vue';
   import { Plus } from '@element-plus/icons-vue';
   import { ElMessage } from 'element-plus';
-  import Search from '@/views/disaster/components/Search.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';

src/views/disaster/disaster-warning/src/config/search.ts

@@ -2,7 +2,7 @@
  * 灾害预警信息搜索配置
  */
 import { ACTIVE_STATUS_OPTIONS } from '@/views/disaster/constant';
-import type { SearchConfig } from '@/views/disaster/types';
+import type { SearchConfig } from '@/types/basic-search';
 // 通用搜索配置
 const BASIC_SEARCH_CONFIG = {
   DISASTER_LEVEL: {

src/views/disaster/types/index.ts

@@ -14,13 +14,3 @@ export interface FileItem {
   fileUrl?: string;
   file?: File;
 }
-
-export interface SearchConfig {
-  label: string;
-  prop: string;
-  component?: string;
-  selectOptions?: any[];
-  componentProps?: any;
-  slot?: string;
-  [key: string]: any; // 添加索引签名
-}

src/views/emergency/emergency-supplies/PageEmergencyList.vue

@@ -3,12 +3,43 @@
     <div class="safety-platform-container__header">
       <div class="breadcrumb-title">物资清单</div>
     </div>
-    <div class="safety-platform-container__main"></div>
+    <div class="safety-platform-container__main">
+      <div class="search-table-container">
+        <header class="disaster-precaution__header">
+          <el-button type="primary" class="search-table-container--button" :icon="Plus">添加物资</el-button>
+          <el-button type="primary" class="search-table-container--button">
+            <template #icon>
+              <SvgIcon iconName="inventory-check" />
+            </template>
+            发起盘点
+          </el-button>
+          <BasicSearch :searchConfig="SUPPLY_LIST_SEARCH_CONFIG" :searchData="searchData" />
+        </header>
+      </div>
+    </div>
   </div>
 </template>
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+  import { reactive } from 'vue';
+  import { Plus } from '@element-plus/icons-vue';
+  // @ts-ignore
+  import SvgIcon from '@/components/SvgIcon/SvgIcon.vue';
+  import BasicSearch from '@/components/BasicSearch.vue';
+  import { SUPPLY_LIST_SEARCH_CONFIG } from './src/config';
+
+  const searchData = reactive({
+    emergencyType: null,
+    supplyType: null,
+    supplyName: null,
+    park: null,
+    location: null,
+    keeperName: null,
+    status: null,
+  });
+</script>
 
 <style scoped lang="scss">
   @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 </style>

src/views/emergency/emergency-supplies/src/config/index.ts

@@ -0,0 +1,4 @@
+import { SUPPLY_LIST_SEARCH_CONFIG } from './search';
+
+export { SUPPLY_LIST_SEARCH_CONFIG };
+

src/views/emergency/emergency-supplies/src/config/search.ts

@@ -0,0 +1,53 @@
+import type { SearchConfig } from '@/types/basic-search';
+import { EMERGENCY_SUPPLY_STATUS_OPTIONS } from '../constant';
+
+export const SUPPLY_LIST_SEARCH_CONFIG: SearchConfig[] = [
+  {
+    label: '应急类型：',
+    prop: 'emergencyType',
+    slot: 'emergencyType',
+  },
+  {
+    label: '物资类型：',
+    prop: 'supplyType',
+    slot: 'supplyType',
+  },
+  {
+    label: '应急物资名称：',
+    prop: 'supplyName',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入应急物资名称',
+    },
+  },
+  {
+    label: '园区：',
+    prop: 'park',
+    slot: 'park',
+  },
+  {
+    label: '地点：',
+    prop: 'location',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入地点',
+    },
+  },
+  {
+    label: '保管人：',
+    prop: 'keeperName',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入保管人姓名',
+    },
+  },
+  {
+    label: '使用状态：',
+    prop: 'status',
+    component: 'ElSelect',
+    selectOptions: EMERGENCY_SUPPLY_STATUS_OPTIONS,
+    componentProps: {
+      placeholder: '请选择使用状态',
+    },
+  },
+];

src/views/emergency/emergency-supplies/src/constant/index.ts

@@ -0,0 +1,19 @@
+/**
+ * 应急物资常量
+ */
+
+export enum EMERGENCY_SUPPLY_STATUS {
+  INTACT = 0,
+  DAMAGED,
+}
+
+export const EMERGENCY_SUPPLY_STATUS_OPTIONS = [
+  {
+    label: '完好',
+    value: EMERGENCY_SUPPLY_STATUS.INTACT,
+  },
+  {
+    label: '缺损',
+    value: EMERGENCY_SUPPLY_STATUS.DAMAGED,
+  },
+];