@cmstops/pro-compo 0.3.69 → 0.3.70

package/es/selectResourceModal/components/List/ListAi/index.js

@@ -0,0 +1,53 @@
+import { defineComponent, inject, ref, watch, openBlock, createBlock, withCtx, renderSlot, createElementBlock, Fragment, createElementVNode, renderList, createCommentVNode, createTextVNode } from "vue";
+import _sfc_main$1 from "../ListWraper.js";
+const _hoisted_1 = /* @__PURE__ */ createElementVNode("div", { class: "title" }, [
+  /* @__PURE__ */ createElementVNode("div", { class: "line" }),
+  /* @__PURE__ */ createTextVNode(" \u5C01\u9762\u56FE ")
+], -1);
+const _hoisted_2 = { class: "list-item-grid" };
+const _sfc_main = defineComponent({
+  __name: "index",
+  setup(__props) {
+    const aiThumbList = inject("aiThumbList");
+    const aiThumbListReal = ref([]);
+    watch(
+      () => aiThumbList == null ? void 0 : aiThumbList.value,
+      () => {
+        var _a;
+        aiThumbListReal.value = ((_a = aiThumbList == null ? void 0 : aiThumbList.value) == null ? void 0 : _a.map((item) => {
+          return {
+            url: item,
+            catalog: "image",
+            thumb: item,
+            alias: item
+          };
+        })) || [];
+      },
+      { deep: true, immediate: true }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, {
+        isEmpty: !aiThumbListReal.value.length
+      }, {
+        "footer-extra": withCtx(() => [
+          renderSlot(_ctx.$slots, "footer-extra")
+        ]),
+        default: withCtx(() => [
+          aiThumbListReal.value.length ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+            _hoisted_1,
+            createElementVNode("div", _hoisted_2, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(aiThumbListReal.value, (item) => {
+                return renderSlot(_ctx.$slots, "item", {
+                  key: item.url,
+                  item
+                });
+              }), 128))
+            ])
+          ], 64)) : createCommentVNode("v-if", true)
+        ]),
+        _: 3
+      }, 8, ["isEmpty"]);
+    };
+  }
+});
+export { _sfc_main as default };

package/es/selectResourceModal/components/List/ListNormal/index.js

@@ -32,7 +32,6 @@ const _sfc_main = defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$1, {
-        list: unref(list),
         loading: unref(loading),
         "is-empty": unref(list).length === 0
       }, {
@@ -70,7 +69,7 @@ const _sfc_main = defineComponent({
           ])
         ]),
         _: 3
-      }, 8, ["list", "loading", "is-empty"]);
+      }, 8, ["loading", "is-empty"]);
     };
   }
 });

package/es/selectResourceModal/components/List/ListSystem/index.js

@@ -60,7 +60,6 @@ const _sfc_main = defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$1, {
-        list: _ctx.list,
         loading: loading.value,
         "is-empty": isEmpty.value
       }, {
@@ -102,7 +101,7 @@ const _sfc_main = defineComponent({
           }), 128))
         ]),
         _: 3
-      }, 8, ["list", "loading", "is-empty"]);
+      }, 8, ["loading", "is-empty"]);
     };
   }
 });

package/es/selectResourceModal/components/List/ListVideo/index.js

@@ -0,0 +1,19 @@
+import { defineComponent, inject, openBlock, createBlock, withCtx, unref, normalizeProps, mergeProps, createCommentVNode } from "vue";
+import videoThumb from "../../../../videoThumb/index.js";
+import _sfc_main$1 from "../ListWraper.js";
+const _sfc_main = defineComponent({
+  __name: "index",
+  setup(__props) {
+    const videoThumbOptions = inject("videoThumbOptions");
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, null, {
+        "footer-extra": withCtx(() => []),
+        default: withCtx(() => [
+          unref(videoThumbOptions) ? (openBlock(), createBlock(unref(videoThumb), normalizeProps(mergeProps({ key: 0 }, unref(videoThumbOptions))), null, 16)) : createCommentVNode("v-if", true)
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export { _sfc_main as default };

package/es/selectResourceModal/components/List/ListWraper.js

@@ -19,7 +19,6 @@ const _hoisted_6 = { class: "resource-list-footer" };
 const _sfc_main = defineComponent({
   __name: "ListWraper",
   props: {
-    list: {},
     isEmpty: { type: Boolean },
     loading: { type: Boolean }
   },

package/es/selectResourceModal/scripts/useCompoLf.js

@@ -23,6 +23,8 @@ function useCompoentLifycycle(props, emits) {
   provide("filterOptions", computed(() => props.filterOptions));
   provide("userInfo", computed(() => props.userInfo));
   provide("mediaUseType", computed(() => props.mediaUseType));
+  provide("aiThumbList", computed(() => props.aiThumbList));
+  provide("videoThumbOptions", computed(() => props.videoThumbOptions));
   return {
     wrapProps,
     close: () => emits("update:visible", false),

package/es/selectResourceModal/scripts/useTabFilter.d.ts

@@ -17,5 +17,6 @@ export default function useTabFilter(props: any): {
     activeKey: import("vue").Ref<string | number | symbol>;
     activeComponent: import("vue").ComputedRef<any>;
     tabKeyList: import("vue").ComputedRef<TabListType[]>;
+    handelChangeTab: (tabKey: TabEnum) => void;
 };
 export {};

package/es/selectResourceModal/scripts/useTabFilter.js

@@ -1,37 +1,46 @@
 import { ref, computed } from "vue";
+import _sfc_main$4 from "../components/List/ListVideo/index.js";
 import _sfc_main from "../components/List/ListNormal/index.js";
 import _sfc_main$2 from "../components/List/ListSystem/index.js";
 import _sfc_main$1 from "../components/List/ListLocal/index.js";
-const DEFAULT_TABS = [
-  "all",
-  "my",
-  "remind",
-  "local"
-].join(",");
+import _sfc_main$3 from "../components/List/ListAi/index.js";
+const DEFAULT_TABS = ["all", "my", "remind", "local"];
 const TAB_DICT = {
-  ["all"]: { title: "\u5168\u90E8\u7D20\u6750", component: _sfc_main, usePage: true },
-  ["my"]: { title: "\u6211\u7684\u7D20\u6750", component: _sfc_main, usePage: true },
-  ["remind"]: { title: "\u63D0\u9192\u6211\u7684", component: _sfc_main, usePage: true },
-  ["local"]: { title: "\u672C\u5730\u7D20\u6750", component: _sfc_main$1, usePage: false },
-  ["system"]: { title: "\u5185\u7F6E\u7D20\u6750", component: _sfc_main$2, usePage: false },
-  ["ai"]: { title: "AI\u4F18\u9009", component: _sfc_main$2, usePage: false },
-  ["video"]: { title: "\u89C6\u9891\u5C01\u9762", component: _sfc_main$2, usePage: false }
+  ["all"]: { title: "\u5168\u90E8\u7D20\u6750", component: _sfc_main },
+  ["my"]: { title: "\u6211\u7684\u7D20\u6750", component: _sfc_main },
+  ["remind"]: { title: "\u63D0\u9192\u6211\u7684", component: _sfc_main },
+  ["local"]: { title: "\u672C\u5730\u7D20\u6750", component: _sfc_main$1 },
+  ["system"]: { title: "\u5185\u7F6E\u7D20\u6750", component: _sfc_main$2 },
+  ["ai"]: { title: "AI\u4F18\u9009", component: _sfc_main$3 },
+  ["video"]: { title: "\u89C6\u9891\u5C01\u9762", component: _sfc_main$4 }
 };
 function useTabFilter(props) {
   const activeKey = ref("all");
   const curTab = computed(() => TAB_DICT[activeKey.value]);
   const tabKeyList = computed(() => {
-    const keys = (props.tabKeys || DEFAULT_TABS).split(",");
+    const { mediaUseType, aiThumbList, videoThumbOptions } = props;
+    const keys = JSON.parse(JSON.stringify(DEFAULT_TABS));
+    if (mediaUseType > 0)
+      keys.unshift("system");
+    if (aiThumbList && aiThumbList.length)
+      keys.unshift("ai");
+    if (videoThumbOptions)
+      keys.unshift("video");
+    [activeKey.value] = keys;
     return keys.map((key) => ({
       key,
       title: TAB_DICT[key].title
     }));
   });
   const activeComponent = computed(() => curTab.value.component);
+  function handelChangeTab(tabKey) {
+    activeKey.value = tabKey;
+  }
   return {
     activeKey,
     activeComponent,
-    tabKeyList
+    tabKeyList,
+    handelChangeTab
   };
 }
 export { useTabFilter as default };

package/es/selectResourceModal/style/index.css

@@ -222,19 +222,6 @@
 .resource-list .scen-module {
   margin-bottom: 20px;
 }
-.resource-list .scen-module .title {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  margin-bottom: 20px;
-  font-weight: bold;
-  font-size: 16px;
-}
-.resource-list .scen-module .title .line {
-  width: 3px;
-  height: 16px;
-  background-color: #4886ff;
-}
 .resource-list .item-load-more {
   display: flex;
   flex-direction: column;
@@ -283,6 +270,19 @@
 .resource-list .list-filter-wrapper .list-filter .arco-input-prepend {
   padding: 0;
 }
+.resource-list .title {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 20px;
+  font-weight: bold;
+  font-size: 16px;
+}
+.resource-list .title .line {
+  width: 3px;
+  height: 16px;
+  background-color: #4886ff;
+}
 .resource-select-modal-body {
   height: 80vh;
   padding: 0;

package/es/selectResourceModal/style/list.less

@@ -83,21 +83,6 @@
 .resource-list {
   .scen-module {
     margin-bottom: 20px;
-
-    .title {
-      display: flex;
-      gap: 8px;
-      align-items: center;
-      margin-bottom: 20px;
-      font-weight: bold;
-      font-size: 16px;
-
-      .line {
-        width: 3px;
-        height: 16px;
-        background-color: #4886ff;
-      }
-    }
   }
 
   .item-load-more {
@@ -161,3 +146,21 @@
     }
   }
 }
+
+// 二级列表的标题样式
+.resource-list {
+  .title {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+    margin-bottom: 20px;
+    font-weight: bold;
+    font-size: 16px;
+
+    .line {
+      width: 3px;
+      height: 16px;
+      background-color: #4886ff;
+    }
+  }
+}

package/es/videoThumb/component.js

@@ -61,7 +61,8 @@ const _sfc_main = defineComponent({
     }
     watch(
       () => curThumb.value,
-      () => emit("select", curThumb.value)
+      () => emit("select", curThumb.value),
+      { immediate: true }
     );
     onMounted(() => {
       getVideoThumbs(BASE_API, props.src, props.duration);

package/lib/index.css

@@ -4574,19 +4574,6 @@
 .resource-list .scen-module {
   margin-bottom: 20px;
 }
-.resource-list .scen-module .title {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  margin-bottom: 20px;
-  font-weight: bold;
-  font-size: 16px;
-}
-.resource-list .scen-module .title .line {
-  width: 3px;
-  height: 16px;
-  background-color: #4886ff;
-}
 .resource-list .item-load-more {
   display: flex;
   flex-direction: column;
@@ -4635,6 +4622,19 @@
 .resource-list .list-filter-wrapper .list-filter .arco-input-prepend {
   padding: 0;
 }
+.resource-list .title {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 20px;
+  font-weight: bold;
+  font-size: 16px;
+}
+.resource-list .title .line {
+  width: 3px;
+  height: 16px;
+  background-color: #4886ff;
+}
 .resource-select-modal-body {
   height: 80vh;
   padding: 0;

package/lib/selectResourceModal/component.js

@@ -23,20 +23,21 @@ const _sfc_main = vue.defineComponent({
   __name: "component",
   props: {
     BASE_API: {},
-    visible: { type: Boolean },
     userInfo: {},
-    maxcount: {},
+    visible: { type: Boolean },
     wrap: {},
+    maxcount: {},
     filterOptions: {},
-    tabKeys: {},
-    mediaUseType: {}
+    mediaUseType: {},
+    aiThumbList: {},
+    videoThumbOptions: {}
   },
   emits: ["update:visible", "submit"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const { selected, selectedKeys, disableSelect, handleSelect, handleClear } = useResourceSelect.useResourceSelect(props);
-    const { activeKey, activeComponent, tabKeyList } = useTabFilter(props);
+    const { activeKey, activeComponent, tabKeyList, handelChangeTab } = useTabFilter(props);
     const { wrapProps, close, submit } = useCompoLf(props, emits);
     const handleOptions = (options, handleOptions2) => {
       const { key, meta } = options;
@@ -53,9 +54,6 @@ const _sfc_main = vue.defineComponent({
     function handleConfirm() {
       submit(selected.value);
     }
-    function handelChangeTab(tabKey) {
-      activeKey.value = tabKey;
-    }
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.wrap === "drawer" ? vue.unref(webVue.Drawer) : vue.unref(webVue.Modal)), vue.mergeProps({ visible: _ctx.visible }, vue.unref(wrapProps)), {
@@ -72,7 +70,7 @@ const _sfc_main = vue.defineComponent({
                 vue.createCommentVNode(" \u5217\u8868\u5206\u53D1\u5668 "),
                 (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(activeComponent)), {
                   "active-key": vue.unref(activeKey),
-                  onChangeTab: handelChangeTab
+                  onChangeTab: vue.unref(handelChangeTab)
                 }, {
                   item: vue.withCtx(({ item, onOptions }) => [
                     vue.createVNode(ListCardWrapper, {
@@ -109,7 +107,7 @@ const _sfc_main = vue.defineComponent({
                     ])) : vue.createCommentVNode("v-if", true)
                   ]),
                   _: 1
-                }, 40, ["active-key"]))
+                }, 40, ["active-key", "onChangeTab"]))
               ])) : (vue.openBlock(), vue.createBlock(vue.unref(index$2), {
                 key: 1,
                 type: "empty",

package/lib/selectResourceModal/components/List/ListAi/index.js

@@ -0,0 +1,54 @@
+"use strict";
+var vue = require("vue");
+var ListWraper = require("../ListWraper.js");
+const _hoisted_1 = /* @__PURE__ */ vue.createElementVNode("div", { class: "title" }, [
+  /* @__PURE__ */ vue.createElementVNode("div", { class: "line" }),
+  /* @__PURE__ */ vue.createTextVNode(" \u5C01\u9762\u56FE ")
+], -1);
+const _hoisted_2 = { class: "list-item-grid" };
+const _sfc_main = vue.defineComponent({
+  __name: "index",
+  setup(__props) {
+    const aiThumbList = vue.inject("aiThumbList");
+    const aiThumbListReal = vue.ref([]);
+    vue.watch(
+      () => aiThumbList == null ? void 0 : aiThumbList.value,
+      () => {
+        var _a;
+        aiThumbListReal.value = ((_a = aiThumbList == null ? void 0 : aiThumbList.value) == null ? void 0 : _a.map((item) => {
+          return {
+            url: item,
+            catalog: "image",
+            thumb: item,
+            alias: item
+          };
+        })) || [];
+      },
+      { deep: true, immediate: true }
+    );
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(ListWraper, {
+        isEmpty: !aiThumbListReal.value.length
+      }, {
+        "footer-extra": vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "footer-extra")
+        ]),
+        default: vue.withCtx(() => [
+          aiThumbListReal.value.length ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+            _hoisted_1,
+            vue.createElementVNode("div", _hoisted_2, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(aiThumbListReal.value, (item) => {
+                return vue.renderSlot(_ctx.$slots, "item", {
+                  key: item.url,
+                  item
+                });
+              }), 128))
+            ])
+          ], 64)) : vue.createCommentVNode("v-if", true)
+        ]),
+        _: 3
+      }, 8, ["isEmpty"]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/selectResourceModal/components/List/ListNormal/index.js

@@ -33,7 +33,6 @@ const _sfc_main = vue.defineComponent({
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(ListWraper, {
-        list: vue.unref(list),
         loading: vue.unref(loading),
         "is-empty": vue.unref(list).length === 0
       }, {
@@ -71,7 +70,7 @@ const _sfc_main = vue.defineComponent({
           ])
         ]),
         _: 3
-      }, 8, ["list", "loading", "is-empty"]);
+      }, 8, ["loading", "is-empty"]);
     };
   }
 });

package/lib/selectResourceModal/components/List/ListSystem/index.js

@@ -61,7 +61,6 @@ const _sfc_main = vue.defineComponent({
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(ListWraper, {
-        list: _ctx.list,
         loading: loading.value,
         "is-empty": isEmpty.value
       }, {
@@ -103,7 +102,7 @@ const _sfc_main = vue.defineComponent({
           }), 128))
         ]),
         _: 3
-      }, 8, ["list", "loading", "is-empty"]);
+      }, 8, ["loading", "is-empty"]);
     };
   }
 });

package/lib/selectResourceModal/components/List/ListVideo/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var vue = require("vue");
+var index = require("../../../../videoThumb/index.js");
+var ListWraper = require("../ListWraper.js");
+const _sfc_main = vue.defineComponent({
+  __name: "index",
+  setup(__props) {
+    const videoThumbOptions = vue.inject("videoThumbOptions");
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(ListWraper, null, {
+        "footer-extra": vue.withCtx(() => []),
+        default: vue.withCtx(() => [
+          vue.unref(videoThumbOptions) ? (vue.openBlock(), vue.createBlock(vue.unref(index), vue.normalizeProps(vue.mergeProps({ key: 0 }, vue.unref(videoThumbOptions))), null, 16)) : vue.createCommentVNode("v-if", true)
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/selectResourceModal/components/List/ListWraper.js

@@ -20,7 +20,6 @@ const _hoisted_6 = { class: "resource-list-footer" };
 const _sfc_main = vue.defineComponent({
   __name: "ListWraper",
   props: {
-    list: {},
     isEmpty: { type: Boolean },
     loading: { type: Boolean }
   },

package/lib/selectResourceModal/scripts/useCompoLf.js

@@ -24,6 +24,8 @@ function useCompoentLifycycle(props, emits) {
   vue.provide("filterOptions", vue.computed(() => props.filterOptions));
   vue.provide("userInfo", vue.computed(() => props.userInfo));
   vue.provide("mediaUseType", vue.computed(() => props.mediaUseType));
+  vue.provide("aiThumbList", vue.computed(() => props.aiThumbList));
+  vue.provide("videoThumbOptions", vue.computed(() => props.videoThumbOptions));
   return {
     wrapProps,
     close: () => emits("update:visible", false),

package/lib/selectResourceModal/scripts/useTabFilter.js

@@ -1,38 +1,47 @@
 "use strict";
 var vue = require("vue");
+var index$4 = require("../components/List/ListVideo/index.js");
 var index = require("../components/List/ListNormal/index.js");
 var index$2 = require("../components/List/ListSystem/index.js");
 var index$1 = require("../components/List/ListLocal/index.js");
-const DEFAULT_TABS = [
-  "all",
-  "my",
-  "remind",
-  "local"
-].join(",");
+var index$3 = require("../components/List/ListAi/index.js");
+const DEFAULT_TABS = ["all", "my", "remind", "local"];
 const TAB_DICT = {
-  ["all"]: { title: "\u5168\u90E8\u7D20\u6750", component: index, usePage: true },
-  ["my"]: { title: "\u6211\u7684\u7D20\u6750", component: index, usePage: true },
-  ["remind"]: { title: "\u63D0\u9192\u6211\u7684", component: index, usePage: true },
-  ["local"]: { title: "\u672C\u5730\u7D20\u6750", component: index$1, usePage: false },
-  ["system"]: { title: "\u5185\u7F6E\u7D20\u6750", component: index$2, usePage: false },
-  ["ai"]: { title: "AI\u4F18\u9009", component: index$2, usePage: false },
-  ["video"]: { title: "\u89C6\u9891\u5C01\u9762", component: index$2, usePage: false }
+  ["all"]: { title: "\u5168\u90E8\u7D20\u6750", component: index },
+  ["my"]: { title: "\u6211\u7684\u7D20\u6750", component: index },
+  ["remind"]: { title: "\u63D0\u9192\u6211\u7684", component: index },
+  ["local"]: { title: "\u672C\u5730\u7D20\u6750", component: index$1 },
+  ["system"]: { title: "\u5185\u7F6E\u7D20\u6750", component: index$2 },
+  ["ai"]: { title: "AI\u4F18\u9009", component: index$3 },
+  ["video"]: { title: "\u89C6\u9891\u5C01\u9762", component: index$4 }
 };
 function useTabFilter(props) {
   const activeKey = vue.ref("all");
   const curTab = vue.computed(() => TAB_DICT[activeKey.value]);
   const tabKeyList = vue.computed(() => {
-    const keys = (props.tabKeys || DEFAULT_TABS).split(",");
+    const { mediaUseType, aiThumbList, videoThumbOptions } = props;
+    const keys = JSON.parse(JSON.stringify(DEFAULT_TABS));
+    if (mediaUseType > 0)
+      keys.unshift("system");
+    if (aiThumbList && aiThumbList.length)
+      keys.unshift("ai");
+    if (videoThumbOptions)
+      keys.unshift("video");
+    [activeKey.value] = keys;
     return keys.map((key) => ({
       key,
       title: TAB_DICT[key].title
     }));
   });
   const activeComponent = vue.computed(() => curTab.value.component);
+  function handelChangeTab(tabKey) {
+    activeKey.value = tabKey;
+  }
   return {
     activeKey,
     activeComponent,
-    tabKeyList
+    tabKeyList,
+    handelChangeTab
   };
 }
 module.exports = useTabFilter;

package/lib/selectResourceModal/style/index.css

@@ -222,19 +222,6 @@
 .resource-list .scen-module {
   margin-bottom: 20px;
 }
-.resource-list .scen-module .title {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  margin-bottom: 20px;
-  font-weight: bold;
-  font-size: 16px;
-}
-.resource-list .scen-module .title .line {
-  width: 3px;
-  height: 16px;
-  background-color: #4886ff;
-}
 .resource-list .item-load-more {
   display: flex;
   flex-direction: column;
@@ -283,6 +270,19 @@
 .resource-list .list-filter-wrapper .list-filter .arco-input-prepend {
   padding: 0;
 }
+.resource-list .title {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 20px;
+  font-weight: bold;
+  font-size: 16px;
+}
+.resource-list .title .line {
+  width: 3px;
+  height: 16px;
+  background-color: #4886ff;
+}
 .resource-select-modal-body {
   height: 80vh;
   padding: 0;

package/lib/selectResourceModal/style/list.less

@@ -83,21 +83,6 @@
 .resource-list {
   .scen-module {
     margin-bottom: 20px;
-
-    .title {
-      display: flex;
-      gap: 8px;
-      align-items: center;
-      margin-bottom: 20px;
-      font-weight: bold;
-      font-size: 16px;
-
-      .line {
-        width: 3px;
-        height: 16px;
-        background-color: #4886ff;
-      }
-    }
   }
 
   .item-load-more {
@@ -161,3 +146,21 @@
     }
   }
 }
+
+// 二级列表的标题样式
+.resource-list {
+  .title {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+    margin-bottom: 20px;
+    font-weight: bold;
+    font-size: 16px;
+
+    .line {
+      width: 3px;
+      height: 16px;
+      background-color: #4886ff;
+    }
+  }
+}