feat: 修改bug

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<ComponentRef>(null)
 const el = ref<HTMLDivElement | null>(null)
 const elwc = ref<HTMLDivElement | null>(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,
               </div>
             </div>
 
-            <div ref="el" class="scroll">
+            <div ref="el" class="scroll" :style="{height: maxHeight}">
               <!-- <n-scrollbar :on-scroll="scrollHandler"> -->
               <div ref="masonryRef" class="grid">
                 <div v-for="(item, index) in listData" :key="item.pictureId" :data-id="item.pictureId"

src/store/modules/final.ts

@@ -1,35 +1,90 @@
 import { defineStore } from 'pinia'
 import { store } from '@/store'
 import { getFilter } from '@/api/home/filter'
+import { getConfig } from '@/api/system/user'
+
+import type { AsideConfig } from '/#/api'
 
 export interface ConfigState {
+  systemConfig: AsideConfig | null
   customConfig: string[] | null
   asideValue: any
   listKey: number
+  searchValue: string
+  isAllowDownload: boolean
+  timeNum: number
+  filterConfig: string[] // 过滤筛选条件
 }
 
 export const useFinalStore = defineStore({
   id: 'app-final',
   state: (): ConfigState => ({
+    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)

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<any>(null); // 获取高级筛选获取的值
+const customTempObjRef = ref<any>(null); // 获取高级筛选获取的值(作对比)
+  const configFilterRef = ref<any>([]); // 获取排序的值
 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(() => {
+nextTick(()=>{
-  const customConfig = finalStore.getCustomConfig;
+  finalStore.$subscribe(() => {
-
+    const config = finalStore.getConfig;
-  if (customConfig === null) return;
+    const customConfig = finalStore.getCustomConfig;
-
+    console.log("customConfig", customConfig, config);
-  const showKeys: string[] = [...customConfig];
+    console.log("configFilterRef", configFilterRef.value, finalStore.getFilterConfig);
-  const defaultKeys = Object.keys(asideMap).filter(
+    console.log("customObjRef", customObjRef.value, customTempObjRef.value);
-    (key) => asideMap[key].isDefaultFilter
+    if (
-  );
+      configFilterRef.value.length > 0 &&
-  showKeys.unshift(...defaultKeys);
+      isEqual(configFilterRef.value, finalStore.getFilterConfig) &&
-
+      customObjRef.value &&
-  Object.keys(asideMap).forEach((key) => {
+      isEqual(customObjRef.value, customTempObjRef.value)
-    // 设置显示的或者默认显示的
+    ) {
-    if (key.startsWith("iz"))
+      return;
-      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;
     }
-  }, []);
+    if (config == null || customConfig == null) return;
-
+    // console.log("config", config, "customConfig", customConfig);
-  showItems.value = items;
+    /* 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)"
       />
 
       <!-- 筛选 -->

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',