From ab88ad3e68cd79b1b569481569f4a1e631603c81 Mon Sep 17 00:00:00 2001 From: raofuzi <2641346316@qq.com> Date: Fri, 12 Apr 2024 09:41:39 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layout/components/Header/RecycleModal.vue | 19 ++- src/store/modules/final.ts | 55 +++++++ src/views/final/aside/Aside.vue | 154 ++++++++++++++---- src/views/final/content/Content.vue | 2 +- 4 files changed, 193 insertions(+), 37 deletions(-) diff --git a/src/layout/components/Header/RecycleModal.vue b/src/layout/components/Header/RecycleModal.vue index 46688d4..0a061f0 100644 --- a/src/layout/components/Header/RecycleModal.vue +++ b/src/layout/components/Header/RecycleModal.vue @@ -66,6 +66,15 @@ const viewLabel = computed(() => { return item?.label }) +const maxHeight = computed(() => { + let height = "800"; + const screenWidth = window.screen.width; + if(screenWidth <= 1920) { + height = "600"; + } + return height + 'px'; +}) + const masonryRef = ref(null) const el = ref(null) const elwc = ref(null) @@ -383,7 +392,8 @@ async function onChange() { // orderbyname: val, orderByUptime: timeRange.value } - pagination.pageNo = 1 + pagination.pageNo = 1; + canloadMore = true; const list = await featchList() listData.value = list layout() @@ -399,7 +409,8 @@ async function onChangeView() { // orderbyname: val, orderBySimilarity: similarRange.value } - pagination.pageNo = 1 + pagination.pageNo = 1; + canloadMore = true; const list = await featchList() listData.value = list layout() @@ -601,13 +612,13 @@ watch(() => show.value, watch(() => pagination.pageNo, (newVal, oldVal) => { + console.log("加载了22222222222222222---------------------------", newVal, oldVal, canloadMore); if(newVal == oldVal) { return } if((newVal == 1 || newVal == 2) && canloadMore) { setTimeout(() => { nextTick(() => { - console.log("加载了22222222222222222---------------------------", newVal); loading = false loadMore(); }) @@ -695,7 +706,7 @@ watch(() => pagination.pageNo, -
+
({ + systemConfig: null, customConfig: null, asideValue: null, listKey: 0, + searchValue: "", + isAllowDownload: true, + timeNum: 0, + filterConfig: [], }), getters: { + getConfig(): AsideConfig | null { + return this.systemConfig + }, getCustomConfig(): string[] | null { return this.customConfig }, getAsideValue(): any { return this.asideValue }, + getSearchValue(): any { + return this.searchValue + }, + getIsAllowDownload(): any { + return this.isAllowDownload + }, + getTimeNum(): any { + return this.timeNum + }, + getFilterConfig(): any { + return this.filterConfig + }, }, actions: { + setConfig(config: AsideConfig) { + this.systemConfig = config + console.log("systemConfig----------", config); + }, setAsideValue(value) { this.asideValue = value }, setListKey() { this.listKey = new Date().getTime() }, + setSearchValue(value) { + this.searchValue = value + }, + setIsAllowDownload(value) { + this.isAllowDownload = value + }, + setTimeNum(value) { + this.timeNum = value + }, + // 设置个性化配置 + setCustomConfig(value) { + this.customConfig = value + }, + setFilterConfig(value) { + this.filterConfig = value + }, + // 获取系统配置信息 + async fetchConfig() { + const response = await getConfig() + console.log("response.data----------", response.data); + this.setConfig(response.data) + return response.data + }, // 获取终审个性化配置 async fetchCustomConfig() { const res = await getFilter(1) diff --git a/src/views/final/aside/Aside.vue b/src/views/final/aside/Aside.vue index af48f26..66d64da 100644 --- a/src/views/final/aside/Aside.vue +++ b/src/views/final/aside/Aside.vue @@ -22,6 +22,8 @@ import type { AsideEntity } from "@/config/aside"; import { asideMap } from "@/config/final"; import type { AsideConfig } from "/#/api"; import emitter from "@/utils/mitt"; +import { cloneDeep, isEqual } from "lodash-es"; +import { getFilterList } from "@/api/home/main"; const emit = defineEmits(["inputChange"]); const finalStore = useFinal(); @@ -40,6 +42,9 @@ Object.keys(asideMap).forEach((key) => { const filterModalRef:any = ref(null); const newFilterModalRef = ref(null); const customModalRef = ref(null); +const customObjRef = ref(null); // 获取高级筛选获取的值 +const customTempObjRef = ref(null); // 获取高级筛选获取的值(作对比) + const configFilterRef = ref([]); // 获取排序的值 const AdvanceFilterRef: any = ref(null); function showModal(modalRef: any) { @@ -61,6 +66,7 @@ mousetrap.bind("[", collapseHandler); onMounted(() => { nextTick(() => { computeSlideHeight(); + // let tempAsideValue = cloneDeep(asideValue); }); }); @@ -96,40 +102,96 @@ function computeSlideHeight() { useWindowSizeFn(computeSlideHeight, 280); onBeforeMount(async () => { + finalStore.fetchConfig(); finalStore.fetchCustomConfig(); }); -finalStore.$subscribe(() => { - const customConfig = finalStore.getCustomConfig; - - if (customConfig === null) return; - - const showKeys: string[] = [...customConfig]; - const defaultKeys = Object.keys(asideMap).filter( - (key) => asideMap[key].isDefaultFilter - ); - showKeys.unshift(...defaultKeys); - - Object.keys(asideMap).forEach((key) => { - // 设置显示的或者默认显示的 - if (key.startsWith("iz")) - asideVisible[key] = - asideMap[key] && (showKeys.includes(key) || asideMap[key].isDefaultFilter); - }); - - const items = showKeys.reduce((acc, key) => { - if (asideMap[key]) { - const config = { - key, - config: asideMap[key], - }; - return [...acc, config]; - } else { - return acc; +nextTick(()=>{ + finalStore.$subscribe(() => { + const config = finalStore.getConfig; + const customConfig = finalStore.getCustomConfig; + console.log("customConfig", customConfig, config); + console.log("configFilterRef", configFilterRef.value, finalStore.getFilterConfig); + console.log("customObjRef", customObjRef.value, customTempObjRef.value); + if ( + configFilterRef.value.length > 0 && + isEqual(configFilterRef.value, finalStore.getFilterConfig) && + customObjRef.value && + isEqual(customObjRef.value, customTempObjRef.value) + ) { + return; } - }, []); - - showItems.value = items; + if (config == null || customConfig == null) return; + // console.log("config", config, "customConfig", customConfig); + /* rao + const showKeys = [...customConfig].filter(key => !asideMap[key].isDefaultFilter)// 获取customConfig 非isDefaultFilter的选项 + const defaultKeys = Object.keys(asideMap).filter(key => asideMap[key].isDefaultFilter)// 获取asideMap isDefaultFilter的选项 + showKeys.unshift(...defaultKeys) + */ + + let sortKeyList: any = []; + finalStore.getFilterConfig.map((item: any) => { + sortKeyList.push(item?.id); + }); + const showKeys = [...sortKeyList]; + + Object.keys(config).forEach((key) => { + if (key.startsWith("iz") && asideMap[key] !== undefined) + asideVisible[key] = + (showKeys.includes(key) || asideMap[key].isDefaultFilter) && config[key] === "Y"; + }); + if (customObjRef.value) { + // 赋值 + Object.keys(customObjRef.value).map((key) => { + if (asideMap.hasOwnProperty(key)) { + const str = key.toLowerCase(); + if (str == "izsimilarity") { + if (typeof customObjRef.value[str] == "string") { + customObjRef.value[str] = customObjRef.value[str].split(","); + } + asideValue[key] = customObjRef.value[str]; // 赋值 + } else if (str == "izyear") { + if (typeof customObjRef.value[str] == "string") { + let time = customObjRef.value[str].split("-"); + time[0] = new Date(time[0]).getTime(); + time[1] = new Date(time[1]).getTime(); + customObjRef.value[str] = time; + } + asideValue[key] = customObjRef.value[str]; // 赋值 + } else if (str != "izsimilarity" && str != "izyear" && customObjRef.value[str]) { + asideValue[key] = customObjRef.value[str]; // 赋值 + } else { + asideValue[key] = null; + } + // asideMap[str].defaultValue = customObjRef.value[str];// 赋值 + } + }); + customTempObjRef.value = customObjRef.value; + console.log("asideValue直接处理后的结果", asideValue); + console.log("customTempObjRef.value", customTempObjRef.value); + let tempobj = cloneDeep(asideValue); + console.log("tempObj", tempobj); + finalStore.setAsideValue(tempobj); + } + const items = showKeys.reduce((acc, key) => { + const currentData = asideMap[key]; + const render = currentData?.render; + if (render !== false) { + const str = key?.toLowerCase(); + + const o = { + key: str, + config: asideMap[str], + }; + return [...acc, o]; + } else { + return acc; + } + }, []); + console.log("showItems=================================", items); + showItems.value = items; + configFilterRef.value = finalStore.getFilterConfig; + }); }); watch(asideVisible, (newVal) => { @@ -159,7 +221,20 @@ function scrollHandler(key: string) { element?.scrollIntoView(true); } -function filterHandler(searchId: string) { +async function filterHandler(searchId: string) { + const res = await getFilterList({ userSearchId: searchId }); + if (res.code == "OK") { + let obj = res.data; + customObjRef.value = res.data; + let showKeys: any[] = []; + Object.keys(obj).map((key) => { + if (asideMap.hasOwnProperty(key)) { + showKeys.push(key); + } + }); + // console.log(showKeys); + finalStore.setCustomConfig(showKeys); + } emitter.emit("filter-final", searchId); } @@ -169,6 +244,20 @@ function editFilter(filter: any) { modal.edit(filter); } +function updateComponent(key, e) { + console.log("跟新值", key, e); + console.log("tempAsideValue跟新值", finalStore.getAsideValue, asideValue); + // let tempAsideValue = finalStore.getAsideValue || asideValue; + let tempobj = cloneDeep(asideValue); + console.log(tempobj, "tempobj"); + tempobj[key] = e; + console.log(tempobj, "tempobj After"); + customObjRef.value = tempobj; + // asideValue = Object.assign({}, asideValue, tempobj); + console.log("asideValue跟新值", tempobj); + finalStore.setAsideValue(tempobj); +} + watch(asideValue, (newVal) => { finalStore.setAsideValue(newVal); }); @@ -225,9 +314,10 @@ const handleOk = (item: any) => { :is="item.config.component" v-for="(item, index) in showItems" :id="item.key" - :key="index" + :key="item.key" v-model:value="asideValue[item.key]" :label="item.config.label" + @update:value="(e) => updateComponent(item.key, e)" /> diff --git a/src/views/final/content/Content.vue b/src/views/final/content/Content.vue index eb4b794..4bbacf0 100644 --- a/src/views/final/content/Content.vue +++ b/src/views/final/content/Content.vue @@ -274,7 +274,7 @@ async function formatColumns() { NButton, { 'strong': true, - 'tertiary': true, + // 'tertiary': true, 'text': true, 'size': 'small', 'text-color': '#507AFD', From 663afdaf5efeab0bf65861dfae63822711bc67e1 Mon Sep 17 00:00:00 2001 From: raofuzi <2641346316@qq.com> Date: Fri, 12 Apr 2024 16:14:15 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components.d.ts | 8 - src/store/modules/final.ts | 28 +- src/views/final/aside/Aside.vue | 134 ++----- src/views/final/comp/CustomFilterModalVue.vue | 344 +++++++++++------- 4 files changed, 268 insertions(+), 246 deletions(-) diff --git a/components.d.ts b/components.d.ts index 6458938..11049e1 100644 --- a/components.d.ts +++ b/components.d.ts @@ -11,7 +11,6 @@ declare module 'vue' { BasicModal: typeof import('./src/components/Modal/BasicModal.vue')['default'] DataHeader: typeof import('./src/components/DataHeader/index.vue')['default'] NAvatar: typeof import('naive-ui')['NAvatar'] - NBackTop: typeof import('naive-ui')['NBackTop'] NButton: typeof import('naive-ui')['NButton'] NCard: typeof import('naive-ui')['NCard'] NCheckbox: typeof import('naive-ui')['NCheckbox'] @@ -22,8 +21,6 @@ declare module 'vue' { NDialogProvider: typeof import('naive-ui')['NDialogProvider'] NDivider: typeof import('naive-ui')['NDivider'] NDropdown: typeof import('naive-ui')['NDropdown'] - NEllipsis: typeof import('naive-ui')['NEllipsis'] - NEmpty: typeof import('naive-ui')['NEmpty'] NForm: typeof import('naive-ui')['NForm'] NFormItem: typeof import('naive-ui')['NFormItem'] NGi: typeof import('naive-ui')['NGi'] @@ -35,7 +32,6 @@ declare module 'vue' { NModal: typeof import('naive-ui')['NModal'] NNotificationProvider: typeof import('naive-ui')['NNotificationProvider'] NotPassed: typeof import('./src/components/NotPassed.vue')['default'] - NPopconfirm: typeof import('naive-ui')['NPopconfirm'] NPopover: typeof import('naive-ui')['NPopover'] NPopselect: typeof import('naive-ui')['NPopselect'] NProgress: typeof import('naive-ui')['NProgress'] @@ -45,11 +41,7 @@ declare module 'vue' { NSpace: typeof import('naive-ui')['NSpace'] NSpin: typeof import('naive-ui')['NSpin'] NSwitch: typeof import('naive-ui')['NSwitch'] - NTabPane: typeof import('naive-ui')['NTabPane'] - NTabs: typeof import('naive-ui')['NTabs'] NTag: typeof import('naive-ui')['NTag'] - NTimeline: typeof import('naive-ui')['NTimeline'] - NTimelineItem: typeof import('naive-ui')['NTimelineItem'] NTooltip: typeof import('naive-ui')['NTooltip'] NUpload: typeof import('naive-ui')['NUpload'] NUploadDragger: typeof import('naive-ui')['NUploadDragger'] diff --git a/src/store/modules/final.ts b/src/store/modules/final.ts index f0480e6..629deec 100644 --- a/src/store/modules/final.ts +++ b/src/store/modules/final.ts @@ -2,6 +2,8 @@ import { defineStore } from 'pinia' import { store } from '@/store' import { getFilter } from '@/api/home/filter' import { getConfig } from '@/api/system/user' +import { asideMap } from "@/config/final"; +import { cloneDeep, isEqual } from "lodash-es"; import type { AsideConfig } from '/#/api' @@ -29,7 +31,7 @@ export const useFinalStore = defineStore({ filterConfig: [], }), getters: { - getConfig(): AsideConfig | null { + getSystemConfig(): AsideConfig | null { return this.systemConfig }, getCustomConfig(): string[] | null { @@ -52,7 +54,7 @@ export const useFinalStore = defineStore({ }, }, actions: { - setConfig(config: AsideConfig) { + setSystemConfig(config: AsideConfig) { this.systemConfig = config console.log("systemConfig----------", config); }, @@ -82,14 +84,28 @@ export const useFinalStore = defineStore({ async fetchConfig() { const response = await getConfig() console.log("response.data----------", response.data); - this.setConfig(response.data) + this.setSystemConfig(response.data) return response.data }, + // // 获取终审个性化配置 + // async fetchCustomConfig() { + // const res = await getFilter(1) + // const { data } = res + // const list = data && data.searchcount ? data.searchcount.split(',') : []; + // console.log("listkey---------------", list); + // this.customConfig = list + // return list + // }, // 获取终审个性化配置 async fetchCustomConfig() { - const res = await getFilter(1) - const { data } = res - const list = data && data.searchcount ? data.searchcount.split(',') : [] + let list: any = []; + let tempAsideMap = cloneDeep(asideMap); + Object.keys(tempAsideMap).map(key => { + if(!tempAsideMap[key].isDefaultFilter) { + list.push(key); + } + }); + console.log("listkey---------------", list); this.customConfig = list return list }, diff --git a/src/views/final/aside/Aside.vue b/src/views/final/aside/Aside.vue index 66d64da..79c70cd 100644 --- a/src/views/final/aside/Aside.vue +++ b/src/views/final/aside/Aside.vue @@ -22,8 +22,8 @@ import type { AsideEntity } from "@/config/aside"; import { asideMap } from "@/config/final"; import type { AsideConfig } from "/#/api"; import emitter from "@/utils/mitt"; -import { cloneDeep, isEqual } from "lodash-es"; import { getFilterList } from "@/api/home/main"; +import { cloneDeep, isEqual } from "lodash-es"; const emit = defineEmits(["inputChange"]); const finalStore = useFinal(); @@ -33,6 +33,16 @@ const asideValue: Record = reactive({}); const asideVisible: Partial> = reactive({}); // 当前显示的模块,按照数组顺序显示 const showItems = shallowRef<{ key: string; config: AsideEntity }[]>([]); +const initAsideValueRef = ref(null); // 所有左侧模块的值(初始值) +const customObjRef = ref(null); // 获取高级筛选获取的值 +const customTempObjRef = ref(null); // 获取高级筛选获取的值(作对比) + +initAsideValueRef.value = cloneDeep(asideMap); + +onBeforeMount(async () => { + finalStore.fetchConfig(); + finalStore.fetchCustomConfig(); +}); Object.keys(asideMap).forEach((key) => { const { defaultValue, inFilterList } = asideMap[key]; @@ -42,9 +52,6 @@ Object.keys(asideMap).forEach((key) => { const filterModalRef:any = ref(null); const newFilterModalRef = ref(null); const customModalRef = ref(null); -const customObjRef = ref(null); // 获取高级筛选获取的值 -const customTempObjRef = ref(null); // 获取高级筛选获取的值(作对比) - const configFilterRef = ref([]); // 获取排序的值 const AdvanceFilterRef: any = ref(null); function showModal(modalRef: any) { @@ -66,7 +73,6 @@ mousetrap.bind("[", collapseHandler); onMounted(() => { nextTick(() => { computeSlideHeight(); - // let tempAsideValue = cloneDeep(asideValue); }); }); @@ -102,97 +108,43 @@ function computeSlideHeight() { useWindowSizeFn(computeSlideHeight, 280); onBeforeMount(async () => { - finalStore.fetchConfig(); finalStore.fetchCustomConfig(); }); nextTick(()=>{ finalStore.$subscribe(() => { - const config = finalStore.getConfig; const customConfig = finalStore.getCustomConfig; - console.log("customConfig", customConfig, config); - console.log("configFilterRef", configFilterRef.value, finalStore.getFilterConfig); - console.log("customObjRef", customObjRef.value, customTempObjRef.value); - if ( - configFilterRef.value.length > 0 && - isEqual(configFilterRef.value, finalStore.getFilterConfig) && - customObjRef.value && - isEqual(customObjRef.value, customTempObjRef.value) - ) { - return; - } - if (config == null || customConfig == null) return; - // console.log("config", config, "customConfig", customConfig); - /* rao - const showKeys = [...customConfig].filter(key => !asideMap[key].isDefaultFilter)// 获取customConfig 非isDefaultFilter的选项 - const defaultKeys = Object.keys(asideMap).filter(key => asideMap[key].isDefaultFilter)// 获取asideMap isDefaultFilter的选项 - showKeys.unshift(...defaultKeys) - */ - - let sortKeyList: any = []; - finalStore.getFilterConfig.map((item: any) => { - sortKeyList.push(item?.id); - }); - const showKeys = [...sortKeyList]; - - Object.keys(config).forEach((key) => { - if (key.startsWith("iz") && asideMap[key] !== undefined) + console.log("customConfig111111111---------------", customConfig); + if (customConfig === null) return; + + const showKeys: string[] = [...customConfig]; + const defaultKeys = Object.keys(asideMap).filter( + (key) => asideMap[key].isDefaultFilter + ); + showKeys.unshift(...defaultKeys); + + Object.keys(asideMap).forEach((key) => { + // 设置显示的或者默认显示的 + if (key.startsWith("iz")) asideVisible[key] = - (showKeys.includes(key) || asideMap[key].isDefaultFilter) && config[key] === "Y"; + asideMap[key] && (showKeys.includes(key) || asideMap[key].isDefaultFilter); }); - if (customObjRef.value) { - // 赋值 - Object.keys(customObjRef.value).map((key) => { - if (asideMap.hasOwnProperty(key)) { - const str = key.toLowerCase(); - if (str == "izsimilarity") { - if (typeof customObjRef.value[str] == "string") { - customObjRef.value[str] = customObjRef.value[str].split(","); - } - asideValue[key] = customObjRef.value[str]; // 赋值 - } else if (str == "izyear") { - if (typeof customObjRef.value[str] == "string") { - let time = customObjRef.value[str].split("-"); - time[0] = new Date(time[0]).getTime(); - time[1] = new Date(time[1]).getTime(); - customObjRef.value[str] = time; - } - asideValue[key] = customObjRef.value[str]; // 赋值 - } else if (str != "izsimilarity" && str != "izyear" && customObjRef.value[str]) { - asideValue[key] = customObjRef.value[str]; // 赋值 - } else { - asideValue[key] = null; - } - // asideMap[str].defaultValue = customObjRef.value[str];// 赋值 - } - }); - customTempObjRef.value = customObjRef.value; - console.log("asideValue直接处理后的结果", asideValue); - console.log("customTempObjRef.value", customTempObjRef.value); - let tempobj = cloneDeep(asideValue); - console.log("tempObj", tempobj); - finalStore.setAsideValue(tempobj); - } + const items = showKeys.reduce((acc, key) => { - const currentData = asideMap[key]; - const render = currentData?.render; - if (render !== false) { - const str = key?.toLowerCase(); - - const o = { - key: str, - config: asideMap[str], + if (asideMap[key]) { + const config = { + key, + config: asideMap[key], }; - return [...acc, o]; + return [...acc, config]; } else { return acc; } }, []); - console.log("showItems=================================", items); + console.log("showItems111111111---------------", items); showItems.value = items; - configFilterRef.value = finalStore.getFilterConfig; }); -}); +}) watch(asideVisible, (newVal) => { Object.keys(asideValue).forEach((key) => { @@ -222,7 +174,9 @@ function scrollHandler(key: string) { } async function filterHandler(searchId: string) { + emitter.emit("filter-final", searchId); const res = await getFilterList({ userSearchId: searchId }); + // console.log("顾虑结果", res); if (res.code == "OK") { let obj = res.data; customObjRef.value = res.data; @@ -232,10 +186,9 @@ async function filterHandler(searchId: string) { showKeys.push(key); } }); - // console.log(showKeys); + console.log("showKeys1111111111111111", showKeys); finalStore.setCustomConfig(showKeys); } - emitter.emit("filter-final", searchId); } function editFilter(filter: any) { @@ -244,20 +197,6 @@ function editFilter(filter: any) { modal.edit(filter); } -function updateComponent(key, e) { - console.log("跟新值", key, e); - console.log("tempAsideValue跟新值", finalStore.getAsideValue, asideValue); - // let tempAsideValue = finalStore.getAsideValue || asideValue; - let tempobj = cloneDeep(asideValue); - console.log(tempobj, "tempobj"); - tempobj[key] = e; - console.log(tempobj, "tempobj After"); - customObjRef.value = tempobj; - // asideValue = Object.assign({}, asideValue, tempobj); - console.log("asideValue跟新值", tempobj); - finalStore.setAsideValue(tempobj); -} - watch(asideValue, (newVal) => { finalStore.setAsideValue(newVal); }); @@ -314,10 +253,9 @@ const handleOk = (item: any) => { :is="item.config.component" v-for="(item, index) in showItems" :id="item.key" - :key="item.key" + :key="index" v-model:value="asideValue[item.key]" :label="item.config.label" - @update:value="(e) => updateComponent(item.key, e)" /> diff --git a/src/views/final/comp/CustomFilterModalVue.vue b/src/views/final/comp/CustomFilterModalVue.vue index fd81a3b..2c4f9d2 100644 --- a/src/views/final/comp/CustomFilterModalVue.vue +++ b/src/views/final/comp/CustomFilterModalVue.vue @@ -1,18 +1,43 @@