@cmstops/pro-compo 0.1.9 → 0.1.11

package/lib/uploadStep/component.js

@@ -1,14 +1,149 @@
 "use strict";
 var vue = require("vue");
+var icon = require("@arco-design/web-vue/es/icon");
+var webVue = require("@arco-design/web-vue");
+var component = require("../typeIcons/component.js");
+var toggle = require("../hooks/toggle.js");
+const _hoisted_1 = { class: "panel_header" };
+const _hoisted_2 = { class: "title" };
+const _hoisted_3 = { class: "opt" };
+const _hoisted_4 = { class: "panel_column flex-3" };
+const _hoisted_5 = { class: "media_alias ellips" };
+const _hoisted_6 = { class: "panel_column percent flex-1" };
+var stateEnum = /* @__PURE__ */ ((stateEnum2) => {
+  stateEnum2[stateEnum2["UPLOADING"] = 3] = "UPLOADING";
+  stateEnum2[stateEnum2["WATING"] = 5] = "WATING";
+  stateEnum2[stateEnum2["SUCCESS"] = 2] = "SUCCESS";
+  stateEnum2[stateEnum2["ERROR"] = -1] = "ERROR";
+  return stateEnum2;
+})(stateEnum || {});
 const _sfc_main = vue.defineComponent({
   ...{ name: "uploadStep" },
   __name: "component",
   props: {
-    BASE_API: {}
+    BASE_API: {},
+    fileList: {},
+    visable: { type: Boolean },
+    global: { type: Boolean }
   },
-  setup(__props) {
+  emits: ["update:visable"],
+  setup(__props, { emit: __emit }) {
+    const progressEnum = {
+      UPLOADING: "normal",
+      WATING: "normal",
+      SUCCESS: "success",
+      ERROR: "danger"
+    };
+    const stateTxtEnum = {
+      UPLOADING: "\u4E0A\u4F20\u4E2D",
+      WATING: "\u6392\u961F\u4E2D",
+      SUCCESS: "\u4E0A\u4F20\u5B8C\u6210",
+      ERROR: "\u4E0A\u4F20\u5931\u8D25"
+    };
+    const emits = __emit;
+    const props = __props;
+    const showList = vue.toRef(props, "fileList");
+    const { state: expend, toggle: toggleExp } = toggle.useToggle(true);
+    const { state: scale, toggle: toggleSca } = toggle.useToggle();
+    const cardBodyStyle = vue.computed(() => expend.value ? {} : { padding: 0 });
+    const titleTxt = vue.computed(() => isUploading.value ? "\u6B63\u5728\u5904\u7406" : "\u5904\u7406\u5B8C\u6210");
+    const successCount = vue.computed(
+      () => showList.value.filter((it) => !uploadingFilter(it.state)).length
+    );
+    const isUploading = vue.computed(
+      () => !showList.value.some((item) => !uploadingFilter(item.state))
+    );
+    vue.watch(
+      () => scale.value,
+      (n) => n && !expend.value && toggleExp()
+    );
+    const closeListPanel = () => emits("update:visable");
+    const getSttType = (n) => stateTxtEnum[stateEnum[n]];
+    const getPrgType = (n) => progressEnum[stateEnum[n]];
+    const uploadingFilter = (state) => [3, 5].includes(state);
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", null, "uploadStep");
+      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(["panel_wrp", { global: _ctx.global }])
+      }, [
+        vue.createVNode(vue.unref(webVue.Card), {
+          hoverable: "",
+          class: vue.normalizeClass(["panel_card", { expend: vue.unref(scale) }]),
+          "body-style": cardBodyStyle.value
+        }, {
+          cover: vue.withCtx(() => [
+            vue.createElementVNode("div", _hoisted_1, [
+              vue.createElementVNode("div", _hoisted_2, vue.toDisplayString(titleTxt.value) + "\uFF08" + vue.toDisplayString(successCount.value) + "/" + vue.toDisplayString(showList.value.length) + "\uFF09 ", 1),
+              vue.createElementVNode("div", _hoisted_3, [
+                vue.createElementVNode("div", {
+                  class: "bar",
+                  onClick: _cache[0] || (_cache[0] = (...args) => vue.unref(toggleExp) && vue.unref(toggleExp)(...args))
+                }, [
+                  vue.unref(expend) ? (vue.openBlock(), vue.createBlock(vue.unref(icon.IconDown), { key: 0 })) : (vue.openBlock(), vue.createBlock(vue.unref(icon.IconUp), { key: 1 }))
+                ]),
+                vue.createElementVNode("div", {
+                  class: "bar",
+                  onClick: _cache[1] || (_cache[1] = (...args) => vue.unref(toggleSca) && vue.unref(toggleSca)(...args))
+                }, [
+                  vue.unref(scale) ? (vue.openBlock(), vue.createBlock(vue.unref(icon.IconShrink), { key: 0 })) : (vue.openBlock(), vue.createBlock(vue.unref(icon.IconExpand), { key: 1 }))
+                ]),
+                !isUploading.value ? (vue.openBlock(), vue.createElementBlock("div", {
+                  key: 0,
+                  class: "bar",
+                  onClick: closeListPanel
+                }, [
+                  vue.createVNode(vue.unref(icon.IconClose))
+                ])) : vue.createCommentVNode("v-if", true)
+              ])
+            ])
+          ]),
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(["panel_list", { un_expend: !vue.unref(expend) }])
+            }, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.fileList, (file) => {
+                return vue.openBlock(), vue.createElementBlock("div", {
+                  key: file.id,
+                  class: "panel_item"
+                }, [
+                  vue.createElementVNode("div", _hoisted_4, [
+                    vue.createVNode(component, {
+                      doc: true,
+                      resource: true,
+                      type: file.type
+                    }, null, 8, ["type"]),
+                    vue.createVNode(vue.unref(webVue.Tooltip), {
+                      content: file.name
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createElementVNode("span", _hoisted_5, vue.toDisplayString(file.name), 1)
+                      ]),
+                      _: 2
+                    }, 1032, ["content"])
+                  ]),
+                  vue.withDirectives(vue.createElementVNode("div", { class: "panel_column flex-1" }, vue.toDisplayString(getSttType(file.state)), 513), [
+                    [vue.vShow, vue.unref(scale)]
+                  ]),
+                  vue.createElementVNode("div", _hoisted_6, [
+                    vue.createTextVNode(vue.toDisplayString([2, 0].includes(file.state) ? 100 : file.percent * 100) + " % ", 1),
+                    vue.createVNode(vue.unref(webVue.Progress), {
+                      size: "small",
+                      type: "circle",
+                      width: 20,
+                      "stroke-width": 1,
+                      percent: file.percent,
+                      status: getPrgType(file.state),
+                      "show-text": ![3, 5].includes(file.state)
+                    }, null, 8, ["percent", "status", "show-text"])
+                  ])
+                ]);
+              }), 128))
+            ], 2)
+          ]),
+          _: 1
+        }, 8, ["class", "body-style"])
+      ], 2)), [
+        [vue.vShow, _ctx.visable]
+      ]);
     };
   }
 });

package/lib/uploadStep/style/index.css

@@ -2,3 +2,116 @@
   height: auto;
   padding: 20px;
 }
+.table_wrp {
+  height: 50vh;
+}
+/** 上传列表面板 */
+.panel_wrp {
+  position: relative;
+}
+.panel_wrp.global {
+  position: absolute;
+  right: 20px;
+  bottom: 20px;
+}
+.panel_wrp .panel_card .panel_header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+}
+.panel_wrp .panel_card .panel_header .opt {
+  display: flex;
+  flex-direction: row;
+  gap: 15px;
+}
+.panel_wrp .panel_card .panel_list {
+  display: flex;
+  flex-direction: column;
+}
+.panel_wrp .panel_card .panel_list .panel_item {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column.percent {
+  justify-content: end;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column.flex-1 {
+  flex: 1;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column.flex-3 {
+  flex: 3;
+}
+.panel_wrp {
+  width: auto;
+  overflow: hidden;
+  border-top-left-radius: 12px;
+  border-top-right-radius: 12px;
+}
+.panel_wrp *::selection {
+  display: none;
+}
+.panel_wrp .panel_card {
+  width: 350px;
+  transition: all 0.3s;
+}
+.panel_wrp .panel_card.expend {
+  width: 420px;
+}
+.panel_wrp .panel_card .panel_header {
+  width: 90%;
+  height: 50px;
+  padding: 0 5%;
+  color: white;
+  background-color: rgb(var(--arcoblue-5));
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+}
+.panel_wrp .panel_card .panel_header .title {
+  white-space: nowrap;
+}
+.panel_wrp .panel_card .panel_header .opt {
+  font-size: 18px;
+}
+.panel_wrp .panel_card .panel_header .opt::selection {
+  display: none;
+}
+.panel_wrp .panel_card .panel_header .opt .bar {
+  cursor: pointer;
+}
+.panel_wrp .panel_card .panel_list {
+  width: 100%;
+  height: 120px;
+  overflow-y: scroll;
+  transition: all 0.3s;
+}
+.panel_wrp .panel_card .panel_list::-webkit-scrollbar {
+  display: none;
+}
+.panel_wrp .panel_card .panel_list.un_expend {
+  height: 0;
+  overflow: hidden;
+}
+.panel_wrp .panel_card .panel_list .panel_item {
+  height: 35px;
+  padding: 5px 15px;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column {
+  white-space: nowrap;
+}
+.panel_wrp .panel_card .panel_list .panel_item .panel_column .media_alias {
+  width: 160px;
+  cursor: pointer;
+}
+/** 公用 */
+.ellips {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

package/lib/uploadStep/style/index.less

@@ -2,3 +2,151 @@
   height: auto;
   padding: 20px;
 }
+
+.table_wrp {
+  height: 50vh;
+}
+
+._brTop(@p) {
+  border-top-left-radius: @p;
+  border-top-right-radius: @p;
+}
+
+/** 上传列表面板 */
+
+// 布局部分
+.panel_wrp {
+  position: relative;
+
+  &.global {
+    position: absolute;
+    right: 20px;
+    bottom: 20px;
+  }
+
+  .panel_card {
+    .panel_header {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+
+      .opt {
+        display: flex;
+        flex-direction: row;
+        gap: 15px;
+      }
+    }
+
+    .panel_list {
+      display: flex;
+      flex-direction: column;
+
+      .panel_item {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+
+        .panel_column {
+          display: flex;
+          gap: 10px;
+          align-items: center;
+
+          &.percent {
+            justify-content: end;
+          }
+
+          &.flex-1 {
+            flex: 1;
+          }
+
+          &.flex-3 {
+            flex: 3;
+          }
+        }
+      }
+    }
+  }
+}
+
+// 样式部分
+.panel_wrp {
+  width: auto;
+  overflow: hidden;
+
+  & *::selection {
+    display: none;
+  }
+  ._brTop(12px);
+
+  .panel_card {
+    width: 350px;
+    transition: all 0.3s;
+
+    &.expend {
+      width: 420px;
+    }
+
+    .panel_header {
+      width: 90%;
+      height: 50px;
+      padding: 0 5%;
+      color: white;
+      background-color: rgb(var(--arcoblue-5));
+      ._brTop(10px);
+
+      .title {
+        white-space: nowrap;
+      }
+
+      .opt {
+        font-size: 18px;
+
+        &::selection {
+          display: none;
+        }
+
+        .bar {
+          cursor: pointer;
+        }
+      }
+    }
+
+    .panel_list {
+      width: 100%;
+      height: 120px;
+      overflow-y: scroll;
+      transition: all 0.3s;
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
+
+      &.un_expend {
+        height: 0;
+        overflow: hidden;
+      }
+
+      .panel_item {
+        height: 35px;
+        padding: 5px 15px;
+
+        .panel_column {
+          white-space: nowrap;
+
+          .media_alias {
+            width: 160px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+}
+
+/** 公用 */
+.ellips {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

package/lib/userDirector/component.js

@@ -0,0 +1,201 @@
+"use strict";
+var vue = require("vue");
+var webVue = require("@arco-design/web-vue");
+var config = require("../config.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 _sfc_main = vue.defineComponent({
+  ...{ name: "userDirector" },
+  __name: "component",
+  props: {
+    BASE_API: {},
+    repositoryId: {},
+    visible: { type: Boolean },
+    title: {}
+  },
+  emits: ["update:visible"],
+  setup(__props, { emit: __emit }) {
+    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 selectRoleNode = (selectedKeys, data) => {
+      console.log("selectRoleNode", data);
+    };
+    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;
+          });
+        }
+      }
+    };
+    const selectDepartNode = (selectedKeys, data) => {
+      console.log("selectDepartNode", data);
+    };
+    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;
+          });
+        }
+      }
+    };
+    const collapseChange = async (keys) => {
+      if (keys.includes("Role")) {
+        api.getRepoRoleList(BASE_API, { repoID: props.repositoryId }).then((res) => {
+          if (res.code === 0) {
+            RoleTreeData.value = res.message.map((item) => {
+              item.node_key = `role_${item.id}`;
+              item.isRole = true;
+              return item;
+            });
+          }
+        });
+      }
+      if (keys.includes("Depart")) {
+        api.getDepartList(BASE_API).then((res) => {
+          if (res.code === 0) {
+            DepartTreeData.value = res.message.departments.map((item) => {
+              item.node_key = `depart_${item.id}`;
+              item.isDepart = true;
+              return item;
+            });
+          }
+        });
+      }
+    };
+    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;
+        });
+      }
+    };
+    const selectUser = (value) => {
+      console.log(value);
+      setTimeout(() => {
+        completeUser.value = "";
+      }, 100);
+    };
+    vue.onMounted(() => {
+      getUserList();
+    });
+    const visible = vue.computed({
+      get() {
+        return props.visible;
+      },
+      set(value) {
+        setVisible(value);
+      }
+    });
+    const setVisible = (bool) => {
+      emit("update:visible", bool);
+    };
+    const handleOk = () => {
+      setVisible(false);
+    };
+    const handleCancel = () => {
+      setVisible(false);
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(webVue.Modal), {
+        visible: visible.value,
+        width: "986px",
+        "mask-closable": false,
+        footer: false,
+        "title-align": "start",
+        "unmount-on-close": "",
+        onOk: handleOk,
+        onCancel: handleCancel
+      }, {
+        title: vue.withCtx(() => [
+          vue.createTextVNode(vue.toDisplayString(props.title ? props.title : "\u9009\u62E9\u7528\u6237"), 1)
+        ]),
+        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,
+                placeholder: "\u641C\u7D22\u59D3\u540D\u3001\u7528\u6237\u540D",
+                onSelect: selectUser
+              }, null, 8, ["modelValue", "data"]),
+              vue.createVNode(vue.unref(webVue.Collapse), {
+                accordion: "",
+                onChange: collapseChange
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(vue.unref(webVue.CollapseItem), {
+                    key: "Role",
+                    header: "\u6309\u89D2\u8272\u9009\u62E9"
+                  }, {
+                    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"])
+                    ]),
+                    _: 1
+                  }),
+                  vue.createVNode(vue.unref(webVue.CollapseItem), {
+                    key: "Depart",
+                    header: "\u6309\u7EC4\u7EC7\u67B6\u6784\u9009\u62E9"
+                  }, {
+                    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"])
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _hoisted_3
+          ])
+        ]),
+        _: 1
+      }, 8, ["visible"]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/lib/userDirector/index.js

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

package/lib/userDirector/script/api.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+var request = require("../../utils/request.js");
+function getRepoRoleList(BASE_API, params) {
+  return request(BASE_API, {
+    url: `/poplar/v2/roles/${params.repoID}`,
+    method: "get"
+  });
+}
+function getRoleAllUser(BASE_API, params) {
+  return request(BASE_API, {
+    url: `/poplar/v2/role/${params.id}/user`,
+    method: "get"
+  });
+}
+function getDepartList(BASE_API) {
+  return request(BASE_API, {
+    url: "/poplar/v2/department",
+    method: "get"
+  });
+}
+function getDepartUserList(BASE_API, params) {
+  return request(BASE_API, {
+    url: `/poplar/v2/department/${params.pid}/user`,
+    method: "get"
+  });
+}
+function getRepoUserList(BASE_API, params) {
+  return request(BASE_API, {
+    url: `/poplar/v2/repository/${params.id}/user`,
+    method: "get"
+  });
+}
+exports.getDepartList = getDepartList;
+exports.getDepartUserList = getDepartUserList;
+exports.getRepoRoleList = getRepoRoleList;
+exports.getRepoUserList = getRepoUserList;
+exports.getRoleAllUser = getRoleAllUser;

package/lib/userDirector/style/css.js

@@ -0,0 +1,2 @@
+"use strict";
+require("./index.css");

package/lib/userDirector/style/index.css

@@ -0,0 +1,8 @@
+.user-select-content {
+  height: 60vh;
+}
+.user-select-content .user-select-left,
+.user-select-content .user-select-right {
+  width: 50%;
+  height: 100%;
+}

package/lib/userDirector/style/index.js

@@ -0,0 +1,2 @@
+"use strict";
+require("./index.less");

package/lib/userDirector/style/index.less

@@ -0,0 +1,8 @@
+.user-select-content {
+  height: 60vh;
+  .user-select-left,
+  .user-select-right {
+    width: 50%;
+    height: 100%;
+  }
+}