rsetcallback

src/components/form/area/index.vue

@@ -14,7 +14,7 @@ const cascaderProps = {
     label: 'name',
     value: 'id',
     checkStrictly: true,
-    showAllLevels: false
+    emitPath: false
 }
 const dictData = useDictData()
 const options = dictData.state.area

src/utils/tableStore.ts

@@ -9,7 +9,9 @@ interface TableStoreParams {
     column: TableColumn[]
     params?: anyObj
     method?: Method
-    isWebPaging?: boolean // 是否前端分页   
+    isWebPaging?: boolean // 是否前端分页
+    resetCallback?: () => void
+    loadCallback?: () => void
 }
 
 export default class TableStore {
@@ -29,7 +31,9 @@ export default class TableStore {
             pageSize: 20
         },
         loading: true,
-        column: []
+        column: [],
+        loadCallback: null,
+        resetCallback: null
     })
 
     constructor(public options: TableStoreParams) {
@@ -38,6 +42,7 @@ export default class TableStore {
         this.isWebPaging = options.isWebPaging || false
         this.method = options.method || 'GET'
         this.table.column = options.column
+        this.table.resetCallback = options.resetCallback || null
         Object.assign(this.table.params, options.params)
     }
 
@@ -61,6 +66,7 @@ export default class TableStore {
                 this.table.webPagingData = window.XEUtils.chunk(this.table.data, this.table.params.pageSize)
                 this.table.data = this.table.webPagingData[this.table.params.pageNum - 1]
             }
+            this.table.loadCallback && this.table.loadCallback()
             this.table.loading = false
         })
     }
@@ -85,6 +91,7 @@ export default class TableStore {
                     delete this.initData.pageSize
                     Object.assign(this.table.params, this.initData)
                     this.index()
+                    this.table.resetCallback && this.table.resetCallback()
                 }
             ],
             [

src/views/voltage/sags/operationsManagement/index.vue

@@ -6,24 +6,20 @@
                     <Area v-model='tableStore.table.params.deptIndex' />
                 </el-form-item>
                 <el-form-item label='终端状态'>
-                    <el-select v-model='tableStore.table.params.runFlag'
-                               placeholder='请选择'>
+                    <el-select v-model='form.runFlag' placeholder='请选择' @change='onRunFlagChange'>
                         <el-option label='投运' value='0' />
                         <el-option label='热备用' value='1' />
                         <el-option label='停运' value='2' />
                     </el-select>
                 </el-form-item>
                 <el-form-item label='通讯状态'>
-                    <el-select v-model='tableStore.table.params.comFlag'
-                               placeholder='请选择'>
+                    <el-select v-model='form.comFlag' placeholder='请选择' @change='onComFlagChange'>
                         <el-option label='正常' value='1' />
                         <el-option label='中断' value='0' />
                     </el-select>
                 </el-form-item>
                 <el-form-item label='厂家'>
-                    <el-select v-model='tableStore.table.params.manufacturer'
-                               placeholder='请选择'
-                    >
+                    <el-select v-model='form.manufacturer' placeholder='请选择' @change='onManufacturerChange'>
                         <el-option
                             v-for='item in manufacturer'
                             :key='item.id'
@@ -33,7 +29,8 @@
                     </el-select>
                 </el-form-item>
                 <el-form-item label='筛选数据'>
-                    <el-input v-model='tableStore.table.params.searchValue'  placeholder='请输入' />
+                    <el-input v-model='tableStore.table.params.searchValue'
+                              placeholder='根据变电站,终端编号,型号或网络参数查询' style='width:300px' />
                 </el-form-item>
             </template>
         </TableHeader>
@@ -41,7 +38,7 @@
     </div>
 </template>
 <script setup lang='tsx'>
-import { ref, onMounted, provide } from 'vue'
+import { ref, onMounted, provide, reactive } from 'vue'
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
 import TableHeader from '@/components/table/header/index.vue'
@@ -101,12 +98,24 @@ const tableStore = new TableStore({
                 }
             }
         }
-    ]
+    ],
+    resetCallback: () => {
+        form.runFlag = ''
+        form.comFlag = ''
+        form.manufacturer = ''
+    }
 })
-tableStore.table.params.deptIndex = '5699e5916a18a6381e1ac92da5bd2628'
+const form = reactive({
+    runFlag: '',
+    comFlag: '',
+    manufacturer: ''
+})
+tableStore.table.params.deptIndex = dictData.state.area[0].id
 tableStore.table.params.runFlag = []
 tableStore.table.params.comFlag = []
 tableStore.table.params.manufacturer = []
+tableStore.table.params.statisticalType = {}
+tableStore.table.params.serverName = 'event-boot'
 tableStore.table.params.searchValue = ''
 provide('tableStore', tableStore)
 
@@ -114,6 +123,19 @@ onMounted(() => {
     tableStore.index()
 })
 
+const onRunFlagChange = (val: any) => {
+    tableStore.table.params.runFlag = [val]
+}
+const onComFlagChange = (val: any) => {
+    tableStore.table.params.comFlag = [val]
+}
+const onManufacturerChange = (val: any) => {
+    let obj = manufacturer.find(item => item.id === val) as any
+    obj.label = obj.name
+    obj.value = obj.id
+    tableStore.table.params.manufacturer = [obj]
+}
+
 const addMenu = () => {
 }
 </script>

types/table.d.ts

@@ -23,6 +23,8 @@ declare global {
             pageSize: number
             [key: string]: any
         }
+        loadCallback: () => void | null
+        resetCallback: () => void | null
     }
 
     /* 表格行 */