@web-utils/component 2.7.36 → 2.8.0

package/package.json

@@ -1,139 +1,17 @@
 {
   "name": "@web-utils/component",
-  "version": "2.7.36",
+  "version": "2.8.0",
   "type": "module",
-  "private": false,
+  "author": "Simple",
   "license": "MIT",
-  "main": "./dist/index.es.js",
-  "module": "./dist/index.es.js",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
   "exports": {
     ".": {
-      "require": "./dist/index.es.js",
-      "import": "./dist/index.es.js"
+      "require": "./dist/index.cjs",
+      "import": "./dist/index.mjs"
     },
     "./*": "./*"
   },
-  "files": [
-    "dist",
-    "web-types.json"
-  ],
-  "web-types": "web-types.json",
-  "scripts": {
-    "dev": "vite --host",
-    "serve": "vite preview",
-    "build": "vite build",
-    "build:lib": "esno scripts/build.ts",
-    "gen:index": "esno scripts/genIndex.ts",
-    "release": "npm run build:lib && npm publish --access public",
-    "lint": "eslint src/**/*.{js,jsx,ts,vue} --fix",
-    "stylelint": "stylelint src/**/*.{scss,css,vue} --fix"
-  },
-  "devDependencies": {
-    "@wangeditor/editor": "^5.1.23",
-    "@wangeditor/editor-for-vue": "^1.0.2",
-    "countup.js": "^2.4.2",
-    "monaco-editor": "^0.30.1",
-    "photoswipe": "^5.3.5",
-    "resize-detector": "^0.3.0",
-    "viewerjs": "^1.11.1",
-    "vue-cropper": "^0.5.8",
-    "vuedraggable": "^2.24.3",
-    "bpmn-js-token-simulation": "^0.31.0",
-    "bpmn-js": "^11.3.0",
-    "highlight.js": "^11.7.0",
-    "min-dash": "^4.0.0",
-    "x2js": "^3.4.2",
-    "tiny-svg": "^3.0.0",
-    "diagram-js": "11.9.0",
-    "core-js": "^3.8.1",
-    "simple-uploader.js": "^0.6.0",
-    "echarts": "^5.4.1",
-    "codemirror": "^5.65.11",
-    "overlayscrollbars": "^1.13.3",
-    "lodash": "^4.17.21",
-    "@tinymce/tinymce-vue": "3.2.8",
-    "tinymce": "4.5.12",
-    "@web-utils/core": "^2.0.28",
-    "@web-utils/integrations": "^2.0.28",
-    "@web-utils/vue": "^2.0.28",
-    "@types/lodash": "^4.14.191",
-    "@types/node": "^16.18.10",
-    "@types/qrcode": "^1.5.0",
-    "@types/uuid": "^8.3.4",
-    "@typescript-eslint/eslint-plugin": "^5.47.0",
-    "@typescript-eslint/parser": "^5.47.0",
-    "@vue/babel-preset-jsx": "^1.4.0",
-    "@vue/eslint-config-typescript": "^11.0.2",
-    "@web-utils/eslint-config-vue2": "^1.1.1",
-    "@web-utils/stylelint-config-scss": "^1.0.2",
-    "element-ui": "^2.15.12",
-    "eslint": "^8.33.0",
-    "esno": "^0.16.3",
-    "eslint-plugin-vue": "^9.9.0",
-    "globby": "^13.1.3",
-    "sass": "^1.58.0",
-    "rollup": "^3.14.0",
-    "slash": "^5.0.0",
-    "stylelint": "^14.16.1",
-    "typescript": "^4.9.5",
-    "vite": "^4.1.1",
-    "vite-plugin-inspect": "^0.7.15",
-    "vite-plugin-style-import": "^1.4.1",
-    "vite-plugin-vue2": "^2.0.3",
-    "vue": "2.6.14",
-    "vue-docgen-api": "^4.56.4",
-    "vue-router": "^3.6.5",
-    "vue-template-compiler": "2.6.14"
-  },
-  "stylelint": {
-    "extends": [
-      "@web-utils/stylelint-config-scss"
-    ],
-    "rules": {
-      "max-nesting-depth": 6,
-      "at-rule-no-unknown": [
-        true,
-        {
-          "ignoreAtRules": [
-            "function",
-            "if",
-            "return",
-            "include",
-            "extend",
-            "mixin",
-            "else",
-            "while",
-            "for",
-            "use",
-            "each"
-          ]
-        }
-      ]
-    }
-  },
-  "eslintConfig": {
-    "root": true,
-    "env": {
-      "vue/setup-compiler-macros": true
-    },
-    "globals": {},
-    "parser": "vue-eslint-parser",
-    "parserOptions": {
-      "parser": "@typescript-eslint/parser",
-      "sourceType": "module",
-      "ecmaVersion": 2020,
-      "ecmaFeatures": {
-        "jsx": true
-      }
-    },
-    "extends": [
-      "@web-utils/eslint-config-vue2",
-      "@vue/typescript"
-    ],
-    "rules": {
-    }
-  },
-  "resolutions": {
-    "vue": "2.6.14"
-  }
+  "web-types": "web-types.json"
 }

package/page/index.mjs

@@ -0,0 +1,40 @@
+import { n as o } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var l = function() {
+  var e = this, t = e.$createElement, a = e._self._c || t;
+  return a("div", {
+    staticClass: "page flex-row flex-item",
+    class: {
+      vertical: e.vertical && !e.horizontal
+    }
+  }, [e._t("default")], 2);
+}, r = [];
+const s = {
+  name: "Page",
+  props: {
+    vertical: {
+      type: Boolean,
+      default: !0
+    },
+    horizontal: Boolean
+  }
+}, n = {};
+var _ = /* @__PURE__ */ o(
+  s,
+  l,
+  r,
+  !1,
+  c,
+  null,
+  null,
+  null
+);
+function c(e) {
+  for (let t in n)
+    this[t] = n[t];
+}
+const u = /* @__PURE__ */ function() {
+  return _.exports;
+}();
+export {
+  u as default
+};

package/page/style.css

@@ -0,0 +1 @@
+.page{height:100%}.page.vertical{flex-direction:column}

package/page-header/index.mjs

@@ -0,0 +1,56 @@
+import { n as a } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var r = function() {
+  var e = this, t = e.$createElement, n = e._self._c || t;
+  return n("div", {
+    staticClass: "egd-header flex-row egd-page-header"
+  }, [e._t("section-title", function() {
+    return [n("span", {
+      staticClass: "section-title"
+    }, [e._t("title", function() {
+      return [e._v(e._s(e.title))];
+    }, {
+      title: e.title
+    })], 2)];
+  }, {
+    title: e.title
+  }), n("div", {
+    staticClass: "flex-row flex-item vertical-center"
+  }, [n("div", {
+    class: ["flex-row", "flex-item", "vertical-center", {
+      "align-end": e.alignEnd
+    }]
+  }, [e._t("default")], 2)])], 2);
+}, i = [];
+const s = {
+  name: "PageHeader",
+  props: {
+    title: {
+      type: String,
+      default: "标题"
+    },
+    alignEnd: {
+      type: Boolean,
+      default: !0
+    }
+  }
+}, l = {};
+var o = /* @__PURE__ */ a(
+  s,
+  r,
+  i,
+  !1,
+  _,
+  null,
+  null,
+  null
+);
+function _(e) {
+  for (let t in l)
+    this[t] = l[t];
+}
+const u = /* @__PURE__ */ function() {
+  return o.exports;
+}();
+export {
+  u as default
+};

package/page-header/style.css

@@ -0,0 +1 @@
+.egd-page-header{height:40px;margin:0 10px;line-height:40px}.egd-page-header .align-end{justify-content:flex-end}

package/page-index/index.mjs

@@ -0,0 +1,175 @@
+var r = (t, a, e) => new Promise((s, i) => {
+  var u = (n) => {
+    try {
+      d(e.next(n));
+    } catch (o) {
+      i(o);
+    }
+  }, h = (n) => {
+    try {
+      d(e.throw(n));
+    } catch (o) {
+      i(o);
+    }
+  }, d = (n) => n.done ? s(n.value) : Promise.resolve(n.value).then(u, h);
+  d((e = e.apply(t, a)).next());
+});
+import { treeToArray as p, findFirstMatchNode as l } from "@web-utils/core";
+import { n as y } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var f = function() {
+  var t = this, a = t.$createElement, e = t._self._c || a;
+  return e("div", {
+    staticClass: "egd-container"
+  }, [t.aside ? e("div", {
+    staticClass: "egd-aside",
+    style: {
+      width: t.asideWidth
+    }
+  }, [t._t("aside", function() {
+    return [e("div", {
+      staticClass: "egd-main"
+    }, [t._t("nav-top"), e("div", {
+      staticClass: "egd-header"
+    }, [e("span", {
+      staticClass: "section-title flex-not-shrink"
+    }, [t._v(t._s(t.sectionTitle))])]), t._t("menu", function() {
+      return [e("ElTree", {
+        ref: "menuTree",
+        attrs: {
+          data: t.menus,
+          "default-expand-all": "",
+          props: t.defaultProps,
+          "highlight-current": "",
+          "empty-text": "请配置菜单！",
+          "default-expanded-keys": t.currentTreeKey,
+          "node-key": "key"
+        },
+        on: {
+          "node-click": t.onNodeClick
+        },
+        scopedSlots: t._u([{
+          key: "default",
+          fn: function(s) {
+            var i = s.data, u = s.node;
+            return [t._t("tree-node", function() {
+              return [e("span", [e("i", {
+                class: i.icon
+              }), t._v(" " + t._s(i.label))])];
+            }, {
+              data: i,
+              node: u
+            })];
+          }
+        }], null, !0)
+      })];
+    })], 2)];
+  })], 2) : t._e(), e("div", {
+    staticClass: "page-index-content",
+    style: {
+      width: t.aside ? `calc(100% - ${t.asideWidth})` : "100%"
+    }
+  }, [t._t("default", function() {
+    return [e("div", {
+      staticClass: "page-index-content-empty"
+    }, [t._v(" " + t._s(t.tips) + " ")])];
+  })], 2)]);
+}, _ = [];
+const m = {
+  name: "PageIndex",
+  props: {
+    menus: {
+      type: Array,
+      default: () => []
+    },
+    asideWidth: {
+      type: String,
+      default: "220px"
+    },
+    aside: {
+      type: Boolean,
+      default: !0
+    },
+    tips: {
+      type: String,
+      default: "请添加页面内容！"
+    },
+    sectionTitle: {
+      type: String,
+      default: "功能导航"
+    },
+    schema: {
+      type: String,
+      default: ""
+    },
+    currentTreeKey: {
+      type: Array,
+      default: () => []
+    },
+    defaultProps: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  watch: {
+    menus() {
+      this.setCurrentKey(this.$route.path);
+    }
+  },
+  mounted() {
+    this.activeFirstMenu();
+  },
+  activated() {
+    this.setCurrentKey(this.$route.path);
+  },
+  methods: {
+    activeFirstMenu() {
+      return r(this, null, function* () {
+        if (p(this.menus).map((a) => a.path).filter((a) => a).includes(this.$route.path))
+          yield this.setCurrentKey(this.$route.path);
+        else {
+          const a = l(this.menus, (e) => e.path);
+          a && (yield this.$router.push({ path: a.path, query: a.query }), yield this.setCurrentKey(a.path));
+        }
+      });
+    },
+    onNodeClick(t) {
+      return r(this, null, function* () {
+        t.path && t.path.indexOf("/") > -1 && (yield this.$router.push({ path: t.path, query: t.query })), yield this.setCurrentKey(t.key);
+      });
+    },
+    setCurrentKey(t) {
+      return r(this, null, function* () {
+        yield this.$nextTick(), this.$refs.menuTree && this.$refs.menuTree.setCurrentKey(t);
+      });
+    },
+    beforeRouteUpdate(t, a, e) {
+      return r(this, null, function* () {
+        if (t.path === this.schema) {
+          const s = l(this.menus, (i) => i.path);
+          s ? (yield e({ path: s.path, query: s.query }), yield this.setCurrentKey(s.path)) : yield e(!1);
+        } else
+          yield e(), yield this.setCurrentKey(this.$route.path);
+      });
+    }
+  }
+}, c = {};
+var v = /* @__PURE__ */ y(
+  m,
+  f,
+  _,
+  !1,
+  C,
+  null,
+  null,
+  null
+);
+function C(t) {
+  for (let a in c)
+    this[a] = c[a];
+}
+const $ = /* @__PURE__ */ function() {
+  return v.exports;
+}();
+export {
+  $ as default
+};

package/page-index/style.css

@@ -0,0 +1 @@
+.page-index-content{display:flex;flex:1 1 auto;flex-direction:column;height:100%;padding:0;overflow:hidden}.page-index-content-empty{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:gray;font-size:20px}

package/page-index-top/index.mjs

@@ -0,0 +1,141 @@
+var i = (t, a, e) => new Promise((n, r) => {
+  var p = (s) => {
+    try {
+      u(e.next(s));
+    } catch (o) {
+      r(o);
+    }
+  }, h = (s) => {
+    try {
+      u(e.throw(s));
+    } catch (o) {
+      r(o);
+    }
+  }, u = (s) => s.done ? n(s.value) : Promise.resolve(s.value).then(p, h);
+  u((e = e.apply(t, a)).next());
+});
+import { treeToArray as m, findFirstMatchNode as c } from "@web-utils/core";
+import { n as f } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var d = function() {
+  var t = this, a = t.$createElement, e = t._self._c || a;
+  return t.menus && t.menus.length ? e("PageSkeleton", {
+    scopedSlots: t._u([{
+      key: "header",
+      fn: function() {
+        return [e("PageHeader", {
+          scopedSlots: t._u([{
+            key: "section-title",
+            fn: function() {
+              return [e("ElTabs", {
+                on: {
+                  "tab-click": t.tabClick
+                },
+                model: {
+                  value: t.activeTab,
+                  callback: function(n) {
+                    t.activeTab = n;
+                  },
+                  expression: "activeTab"
+                }
+              }, t._l(t.menus, function(n) {
+                return e("ElTabPane", {
+                  key: n.path,
+                  attrs: {
+                    label: n.label,
+                    name: `${n.path}`
+                  }
+                });
+              }), 1)];
+            },
+            proxy: !0
+          }], null, !1, 412017982)
+        })];
+      },
+      proxy: !0
+    }], null, !1, 2288233724)
+  }, [t._t("default", function() {
+    return [e("EmptyView", {
+      attrs: {
+        "empty-tips": t.tips
+      }
+    })];
+  })], 2) : e("EmptyView", {
+    attrs: {
+      "empty-tips": "暂无权限！"
+    }
+  });
+}, y = [];
+const _ = {
+  name: "PageIndexTop",
+  props: {
+    menus: {
+      type: Array,
+      default: () => []
+    },
+    tips: {
+      type: String,
+      default: "请添加页面内容！"
+    },
+    schema: {
+      type: String,
+      default: ""
+    }
+  },
+  data() {
+    return {
+      activeTab: ""
+    };
+  },
+  watch: {
+    menus: "activeFirstMenu"
+  },
+  mounted() {
+    this.activeFirstMenu();
+  },
+  methods: {
+    activeFirstMenu() {
+      return i(this, null, function* () {
+        if (m(this.menus).map((a) => a.path).filter((a) => a).includes(this.$route.path))
+          this.activeTab = this.$route.path;
+        else {
+          const a = c(this.menus, (e) => e.path);
+          a && (this.activeTab = a.path, yield this.$router.push({ path: a.path, query: a.query }));
+        }
+      });
+    },
+    tabClick(t) {
+      return i(this, null, function* () {
+        yield this.$router.push(t.name);
+      });
+    },
+    beforeRouteUpdate(t, a, e) {
+      return i(this, null, function* () {
+        if (t.path === this.schema) {
+          const n = c(this.menus, (r) => r.path);
+          n ? (yield e({ path: n.path, query: n.query }), this.activeTab = n.path) : yield e(!1);
+        } else
+          yield e();
+      });
+    }
+  }
+}, l = {};
+var v = /* @__PURE__ */ f(
+  _,
+  d,
+  y,
+  !1,
+  b,
+  null,
+  null,
+  null
+);
+function b(t) {
+  for (let a in l)
+    this[a] = l[a];
+}
+const g = /* @__PURE__ */ function() {
+  return v.exports;
+}();
+export {
+  g as default
+};

package/page-skeleton/index.mjs

@@ -0,0 +1,56 @@
+import { n as o } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var a = function() {
+  var e = this, t = e.$createElement, n = e._self._c || t;
+  return n("Page", {
+    staticClass: "page-skeleton"
+  }, [e.header ? e._t("header", function() {
+    return [e.title ? n("PageHeader", {
+      attrs: {
+        title: e.title
+      }
+    }) : n("NavBar")];
+  }) : e._e(), n("div", {
+    class: ["page-content", {
+      "flex-column": e.flexColumn,
+      "flex-row": e.flexRow,
+      "content-scroll": e.contentScroll
+    }, e.contentClass]
+  }, [e._t("default")], 2)], 2);
+}, r = [];
+const s = {
+  name: "PageSkeleton",
+  props: {
+    title: String,
+    flexColumn: Boolean,
+    flexRow: Boolean,
+    header: {
+      type: Boolean,
+      default: !0
+    },
+    contentClass: String,
+    contentScroll: {
+      type: Boolean,
+      default: !0
+    }
+  }
+}, l = {};
+var c = /* @__PURE__ */ o(
+  s,
+  a,
+  r,
+  !1,
+  _,
+  null,
+  null,
+  null
+);
+function _(e) {
+  for (let t in l)
+    this[t] = l[t];
+}
+const i = /* @__PURE__ */ function() {
+  return c.exports;
+}();
+export {
+  i as default
+};

package/page-skeleton/style.css

@@ -0,0 +1 @@
+.page-skeleton .page-content{position:relative;flex:1 1 auto;width:100%;height:100%}.page-skeleton .page-content.content-scroll{overflow:auto}.page-skeleton .page-content.flex-column{display:flex;flex-direction:column;height:0}.page-skeleton .page-content.flex-row{display:flex}