@cmstops/pro-compo 3.9.2-alpha.19 → 3.9.2-alpha.20

package/es/selectAddTo/components/ViewAllColumn/MediaFilter/index.js

@@ -1,9 +1,12 @@
-import { defineComponent, ref, computed, watch, openBlock, createElementBlock, createVNode, unref, withCtx, Fragment, renderList, createElementVNode, toDisplayString, createBlock } from "vue";
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, createVNode, unref, withCtx, Fragment, renderList, createElementVNode, toDisplayString, createBlock, createCommentVNode } from "vue";
 import { Space, Input, Select, Option, Tooltip } from "@arco-design/web-vue";
 import { IconInfoCircle } from "@arco-design/web-vue/es/icon";
 const _hoisted_1 = { class: "media-filter-container" };
 const _hoisted_2 = { style: { "display": "flex", "align-items": "center", "gap": "5px" } };
-const _hoisted_3 = { class: "sort-button" };
+const _hoisted_3 = {
+  key: 0,
+  class: "sort-button"
+};
 const _sfc_main = defineComponent({
   ...{ name: "MediaFilter" },
   __name: "index",
@@ -13,7 +16,8 @@ const _sfc_main = defineComponent({
     series: { default: "all" },
     banner: { default: "all" },
     height: {},
-    userInfo: {}
+    userInfo: {},
+    typeKey: {}
   },
   emits: ["update:group_id", "search"],
   setup(__props, { emit: __emit }) {
@@ -139,7 +143,7 @@ const _sfc_main = defineComponent({
           ]),
           _: 1
         }),
-        createElementVNode("div", _hoisted_3, [
+        _ctx.typeKey && _ctx.typeKey !== "ZQ" ? (openBlock(), createElementBlock("div", _hoisted_3, [
           createVNode(unref(Select), {
             modelValue: filter.value.order,
             "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => filter.value.order = $event),
@@ -157,7 +161,7 @@ const _sfc_main = defineComponent({
             ]),
             _: 1
           }, 8, ["modelValue"])
-        ])
+        ])) : createCommentVNode("v-if", true)
       ]);
     };
   }

package/es/selectAddTo/components/ViewAllColumn/index.js

@@ -1,12 +1,12 @@
-import { defineComponent, ref, computed, watch, h, onMounted, openBlock, createElementBlock, createVNode, unref, withCtx, createBlock, createElementVNode, toDisplayString, renderSlot, withDirectives, vShow } from "vue";
+import { defineComponent, ref, onMounted, openBlock, createElementBlock, createVNode, unref, isRef, withCtx, createBlock, createElementVNode, toDisplayString, renderSlot, withDirectives, vShow } from "vue";
 import { IconRight, IconDown } from "@arco-design/web-vue/es/icon";
-import { Checkbox, Table, Pagination, Message } from "@arco-design/web-vue";
+import { Table, Checkbox, Pagination } from "@arco-design/web-vue";
 import _sfc_main$2 from "../../../typeIcons/component.js";
 import _sfc_main$1 from "./MediaFilter/index.js";
 import _sfc_main$3 from "../../../dataTags/component.js";
-import useTableBatch from "../../../hooks/batch.js";
 import { timeFormat } from "../../../utils/index.js";
-import { getCategoryMediaNew, getPoliticals, getMlists } from "../../script/api.js";
+import { useViewAllColumnState } from "./script/useViewAllColumnState.js";
+import { useTableColumns } from "./script/useTableColumns.js";
 import "./index.vue_vue_type_style_index_0_scoped_true_lang.js";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.js";
 const _hoisted_1 = { class: "view-all-column-container" };
@@ -32,12 +32,6 @@ const _sfc_main = defineComponent({
   ...{ name: "ViewAllColumn" },
   __name: "index",
   props: {
-    maxSelect: {},
-    defaultSelectedData: {},
-    typeData: {},
-    series: {},
-    banner: {},
-    userInfo: {},
     typeKey: {},
     rid: {}
   },
@@ -45,299 +39,69 @@ const _sfc_main = defineComponent({
   setup(__props, { emit: __emit }) {
     const emit = __emit;
     const props = __props;
-    const _maxSelect = props.maxSelect || 100;
-    const selectedData = ref([]);
-    const categoryCascaderData = ref([]);
     const listMinHeight = ref(0);
-    const mediaFileData = ref([]);
-    const filter = ref(null);
-    const page = ref({
-      index: 1,
-      size: 30,
-      total: 0
-    });
-    const tempSelectedData = computed(() => {
-      return props.defaultSelectedData || [];
-    });
-    watch(
-      () => tempSelectedData.value,
-      (val) => {
-        selectedData.value = val;
-      }
-    );
-    const importantBanner = computed(() => {
-      if (!props.banner || props.banner === "all")
-        return false;
-      return !!props.banner;
-    });
+    const categoryCascaderData = ref([]);
+    const scrollPercent = { y: "100%" };
     const {
+      selectedData,
+      mediaFileData,
+      dataLoading,
+      group_id,
+      page,
       isItemChecked,
       tableCellMouseEnter,
-      tableCellMouseLeave
-    } = useTableBatch();
-    const selectTableCell = (record) => {
-      selectData(record);
-    };
-    const selectTableAll = (checked) => {
-      if (checked) {
-        selectedData.value = [];
-        mediaFileData.value.forEach((item) => selectData(item));
-      } else {
-        selectedData.value = [];
-      }
-      emitChange();
-    };
-    const selectData = (record) => {
-      if (importantBanner.value) {
-        const {
-          cover: { banner }
-        } = record;
-        if (!banner) {
-          return Message.warning({ content: "\u8BE5\u5185\u5BB9\u4E0D\u5177\u5907\u72EC\u7ACB\u8F6E\u64AD\u56FE" });
-        }
-      }
-      addDataToSelectedList(record);
-      return true;
-    };
-    const addDataToSelectedList = async (record) => {
-      const index = selectedData.value.findIndex((v) => v.id === record.id);
-      if (selectedData.value.length < _maxSelect) {
-        if (index === -1) {
-          selectedData.value.push(record);
-        } else {
-          selectedData.value.splice(index, 1);
-        }
-        emitChange();
-      } else {
-        if (index === -1) {
-          selectedData.value.splice(selectedData.value.length - 1, 1);
-          selectedData.value.push(record);
-        } else {
-          selectedData.value.splice(index, 1);
-        }
-        emitChange();
-      }
-    };
-    const emitChange = () => {
-      emit("change", selectedData.value);
-    };
-    const group_id = ref(0);
-    const scrollPercent = { y: "100%" };
-    const search = (_filter) => {
-      columns.value.some((e) => {
-        if (e.dataIndex === "pub_time") {
-          e.title = _filter.order === "create_time" ? "\u521B\u5EFA\u65F6\u95F4" : "\u53D1\u5E03\u65F6\u95F4";
-          return e;
-        }
-        return false;
-      });
-      _filter = { ..._filter };
-      const where = [];
-      _filter.precise_kw && where.push(`precise_kw:${_filter.precise_kw}`);
-      _filter.keywords && where.push(`kw:${_filter.keywords}`);
-      _filter.type && where.push(`series:${_filter.type}`);
-      _filter.state && where.push(`state:${_filter.state}`);
-      _filter.cover_type && where.push(`cover_type:${_filter.cover_type}`);
-      _filter.banner && where.push(`banner:${_filter.banner}`);
-      if (_filter.publish_date && Array.isArray(_filter.publish_date) && _filter.publish_date.length > 0) {
-        where.push(`publish_from:${_filter.publish_date[0] / 1e3}`);
-        where.push(`publish_to:${_filter.publish_date[1] / 1e3}`);
-      }
-      _filter.where = where;
-      filter.value = { ..._filter };
-      page.value.index = 1;
-      loadData();
-    };
-    const pageChangeHandle = (index) => {
-      page.value.index = index;
-      loadData();
-    };
-    watch(
-      () => group_id.value,
-      () => {
-        page.value.index = 1;
-        loadData();
-      }
+      tableCellMouseLeave,
+      selectTableCell,
+      selectTableAll,
+      search,
+      pageChangeHandle,
+      loadData,
+      loadMore
+    } = useViewAllColumnState(props, emit);
+    const { columns, politicalColumns } = useTableColumns(
+      props,
+      selectedData,
+      isItemChecked
     );
-    const columns = ref([
-      {
-        title: "\u52FE",
-        dataIndex: "select",
-        slotName: "select",
-        width: 40,
-        titleSlotName: "selectTitle",
-        render: ({ record }) => {
-          if (props.typeKey === "series:special_v3") {
-            if (record.isLeaf) {
-              return h(Checkbox, {
-                modelValue: isItemChecked.value(selectedData.value, record),
-                class: "icon"
-              });
-            }
-            return null;
-          }
-          return h(Checkbox, {
-            modelValue: isItemChecked.value(selectedData.value, record),
-            class: "icon"
-          });
-        }
-      },
-      {
-        title: "\u4E13\u9898/\u680F\u76EE\u540D\u79F0",
-        dataIndex: "title",
-        slotName: "title",
-        width: 428
-      },
-      {
-        title: "\u7F16\u8F91",
-        dataIndex: "duty_editor",
-        slotName: "duty_editor",
-        width: 100
-      },
-      {
-        title: "\u53D1\u5E03\u65F6\u95F4",
-        dataIndex: "pub_time",
-        slotName: "pub_time",
-        width: 150
-      }
-    ]);
-    const politicalColumns = ref([
-      {
-        title: "\u52FE",
-        dataIndex: "select",
-        slotName: "select",
-        width: 40,
-        titleSlotName: "selectTitle"
-      },
-      {
-        title: "\u653F\u60C5\u4EBA\u7269\u59D3\u540D",
-        dataIndex: "name",
-        slotName: "name",
-        width: 428
-      },
-      {
-        title: "\u804C\u4F4D",
-        dataIndex: "position",
-        slotName: "position",
-        width: 100
-      },
-      {
-        title: "\u5730\u533A",
-        dataIndex: "city_alias",
-        slotName: "city_alias",
-        width: 150
-      }
-    ]);
-    const dataLoading = ref(false);
-    const loadData = async () => {
-      const params = {
-        limit: page.value.size,
-        offset: page.value.size * (page.value.index - 1),
-        where: ["state:15|19"]
-      };
-      params.where.push(props.typeKey);
-      if (filter.value) {
-        const _filter = filter.value;
-        params.order = _filter.order;
-        params.sort = _filter.sort;
-        if (_filter.where) {
-          params.where = [...params.where, ..._filter.where];
-        }
-      }
-      params.where = params.where.join(",");
-      dataLoading.value = true;
-      let code = "";
-      let message = "";
-      if (props.typeKey) {
-        const { code: code1, message: message1 } = await getCategoryMediaNew(
-          props.userInfo.BASE_API,
-          params
-        );
-        code = code1;
-        message = message1;
-      } else {
-        params.state = 2;
-        const { code: code1, message: message1 } = await getPoliticals(
-          props.userInfo.BASE_API,
-          params
-        );
-        code = code1;
-        message = message1;
-      }
-      dataLoading.value = false;
-      if (code === 0) {
-        mediaFileData.value = (message.data || message.datas).map((v) => {
-          v.catalog = "doc";
-          v.target_id = v.id;
-          v.target_type = 3;
-          v.pub_time = v.pub_time || v.created_at;
-          v.update_time = v.updated_at;
-          v.pub_user_alias = v.author_alias;
-          v.key = v.id;
-          v.isLeaf = props.typeKey !== "series:special_v3";
-          return v;
-        }) || [];
-        page.value.total = message.total || message.count;
-      }
-    };
-    const loadMore = async (record, done) => {
-      const res = await getMlists(props.userInfo.BASE_API, {
-        rid: props.rid,
-        gid: record.special_id
-      });
-      window.setTimeout(() => {
-        done(
-          res.message.map((item) => ({
-            ...item,
-            isLeaf: true,
-            key: item.id,
-            parentName: record.title,
-            parentId: record.id
-          }))
-        );
-      }, 2e3);
-    };
     onMounted(() => {
       loadData();
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createVNode(_sfc_main$1, {
-          group_id: group_id.value,
-          "onUpdate:group_id": _cache[0] || (_cache[0] = ($event) => group_id.value = $event),
-          banner: _ctx.banner,
+          group_id: unref(group_id),
+          "onUpdate:group_id": _cache[0] || (_cache[0] = ($event) => isRef(group_id) ? group_id.value = $event : null),
           height: listMinHeight.value,
-          series: props.series,
           tree: categoryCascaderData.value,
-          "user-info": props.userInfo,
-          onSearch: search
-        }, null, 8, ["group_id", "banner", "height", "series", "tree", "user-info"]),
-        _ctx.typeKey ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          "type-key": _ctx.typeKey,
+          onSearch: unref(search)
+        }, null, 8, ["group_id", "height", "tree", "type-key", "onSearch"]),
+        _ctx.typeKey && _ctx.typeKey !== "ZQ" ? (openBlock(), createElementBlock("div", _hoisted_2, [
           createVNode(unref(Table), {
             bordered: false,
-            columns: columns.value,
-            data: mediaFileData.value,
+            columns: unref(columns),
+            data: unref(mediaFileData),
             pagination: false,
-            loading: dataLoading.value,
+            loading: unref(dataLoading),
             scroll: scrollPercent,
-            "load-more": loadMore,
+            "load-more": unref(loadMore),
             onCellMouseEnter: unref(tableCellMouseEnter),
             onCellMouseLeave: unref(tableCellMouseLeave),
-            onRowClick: selectTableCell
+            onRowClick: unref(selectTableCell)
           }, {
             "expand-icon": withCtx(({ expanded }) => [
               !expanded ? (openBlock(), createBlock(unref(IconRight), { key: 0 })) : (openBlock(), createBlock(unref(IconDown), { key: 1 }))
             ]),
             selectTitle: withCtx(() => [
               createVNode(unref(Checkbox), {
-                "model-value": selectedData.value.length === mediaFileData.value.length,
+                "model-value": unref(selectedData).length === unref(mediaFileData).length,
                 class: "icon",
-                onChange: selectTableAll
-              }, null, 8, ["model-value"])
+                onChange: unref(selectTableAll)
+              }, null, 8, ["model-value", "onChange"])
             ]),
             select: withCtx(({ record }) => [
               createVNode(unref(Checkbox), {
-                "model-value": unref(isItemChecked)(selectedData.value, record),
+                "model-value": unref(isItemChecked)(unref(selectedData), record),
                 class: "icon"
               }, null, 8, ["model-value"])
             ]),
@@ -346,7 +110,7 @@ const _sfc_main = defineComponent({
                 createVNode(_sfc_main$2, {
                   type: record.series,
                   class: "icon",
-                  doc: ""
+                  doc: true
                 }, null, 8, ["type"]),
                 createElementVNode("span", _hoisted_4, toDisplayString(record.title || record.alias || "--"), 1)
               ])
@@ -365,29 +129,29 @@ const _sfc_main = defineComponent({
               ])
             ]),
             _: 1
-          }, 8, ["columns", "data", "loading", "onCellMouseEnter", "onCellMouseLeave"])
+          }, 8, ["columns", "data", "loading", "load-more", "onCellMouseEnter", "onCellMouseLeave", "onRowClick"])
         ])) : (openBlock(), createElementBlock("div", _hoisted_7, [
           createVNode(unref(Table), {
             bordered: false,
-            columns: politicalColumns.value,
-            data: mediaFileData.value,
+            columns: unref(politicalColumns),
+            data: unref(mediaFileData),
             pagination: false,
-            loading: dataLoading.value,
+            loading: unref(dataLoading),
             scroll: scrollPercent,
             onCellMouseEnter: unref(tableCellMouseEnter),
             onCellMouseLeave: unref(tableCellMouseLeave),
-            onRowClick: selectTableCell
+            onRowClick: unref(selectTableCell)
           }, {
             selectTitle: withCtx(() => [
               createVNode(unref(Checkbox), {
-                "model-value": selectedData.value.length === mediaFileData.value.length,
+                "model-value": unref(selectedData).length === unref(mediaFileData).length,
                 class: "icon",
-                onChange: selectTableAll
-              }, null, 8, ["model-value"])
+                onChange: unref(selectTableAll)
+              }, null, 8, ["model-value", "onChange"])
             ]),
             select: withCtx(({ record }) => [
               createVNode(unref(Checkbox), {
-                "model-value": unref(isItemChecked)(selectedData.value, record),
+                "model-value": unref(isItemChecked)(unref(selectedData), record),
                 class: "icon"
               }, null, 8, ["model-value"])
             ]),
@@ -415,18 +179,18 @@ const _sfc_main = defineComponent({
               ])
             ]),
             _: 1
-          }, 8, ["columns", "data", "loading", "onCellMouseEnter", "onCellMouseLeave"])
+          }, 8, ["columns", "data", "loading", "onCellMouseEnter", "onCellMouseLeave", "onRowClick"])
         ])),
         createElementVNode("div", _hoisted_12, [
           createElementVNode("div", _hoisted_13, [
             renderSlot(_ctx.$slots, "store", {}, void 0, true),
             withDirectives(createVNode(unref(Pagination), {
-              current: page.value.index,
-              "page-size": page.value.size,
-              total: page.value.total,
-              onChange: pageChangeHandle
-            }, null, 8, ["current", "page-size", "total"]), [
-              [vShow, mediaFileData.value.length > 0]
+              current: unref(page).index,
+              "page-size": unref(page).size,
+              total: unref(page).total,
+              onChange: unref(pageChangeHandle)
+            }, null, 8, ["current", "page-size", "total", "onChange"]), [
+              [vShow, unref(mediaFileData).length > 0]
             ])
           ]),
           renderSlot(_ctx.$slots, "options", {}, void 0, true)
@@ -435,5 +199,5 @@ const _sfc_main = defineComponent({
     };
   }
 });
-var ViewAllColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9b59a360"]]);
+var ViewAllColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ac92e0de"]]);
 export { ViewAllColumn as default };

package/es/selectAddTo/components/ViewAllColumn/script/useTableColumns.js

@@ -0,0 +1,78 @@
+import { ref, h } from "vue";
+import { Checkbox } from "@arco-design/web-vue";
+const useTableColumns = (props, selectedData, isItemChecked) => {
+  const columns = ref([
+    {
+      title: "\u52FE",
+      dataIndex: "select",
+      slotName: "select",
+      width: 40,
+      titleSlotName: "selectTitle",
+      render: ({ record }) => {
+        if (props.typeKey === "series:special_v3") {
+          if (record.isLeaf) {
+            return h(Checkbox, {
+              modelValue: isItemChecked.value(selectedData.value, record),
+              class: "icon"
+            });
+          }
+          return null;
+        }
+        return h(Checkbox, {
+          modelValue: isItemChecked.value(selectedData.value, record),
+          class: "icon"
+        });
+      }
+    },
+    {
+      title: "\u4E13\u9898/\u680F\u76EE\u540D\u79F0",
+      dataIndex: "title",
+      slotName: "title",
+      width: 428
+    },
+    {
+      title: "\u7F16\u8F91",
+      dataIndex: "duty_editor",
+      slotName: "duty_editor",
+      width: 100
+    },
+    {
+      title: "\u53D1\u5E03\u65F6\u95F4",
+      dataIndex: "pub_time",
+      slotName: "pub_time",
+      width: 150
+    }
+  ]);
+  const politicalColumns = ref([
+    {
+      title: "\u52FE",
+      dataIndex: "select",
+      slotName: "select",
+      width: 40,
+      titleSlotName: "selectTitle"
+    },
+    {
+      title: "\u653F\u60C5\u4EBA\u7269\u59D3\u540D",
+      dataIndex: "name",
+      slotName: "name",
+      width: 428
+    },
+    {
+      title: "\u804C\u4F4D",
+      dataIndex: "position",
+      slotName: "position",
+      width: 100
+    },
+    {
+      title: "\u5730\u533A",
+      dataIndex: "city_alias",
+      slotName: "city_alias",
+      width: 150
+    }
+  ]);
+  return {
+    columns,
+    politicalColumns
+  };
+};
+export { useTableColumns };