@cmstops/pro-compo 0.1.11 → 0.1.13

package/lib/mediaFilter/components/DocFilter.js

@@ -6,14 +6,12 @@ var doc = require("../../utils/doc.js");
 var optionsGetter = require("../script/optionsGetter.js");
 var FilterGroup = require("./FilterGroup.js");
 var FilterItem = require("./FilterItem.js");
-require("./DocFilter.vue_vue_type_style_index_0_scoped_true_lang.js");
-var pluginVue_exportHelper = require("../../_virtual/plugin-vue_export-helper.js");
 const _hoisted_1 = { class: "label" };
 const _hoisted_2 = { class: "label" };
 const _sfc_main = vue.defineComponent({
   __name: "DocFilter",
   props: {
-    filterKeys: { default: () => ["keywords", "doc_type"] },
+    filterKeys: { default: () => ["doc_type"] },
     filterType: { default: "APV" }
   },
   emits: ["search", "change"],
@@ -71,22 +69,27 @@ const _sfc_main = vue.defineComponent({
         filter.value[key] = "";
       });
     }
+    function columnFilter(fi) {
+      const ret = {};
+      calculateRules.value.forEach((item) => {
+        ret[item.key] = fi[item.key];
+      });
+      ret.keywords = fi.keywords;
+      ret.highSearch = {
+        order: fi.order,
+        sort: fi.sort,
+        meta: fi.meta
+      };
+      return ret;
+    }
     function handleSearch() {
-      emits("search", filter.value);
+      const ret = columnFilter(filter.value);
+      emits("search", ret);
     }
     vue.watch(
       () => filter.value,
       (n) => {
-        const ret = {};
-        calculateRules.value.forEach((item) => {
-          ret[item.key] = n[item.key];
-        });
-        ret.keywords = n.keywords;
-        ret.highSearch = {
-          order: n.order,
-          sort: n.sort,
-          meta: n.meta
-        };
+        const ret = columnFilter(n);
         emits("change", ret);
       },
       { deep: true }
@@ -241,12 +244,11 @@ const _sfc_main = vue.defineComponent({
             ]),
             _: 1
           })) : vue.createCommentVNode("v-if", true),
-          vue.renderSlot(_ctx.$slots, "right", {}, void 0, true)
+          vue.renderSlot(_ctx.$slots, "right")
         ]),
         _: 3
       });
     };
   }
 });
-var DocFilter = /* @__PURE__ */ pluginVue_exportHelper(_sfc_main, [["__scopeId", "data-v-10378a8c"]]);
-module.exports = DocFilter;
+module.exports = _sfc_main;

package/lib/mediaFilter/components/FilterGroup.js

@@ -3,8 +3,6 @@ var vue = require("vue");
 var webVue = require("@arco-design/web-vue");
 var icon = require("@arco-design/web-vue/es/icon");
 var core = require("@popperjs/core");
-require("./FilterGroup.vue_vue_type_style_index_0_scoped_true_lang.js");
-var pluginVue_exportHelper = require("../../_virtual/plugin-vue_export-helper.js");
 const _hoisted_1 = { class: "filter-view-container" };
 const _hoisted_2 = { class: "filter-search" };
 const _hoisted_3 = { class: "more-btn" };
@@ -137,7 +135,7 @@ const _sfc_main = vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.createElementVNode("div", _hoisted_2, [
-          vue.renderSlot(_ctx.$slots, "search", {}, void 0, true)
+          vue.renderSlot(_ctx.$slots, "search")
         ]),
         vue.createElementVNode("div", _hoisted_3, [
           vue.createElementVNode("div", {
@@ -173,10 +171,10 @@ const _sfc_main = vue.defineComponent({
             ref: filterItemsRef,
             class: "left"
           }, [
-            vue.renderSlot(_ctx.$slots, "left", {}, void 0, true)
+            vue.renderSlot(_ctx.$slots, "left")
           ], 512),
           vue.createElementVNode("div", _hoisted_6, [
-            vue.renderSlot(_ctx.$slots, "right", {}, void 0, true)
+            vue.renderSlot(_ctx.$slots, "right")
           ])
         ]),
         vue.createElementVNode("div", _hoisted_7, null, 512)
@@ -184,5 +182,4 @@ const _sfc_main = vue.defineComponent({
     };
   }
 });
-var FilterGroup = /* @__PURE__ */ pluginVue_exportHelper(_sfc_main, [["__scopeId", "data-v-017dcf0e"]]);
-module.exports = FilterGroup;
+module.exports = _sfc_main;

package/lib/mediaFilter/components/FilterItem.js

@@ -2,8 +2,6 @@
 var vue = require("vue");
 var webVue = require("@arco-design/web-vue");
 var icon = require("@arco-design/web-vue/es/icon");
-require("./FilterItem.vue_vue_type_style_index_0_scoped_true_lang.js");
-var pluginVue_exportHelper = require("../../_virtual/plugin-vue_export-helper.js");
 const _hoisted_1 = { class: "filter-item-view" };
 const _hoisted_2 = { class: "show-view" };
 const _hoisted_3 = { class: "right-prefix" };
@@ -107,11 +105,10 @@ const _sfc_main = vue.defineComponent({
           })
         ]),
         vue.createElementVNode("div", _hoisted_6, [
-          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          vue.renderSlot(_ctx.$slots, "default")
         ])
       ]);
     };
   }
 });
-var FilterItem = /* @__PURE__ */ pluginVue_exportHelper(_sfc_main, [["__scopeId", "data-v-197080c1"]]);
-module.exports = FilterItem;
+module.exports = _sfc_main;

package/lib/mediaFilter/style/index.css

@@ -1,4 +1,90 @@
-.tooltip-button {
+.filter-wrp .tooltip-button {
   height: auto;
   padding: 20px;
 }
+.filter-wrp .dop.active {
+  color: #165dff;
+}
+.filter-wrp .dop .label {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+.filter-wrp .filter-view-container {
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+  font-size: 14px;
+}
+.filter-wrp .filter-search {
+  display: flex;
+  gap: 10px;
+  width: 180px;
+  margin-right: 10px;
+}
+.filter-wrp .filter-content {
+  position: relative;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-between;
+}
+.filter-wrp .left {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+.filter-wrp .right {
+  position: absolute;
+  right: 0;
+  z-index: 1;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  height: 100%;
+  padding-left: 20px;
+  background: white;
+}
+.filter-wrp .more-btn {
+  margin-right: 10px;
+}
+.filter-wrp .right-prefix {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+.filter-wrp .filter-pannel {
+  display: flex;
+  gap: 10px;
+  padding: 10px;
+  background-color: white;
+  border-radius: 6px;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+}
+.filter-wrp .filter-item-view {
+  position: relative;
+  display: flex;
+  overflow: hidden;
+}
+.filter-wrp .filter-item-view .show-view {
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  pointer-events: none;
+}
+.filter-wrp .filter-item-view .select-view {
+  position: absolute;
+  z-index: 0;
+  width: 100%;
+}
+.filter-wrp .hasvalue-btn {
+  color: #165dff;
+  background-color: #e8f3ff;
+  border-right: none !important;
+}
+.filter-wrp .right-prefix {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}

package/lib/mediaFilter/style/index.less

@@ -1,4 +1,110 @@
-.tooltip-button {
-  height: auto;
-  padding: 20px;
+.filter-wrp {
+  .tooltip-button {
+    height: auto;
+    padding: 20px;
+  }
+
+  // DocFilter 组件内部样式
+  .dop.active {
+    color: #165dff;
+  }
+
+  .dop .label {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+  }
+
+  // FilterGroup 内部样式
+  .filter-view-container {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    font-size: 14px;
+  }
+
+  .filter-search {
+    display: flex;
+    gap: 10px;
+    width: 180px;
+    margin-right: 10px;
+  }
+
+  .filter-content {
+    position: relative;
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .left {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+  }
+
+  .right {
+    position: absolute;
+    right: 0;
+    z-index: 1;
+    display: flex;
+    flex-wrap: nowrap;
+    align-items: center;
+    height: 100%;
+    padding-left: 20px;
+    background: white;
+  }
+
+  .more-btn {
+    margin-right: 10px;
+  }
+
+  .right-prefix {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+  }
+
+  .filter-pannel {
+    display: flex;
+    gap: 10px;
+    padding: 10px;
+    background-color: white;
+    border-radius: 6px;
+    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+  }
+
+  // Filter Item 内部样式
+  .filter-item-view {
+    position: relative;
+    display: flex;
+    overflow: hidden;
+  }
+
+  .filter-item-view .show-view {
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    background: #fff;
+    pointer-events: none;
+  }
+
+  .filter-item-view .select-view {
+    position: absolute;
+    z-index: 0;
+    width: 100%;
+  }
+
+  .hasvalue-btn {
+    color: #165dff;
+    background-color: #e8f3ff;
+    border-right: none !important;
+  }
+
+  .right-prefix {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+  }
 }

package/lib/userDirector/component.js

@@ -1,17 +1,24 @@
 "use strict";
 var vue = require("vue");
 var webVue = require("@arco-design/web-vue");
+var icon = require("@arco-design/web-vue/es/icon");
 var config = require("../config.js");
+var userTree = require("./components/userTree.js");
 var api = require("./script/api.js");
 const _hoisted_1 = { class: "user-select-content" };
 const _hoisted_2 = { class: "user-select-left" };
-const _hoisted_3 = /* @__PURE__ */ vue.createElementVNode("div", { class: "user-select-right" }, null, -1);
+const _hoisted_3 = { class: "user-select-right" };
+const _hoisted_4 = { class: "user-select-right-title" };
+const _hoisted_5 = { class: "left" };
+const _hoisted_6 = { class: "alias" };
+const _hoisted_7 = { class: "action" };
 const _sfc_main = vue.defineComponent({
   ...{ name: "userDirector" },
   __name: "component",
   props: {
     BASE_API: {},
     repositoryId: {},
+    defaultData: {},
     visible: { type: Boolean },
     title: {}
   },
@@ -20,47 +27,58 @@ const _sfc_main = vue.defineComponent({
     const props = __props;
     const BASE_API = props.BASE_API || config.DEFAULT_BASE_API;
     const emit = __emit;
-    const loadMore = () => {
-    };
     const RoleTreeData = vue.ref([]);
     const DepartTreeData = vue.ref([]);
-    const fieldNames = {
-      children: "children",
-      title: "alias",
-      key: "node_key"
-    };
+    const userSelectedList = vue.ref([]);
     const selectRoleNode = (selectedKeys, data) => {
       console.log("selectRoleNode", data);
     };
+    const clearUserSelectedList = () => {
+      userSelectedList.value = [];
+    };
+    const loadRoleAllUser = async (id) => {
+      const res = await api.getRoleAllUser(BASE_API, { id });
+      if (res.code === 0) {
+        return res.message.map((item) => {
+          item.node_key = `role_${id}_${item.uid}`;
+          item.isUser = true;
+          item.isLeaf = true;
+          return item;
+        });
+      }
+      return [];
+    };
     const expandRoleNode = async (selectedKeys, data) => {
       if (data.node.isRole) {
-        const res = await api.getRoleAllUser(BASE_API, { id: data.node.id });
-        if (res.code === 0) {
-          data.node.children = res.message.map((item) => {
-            item.node_key = `role_${data.node.id}_${item.uid}`;
-            item.isUser = true;
-            item.isLeaf = true;
-            return item;
-          });
-        }
+        data.node.children = await loadRoleAllUser(data.node.id);
       }
     };
     const selectDepartNode = (selectedKeys, data) => {
       console.log("selectDepartNode", data);
     };
+    const loadDepartUserList = async (id) => {
+      const res = await api.getDepartUserList(BASE_API, { pid: id });
+      if (res.code === 0) {
+        return res.message.map((item) => {
+          item.node_key = `depart_${id}_${item.uid}`;
+          item.isUser = true;
+          item.isLeaf = true;
+          return item;
+        });
+      }
+      return [];
+    };
     const expandDepartNode = async (selectedKeys, data) => {
       if (data.node.isDepart) {
-        const res = await api.getDepartUserList(BASE_API, { pid: data.node.id });
-        if (res.code === 0) {
-          data.node.children = res.message.map((item) => {
-            item.node_key = `depart_${data.node.id}_${item.uid}`;
-            item.isUser = true;
-            item.isLeaf = true;
-            return item;
-          });
-        }
+        data.node.children = await loadDepartUserList(data.node.id);
       }
     };
+    const collapseStyle = vue.ref({
+      paddingLfet: "0px",
+      paddingRigth: "0px",
+      border: "none",
+      background: "white"
+    });
     const collapseChange = async (keys) => {
       if (keys.includes("Role")) {
         api.getRepoRoleList(BASE_API, { repoID: props.repositoryId }).then((res) => {
@@ -86,22 +104,56 @@ const _sfc_main = vue.defineComponent({
       }
     };
     const allUserList = vue.ref([]);
-    const completeUser = vue.ref();
     const getUserList = async () => {
       const res = await api.getRepoUserList(BASE_API, { id: props.repositoryId });
       if (res.code === 0) {
-        allUserList.value = res.message.map((item) => {
-          item.value = item.uid;
-          item.label = item.alias;
-          return item;
+        allUserList.value = res.message;
+      }
+    };
+    const searchUserChange = (value) => {
+      const target = allUserList.value.find((item) => item.uid === value);
+      if (target) {
+        addUserSelectedList(target);
+      }
+    };
+    const userSelectedListFilter = (user) => {
+      const result = { ...user };
+      const userList = [].concat(userSelectedList.value);
+      for (const i of userList) {
+        if (result.id === i.id) {
+          return false;
+        }
+      }
+      return result;
+    };
+    const addItem = async (nodeData) => {
+      if (nodeData.isUser) {
+        addUserSelectedList(nodeData);
+      }
+      if (nodeData.isRole) {
+        const users = await loadRoleAllUser(nodeData.id);
+        users.forEach((user) => {
+          addUserSelectedList(user, false);
+        });
+      }
+      if (nodeData.isDepart) {
+        const users = await loadDepartUserList(nodeData.id);
+        users.forEach((user) => {
+          addUserSelectedList(user, false);
         });
       }
     };
-    const selectUser = (value) => {
-      console.log(value);
-      setTimeout(() => {
-        completeUser.value = "";
-      }, 100);
+    const addUserSelectedList = (user, tip = true) => {
+      user = userSelectedListFilter(user);
+      if (user) {
+        user.rtype = "user";
+        userSelectedList.value.push(user);
+      } else if (tip) {
+        webVue.Message.warning("\u6210\u5458\u5DF2\u5B58\u5728");
+      }
+    };
+    const removeUserSelected = (index) => {
+      userSelectedList.value.splice(index, 1);
     };
     vue.onMounted(() => {
       getUserList();
@@ -126,10 +178,10 @@ const _sfc_main = vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(webVue.Modal), {
         visible: visible.value,
-        width: "986px",
+        width: "700px",
         "mask-closable": false,
-        footer: false,
         "title-align": "start",
+        "body-class": "user-director-modal-body",
         "unmount-on-close": "",
         onOk: handleOk,
         onCancel: handleCancel
@@ -140,57 +192,120 @@ const _sfc_main = vue.defineComponent({
         default: vue.withCtx(() => [
           vue.createElementVNode("div", _hoisted_1, [
             vue.createElementVNode("div", _hoisted_2, [
-              vue.createVNode(vue.unref(webVue.AutoComplete), {
-                modelValue: completeUser.value,
-                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => completeUser.value = $event),
-                data: allUserList.value,
+              vue.createVNode(vue.unref(webVue.Select), {
                 placeholder: "\u641C\u7D22\u59D3\u540D\u3001\u7528\u6237\u540D",
-                onSelect: selectUser
-              }, null, 8, ["modelValue", "data"]),
+                "allow-search": "",
+                size: "large",
+                onChange: searchUserChange
+              }, {
+                default: vue.withCtx(() => [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(allUserList.value, (item) => {
+                    return vue.openBlock(), vue.createBlock(vue.unref(webVue.Option), {
+                      key: item.uid,
+                      value: item.uid,
+                      label: item.alias
+                    }, null, 8, ["value", "label"]);
+                  }), 128))
+                ]),
+                _: 1
+              }),
               vue.createVNode(vue.unref(webVue.Collapse), {
                 accordion: "",
+                bordered: false,
                 onChange: collapseChange
               }, {
                 default: vue.withCtx(() => [
                   vue.createVNode(vue.unref(webVue.CollapseItem), {
                     key: "Role",
-                    header: "\u6309\u89D2\u8272\u9009\u62E9"
+                    header: "\u6309\u89D2\u8272\u9009\u62E9",
+                    style: vue.normalizeStyle(collapseStyle.value)
                   }, {
                     default: vue.withCtx(() => [
-                      vue.createVNode(vue.unref(webVue.Tree), {
-                        data: RoleTreeData.value,
-                        "load-more": loadMore,
-                        "field-names": fieldNames,
-                        "action-on-node-click": "expand",
-                        onSelect: selectRoleNode,
-                        onExpand: expandRoleNode
-                      }, null, 8, ["data"])
+                      vue.createVNode(vue.unref(webVue.Scrollbar), { style: { "height": "40vh", "overflow": "auto" } }, {
+                        default: vue.withCtx(() => [
+                          vue.createVNode(userTree, {
+                            list: RoleTreeData.value,
+                            onSelect: selectRoleNode,
+                            onExpand: expandRoleNode,
+                            onAdd: addItem
+                          }, null, 8, ["list"])
+                        ]),
+                        _: 1
+                      })
                     ]),
                     _: 1
-                  }),
+                  }, 8, ["style"]),
                   vue.createVNode(vue.unref(webVue.CollapseItem), {
                     key: "Depart",
-                    header: "\u6309\u7EC4\u7EC7\u67B6\u6784\u9009\u62E9"
+                    header: "\u6309\u7EC4\u7EC7\u67B6\u6784\u9009\u62E9",
+                    style: vue.normalizeStyle(collapseStyle.value)
                   }, {
                     default: vue.withCtx(() => [
-                      vue.createVNode(vue.unref(webVue.Tree), {
-                        size: "large",
-                        "block-node": "",
-                        "field-names": fieldNames,
-                        data: DepartTreeData.value,
-                        "load-more": loadMore,
-                        "action-on-node-click": "expand",
-                        onSelect: selectDepartNode,
-                        onExpand: expandDepartNode
-                      }, null, 8, ["data"])
+                      vue.createVNode(vue.unref(webVue.Scrollbar), { style: { "height": "40vh", "overflow": "auto" } }, {
+                        default: vue.withCtx(() => [
+                          vue.createVNode(userTree, {
+                            list: DepartTreeData.value,
+                            onSelect: selectDepartNode,
+                            onExpand: expandDepartNode,
+                            onAdd: addItem
+                          }, null, 8, ["list"])
+                        ]),
+                        _: 1
+                      })
                     ]),
                     _: 1
-                  })
+                  }, 8, ["style"])
                 ]),
                 _: 1
               })
             ]),
-            _hoisted_3
+            vue.createElementVNode("div", _hoisted_3, [
+              vue.createElementVNode("div", _hoisted_4, [
+                vue.createElementVNode("span", null, "\u5DF2\u9009\u6210\u5458(" + vue.toDisplayString(userSelectedList.value.length) + "\u4EBA)", 1),
+                vue.createVNode(vue.unref(webVue.Button), {
+                  type: "text",
+                  size: "mini",
+                  onClick: clearUserSelectedList
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createTextVNode("\u5168\u90E8\u6E05\u9664")
+                  ]),
+                  _: 1
+                })
+              ]),
+              vue.createVNode(vue.unref(webVue.Scrollbar), { style: { "height": "100%", "overflow": "auto" } }, {
+                default: vue.withCtx(() => [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(userSelectedList.value, (item, index) => {
+                    return vue.openBlock(), vue.createElementBlock("div", {
+                      key: item.uid,
+                      class: "user-item"
+                    }, [
+                      vue.createElementVNode("div", _hoisted_5, [
+                        vue.createVNode(vue.unref(webVue.Avatar), {
+                          size: 32,
+                          "image-url": item.avatar
+                        }, null, 8, ["image-url"]),
+                        vue.createElementVNode("div", _hoisted_6, vue.toDisplayString(item.alias), 1)
+                      ]),
+                      vue.createElementVNode("div", _hoisted_7, [
+                        vue.createVNode(vue.unref(webVue.Button), {
+                          type: "primary",
+                          size: "mini",
+                          shape: "circle",
+                          onClick: ($event) => removeUserSelected(index)
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(vue.unref(icon.IconDelete))
+                          ]),
+                          _: 2
+                        }, 1032, ["onClick"])
+                      ])
+                    ]);
+                  }), 128))
+                ]),
+                _: 1
+              })
+            ])
           ])
         ]),
         _: 1