字典缓存

2023-12-28 11:27:03 +08:00
parent afeadbe26a
commit c1b08dabd4
7 changed files with 102 additions and 20 deletions
--- a/src/components/table/fieldRender/index.vue
+++ b/src/components/table/fieldRender/index.vue
@@ -40,10 +40,9 @@
    </div>

    <!-- customTemplate 自定义模板 -->
-    <div
-        v-if="field.render == 'customTemplate'"
-        v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"
-    ></div>
+    <div v-if="field.render == 'customTemplate'">
+        {{ field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : '' }}
+    </div>

    <!-- 自定义组件/函数渲染 -->
    <component
@@ -143,21 +142,22 @@

 <script setup lang="ts">
 import { ref, inject } from 'vue'
-import type { TagProps, TableColumnCtx } from 'element-plus'
+import type { TagProps } from 'element-plus'
 import type TableStoreClass from '@/utils/tableStore'
 import { fullUrl, timeFormat } from '@/utils/common'
+import { VxeColumnProps } from 'vxe-table/types/all'
 const TableStore = inject('tableStore') as TableStoreClass

 interface Props {
    row: TableRow
    field: TableColumn
-    column: TableColumnCtx<TableRow>
+    column: VxeColumnProps
    index: number
 }
 const props = defineProps<Props>()

 // 字段值（单元格值）
-const fieldName = ref(props.field.prop)
+const fieldName = ref(props.field.field)
 const fieldValue = ref(fieldName.value ? props.row[fieldName.value] : '')
 if (fieldName.value && fieldName.value.indexOf('.') > -1) {
    let fieldNameArr = fieldName.value.split('.')
--- a/src/components/table/index.vue
+++ b/src/components/table/index.vue
@@ -7,6 +7,7 @@
        :border="true"
        v-loading="tableStore.table.loading"
        stripe
+        size="small"
        @checkbox-change="onSelectionChange"
        v-bind="$attrs"
        :column-config="{resizable: true}"
@@ -95,8 +96,8 @@ const pageSizes = computed(() => {
 /*
 * 记录选择的项
 */
-const onSelectionChange = (selection: TableRow[]) => {
-    tableStore.onTableAction('selection-change', selection)
+const onSelectionChange = (selection: any) => {
+    // tableStore.onTableAction('selection-change', selection)
 }

 const getRef = () => {
--- a/src/stores/constant/cacheKey.ts
+++ b/src/stores/constant/cacheKey.ts
@@ -9,4 +9,6 @@ export const ADMIN_INFO = 'adminInfo'
 export const STORE_CONFIG = 'storeConfig'

 // 后台标签页
-export const STORE_TAB_VIEW_CONFIG = 'storeTabViewConfig'
+export const STORE_TAB_VIEW_CONFIG = 'storeTabViewConfig'
+// 字典
+export const DICT_DATA = 'dictData'
--- a/src/stores/dictData.ts
+++ b/src/stores/dictData.ts
@@ -0,0 +1,30 @@
+import { defineStore } from 'pinia'
+import { DICT_DATA } from '@/stores/constant/cacheKey'
+import type { DictData, BasicDictData } from '@/stores/interface/index'
+import { reactive } from 'vue'
+
+export const useDictData = defineStore(
+    'dictData',
+    () => {
+        const state: DictData = reactive({
+            basic: [],
+            // 其他接口获取的字典，比如区域 
+        })
+        const setBasicData = (data: BasicDictData[]) => {
+            state.basic = data
+        }
+        const getBasicData = (code: string) => {
+            return state.basic.filter(item => item.code === code)[0]?.children || []
+        }
+        return {
+            state,
+            setBasicData,
+            getBasicData
+        }
+    },
+    {
+        persist: {
+            key: DICT_DATA
+        }
+    }
+)
--- a/src/stores/interface/index.ts
+++ b/src/stores/interface/index.ts
@@ -41,5 +41,18 @@ export interface AdminInfo {
    last_login_time: string
    token: string
    refresh_token: string
-    super:boolean
+    super: boolean
+}
+
+export interface DictData {
+    basic: BasicDictData[]
+}
+
+export interface BasicDictData {
+    name: string
+    id: string
+    code: string
+    value: null
+    sort: number | null
+    children?: BasicDictData[]
 }
--- a/src/views/voltage/sags/operationsManagement/index.vue
+++ b/src/views/voltage/sags/operationsManagement/index.vue
@@ -20,7 +20,7 @@
 </template>
 <script setup lang="ts">
 import { Plus } from '@element-plus/icons-vue'
-import { ref, onMounted, provide } from 'vue'
+import { ref, onMounted, provide, h } from 'vue'
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
 import TableHeader from '@/components/table/header/index.vue'
@@ -34,13 +34,49 @@ const tableStore = new TableStore({
    method: 'POST',
    column: [
        { title: '序号', type: 'seq', align: 'center', width: 60 },
-        { title: '区域', field: 'userName', align: 'center', width: 120 },
-        { title: '供电公司', field: 'operate', align: 'center', width: 220 },
-        { title: '变电站', field: 'describe', align: 'center', showOverflow: true, minWidth: 200 },
-        { title: '终端编号', field: 'type', align: 'center', width: 160 },
-        { title: '投运时间', field: 'type', align: 'center', width: 100 },
-        { title: '厂家', field: 'ip', align: 'center', width: 160 },
-        { title: '', field: 'level', align: 'center', width: 100 }
+        { title: '区域', field: 'areaName', align: 'center', width: 120 },
+        { title: '供电公司', field: 'gdName', align: 'center', width: 120 },
+        { title: '变电站', field: 'bdName', align: 'center', showOverflow: true, minWidth: 100 },
+        { title: '终端编号', field: 'devName', align: 'center', width: 160 },
+        { title: '投运时间', field: 'loginTime', align: 'center', width: 200 },
+        { title: '厂家', field: 'manufacturer', align: 'center', width: 160 },
+        { title: '型号', field: 'devType', align: 'center', width: 200 },
+        { title: '网络参数', field: 'ip', align: 'center', width: 200 },
+        { title: '端口', field: 'port', align: 'center', width: 100 },
+        { title: '终端状态', field: 'runFlag', align: 'center', width: 100 },
+        { title: '通讯状态', field: 'comFlag', align: 'center', width: 100 },
+        { title: '最新数据', field: 'updateTime', align: 'center', width: 200 },
+        {
+            title: '评价',
+            field: 'onlineEvaluate',
+            align: 'center',
+            width: 100,
+            render: 'customTemplate',
+            customTemplate: row => {
+                return h(
+                    'el-tag',
+                    {
+                        effect: 'dark',
+                        type:
+                            row.onlineEvaluate * 100 > 90
+                                ? 'success'
+                                : row.onlineEvaluate * 100 > 60
+                                ? 'warning'
+                                : 'danger'
+                    },
+                    row.onlineEvaluate * 100 + '%'
+                )
+                // if (row.onlineEvaluate == null) {
+                //     return '-'
+                // } else if (row.onlineEvaluate * 100 > 90) {
+                //     return `<el-tag  effect="dark" type="success"> 优 </el-tag> `
+                // } else if (row.onlineEvaluate * 100 > 60) {
+                //     return `<el-tag  effect="dark" type="warning"> 良 </el-tag> `
+                // } else {
+                //     return `<el-tag  effect="dark" type="danger"> 差 </el-tag> `
+                // }
+            }
+        }
    ]
 })
 tableStore.table.params.deptIndex = '5699e5916a18a6381e1ac92da5bd2628'