@ibiz-template/mob-vue3-components 0.0.1-alpha.19

package/lib/editor/span/span-editor.controller.cjs

@@ -0,0 +1,64 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+var core = require('@ibiz-template/core');
+
+"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 SpanEditorController extends runtime.CodeListEditorController {
+  constructor() {
+    super(...arguments);
+    /**
+     *值项
+     */
+    __publicField(this, "valueItem", "");
+    /**
+     * 代码表模型
+     * @return {*}
+     * @author: zhujiamin
+     * @Date: 2023-05-24 10:55:50
+     */
+    __publicField(this, "codeList");
+  }
+  async onInit() {
+    var _a, _b;
+    super.onInit();
+    if ((_b = (_a = this.model) == null ? void 0 : _a.editorItems) == null ? void 0 : _b[0]) {
+      this.valueItem = this.model.editorItems[0].id;
+    }
+    if (this.model.appCodeListId) {
+      const app = await ibiz.hub.getApp(this.context.srfappid);
+      this.codeList = app.codeList.getCodeList(this.model.appCodeListId);
+    }
+  }
+  /**
+   * 打开数据链接视图
+   */
+  async openLinkView(data) {
+    const { context, params } = this.handlePublicParams(
+      data,
+      this.context,
+      this.params
+    );
+    if (data[this.valueItem]) {
+      context.srfkey = data[this.valueItem];
+    }
+    const { linkAppViewId } = this.model;
+    if (!linkAppViewId) {
+      throw new core.RuntimeModelError(this.model, "\u8BF7\u914D\u7F6E\u6570\u636E\u94FE\u63A5\u89C6\u56FE");
+    }
+    return ibiz.commands.execute(
+      runtime.OpenAppViewCommand.TAG,
+      linkAppViewId,
+      context,
+      params
+    );
+  }
+}
+
+exports.SpanEditorController = SpanEditorController;

package/lib/editor/span/span-editor.provider.cjs

@@ -0,0 +1,28 @@
+'use strict';
+
+var spanEditor_controller = require('./span-editor.controller.cjs');
+
+"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 SpanEditorProvider {
+  constructor(editorType) {
+    __publicField(this, "formEditor", "IBizSpan");
+    __publicField(this, "gridEditor", "IBizSpan");
+    if (editorType === "SPAN_LINK") {
+      this.formEditor = "IBizSpanLink";
+      this.gridEditor = "IBizSpanLink";
+    }
+  }
+  async createController(editorModel, parentController) {
+    const c = new spanEditor_controller.SpanEditorController(editorModel, parentController);
+    await c.init();
+    return c;
+  }
+}
+
+exports.SpanEditorProvider = SpanEditorProvider;

package/lib/editor/span/span-link/span-link.cjs

@@ -0,0 +1,48 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./span-link.css');
+
+"use strict";
+const IBizSpanLink = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizSpanLink",
+  props: vue3Util.getSpanProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("span-link");
+    const c = props.controller;
+    const curValue = vue.ref("");
+    vue.watch(() => props.value, (newVal, oldVal) => {
+      if (newVal && newVal !== oldVal) {
+        curValue.value = `${newVal}`;
+      }
+    }, {
+      immediate: true
+    });
+    const openLinkView = async () => {
+      await c.openLinkView(props.data);
+    };
+    const {
+      componentRef: editorRef
+    } = vue3Util.useFocusAndBlur(() => emit("focus"), () => emit("blur"));
+    return {
+      ns,
+      openLinkView,
+      curValue,
+      editorRef
+    };
+  },
+  render() {
+    return vue.createVNode("div", {
+      "class": [this.ns.b(), this.readonly ? this.ns.m("readonly") : ""],
+      "ref": "editorRef"
+    }, [vue.createVNode("a", {
+      "onClick": this.openLinkView
+    }, [this.curValue])]);
+  }
+});
+
+exports.IBizSpanLink = IBizSpanLink;

package/lib/editor/span/span-link/span-link.css

@@ -0,0 +1 @@
+.ibiz-span-link{color:var(--ibiz-form-item-hover-color);cursor:pointer}.ibiz-span-link--disabled{cursor:not-allowed}.ibiz-span-link--readonly{color:var(--ibiz-form-item-readonly-color)}

package/lib/editor/stepper/ibiz-stepper/ibiz-stepper.cjs

@@ -0,0 +1,92 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+var lodashEs = require('lodash-es');
+require('./ibiz-stepper.css');
+
+"use strict";
+const IBizStepper = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizStepper",
+  props: vue3Util.getStepperProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("stepper");
+    const c = props.controller;
+    const editorModel = c.model;
+    const currentVal = vue.computed(() => {
+      return props.value;
+    });
+    let step = 1;
+    let precision = 0;
+    let max = Infinity;
+    let min = -Infinity;
+    if (editorModel.editorParams) {
+      if (editorModel.editorParams.stepValue) {
+        step = lodashEs.toNumber(editorModel.editorParams.stepValue);
+      }
+      if (editorModel.editorParams.precision) {
+        precision = lodashEs.toNumber(editorModel.editorParams.precision);
+      }
+      if (editorModel.editorParams.maxValue) {
+        max = lodashEs.toNumber(editorModel.editorParams.maxValue);
+      }
+      if (editorModel.editorParams.minValue) {
+        min = lodashEs.toNumber(editorModel.editorParams.minValue);
+      }
+    }
+    const handleChange = (e) => {
+      if (e == props.value) {
+        return;
+      }
+      emit("change", e);
+    };
+    const inputRef = vue.ref();
+    const onFocus = () => {
+      emit("focus");
+    };
+    const onBlur = () => {
+      emit("blur");
+    };
+    return {
+      ns,
+      c,
+      currentVal,
+      handleChange,
+      inputRef,
+      step,
+      precision,
+      max,
+      min,
+      onFocus,
+      onBlur
+    };
+  },
+  render() {
+    let content = null;
+    if (this.readonly) {
+      content = `${this.currentVal}`;
+    } else {
+      content = [vue.createVNode(vue.resolveComponent("van-stepper"), {
+        "ref": "inputRef",
+        "modelValue": this.currentVal,
+        "placeholder": this.c.placeHolder,
+        "decimal-length": this.precision,
+        "min": this.min,
+        "max": this.max,
+        "step": this.step,
+        "disabled": this.disabled,
+        "onChange": this.handleChange,
+        "onFocus": this.onFocus,
+        "onBlur": this.onBlur
+      }, null)];
+    }
+    return vue.createVNode("div", {
+      "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : ""]
+    }, [content]);
+  }
+});
+
+exports.IBizStepper = IBizStepper;

package/lib/editor/stepper/ibiz-stepper/ibiz-stepper.css

@@ -0,0 +1 @@
+.ibiz-stepper .van-stepper .van-stepper__minus,.ibiz-stepper .van-stepper .van-stepper__plus{background-color:var(--ibiz-color-bg-0)}.ibiz-stepper .van-stepper .van-stepper__input{background-color:var(--ibiz-color-bg-0)}

package/lib/editor/stepper/index.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+var ibizStepper = require('./ibiz-stepper/ibiz-stepper.cjs');
+var stepperEditor_controller = require('./stepper-editor.controller.cjs');
+var stepperEditor_provider = require('./stepper-editor.provider.cjs');
+
+"use strict";
+
+exports.IBizStepper = ibizStepper.IBizStepper;
+exports.StepperEditorController = stepperEditor_controller.StepperEditorController;
+exports.StepperEditorProvider = stepperEditor_provider.StepperEditorProvider;

package/lib/editor/stepper/stepper-editor.controller.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+
+"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 StepperEditorController extends runtime.EditorController {
+  constructor() {
+    super(...arguments);
+    /**
+     * 占位
+     * @return {*}
+     * @author: zhujiamin
+     * @Date: 2022-08-25 14:33:14
+     */
+    __publicField(this, "placeHolder", "\u8BF7\u8F93\u5165");
+  }
+}
+
+exports.StepperEditorController = StepperEditorController;

package/lib/editor/stepper/stepper-editor.provider.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+var stepperEditor_controller = require('./stepper-editor.controller.cjs');
+
+"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 StepperEditorProvider {
+  constructor() {
+    __publicField(this, "formEditor", "IBizStepper");
+    __publicField(this, "gridEditor", "IBizStepper");
+  }
+  async createController(editorModel, parentController) {
+    const c = new stepperEditor_controller.StepperEditorController(editorModel, parentController);
+    await c.init();
+    return c;
+  }
+}
+
+exports.StepperEditorProvider = StepperEditorProvider;

package/lib/editor/switch/ibiz-switch/ibiz-switch.cjs

@@ -0,0 +1,55 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./ibiz-switch.css');
+
+"use strict";
+const IBizSwitch = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizSwitch",
+  props: vue3Util.getSwitchProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("switch");
+    const currentVal = vue.ref(false);
+    vue.watch(() => props.value, (newVal, oldVal) => {
+      if (newVal !== oldVal) {
+        if (!newVal) {
+          currentVal.value = false;
+        } else {
+          currentVal.value = props.value == 1;
+        }
+      }
+    }, {
+      immediate: true
+    });
+    const handleChange = (currentValue) => {
+      const emitValue = currentValue === true ? 1 : 0;
+      emit("change", emitValue);
+    };
+    const {
+      componentRef: editorRef
+    } = vue3Util.useFocusAndBlur(() => emit("focus"), () => emit("blur"));
+    return {
+      ns,
+      currentVal,
+      handleChange,
+      editorRef
+    };
+  },
+  render() {
+    return vue.createVNode("div", {
+      "class": [this.ns.b()],
+      "ref": "editorRef"
+    }, [vue.createVNode(vue.resolveComponent("van-switch"), {
+      "modelValue": this.currentVal,
+      "onUpdate:modelValue": ($event) => this.currentVal = $event,
+      "disabled": this.disabled || this.readonly,
+      "onChange": this.handleChange
+    }, null)]);
+  }
+});
+
+exports.IBizSwitch = IBizSwitch;

package/lib/editor/switch/ibiz-switch/ibiz-switch.css

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

package/lib/editor/switch/index.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+var ibizSwitch = require('./ibiz-switch/ibiz-switch.cjs');
+var switchEditor_controller = require('./switch-editor.controller.cjs');
+var switchEditor_provider = require('./switch-editor.provider.cjs');
+
+"use strict";
+
+exports.IBizSwitch = ibizSwitch.IBizSwitch;
+exports.SwitchEditorController = switchEditor_controller.SwitchEditorController;
+exports.SwitchEditorProvider = switchEditor_provider.SwitchEditorProvider;

package/lib/editor/switch/switch-editor.controller.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+class SwitchEditorController extends runtime.EditorController {
+}
+
+exports.SwitchEditorController = SwitchEditorController;

package/lib/editor/switch/switch-editor.provider.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+var switchEditor_controller = require('./switch-editor.controller.cjs');
+
+"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 SwitchEditorProvider {
+  constructor() {
+    __publicField(this, "formEditor", "IBizSwitch");
+    __publicField(this, "gridEditor", "IBizSwitch");
+  }
+  async createController(editorModel, parentController) {
+    const c = new switchEditor_controller.SwitchEditorController(editorModel, parentController);
+    await c.init();
+    return c;
+  }
+}
+
+exports.SwitchEditorProvider = SwitchEditorProvider;

package/lib/editor/text-box/ibiz-input-number/ibiz-input-number.cjs

@@ -0,0 +1,94 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./ibiz-input-number.css');
+var lodashEs = require('lodash-es');
+
+"use strict";
+const IBizInputNumber = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizInputNumber",
+  props: vue3Util.getInputNumberProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("input-number");
+    const c = props.controller;
+    const currentVal = vue.ref(void 0);
+    const show = vue.ref(false);
+    const oldEmitVal = vue.ref(void 0);
+    vue.watch(() => props.value, (newVal, oldVal) => {
+      if (newVal !== oldVal) {
+        const number = Number(newVal);
+        currentVal.value = Number.isNaN(number) ? void 0 : number;
+      }
+    }, {
+      immediate: true
+    });
+    const handleChange = (evt) => {
+      const value = Number(evt.target.value);
+      const emitValue = evt.target.value ? lodashEs.floor(value, c.precision) : void 0;
+      if (emitValue === oldEmitVal.value) {
+        return;
+      }
+      emit("change", emitValue);
+      oldEmitVal.value = Number(emitValue);
+    };
+    const inputRef = vue.ref();
+    if (props.autoFocus) {
+      vue.watch(inputRef, (newVal) => {
+        if (newVal) {
+          const input = newVal.$el.getElementsByTagName("input")[0];
+          input.focus();
+        }
+      });
+    }
+    const onFocus = () => {
+      emit("focus");
+    };
+    const onBlur = () => {
+      emit("blur");
+    };
+    return {
+      ns,
+      c,
+      currentVal,
+      handleChange,
+      inputRef,
+      onFocus,
+      onBlur,
+      show
+    };
+  },
+  render() {
+    const {
+      unitName
+    } = this.c.parent;
+    let content = null;
+    if (this.readonly) {
+      content = `${this.currentVal}`;
+      if (content && unitName) {
+        content += unitName;
+      }
+    } else {
+      content = [vue.createVNode(vue.resolveComponent("van-field"), {
+        "ref": "inputRef",
+        "modelValue": this.currentVal,
+        "placeholder": this.c.placeHolder,
+        "precision": this.c.model.precision,
+        "disabled": this.disabled,
+        "onFocus": this.onFocus,
+        "onBlur": this.onBlur,
+        "onInput": this.handleChange
+      }, null), unitName && vue.createVNode("i", {
+        "class": this.ns.e("unit")
+      }, [unitName])];
+    }
+    return vue.createVNode("div", {
+      "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : ""]
+    }, [content]);
+  }
+});
+
+exports.IBizInputNumber = IBizInputNumber;

package/lib/editor/text-box/ibiz-input-number/ibiz-input-number.css

@@ -0,0 +1 @@
+.ibiz-input-number{height:100%}.ibiz-input-number input{font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-form-item-line-height);color:var(--ibiz-form-item-text-color);border-color:var(--ibiz-form-item-border-color)}.ibiz-input-number input::-moz-placeholder{color:var(--ibiz-form-item-placeholder-color)}.ibiz-input-number input::placeholder{color:var(--ibiz-form-item-placeholder-color)}.ibiz-input-number input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color)}.ibiz-input-number--readonly{color:var(--ibiz-form-item-readonly-color);word-break:break-word;white-space:pre-wrap}.ibiz-input-number .ibiz-input-number__unit{margin-left:10px;font-size:var(--ibiz-form-item-font-size);font-style:normal}

package/lib/editor/text-box/index.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var input = require('./input/input.cjs');
+var ibizInputNumber = require('./ibiz-input-number/ibiz-input-number.cjs');
+var textBoxEditor_controller = require('./text-box-editor.controller.cjs');
+var textBoxEditor_provider = require('./text-box-editor.provider.cjs');
+
+"use strict";
+
+exports.IBizInput = input.IBizInput;
+exports.IBizInputNumber = ibizInputNumber.IBizInputNumber;
+exports.TextBoxEditorController = textBoxEditor_controller.TextBoxEditorController;
+exports.TextBoxEditorProvider = textBoxEditor_provider.TextBoxEditorProvider;

package/lib/editor/text-box/input/input.cjs

@@ -0,0 +1,153 @@
+'use strict';
+
+var vue = require('vue');
+var lodashEs = require('lodash-es');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./input.css');
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+const IBizInput = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizInput",
+  props: vue3Util.getInputProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("input");
+    const c = props.controller;
+    const editorModel = c.model;
+    const inputRef = vue.ref();
+    const rows = vue.ref(2);
+    if (editorModel.editorType === "TEXTAREA_10") {
+      rows.value = 10;
+    }
+    const type = vue.computed(() => {
+      switch (editorModel.editorType) {
+        case "MOBTEXT":
+          return "text";
+        case "MOBPASSWORD":
+          return "password";
+        case "MOBTEXTAREA":
+          return "textarea";
+        default:
+          return "text";
+      }
+    });
+    const currentVal = vue.ref("");
+    vue.watch(() => props.value, (newVal, oldVal) => {
+      if (newVal !== oldVal) {
+        if (!newVal) {
+          currentVal.value = "";
+        } else {
+          currentVal.value = newVal;
+        }
+      }
+    }, {
+      immediate: true
+    });
+    let isDebounce = false;
+    let awaitSearch;
+    let blurCacheValue;
+    const debounceChange = lodashEs.debounce((val) => {
+      if (blurCacheValue !== val) {
+        emit("change", val);
+      }
+      blurCacheValue = void 0;
+      isDebounce = false;
+      if (awaitSearch) {
+        awaitSearch();
+      }
+    }, 300, {
+      leading: true
+    });
+    const handleChange = (evt) => {
+      const val = evt.target.value;
+      isDebounce = true;
+      debounceChange(val);
+    };
+    const handleKeyUp = (e) => {
+      if (e && e.code === "Enter") {
+        if (isDebounce) {
+          awaitSearch = () => {
+            inputRef.value.$el.dispatchEvent(e);
+          };
+        }
+      }
+    };
+    const onBlur = (event) => {
+      blurCacheValue = event.target.value;
+      emit("change", blurCacheValue);
+      emit("blur");
+    };
+    if (props.autoFocus) {
+      vue.watch(inputRef, (newVal) => {
+        if (newVal) {
+          const inputTag = type.value === "textarea" ? "textarea" : "input";
+          const input = newVal.$el.getElementsByTagName(inputTag)[0];
+          input.focus();
+        }
+      });
+    }
+    const onFocus = () => {
+      emit("focus");
+    };
+    return {
+      c,
+      ns,
+      rows,
+      type,
+      currentVal,
+      handleChange,
+      handleKeyUp,
+      onBlur,
+      onFocus,
+      inputRef
+    };
+  },
+  render() {
+    const {
+      unitName
+    } = this.c.parent;
+    let content = null;
+    if (this.readonly) {
+      content = `${this.currentVal}`;
+      if (content && unitName) {
+        content += unitName;
+      }
+    } else {
+      const slots = {};
+      if (unitName) {
+        slots.extra = () => {
+          return vue.createVNode("i", {
+            "class": this.ns.e("unit")
+          }, [unitName]);
+        };
+      }
+      content = vue.createVNode(vue.resolveComponent("van-field"), {
+        "ref": "inputRef",
+        "modelValue": this.currentVal,
+        "placeholder": this.controller.placeHolder,
+        "type": this.type,
+        "rows": this.rows,
+        "onInput": this.handleChange,
+        "onKeyup": this.handleKeyUp,
+        "onBlur": this.onBlur,
+        "onFocus": this.onFocus,
+        "class": this.ns.b("input"),
+        "disabled": this.disabled,
+        "autosize": this.type === "textarea",
+        "autocomplete": "new-password"
+      }, _isSlot(slots) ? slots : {
+        default: () => [slots]
+      });
+    }
+    return vue.createVNode("div", {
+      "class": [this.ns.b(), this.ns.is("textarea", Object.is(this.type, "textarea")), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : ""]
+    }, [content]);
+  }
+});
+
+exports.IBizInput = IBizInput;

package/lib/editor/text-box/input/input.css

@@ -0,0 +1 @@
+.ibiz-input{height:100%}.ibiz-input input{font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-form-item-line-height);color:var(--ibiz-form-item-text-color);border-color:var(--ibiz-form-item-border-color)}.ibiz-input input::-moz-placeholder{color:var(--ibiz-form-item-placeholder-color)}.ibiz-input input::placeholder{color:var(--ibiz-form-item-placeholder-color)}.ibiz-input input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color)}.ibiz-input--readonly{color:var(--ibiz-form-item-readonly-color)}.ibiz-input .ibiz-input__unit{font-size:var(--ibiz-form-item-font-size);font-style:normal}