@cmstops/pro-compo 0.3.39 → 0.3.41

package/es/docHistory/scripts/useDocHistory.js

@@ -0,0 +1,71 @@
+import { ref } from "vue";
+import request from "../../utils/request.js";
+import { CompareById2 } from "./diff.js";
+function getDocHistory(BASE_API, id, pub) {
+  return request(BASE_API, {
+    url: `/poplar/v2/content/${id}/history?pub=${pub}`,
+    method: "get"
+  });
+}
+function useDocHistory(BASE_API) {
+  const list = ref([]);
+  const loading = ref(true);
+  const current = ref(0);
+  const diffContent = ref();
+  const id = ref();
+  const pub = ref(false);
+  function initParams(mediaId, docPub) {
+    id.value = mediaId;
+    pub.value = docPub;
+  }
+  async function loadData() {
+    if (!id.value)
+      return;
+    loading.value = true;
+    try {
+      const { code, message } = await getDocHistory(BASE_API, id.value, pub.value);
+      if (code !== 0)
+        return;
+      list.value = message;
+      handleSelect(0);
+    } catch (e) {
+      console.log(e);
+    } finally {
+      loading.value = false;
+    }
+  }
+  async function handleSelect(idx) {
+    loading.value = true;
+    try {
+      current.value = idx;
+      await new Promise((resolve) => setTimeout(resolve, 500));
+      const cur = list.value[idx];
+      const prev = list.value[idx + 1];
+      const value = JSON.parse(JSON.stringify(cur));
+      if (!prev) {
+        diffContent.value = value;
+        return;
+      }
+      const curHtml = document.createElement("div");
+      curHtml.innerHTML = cur.content;
+      const prevHtml = document.createElement("div");
+      prevHtml.innerHTML = prev.content;
+      value.content = CompareById2(curHtml, prevHtml);
+      diffContent.value = value;
+    } catch (e) {
+      console.log(e, "diff \u5931\u8D25");
+    } finally {
+      loading.value = false;
+    }
+  }
+  return {
+    diffContent,
+    current,
+    loading,
+    list,
+    loadData,
+    initParams,
+    handleSelect
+  };
+}
+export { getDocHistory, useDocHistory };

package/es/docHistory/style/css.js

@@ -0,0 +1 @@
+import "./index.css";

package/es/docHistory/style/docDiffPanel.less

@@ -0,0 +1,9 @@
+.doc-diff-panel-wrap {
+  padding: 24px;
+
+  .doc-title {
+    color: var(--color-text-1);
+    font-weight: bold;
+    font-size: 24px;
+  }
+}

package/es/docHistory/style/docHistoryList.less

@@ -0,0 +1,58 @@
+.doc-history-list-wrap {
+  box-sizing: border-box;
+  border-left: 1px solid var(--color-border-1);
+
+  // 单条历史记录
+  .doc-history-item {
+    display: flex;
+    flex-direction: column;
+    gap: 5px;
+    box-sizing: border-box;
+    width: 260px;
+    padding: 20px 16px;
+    border-bottom: 1px solid var(--color-border-1);
+    border-left: 3px solid transparent;
+    cursor: pointer;
+
+    .update-time {
+      color: var(--color-text-1);
+      font-size: 14px;
+    }
+
+    .tips {
+      color: var(--color-text-2);
+      font-size: 12px;
+    }
+
+    .doc-author {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+      color: var(--color-text-1);
+      font-size: 14px;
+
+      &::before {
+        width: 5px;
+        height: 5px;
+        background-color: rgb(var(--primary-6));
+        border-radius: 50%;
+        content: ' ';
+      }
+    }
+
+    // 激活/选中状态
+    &.active {
+      background-color: rgba(var(--primary-6), 0.1);
+      border-left-color: rgb(var(--primary-6));
+
+      .update-time {
+        color: rgb(var(--primary-6));
+      }
+    }
+
+    // 悬浮
+    &:hover {
+      background-color: var(--color-fill-1);
+    }
+  }
+}

package/es/docHistory/style/index.css

@@ -0,0 +1,74 @@
+.doc-diff-panel-wrap {
+  padding: 24px;
+}
+.doc-diff-panel-wrap .doc-title {
+  color: var(--color-text-1);
+  font-weight: bold;
+  font-size: 24px;
+}
+.doc-history-list-wrap {
+  box-sizing: border-box;
+  border-left: 1px solid var(--color-border-1);
+}
+.doc-history-list-wrap .doc-history-item {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  box-sizing: border-box;
+  width: 260px;
+  padding: 20px 16px;
+  border-bottom: 1px solid var(--color-border-1);
+  border-left: 3px solid transparent;
+  cursor: pointer;
+}
+.doc-history-list-wrap .doc-history-item .update-time {
+  color: var(--color-text-1);
+  font-size: 14px;
+}
+.doc-history-list-wrap .doc-history-item .tips {
+  color: var(--color-text-2);
+  font-size: 12px;
+}
+.doc-history-list-wrap .doc-history-item .doc-author {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  color: var(--color-text-1);
+  font-size: 14px;
+}
+.doc-history-list-wrap .doc-history-item .doc-author::before {
+  width: 5px;
+  height: 5px;
+  background-color: rgb(var(--primary-6));
+  border-radius: 50%;
+  content: ' ';
+}
+.doc-history-list-wrap .doc-history-item.active {
+  background-color: rgba(var(--primary-6), 0.1);
+  border-left-color: rgb(var(--primary-6));
+}
+.doc-history-list-wrap .doc-history-item.active .update-time {
+  color: rgb(var(--primary-6));
+}
+.doc-history-list-wrap .doc-history-item:hover {
+  background-color: var(--color-fill-1);
+}
+.doc-history-wrap {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.doc-history-wrap .doc-diff-panel {
+  flex: 1;
+  height: 100%;
+}
+.doc-history-wrap .doc-diff-panel .doc-diff-panel-wrap {
+  padding: 24px;
+}
+.doc-history-wrap .doc-history-list {
+  height: 100%;
+}
+.doc-history-drawer .arco-drawer-body {
+  padding: 0;
+}

package/es/docHistory/style/index.d.ts

@@ -0,0 +1 @@
+import './index.less';

package/es/docHistory/style/index.js

@@ -0,0 +1 @@
+import "./index.less";

package/es/docHistory/style/index.less

@@ -0,0 +1,28 @@
+@import './docDiffPanel.less';
+@import './docHistoryList.less';
+
+.doc-history-wrap {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+
+  .doc-diff-panel {
+    flex: 1;
+    height: 100%;
+
+    .doc-diff-panel-wrap {
+      padding: 24px;
+    }
+  }
+
+  .doc-history-list {
+    height: 100%;
+  }
+}
+
+.doc-history-drawer {
+  .arco-drawer-body {
+    padding: 0;
+  }
+}

package/es/index.css

@@ -4672,3 +4672,77 @@
   font-size: 20px;
   cursor: pointer;
 }
+.doc-diff-panel-wrap {
+  padding: 24px;
+}
+.doc-diff-panel-wrap .doc-title {
+  color: var(--color-text-1);
+  font-weight: bold;
+  font-size: 24px;
+}
+.doc-history-list-wrap {
+  box-sizing: border-box;
+  border-left: 1px solid var(--color-border-1);
+}
+.doc-history-list-wrap .doc-history-item {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  box-sizing: border-box;
+  width: 260px;
+  padding: 20px 16px;
+  border-bottom: 1px solid var(--color-border-1);
+  border-left: 3px solid transparent;
+  cursor: pointer;
+}
+.doc-history-list-wrap .doc-history-item .update-time {
+  color: var(--color-text-1);
+  font-size: 14px;
+}
+.doc-history-list-wrap .doc-history-item .tips {
+  color: var(--color-text-2);
+  font-size: 12px;
+}
+.doc-history-list-wrap .doc-history-item .doc-author {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  color: var(--color-text-1);
+  font-size: 14px;
+}
+.doc-history-list-wrap .doc-history-item .doc-author::before {
+  width: 5px;
+  height: 5px;
+  background-color: rgb(var(--primary-6));
+  border-radius: 50%;
+  content: ' ';
+}
+.doc-history-list-wrap .doc-history-item.active {
+  background-color: rgba(var(--primary-6), 0.1);
+  border-left-color: rgb(var(--primary-6));
+}
+.doc-history-list-wrap .doc-history-item.active .update-time {
+  color: rgb(var(--primary-6));
+}
+.doc-history-list-wrap .doc-history-item:hover {
+  background-color: var(--color-fill-1);
+}
+.doc-history-wrap {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.doc-history-wrap .doc-diff-panel {
+  flex: 1;
+  height: 100%;
+}
+.doc-history-wrap .doc-diff-panel .doc-diff-panel-wrap {
+  padding: 24px;
+}
+.doc-history-wrap .doc-history-list {
+  height: 100%;
+}
+.doc-history-drawer .arco-drawer-body {
+  padding: 0;
+}

package/es/index.d.ts

@@ -25,3 +25,4 @@ export { default as mediaView } from './mediaView';
 export { default as thumbCard } from './thumbCard';
 export { default as selectResourceModal } from './selectResourceModal';
 export { default as docPreview } from './docPreview';
+export { default as docHistory } from './docHistory';

package/es/index.js

@@ -25,3 +25,4 @@ export { default as mediaView } from "./mediaView/index.js";
 export { default as thumbCard } from "./thumbCard/index.js";
 export { default as selectResourceModal } from "./selectResourceModal/index.js";
 export { default as docPreview } from "./docPreview/index.js";
+export { default as docHistory } from "./docHistory/index.js";

package/es/index.less

@@ -25,3 +25,4 @@
 @import './thumbCard/style/index.less';
 @import './selectResourceModal/style/index.less';
 @import './docPreview/style/index.less';
+@import './docHistory/style/index.less';

package/lib/contentModal/components/ViewAllColumn/MediaFilter/index.js

@@ -6,10 +6,7 @@ var doc = require("../../../../utils/doc.js");
 var index = require("../columnTree/index.js");
 const _hoisted_1 = { class: "media-filter-container" };
 const _hoisted_2 = { style: { "display": "flex", "align-items": "center", "gap": "5px" } };
-const _hoisted_3 = /* @__PURE__ */ vue.createElementVNode("span", null, "\u7CBE\u51C6\u641C", -1);
-const _hoisted_4 = { style: { "display": "flex", "align-items": "center", "gap": "5px" } };
-const _hoisted_5 = /* @__PURE__ */ vue.createElementVNode("span", null, "\u6A21\u7CCA\u641C", -1);
-const _hoisted_6 = { class: "sort-button" };
+const _hoisted_3 = { class: "sort-button" };
 const _sfc_main = vue.defineComponent({
   ...{ name: "MediaFilter" },
   __name: "index",
@@ -24,7 +21,7 @@ const _sfc_main = vue.defineComponent({
   emits: ["update:group_id", "search"],
   setup(__props, { emit: __emit }) {
     const props = __props;
-    const column_id = vue.ref(0);
+    const column_id = vue.ref("all");
     const emit = __emit;
     const filter = vue.ref({
       keywords: "",
@@ -35,6 +32,18 @@ const _sfc_main = vue.defineComponent({
       order: "create_time",
       wordState: "precision"
     });
+    const wordStateOptions = [
+      {
+        value: "precision",
+        label: "\u7CBE\u51C6\u641C",
+        desc: "\u4F1A\u4EE5\u8F93\u5165\u7684\u5B8C\u6574\u5173\u952E\u8BCD\u201C\u6210\u957F\u201D\u8FDB\u884C\u641C\u7D22\uFF0C\u641C\u7D22\u7ED3\u679C\u5173\u8054\u6027\u66F4\u9AD8\uFF0C\u4F46\u641C\u7D22\u7ED3\u679C\u66F4\u5C11"
+      },
+      {
+        value: "blur",
+        label: "\u6A21\u7CCA\u641C",
+        desc: "\u4F1A\u5C06\u8F93\u5165\u5185\u5BB9\u5206\u8BCD\uFF0C\u4F8B\u5982\u201C\u6210\u957F\u201D\u4F1A\u5206\u4E3A\u201C\u6210\u201D\u3001\u201C\u957F\u201D\u3001\u201C\u6210\u957F\u201D\uFF0C\u5185\u5BB9\u5305\u542B\u4E09\u4E2A\u8BCD\u4E2D\u4EFB\u610F\u4E00\u4E2A\u5747\u4F1A\u663E\u793A\u51FA\u6765\uFF0C\u641C\u7D22\u5185\u5BB9\u66F4\u52A0\u4E30\u5BCC"
+      }
+    ];
     const bannerOptions = vue.computed(() => {
       const options = [
         {
@@ -92,22 +101,24 @@ const _sfc_main = vue.defineComponent({
       return filter.value.keywords || series || filter.value.cover_type || banner || filter.value.sort !== -1;
     });
     const reset = () => {
-      filter.value = {
+      const _set = {
         keywords: "",
         cover_type: "",
         sort: -1,
         order: "create_time"
       };
+      Object.assign(filter.value, _set);
       if (props.banner !== "all") {
         filter.value.banner = props.banner;
       } else {
         filter.value.banner = "";
       }
-      if (props.series !== "all") {
+      if (props.series !== "all" && props.series.split(",").length === 1) {
         filter.value.type = props.series;
       } else {
         filter.value.type = "";
       }
+      column_id.value = "all";
     };
     const checkout = (type) => {
       filter.value.wordState = type;
@@ -157,6 +168,7 @@ const _sfc_main = vue.defineComponent({
               "allow-clear": "",
               class: "filter-item keyword",
               placeholder: "\u8BF7\u8F93\u5165\u5185\u5BB9\u6807\u9898",
+              style: { width: "240px" },
               onPressEnter: handleSearch
             }, {
               prepend: vue.withCtx(() => [
@@ -167,48 +179,30 @@ const _sfc_main = vue.defineComponent({
                   onSelect: checkout
                 }, {
                   default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(webVue.Option), {
-                      value: "precision",
-                      label: "\u7CBE\u51C6\u641C"
-                    }, {
-                      default: vue.withCtx(() => [
-                        vue.createElementVNode("div", _hoisted_2, [
-                          _hoisted_3,
-                          vue.createVNode(vue.unref(webVue.Tooltip), {
-                            effect: "dark",
-                            content: "\u4F1A\u4EE5\u8F93\u5165\u7684\u5B8C\u6574\u5173\u952E\u8BCD\u201C\u6210\u957F\u201D\u8FDB\u884C\u641C\u7D22\uFF0C\u641C\u7D22\u7ED3\u679C\u5173\u8054\u6027\u66F4\u9AD8\uFF0C\u4F46\u641C\u7D22\u7ED3\u679C\u66F4\u5C11",
-                            position: "right"
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(icon.IconInfoCircle))
-                            ]),
-                            _: 1
-                          })
-                        ])
-                      ]),
-                      _: 1
-                    }),
-                    vue.createVNode(vue.unref(webVue.Option), {
-                      value: "blur",
-                      label: "\u6A21\u7CCA\u641C"
-                    }, {
-                      default: vue.withCtx(() => [
-                        vue.createElementVNode("div", _hoisted_4, [
-                          _hoisted_5,
-                          vue.createVNode(vue.unref(webVue.Tooltip), {
-                            effect: "dark",
-                            content: "\u4F1A\u5C06\u8F93\u5165\u5185\u5BB9\u5206\u8BCD\uFF0C\u4F8B\u5982\u201C\u6210\u957F\u201D\u4F1A\u5206\u4E3A\u201C\u6210\u201D\u3001\u201C\u957F\u201D\u3001\u201C\u6210\u957F\u201D\uFF0C\u5185\u5BB9\u5305\u542B\u4E09\u4E2A\u8BCD\u4E2D\u4EFB\u610F\u4E00\u4E2A\u5747\u4F1A\u663E\u793A\u51FA\u6765\uFF0C\u641C\u7D22\u5185\u5BB9\u66F4\u52A0\u4E30\u5BCC",
-                            position: "right"
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(icon.IconInfoCircle))
-                            ]),
-                            _: 1
-                          })
-                        ])
-                      ]),
-                      _: 1
-                    })
+                    (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, vue.renderList(wordStateOptions, (item, index2) => {
+                      return vue.createVNode(vue.unref(webVue.Option), {
+                        key: index2,
+                        value: item.value,
+                        label: item.label
+                      }, {
+                        default: vue.withCtx(() => [
+                          vue.createElementVNode("div", _hoisted_2, [
+                            vue.createElementVNode("span", null, vue.toDisplayString(item.label), 1),
+                            vue.createVNode(vue.unref(webVue.Tooltip), {
+                              effect: "dark",
+                              content: item.desc,
+                              position: "right"
+                            }, {
+                              default: vue.withCtx(() => [
+                                vue.createVNode(vue.unref(icon.IconInfoCircle))
+                              ]),
+                              _: 2
+                            }, 1032, ["content"])
+                          ])
+                        ]),
+                        _: 2
+                      }, 1032, ["value", "label"]);
+                    }), 64))
                   ]),
                   _: 1
                 }, 8, ["modelValue"])
@@ -300,7 +294,7 @@ const _sfc_main = vue.defineComponent({
           ]),
           _: 1
         }),
-        vue.createElementVNode("div", _hoisted_6, [
+        vue.createElementVNode("div", _hoisted_3, [
           vue.createVNode(vue.unref(webVue.Select), {
             modelValue: filter.value.order,
             "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => filter.value.order = $event),

package/lib/docHistory/component.js

@@ -0,0 +1,101 @@
+"use strict";
+var vue = require("vue");
+var webVue = require("@arco-design/web-vue");
+var config = require("../config.js");
+var useDocHistory = require("./scripts/useDocHistory.js");
+var index$1 = require("./components/DocHistoryList/index.js");
+var index = require("./components/DocDiffPanel/index.js");
+const _hoisted_1 = { class: "doc-history-wrap" };
+const _hoisted_2 = { class: "doc-diff-panel" };
+const _hoisted_3 = { class: "doc-history-list" };
+const _sfc_main = vue.defineComponent({
+  ...{ name: "docHistory" },
+  __name: "component",
+  props: {
+    BASE_API: {},
+    visible: { type: Boolean },
+    docInfo: {},
+    pub: { type: Boolean }
+  },
+  emits: ["update:visible"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const vis = vue.computed({
+      get: () => props.visible,
+      set: (val) => {
+        emits("update:visible", val);
+      }
+    });
+    const BASE_API = props.BASE_API || config.DEFAULT_BASE_API;
+    const {
+      initParams,
+      loadData,
+      handleSelect,
+      loading,
+      diffContent,
+      list,
+      current
+    } = useDocHistory.useDocHistory(BASE_API);
+    vue.onMounted(() => {
+      if (!props.docInfo)
+        return;
+      initParams(props.docInfo.id, props.pub);
+      loadData();
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(webVue.Drawer), {
+        visible: vis.value,
+        "onUpdate:visible": _cache[0] || (_cache[0] = ($event) => vis.value = $event),
+        class: "doc-history-drawer",
+        title: "\u7248\u672C\u8BB0\u5F55",
+        width: 1e3,
+        footer: false
+      }, {
+        default: vue.withCtx(() => [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.createElementVNode("div", _hoisted_2, [
+              vue.createVNode(vue.unref(webVue.Spin), {
+                loading: vue.unref(loading),
+                style: { "height": "100%", "width": "100%" }
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(vue.unref(webVue.Scrollbar), {
+                    "outer-style": { height: "100%" },
+                    style: { "height": "100%", "overflow": "auto" }
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.unref(diffContent) ? (vue.openBlock(), vue.createBlock(index, {
+                        key: 0,
+                        doc: vue.unref(diffContent)
+                      }, null, 8, ["doc"])) : vue.createCommentVNode("v-if", true)
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }, 8, ["loading"])
+            ]),
+            vue.createElementVNode("div", _hoisted_3, [
+              vue.createVNode(vue.unref(webVue.Scrollbar), {
+                "outer-style": { height: "100%" },
+                style: { "height": "100%", "overflow": "auto" }
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(index$1, {
+                    list: vue.unref(list),
+                    current: vue.unref(current),
+                    onSelect: vue.unref(handleSelect)
+                  }, null, 8, ["list", "current", "onSelect"])
+                ]),
+                _: 1
+              })
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["visible"]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/docHistory/components/DocDiffPanel/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var vue = require("vue");
+const _hoisted_1 = { class: "doc-diff-panel-wrap" };
+const _hoisted_2 = { class: "doc-title" };
+const _hoisted_3 = ["innerHTML"];
+const _sfc_main = vue.defineComponent({
+  __name: "index",
+  props: {
+    doc: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_2, vue.toDisplayString(_ctx.doc.title), 1),
+        vue.createElementVNode("div", {
+          class: "doc-content",
+          innerHTML: _ctx.doc.content
+        }, null, 8, _hoisted_3)
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/docHistory/components/DocHistoryList/index.js

@@ -0,0 +1,38 @@
+"use strict";
+var vue = require("vue");
+var index = require("../../../utils/index.js");
+const _hoisted_1 = { class: "doc-history-list-wrap" };
+const _hoisted_2 = ["onClick"];
+const _hoisted_3 = { class: "update-time" };
+const _hoisted_4 = {
+  key: 0,
+  class: "tips"
+};
+const _hoisted_5 = { class: "doc-author" };
+const _sfc_main = vue.defineComponent({
+  __name: "index",
+  props: {
+    list: {},
+    current: {}
+  },
+  emits: ["select"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.list, (item, idx) => {
+          return vue.openBlock(), vue.createElementBlock("div", {
+            key: item,
+            class: vue.normalizeClass(["doc-history-item", { active: idx === _ctx.current }]),
+            onClick: ($event) => emits("select", idx)
+          }, [
+            vue.createElementVNode("div", _hoisted_3, vue.toDisplayString(vue.unref(index.timeFormat)(item.update_time)), 1),
+            idx === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, " \u6700\u8FD1\u66F4\u65B0")) : vue.createCommentVNode("v-if", true),
+            vue.createElementVNode("div", _hoisted_5, vue.toDisplayString(item.author), 1)
+          ], 10, _hoisted_2);
+        }), 128))
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/docHistory/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var component = require("./component.js");
+const docHistory = Object.assign(component, {
+  install: (app) => {
+    app.component(component.name, component);
+  }
+});
+module.exports = docHistory;