From e7375ff25af5510af59a20f21449b3531999922e Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期一, 21 十月 2024 23:28:07 +0800
Subject: [PATCH] 页面缓存优化
---
src/store/modules/prodRoute.ts | 14 ++
src/store/modules/queryInpage.ts | 91 ++++++++++++++++++
src/views/components/GeneralTree.vue | 55 ++++++++++
src/store/modules/multipleTab.ts | 4
src/layouts/default/menu/index.vue | 2
src/views/tigerprojects/system/lowcode/composition/index.vue | 4
src/views/tigerprojects/system/lowcode/normal/mainTable.vue | 72 +++++++++++++-
src/layouts/default/tabs/index.vue | 5 +
src/views/tigerprojects/system/lowcode/composition/LeftTree.vue | 21 +++
src/views/tigerprojects/system/lowcode/normal/index.vue | 2
src/components/TigerTree/src/hooks/useTree.ts | 3
11 files changed, 253 insertions(+), 20 deletions(-)
diff --git a/src/components/TigerTree/src/hooks/useTree.ts b/src/components/TigerTree/src/hooks/useTree.ts
index 6015ea3..65865e2 100644
--- a/src/components/TigerTree/src/hooks/useTree.ts
+++ b/src/components/TigerTree/src/hooks/useTree.ts
@@ -5,6 +5,7 @@
import { cloneDeep } from 'lodash-es';
import { unref } from 'vue';
import { forEach } from '/@/utils/helper/treeHelper';
+import { isNullOrUnDef } from '/@/utils/is';
export function useTree(treeDataRef: Ref<TreeDataItem[]>, getFieldNames: ComputedRef<FieldNames>) {
function getAllKeys(list?: TreeDataItem[]) {
@@ -206,7 +207,7 @@
node = item;
return
}
- if(item.children.length>0){
+ if(isNullOrUnDef(item.children) && item.children.length>0){
let res=getNodeById(id,item.children)
if(res!=null){
node = res;
diff --git a/src/layouts/default/menu/index.vue b/src/layouts/default/menu/index.vue
index b403ff3..0eaaf6f 100644
--- a/src/layouts/default/menu/index.vue
+++ b/src/layouts/default/menu/index.vue
@@ -133,7 +133,7 @@
crudColSlots.push(_cruds[i]['colSlot']);
}
}
- const id = { ID: path.split('/')[1], colSlots: colSlots, crudColSlots: crudColSlots, sName: '' };
+ const id = { ID: path.split('/')[1], colSlots: colSlots, crudColSlots: crudColSlots };
go(`/${path.split('/')[1]}/${path.split('/')[2]}/${encodeURI(JSON.stringify(id))}`);
});
} else if (
diff --git a/src/layouts/default/tabs/index.vue b/src/layouts/default/tabs/index.vue
index 189a1b0..28d531b 100644
--- a/src/layouts/default/tabs/index.vue
+++ b/src/layouts/default/tabs/index.vue
@@ -57,6 +57,7 @@
import SettingButton from './components/SettingButton.vue';
import { useHeaderSetting } from '@/hooks/setting/useHeaderSetting';
import { useMenuSetting } from '@/hooks/setting/useMenuSetting';
+import { useProdRouteStore } from '/@/store/modules/prodRoute';
defineOptions({ name: 'MultipleTabs' });
@@ -119,6 +120,10 @@
function handleChange(activeKey: any) {
activeKeyRef.value = activeKey;
+ const useProdRoute = useProdRouteStore();
+ if(activeKey.includes('/CP/')){
+ useProdRoute.setChangeToCPPage(true);
+ }
go(activeKey, false);
}
diff --git a/src/store/modules/multipleTab.ts b/src/store/modules/multipleTab.ts
index 2fd6736..deb7ea7 100644
--- a/src/store/modules/multipleTab.ts
+++ b/src/store/modules/multipleTab.ts
@@ -14,6 +14,7 @@
import projectSetting from '@/settings/projectSetting';
import { useUserStore } from '@/store/modules/user';
+import { useProdRouteStore } from './prodRoute';
export interface MultipleTabState {
cacheTabList: Set<string>;
@@ -85,6 +86,9 @@
const { currentRoute } = router;
const route = unref(currentRoute);
const name = route.name;
+ const useProdRoute = useProdRouteStore();
+ useProdRoute.setChangeToCPPage(false);
+ useProdRoute.setCurProdRotTree([]);
const findTab = this.getCachedTabList.find((item) => item === name);
if (findTab) {
diff --git a/src/store/modules/prodRoute.ts b/src/store/modules/prodRoute.ts
index b3d2342..00c0d33 100644
--- a/src/store/modules/prodRoute.ts
+++ b/src/store/modules/prodRoute.ts
@@ -4,7 +4,7 @@
* @version:
* @Date: 2024-06-18 15:09:47
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-10-17 14:43:28
+ * @LastEditTime: 2024-10-21 23:13:48
*/
import { defineStore } from 'pinia';
import { store } from '@/store';
@@ -18,7 +18,8 @@
curConfig: any;
curSelectedNodes: any;
ItemCode: string;
- curDtl: any
+ curDtl: any;
+ changeToCPPage: boolean;
}
export const useProdRouteStore = defineStore({
@@ -28,7 +29,8 @@
curConfig: {},
curSelectedNodes: {},
ItemCode: '',
- curDtl: {}
+ curDtl: {},
+ changeToCPPage: false
}),
getters: {
getCurProdRotTree(state): MesRotTree[] {
@@ -46,6 +48,9 @@
getcurDtl(state): any {
return state.curDtl;
},
+ getChangeToCPPage(state): boolean {
+ return state.changeToCPPage;
+ },
},
actions: {
setCurPkgConfig(val: any) {
@@ -63,6 +68,9 @@
setcurDtl(val: any) {
this.curDtl = val;
},
+ setChangeToCPPage(val: boolean) {
+ this.changeToCPPage = val;
+ },
resetState() {
this.curProdRotTree = [];
this.curConfig = {};
diff --git a/src/store/modules/queryInpage.ts b/src/store/modules/queryInpage.ts
new file mode 100644
index 0000000..d1b907c
--- /dev/null
+++ b/src/store/modules/queryInpage.ts
@@ -0,0 +1,91 @@
+/*
+ * @Description: 椤甸潰鏌ヨStore
+ * @Author: Ben Lin
+ * @version:
+ * @Date: 2024-06-18 15:09:47
+ * @LastEditors: Ben Lin
+ * @LastEditTime: 2024-10-21 20:32:10
+ */
+import { defineStore } from 'pinia';
+import { store } from '@/store';
+import { isNullOrEmpty } from '/@/utils/is';
+
+interface QueryState {
+ curSearchInfo: any[];
+ curPageName: string;
+ curCPInfo: any[];
+}
+
+export const useQueryStore = defineStore({
+ id: 'app-query',
+ state: (): QueryState => ({
+ curSearchInfo: [],
+ curPageName: '',
+ curCPInfo: []
+ }),
+ getters: {
+ getCurSearchInfo(state): any[] {
+ return state.curSearchInfo;
+ },
+ getCurPageName(state): string {
+ return state.curPageName;
+ },
+ getCurCPInfo(state): any[] {
+ return state.curCPInfo;
+ },
+ },
+ actions: {
+ setCurSearchInfo(val: any) {
+ if (!isNullOrEmpty(val)) {
+ if (!this.curSearchInfo.some((q) => q.name == val.name)) {
+ this.curSearchInfo.push(val);
+ } else {
+ this.curSearchInfo.map((item) => {
+ if (item.name == val.name) {
+ item.searchInfo = val.searchInfo;
+ }
+ });
+ }
+ }
+ },
+ setCurCPInfo(val: any) {
+ if (!isNullOrEmpty(val)) {
+ if (!this.curCPInfo.some((q) => q.name == val.name)) {
+ this.curCPInfo.push(val);
+ } else {
+ this.curCPInfo.map((item) => {
+ if (item.name == val.name) {
+ item.treeInfo = val.treeInfo;
+ item.navInfo = val.navInfo;
+ item.config = val.config;
+ }
+ });
+ }
+ }
+ },
+ setCurPageName(val: string) {
+ this.curPageName = val;
+ },
+ resetState() {
+ this.curSearchInfo = [];
+ this.curPageName = '';
+ this.curCPInfo = [];
+ },
+ /**
+ * @description: 鏌ヨ鎻愪氦
+ * @param {string} tid
+ * @return {*}
+ */
+ async submitFunc(name, f) {
+ this.setCurSearchInfo({ name: name, searchInfo: f.getFieldsValue() });
+ },
+ async resetFunc(name, f) {
+ this.setCurSearchInfo({ name: name, searchInfo: f.getFieldsValue() });
+ },
+ },
+});
+
+// Need to be used outside the setup
+export function useQueryWithOut() {
+ return useQueryStore(store);
+}
diff --git a/src/views/components/GeneralTree.vue b/src/views/components/GeneralTree.vue
index 0d8e9c1..9a0827d 100644
--- a/src/views/components/GeneralTree.vue
+++ b/src/views/components/GeneralTree.vue
@@ -4,7 +4,7 @@
* @version:
* @Date: 2024-06-19 11:07:21
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-10-05 14:28:09
+ * @LastEditTime: 2024-10-21 22:09:53
-->
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
@@ -23,12 +23,19 @@
@unselect="UnSelect"
:beforeRightClick="props.beforeRightClick"
:defaultExpandAll="true"
+ ref="tigerTree"
/>
</div>
</template>
<script lang="ts" setup>
- import { onMounted, ref } from 'vue';
- import { ContextMenuItem, ContextMenuOptions, FieldNames, TigerTree, TreeItem } from '/@/components/TigerTree';
+ import { onMounted, ref, watch } from 'vue';
+ import {
+ ContextMenuItem,
+ ContextMenuOptions,
+ FieldNames,
+ TigerTree,
+ TreeItem,
+ } from '/@/components/TigerTree';
import { EventDataNode } from 'ant-design-vue/lib/tree';
defineOptions({ name: 'CustTree' });
@@ -52,6 +59,7 @@
default: undefined,
},
});
+ const tigerTree = ref(null);
function handleSelect(keys, e) {
emit('select', keys[0], e);
@@ -65,5 +73,46 @@
emit('UnSelect', node);
}
+ function expandAll(expandAll: boolean) {
+ if (tigerTree.value) {
+ tigerTree.value.expandAll(expandAll);
+ }
+ }
+
+ function getExpandedKeys() {
+ if (tigerTree.value) {
+ return tigerTree.value.getExpandedKeys();
+ }
+ return [];
+ }
+
+ function setSelectedKeys(keys: KeyType[]) {
+ if (tigerTree.value) {
+ tigerTree.value.setSelectedKeys(keys);
+ }
+ }
+
+ function getSelectedKeys() {
+ if (tigerTree.value) {
+ return tigerTree.value.getSelectedKeys();
+ }
+ return [];
+ }
+
+ function getNodeById(Id: string) {
+ if (tigerTree.value) {
+ return tigerTree.value.getNodeById(Id);
+ }
+ return {};
+ }
+
+ defineExpose({
+ getExpandedKeys,
+ expandAll,
+ setSelectedKeys,
+ getSelectedKeys,
+ getNodeById
+ });
+
onMounted(() => {});
</script>
diff --git a/src/views/tigerprojects/system/lowcode/composition/LeftTree.vue b/src/views/tigerprojects/system/lowcode/composition/LeftTree.vue
index 5861985..3bf3c07 100644
--- a/src/views/tigerprojects/system/lowcode/composition/LeftTree.vue
+++ b/src/views/tigerprojects/system/lowcode/composition/LeftTree.vue
@@ -4,7 +4,7 @@
* @version:
* @Date: 2024-06-26 15:31:43
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-07-23 23:40:41
+ * @LastEditTime: 2024-10-21 22:32:11
-->
<template>
<GeneralTree
@@ -15,12 +15,13 @@
:create-icon="createIcon"
:fieldNames="fieldNames"
:beforeRightClick="getRightMenu"
+ ref="generalTree"
/><!--
add
@handle-add="handleAdd" -->
</template>
<script lang="ts" setup>
- import { Ref, inject, onMounted, ref } from 'vue';
+ import { Ref, inject, nextTick, onMounted, ref } from 'vue';
import { isNullOrUnDef } from '/@/utils/is';
import GeneralTree from '/@/views/components/GeneralTree.vue';
import { TreeItem } from '/@/components/TigerTree';
@@ -50,9 +51,19 @@
const treeData = ref<TreeItem[]>([]);
const title = ref('');
const fieldNames = ref({});
+ const generalTree = ref(null);
+ const ExpandedKeys = ref([]);
onMounted(async () => {
await fetch(objParams.value['Name']);
+ await nextTick();
+ if (generalTree.value) {
+ generalTree.value.expandAll(true);
+ ExpandedKeys.value = generalTree.value.getExpandedKeys();
+ generalTree.value.setSelectedKeys(["C2A68FC9-4B23-43F1-8AC2-C99969EE64B8"]); //DE4F54C2-ECF3-4FFA-8AD9-6F761BFCD52A
+ const xx = generalTree.value.getNodeById('C2A68FC9-4B23-43F1-8AC2-C99969EE64B8');
+ console.log(xx);
+ }
});
/**
@@ -83,6 +94,10 @@
function handleSelect(Id = '', info) {
selectedNodes.value = info.selectedNodes;
+ if (generalTree.value) {
+ const keys = generalTree.value.getSelectedKeys();
+ console.log(keys);
+ }
emit('select', SelectNode(selectedNodes));
}
@@ -100,7 +115,7 @@
* @description: 鑾峰彇鍙抽敭鑿滃崟鍒楄〃锛屽甫鍏mit浜嬩欢
* @param {*} node
* @return {*}
- */
+ */
function getRightMenu(node: EventDataNode) {
return GetRightMenuList(node, emit, objParams.value['CODE']);
}
diff --git a/src/views/tigerprojects/system/lowcode/composition/index.vue b/src/views/tigerprojects/system/lowcode/composition/index.vue
index 18ca506..9ee294e 100644
--- a/src/views/tigerprojects/system/lowcode/composition/index.vue
+++ b/src/views/tigerprojects/system/lowcode/composition/index.vue
@@ -4,7 +4,7 @@
* @version:
* @Date: 2024-06-18 23:30:30
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-10-15 21:25:51
+ * @LastEditTime: 2024-10-21 23:03:27
-->
<template>
<PageWrapper
@@ -96,7 +96,7 @@
import { useMessage } from '/@/hooks/web/useMessage';
import LogicFlow from '@logicflow/core';
- defineOptions({ name: 'DeptManagement' });
+ defineOptions({ name: '宸ュ崟宸ヨ壓缁戝畾' });
const { notification, createErrorModal } = useMessage();
const go = useGo();
diff --git a/src/views/tigerprojects/system/lowcode/normal/index.vue b/src/views/tigerprojects/system/lowcode/normal/index.vue
index bc9dbbc..7222220 100644
--- a/src/views/tigerprojects/system/lowcode/normal/index.vue
+++ b/src/views/tigerprojects/system/lowcode/normal/index.vue
@@ -4,7 +4,7 @@
* @version:
* @Date: 2024-05-30 13:28:20
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-10-15 22:00:05
+ * @LastEditTime: 2024-10-20 21:51:55
-->
<template>
<div>
diff --git a/src/views/tigerprojects/system/lowcode/normal/mainTable.vue b/src/views/tigerprojects/system/lowcode/normal/mainTable.vue
index f21dd1b..02b8ba7 100644
--- a/src/views/tigerprojects/system/lowcode/normal/mainTable.vue
+++ b/src/views/tigerprojects/system/lowcode/normal/mainTable.vue
@@ -81,19 +81,22 @@
import { isNullOrEmpty, isNullOrUnDef } from '/@/utils/is';
import { useModal } from '/@/components/Modal';
import { useGo } from '/@/hooks/web/usePage';
- import { DeleteEntity, getEntity, getListByPage } from '/@/api/tigerapi/system';
+ import { getListByPage } from '/@/api/tigerapi/system';
import { useI18n } from '/@/hooks/web/useI18n';
import { EntityCustFunctionType } from '/@/api/tigerapi/model/basModel';
import { getRoleButtons } from '/@/api/sys/menu';
import { useUserStore } from '/@/store/modules/user';
import { useRouter } from 'vue-router';
- import { GenerateActionButton, initRoute, OpenCustModal } from '../data';
+ import { GenerateActionButton, initRoute } from '../data';
import LogicFlow from '@logicflow/core';
import { isFunction } from 'xe-utils';
import { CustModalParams } from '/@/api/tigerapi/model/systemModel';
+ import { useQueryStore } from '/@/store/modules/queryInpage';
const { t } = useI18n();
const { currentRoute } = useRouter();
+ const route = unref(currentRoute);
+ const useQuery = useQueryStore();
const props = defineProps({
useTableData: { type: Object as PropType<{}>, default: { table: [] } },
crudColSlots: { type: Object as PropType<any> },
@@ -184,10 +187,14 @@
}
: '',
},
+ beforeFetch: SearchInfoFn,
+ afterFetch: afterFetchFn,
columns: _columns as unknown as BasicColumn[],
formConfig: {
labelWidth: 140,
schemas: _searchFormSchema as unknown as FormSchema[],
+ submitFunc: () => Search(), //鑷畾涔夋煡璇㈡彁浜ゆ寜閽殑鏂规硶锛岃Е鍙戞煡璇㈡彁浜や簨浠�
+ resetFunc: () => useQuery.resetFunc(route.name, getForm()),
},
useSearchForm: true,
showTableSetting: true,
@@ -209,7 +216,7 @@
() => AuthOption.value,
(newVal, oldVal) => {
nextTick(() => {
- if (!isNullOrEmpty(newVal.BY_ORG)) {
+ if (!isNullOrEmpty(newVal.BY_ORG) && !isNullOrUnDef(savedParams.value['params'])) {
getForm().setFieldsValue(savedParams.value['params']);
setProps({
searchInfo: {
@@ -232,12 +239,65 @@
{ deep: true, immediate: true },
);
- onMounted(() => {
- if (!isNullOrUnDef(savedParams)) {
+ onMounted(async () => {
+ if (!isNullOrUnDef(savedParams) && !isNullOrUnDef(savedParams.value['params'])) {
getForm().setFieldsValue(savedParams.value['params']);
reload();
}
+ // if (
+ // !isNullOrUnDef(useQuery.getCurSearchInfo['searchInfo']) &&
+ // useQuery.getCurSearchInfo['name'] == route.name
+ // ) {
+ // getForm().resetFields();
+ // const searchInfo = useQuery.getCurSearchInfo['searchInfo'];
+ // await getForm().setFieldsValue(searchInfo);
+ // }
});
+
+ /**
+ * @description: 鏌ヨ鎻愪氦
+ * @return {*}
+ */
+ async function Search() {
+ useQuery.submitFunc(route.name, getForm()).then(() => {
+ reload();
+ });
+ }
+
+ /**
+ * @description: 璋冪敤api鍓嶏紝鍙傛暟鏁寸悊
+ * @param {*} t
+ * @return {*}
+ */
+ function SearchInfoFn(t) {
+ if (
+ !isNullOrUnDef(useQuery.getCurSearchInfo) &&
+ useQuery.getCurSearchInfo.some((q) => q.name == route.name)
+ ) {
+ const curSearchInfo = useQuery.getCurSearchInfo.filter((q) => q.name == route.name);
+ const Keys = Object.getOwnPropertyNames(curSearchInfo[0].searchInfo);
+ for (const k in Keys) {
+ t[Keys[k]] = curSearchInfo[0].searchInfo[Keys[k]];
+ }
+ useQuery.setCurSearchInfo({name:route.name, searchInfo:t});
+ }
+ return t;
+ }
+
+ /**
+ * @description: 璇锋眰涔嬪悗瀵硅繑鍥炲�艰繘琛屽鐞�
+ * @param {*} t
+ * @return {*}
+ */
+ function afterFetchFn(t) {
+ if (
+ !isNullOrUnDef(useQuery.getCurSearchInfo) &&
+ useQuery.getCurSearchInfo.some((q) => q.name == route.name)
+ ) {
+ const curSearchInfo = useQuery.getCurSearchInfo.filter((q) => q.name == route.name);
+ getForm().setFieldsValue(curSearchInfo[0].searchInfo);
+ }
+ }
const currlf = ref(null) as Ref<LogicFlow | null>;
/**
@@ -271,7 +331,7 @@
selectVals,
colSlots,
ifSave: true,
- sName: objParams.value['sName']
+ sName: objParams.value['sName'],
};
/* 鏍规嵁鑿滃崟璁剧疆鐨勬寜閽嚜鍔ㄧ敓鎴愭搷浣滃垪涓殑鎸夐挳 */
--
Gitblit v1.9.3