@ibiz-template/vue3-components 0.4.8-dev.0 → 0.4.8

package/lib/control/report-panel/index.cjs

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var runtime = require('@ibiz-template/runtime');
+var vue3Util = require('@ibiz-template/vue3-util');
+var reportPanel = require('./report-panel.cjs');
+var reportPanel_provider = require('./report-panel.provider.cjs');
+require('./report-detail/index.cjs');
+var index = require('./report-detail/user-report-panel/index.cjs');
+var index$1 = require('./report-detail/user2-report-panel/index.cjs');
+
+"use strict";
+const IBizReportPanelControl = vue3Util.withInstall(
+  reportPanel.ReportPanelControl,
+  function(v) {
+    v.use(index.IBizUserReportPanel);
+    v.use(index$1.IBizUser2ReportPanel);
+    v.component(reportPanel.ReportPanelControl.name, reportPanel.ReportPanelControl);
+    runtime.registerControlProvider(
+      runtime.ControlType.REPORT_PANEL,
+      () => new reportPanel_provider.ReportPanelProvider()
+    );
+  }
+);
+
+exports.IBizReportPanelControl = IBizReportPanelControl;
+exports.default = IBizReportPanelControl;

package/lib/control/report-panel/report-detail/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var index = require('./user-report-panel/index.cjs');
+var index$1 = require('./user2-report-panel/index.cjs');
+
+"use strict";
+
+exports.IBizUserReportPanel = index.IBizUserReportPanel;
+exports.IBizUser2ReportPanel = index$1.IBizUser2ReportPanel;

package/lib/control/report-panel/report-detail/user-report-panel/index.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue3Util = require('@ibiz-template/vue3-util');
+var userReportPanel = require('./user-report-panel.cjs');
+
+"use strict";
+const IBizUserReportPanel = vue3Util.withInstall(
+  userReportPanel.UserReportPanel,
+  function(v) {
+    v.component(userReportPanel.UserReportPanel.name, userReportPanel.UserReportPanel);
+  }
+);
+
+exports.IBizUserReportPanel = IBizUserReportPanel;
+exports.default = IBizUserReportPanel;

package/lib/control/report-panel/report-detail/user-report-panel/user-report-panel.cjs

@@ -0,0 +1,49 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./user-report-panel.css');
+
+"use strict";
+const UserReportPanel = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizUserReportPanel",
+  props: {
+    controller: {
+      type: Object
+    }
+  },
+  setup(props) {
+    const c = props.controller;
+    const ns = vue3Util.useNamespace(`user-report-panel`);
+    const generator = c && c.generator;
+    return {
+      c,
+      ns,
+      generator
+    };
+  },
+  render() {
+    if (!this.c) {
+      return;
+    }
+    const state = this.c.state;
+    return vue.createVNode("div", {
+      "class": this.ns.e("container")
+    }, [vue.createVNode(vue.resolveComponent("iBizRelationshipDesign"), {
+      "data": state.data,
+      "context": this.c.context,
+      "params": this.c.params,
+      "config": this.generator && this.generator.config.CONFIG,
+      "pluginConfig": this.generator && this.generator.config.PLUGINCONFIG,
+      "nodeLegendConfig": this.generator && this.generator.config.NODELEGENDCONFIG,
+      "edgeLegendConfig": this.generator && this.generator.config.EDGELEGENDCONFIG,
+      "hooks": this.generator && this.generator.config.HOOKS,
+      "showLoading": true,
+      "onInit": (args) => {
+        this.generator && this.generator.init(args);
+      }
+    }, null)]);
+  }
+});
+
+exports.UserReportPanel = UserReportPanel;

package/lib/control/report-panel/report-detail/user-report-panel/user-report-panel.css

@@ -0,0 +1 @@
+.ibiz-user-report-panel__container{width:100%;height:100%}

package/lib/control/report-panel/report-detail/user2-report-panel/index.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue3Util = require('@ibiz-template/vue3-util');
+var user2ReportPanel = require('./user2-report-panel.cjs');
+
+"use strict";
+const IBizUser2ReportPanel = vue3Util.withInstall(
+  user2ReportPanel.User2ReportPanel,
+  function(v) {
+    v.component(user2ReportPanel.User2ReportPanel.name, user2ReportPanel.User2ReportPanel);
+  }
+);
+
+exports.IBizUser2ReportPanel = IBizUser2ReportPanel;
+exports.default = IBizUser2ReportPanel;

package/lib/control/report-panel/report-detail/user2-report-panel/user2-report-panel.cjs

@@ -0,0 +1,66 @@
+'use strict';
+
+var vue = require('vue');
+var runtime = require('@ibiz-template/runtime');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./user2-report-panel.css');
+
+"use strict";
+const User2ReportPanel = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizUser2ReportPanel",
+  props: {
+    controller: {
+      type: Object
+    }
+  },
+  setup(props) {
+    const c = props.controller;
+    const ns = vue3Util.useNamespace(`user2-report-panel`);
+    const generator = c && c.generator;
+    const handleClick = async (e) => {
+      let clickValue = e.target.getAttribute("click");
+      let params = e.target.getAttribute("params");
+      if (!clickValue || !c || !params) {
+        return;
+      }
+      clickValue = clickValue.replaceAll("`", "");
+      params = params.replaceAll("`", '"');
+      const pattern = /\(([^)]+)\)/;
+      const result = pattern.exec(clickValue);
+      if (result && result[1]) {
+        runtime.UIActionUtil.exec(result[1], {
+          context: c.context,
+          params: c.params,
+          data: [JSON.parse(params)],
+          view: c.view
+        }, c.context.srfappid);
+      }
+    };
+    return {
+      c,
+      ns,
+      generator,
+      handleClick
+    };
+  },
+  render() {
+    if (!this.c) {
+      return;
+    }
+    const state = this.c.state;
+    if (state.isLoaded) {
+      return vue.createVNode("div", {
+        "class": this.ns.e("container"),
+        "innerHTML": state.data,
+        "onClick": (e) => {
+          this.handleClick(e);
+        }
+      }, null);
+    }
+    return vue.createVNode("div", {
+      "class": this.ns.e("empty")
+    }, [vue.createTextVNode("\u6682\u65E0\u6570\u636E")]);
+  }
+});
+
+exports.User2ReportPanel = User2ReportPanel;

package/lib/control/report-panel/report-detail/user2-report-panel/user2-report-panel.css

@@ -0,0 +1 @@
+.ibiz-user2-report-panel__container{width:100%;height:100%}.ibiz-user2-report-panel__empty{display:flex;justify-content:center;align-items:center;width:100%;height:100%}

package/lib/control/report-panel/report-panel.cjs

@@ -0,0 +1,74 @@
+'use strict';
+
+var vue = require('vue');
+var runtime = require('@ibiz-template/runtime');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./report-panel.css');
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+const ReportPanelControl = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizReportPanelControl",
+  props: {
+    modelData: {
+      type: Object,
+      required: true
+    },
+    context: {
+      type: Object,
+      required: true
+    },
+    params: {
+      type: Object,
+      default: () => ({})
+    },
+    provider: {
+      type: Object
+    },
+    noLoadDefault: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup() {
+    const c = vue3Util.useControlController((...args) => new runtime.ReportPanelController(...args));
+    const ns = vue3Util.useNamespace(`control-${c.model.controlType.toLowerCase()}`);
+    const renderContent = () => {
+      const {
+        reportType
+      } = c.state;
+      switch (reportType) {
+        case "USER":
+          return vue.createVNode(vue.resolveComponent("iBizUserReportPanel"), {
+            "controller": c
+          }, null);
+        case "USER2":
+          return vue.createVNode(vue.resolveComponent("iBizUser2ReportPanel"), {
+            "controller": c
+          }, null);
+        default:
+          return vue.createVNode("div", null, [vue.createTextVNode("\u6682\u672A\u5B9E\u73B0")]);
+      }
+    };
+    return {
+      c,
+      ns,
+      renderContent
+    };
+  },
+  render() {
+    let _slot;
+    if (!this.c.state.isCreated) {
+      return;
+    }
+    return vue.createVNode(vue.resolveComponent("iBizControlBase"), {
+      "controller": this.c
+    }, _isSlot(_slot = this.renderContent()) ? _slot : {
+      default: () => [_slot]
+    });
+  }
+});
+
+exports.ReportPanelControl = ReportPanelControl;

package/lib/control/report-panel/report-panel.css

@@ -0,0 +1 @@
+.ibiz-control-reportpanel{width:100%;height:100%}

package/lib/control/report-panel/report-panel.provider.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ReportPanelProvider {
+  constructor() {
+    __publicField(this, "component", "IBizReportPanelControl");
+  }
+}
+
+exports.ReportPanelProvider = ReportPanelProvider;

package/lib/control/search-bar/filter-mode-select/filter-mode-select.cjs

@@ -0,0 +1,97 @@
+'use strict';
+
+var vue = require('vue');
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+const FilterModes = [{
+  valueOP: runtime.ValueOP.EQ,
+  label: "\u7B49\u4E8E(=)"
+}, {
+  valueOP: runtime.ValueOP.NOT_EQ,
+  label: "\u4E0D\u7B49\u4E8E(<>)"
+}, {
+  valueOP: runtime.ValueOP.GT,
+  label: "\u5927\u4E8E(>)"
+}, {
+  valueOP: runtime.ValueOP.GT_AND_EQ,
+  label: "\u5927\u4E8E\u7B49\u4E8E(>=)"
+}, {
+  valueOP: runtime.ValueOP.LT,
+  label: "\u5C0F\u4E8E(<)"
+}, {
+  valueOP: runtime.ValueOP.LT_AND_EQ,
+  label: "\u5C0F\u4E8E\u7B49\u4E8E(<=)"
+}, {
+  valueOP: runtime.ValueOP.IS_NULL,
+  label: "\u503C\u4E3A\u7A7A(Nil)"
+}, {
+  valueOP: runtime.ValueOP.IS_NOT_NULL,
+  label: "\u503C\u4E0D\u4E3A\u7A7A(NotNil)"
+}, {
+  valueOP: runtime.ValueOP.IN,
+  label: "\u503C\u5728\u8303\u56F4\u4E2D(In)"
+}, {
+  valueOP: runtime.ValueOP.NOT_IN,
+  label: "\u503C\u4E0D\u5728\u8303\u56F4\u4E2D(NotIn)"
+}, {
+  valueOP: runtime.ValueOP.LIKE,
+  label: "\u6587\u672C\u5305\u542B(%)"
+}, {
+  valueOP: runtime.ValueOP.LIFT_LIKE,
+  label: "\u6587\u672C\u5DE6\u5305\u542B(%#)"
+}, {
+  valueOP: runtime.ValueOP.RIGHT_LIKE,
+  label: "\u6587\u672C\u53F3\u5305\u542B(#%)"
+}];
+const FilterModeSelect = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizFilterModeSelect",
+  props: {
+    value: String,
+    modes: Array
+  },
+  emits: {
+    change: (_mode) => true
+  },
+  setup(props, {
+    emit
+  }) {
+    const availableModes = vue.computed(() => {
+      var _a;
+      if ((_a = props.modes) == null ? void 0 : _a.length) {
+        return FilterModes.filter((item) => props.modes.includes(item.valueOP));
+      }
+      return FilterModes;
+    });
+    const onChange = (value) => {
+      emit("change", value);
+    };
+    return {
+      availableModes,
+      onChange
+    };
+  },
+  render() {
+    let _slot;
+    return vue.createVNode(vue.resolveComponent("el-select"), {
+      "model-value": this.value,
+      "teleported": false,
+      "onChange": (value) => {
+        this.onChange(value);
+      }
+    }, _isSlot(_slot = this.availableModes.map((mode) => {
+      return vue.createVNode(vue.resolveComponent("el-option"), {
+        "key": mode.valueOP,
+        "value": mode.valueOP,
+        "label": mode.label
+      }, null);
+    })) ? _slot : {
+      default: () => [_slot]
+    });
+  }
+});
+
+exports.FilterModeSelect = FilterModeSelect;

package/lib/control/search-bar/filter-tree/filter-tree.cjs

@@ -0,0 +1,280 @@
+'use strict';
+
+var vue = require('vue');
+var runtime = require('@ibiz-template/runtime');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./filter-tree.css');
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+const FilterModes = [{
+  valueOP: runtime.ValueOP.EQ,
+  label: "\u7B49\u4E8E(=)"
+}, {
+  valueOP: runtime.ValueOP.NOT_EQ,
+  label: "\u4E0D\u7B49\u4E8E(<>)"
+}, {
+  valueOP: runtime.ValueOP.GT,
+  label: "\u5927\u4E8E(>)"
+}, {
+  valueOP: runtime.ValueOP.GT_AND_EQ,
+  label: "\u5927\u4E8E\u7B49\u4E8E(>=)"
+}, {
+  valueOP: runtime.ValueOP.LT,
+  label: "\u5C0F\u4E8E(<)"
+}, {
+  valueOP: runtime.ValueOP.LT_AND_EQ,
+  label: "\u5C0F\u4E8E\u7B49\u4E8E(<=)"
+}, {
+  valueOP: runtime.ValueOP.IS_NULL,
+  label: "\u503C\u4E3A\u7A7A(Nil)"
+}, {
+  valueOP: runtime.ValueOP.IS_NOT_NULL,
+  label: "\u503C\u4E0D\u4E3A\u7A7A(NotNil)"
+}, {
+  valueOP: runtime.ValueOP.IN,
+  label: "\u503C\u5728\u8303\u56F4\u4E2D(In)"
+}, {
+  valueOP: runtime.ValueOP.NOT_IN,
+  label: "\u503C\u4E0D\u5728\u8303\u56F4\u4E2D(NotIn)"
+}, {
+  valueOP: runtime.ValueOP.LIKE,
+  label: "\u6587\u672C\u5305\u542B(%)"
+}, {
+  valueOP: runtime.ValueOP.LIFT_LIKE,
+  label: "\u6587\u672C\u5DE6\u5305\u542B(%#)"
+}, {
+  valueOP: runtime.ValueOP.RIGHT_LIKE,
+  label: "\u6587\u672C\u53F3\u5305\u542B(#%)"
+}];
+const FilterTreeControl = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizFilterTreeControl",
+  props: {
+    controller: {
+      type: Object,
+      required: true
+    },
+    provider: {
+      type: Object
+    }
+  },
+  emits: {
+    close: () => true
+  },
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("filter-tree");
+    const findFilterController = (fieldName, valueOP) => {
+      return props.controller.filterControllers.find((item) => {
+        if (item.fieldName === fieldName) {
+          return item.valueOP ? item.valueOP === valueOP : true;
+        }
+        return false;
+      });
+    };
+    const allFields = [];
+    const getFilterModes = (fieldName) => {
+      if (!fieldName) {
+        return;
+      }
+      const field = allFields.find((item) => item.name === fieldName);
+      if (!field) {
+        return;
+      }
+      return field.valueOPs;
+    };
+    props.controller.filterControllers.forEach((filterC) => {
+      let find = allFields.find((x) => x.name === filterC.fieldName);
+      if (find === void 0) {
+        find = {
+          name: filterC.fieldName,
+          label: filterC.label,
+          valueOPs: []
+        };
+        allFields.push(find);
+      }
+      if (!filterC.valueOP) {
+        find.valueOPs = FilterModes.map((item) => item.valueOP);
+      } else {
+        find.valueOPs.push(filterC.valueOP);
+      }
+    });
+    const onFieldSelect = (node, field) => {
+      node.field = field;
+    };
+    const onValueOPSelect = (node, valueOP) => {
+      node.valueOP = valueOP;
+    };
+    const onGroupLogicTypeChange = (node, logicType) => {
+      node.logicType = logicType;
+    };
+    const addGroup = (node) => {
+      node.children.push({
+        leaf: false,
+        logicType: "AND",
+        children: [{
+          leaf: true,
+          field: null,
+          valueOP: null,
+          value: null
+        }]
+      });
+    };
+    const addItem = (node) => {
+      node.children.push({
+        leaf: true,
+        field: null,
+        valueOP: null,
+        value: null
+      });
+    };
+    const renderEditor = (node, filterC) => {
+      let editor = null;
+      if (filterC.editorProvider) {
+        const component = vue.resolveComponent(filterC.editorProvider.formEditor);
+        editor = vue.h(component, {
+          value: node.value,
+          controller: filterC.editor,
+          onChange: (val) => {
+            node.value = val;
+          }
+        });
+      } else {
+        editor = vue.createVNode(vue.resolveComponent("not-supported-editor"), {
+          "modelData": filterC.model.editor
+        }, null);
+      }
+      return vue.createVNode("div", {
+        "class": ns.e("editor")
+      }, [editor]);
+    };
+    const renderFilterItem = (node) => {
+      let _slot;
+      const filterC = findFilterController(node.field, node.valueOP);
+      const availableModes = getFilterModes(node.field);
+      return vue.createVNode("div", {
+        "class": ns.b("item")
+      }, [vue.createVNode(vue.resolveComponent("el-select"), {
+        "model-value": node.field,
+        "teleported": false,
+        "class": ns.e("field-select"),
+        "onChange": (field) => {
+          onFieldSelect(node, field);
+        }
+      }, _isSlot(_slot = allFields.map((field) => {
+        return vue.createVNode(vue.resolveComponent("el-option"), {
+          "key": field.name,
+          "value": field.name,
+          "label": field.label
+        }, null);
+      })) ? _slot : {
+        default: () => [_slot]
+      }), availableModes && availableModes.length > 0 && vue.createVNode(vue.resolveComponent("iBizFilterModeSelect"), {
+        "class": ns.e("mode-select"),
+        "value": node.valueOP,
+        "modes": availableModes,
+        "onChange": (valueOP) => {
+          onValueOPSelect(node, valueOP);
+        }
+      }, null), filterC && renderEditor(node, filterC)]);
+    };
+    const renderFilterGroup = (node) => {
+      return vue.createVNode("div", {
+        "class": ns.b("group")
+      }, [vue.createVNode("div", {
+        "class": ns.be("group", "actions")
+      }, [vue.createVNode(vue.resolveComponent("el-button"), {
+        "text": true,
+        "type": "primary",
+        "onClick": () => {
+          addGroup(node);
+        }
+      }, {
+        default: () => [vue.createTextVNode("\u6DFB\u52A0\u7EC4")]
+      }), vue.createVNode(vue.resolveComponent("el-button"), {
+        "text": true,
+        "onClick": () => {
+          addItem(node);
+        }
+      }, {
+        default: () => [vue.createTextVNode("\u6DFB\u52A0\u9879")]
+      }), vue.createVNode(vue.resolveComponent("el-select"), {
+        "model-value": node.logicType,
+        "teleported": false,
+        "class": ns.be("group", "logic-type"),
+        "onChange": (logicType) => {
+          onGroupLogicTypeChange(node, logicType);
+        }
+      }, {
+        default: () => [vue.createVNode(vue.resolveComponent("el-option"), {
+          "key": "AND",
+          "value": "AND",
+          "label": "AND"
+        }, null), vue.createVNode(vue.resolveComponent("el-option"), {
+          "key": "OR",
+          "value": "OR",
+          "label": "OR"
+        }, null)]
+      })]), vue.createVNode("div", {
+        "class": ns.be("group", "list")
+      }, [node.children.length > 0 && node.children.map((child, index) => {
+        const childContent = child.leaf ? renderFilterItem(child) : renderFilterGroup(child);
+        return vue.createVNode("div", {
+          "class": ns.be("group", "list-item")
+        }, [vue.createVNode("div", {
+          "class": ns.be("group", "list-item-left")
+        }, [node.logicType]), childContent, vue.createVNode(vue.resolveComponent("iBizIcon"), {
+          "class": ns.be("group", "list-item-right"),
+          "onClick": () => {
+            node.children.splice(index, 1);
+          },
+          "icon": {
+            cssClass: "trash"
+          }
+        }, null)]);
+      })])]);
+    };
+    const onClose = () => {
+      emit("close");
+    };
+    return {
+      ns,
+      renderFilterGroup,
+      renderFilterItem,
+      onClose
+    };
+  },
+  render() {
+    const {
+      state
+    } = this.controller;
+    return vue.createVNode("div", {
+      "class": [this.ns.b()]
+    }, [state.filterNodes.length > 0 && state.filterNodes.map((node) => {
+      if (node.leaf) {
+        return this.renderFilterItem(node);
+      }
+      return this.renderFilterGroup(node);
+    }), vue.createVNode("div", {
+      "class": this.ns.b("footer")
+    }, [vue.createVNode(vue.resolveComponent("el-button"), {
+      "onClick": () => {
+        this.controller.onSearch();
+        this.onClose();
+      }
+    }, {
+      default: () => [vue.createTextVNode("\u641C\u7D22")]
+    }), vue.createVNode(vue.resolveComponent("el-button"), {
+      "onClick": () => {
+        this.controller.resetFilter();
+      }
+    }, {
+      default: () => [vue.createTextVNode("\u91CD\u7F6E")]
+    })])]);
+  }
+});
+
+exports.FilterTreeControl = FilterTreeControl;

package/lib/control/search-bar/filter-tree/filter-tree.css

@@ -0,0 +1 @@
+.ibiz-filter-tree{padding:16px}.ibiz-filter-tree__editor{display:inline-block;width:180px;margin-right:8px}.ibiz-filter-tree__field-select{width:185px;margin-right:8px}.ibiz-filter-tree__mode-select{width:185px;margin-right:8px}.ibiz-filter-tree-group{padding:6px;border:1px solid var(--ibiz-color-border)}.ibiz-filter-tree-group__actions{padding-bottom:16px}.ibiz-filter-tree-group__logic-type{width:80px;margin-left:12px}.ibiz-filter-tree-group__list-item{position:relative;display:flex;align-items:center;justify-content:flex-start;padding-right:15px;padding-bottom:16px}.ibiz-filter-tree-group__list-item-left{align-self:flex-start;width:32px;margin:5px 8px 0;font-size:14px;color:var(--ibiz-editor-default-text-color)}.ibiz-filter-tree-group__list-item-right{position:absolute;top:8px;right:0;color:var(--ibiz-color-danger);cursor:pointer}.ibiz-filter-tree-group__list-item-right:hover{color:var(--ibiz-color-danger-hover)}.ibiz-filter-tree-item{display:flex;align-items:center;justify-content:flex-start;width:574px}.ibiz-filter-tree-footer{margin-top:8px;text-align:right}