@ctzy-web-client/plugin-component-vue 1.0.22 → 1.0.24

package/lib/data-form/data-form.js

@@ -9,171 +9,218 @@ var lodash = require('lodash');
 var dataFormItem = require('./data-form-item.js');
 var _pluginVue_exportHelper = require('../_virtual/_plugin-vue_export-helper.js');
 
-const __default__ = vue.defineComponent({ name: "BwaDataForm" });
-const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
-  props: {
-    dataForm: {
-      type: Object
-    },
-    autoLoad: {
-      type: Boolean,
-      default: true
-    },
-    record: {
-      type: Object
-    },
-    recID: {
-      type: String
-    },
-    labelPosition: {
-      type: String
-    },
-    labelWidth: {
-      type: String,
-      default: ""
-    },
-    rules: {
-      type: Object,
-      default: () => ({})
-    },
-    validateOnRuleChange: {
-      type: Boolean,
-      default: false
-    },
-    isShowLabelColon: {
-      type: Boolean,
-      default: true
-    }
-  },
+const _sfc_main = {
+  __name: 'data-form',
+  props: {
+  dataForm: {
+    type: Object,
+  },
+  autoLoad: {
+    type: Boolean,
+    default: true,
+  },
+  //注册id 和 记录数据
+  record: {
+    type: Object,
+  },
+  recID: {
+    type: String,
+  },
+  labelPosition: {
+    type: String,
+  },
+  labelWidth: {
+    type: String,
+    default: '',
+  },
+  rules: {
+    type: Object,
+    default: () => ({}),
+  },
+  validateOnRuleChange: {
+    type: Boolean,
+    default: false,
+  },
+    isShowLabelColon: {
+        type: Boolean,
+        default: true,
+    },
+},
   setup(__props, { expose }) {
-    const props = __props;
-    const attrs = vue.useAttrs();
-    const dataForm = props.dataForm;
-    const dataFormElRef = vue.ref();
-    const rules = vue.computed(() => {
-      let data = {};
-      dataForm.getDisplayColumns().forEach((item) => {
-        data[item.fullAttrName] = (item.required ? [{ required: true, message: item.title + "\u5FC5\u586B!" }] : []).concat(item.rules);
-      });
-      return lodash.mergeWith(
-        {},
-        data,
-        props.rules,
-        function customizer(objValue, srcValue) {
-          if (lodash.isArray(objValue)) {
-            return objValue.concat(srcValue);
-          }
-        }
-      );
-    });
-    const computedLabelWidth = vue.computed(() => {
-      if (props.labelWidth) {
-        return props.labelWidth;
-      }
-      let labelWidth = 0;
-      if (props.labelPosition != "top") {
-        let maxLabelCharCount = 0;
-        dataForm.getDisplayColumns().forEach((item) => {
-          maxLabelCharCount = Math.max(
-            maxLabelCharCount,
-            item.title.length + (item.required ? 1 : 0)
-          );
-        });
-        labelWidth = (maxLabelCharCount + 1) * 18;
-      }
-      return labelWidth + "px";
-    });
-    if (props.autoLoad) {
-      vue.watch(
-        vue.computed(() => props.record),
-        async () => {
-          if (props.recID) {
-            try {
-              await dataForm.loadDataByRecId(props.recID);
-            } catch (e) {
-              console.error(e);
-              ElementPlus.ElMessage.error("\u83B7\u53D6\u8BB0\u5F55\u5931\u8D25\u3002");
-            }
-            return;
-          }
-          if (props.record) {
-            dataForm.setData(props.record);
-            return;
-          }
-          dataForm.setData();
-        },
-        { immediate: true }
-      );
-    }
-    vue.provide(webBaseClientVue.dataFormKey, dataForm);
-    const validate = (callback) => {
-      return dataFormElRef.value.validate(callback);
-    };
-    window.dataFormElRef = dataFormElRef;
-    window.aaavvv = validate;
-    const submit = (data) => {
-      return validate().then(() => {
-        dataForm.submit(data).then(() => {
-          ElementPlus.ElMessage.info("\u4FDD\u5B58\u6210\u529F!");
-        }).catch((e) => ElementPlus.ElMessage.error(e.message));
-      }).catch((result) => {
-        console.log(result);
-      });
-    };
-    vue.onMounted(() => {
-      vue.unref(dataForm).formValivators.push(vue.unref(dataFormElRef));
-    });
-    vue.onBeforeUnmount(() => {
-      const _dataFormEl = vue.unref(dataFormElRef);
-      vue.unref(dataForm).formValivators = vue.unref(dataForm).formValivators.filter(
-        (validate2) => validate2 !== _dataFormEl
-      );
-    });
-    expose({
-      dataForm,
-      dataFormElRef,
-      validate,
-      submit,
-      rules,
-      computedLabelWidth
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElForm), vue.mergeProps({
-        ref_key: "dataFormElRef",
-        ref: dataFormElRef
-      }, vue.unref(attrs), {
-        model: vue.unref(dataForm).data,
-        "label-position": __props.labelPosition,
-        "label-width": vue.unref(computedLabelWidth),
-        rules: vue.unref(rules),
-        "validate-on-rule-change": __props.validateOnRuleChange,
-        disabled: vue.unref(dataForm).disabled
-      }), {
-        default: vue.withCtx(() => [
-          vue.renderSlot(_ctx.$slots, "default", { dataForm: vue.unref(dataForm) }, () => [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(dataForm).getDisplayColumns(), (column) => {
-              return vue.openBlock(), vue.createBlock(dataFormItem["default"], {
-                key: column.fullAttrName,
-                name: column.fullAttrName,
-                isShowLabelColon: __props.isShowLabelColon
-              }, {
-                default: vue.withCtx(() => [
-                  vue.renderSlot(_ctx.$slots, "form-item-" + column.fullAttrName, {
-                    column,
-                    record: vue.unref(dataForm).data,
-                    dataForm: vue.unref(dataForm)
-                  })
-                ]),
-                _: 2
-              }, 1032, ["name", "isShowLabelColon"]);
-            }), 128))
-          ])
-        ]),
-        _: 3
-      }, 16, ["model", "label-position", "label-width", "rules", "validate-on-rule-change", "disabled"]);
-    };
-  }
-});
-var DataForm = /* @__PURE__ */ _pluginVue_exportHelper["default"](_sfc_main, [["__file", "data-form.vue"]]);
+
+const props = __props;
+
+defineOptions({ name: 'BwaDataForm' });
+
+
+
+const attrs = vue.useAttrs();
+
+const dataForm = props.dataForm;
+
+//表单对象的引用
+const dataFormElRef = vue.ref();
+
+//验证规则
+const rules = vue.computed(() => {
+  let data = {};
+
+  dataForm.getDisplayColumns().forEach((item) => {
+    data[item.fullAttrName] = (
+      item.required ? [{ required: true, message: item.title + '必填!' }] : []
+    ).concat(item.rules);
+  });
+
+  return lodash.mergeWith(
+    {},
+    data,
+    props.rules,
+    function customizer(objValue, srcValue) {
+      if (lodash.isArray(objValue)) {
+        return objValue.concat(srcValue);
+      }
+    }
+  );
+});
+
+//计算后的描述宽度
+const computedLabelWidth = vue.computed(() => {
+  if (props.labelWidth) {
+    return props.labelWidth;
+  }
+
+  let labelWidth = 0;
+
+  if (props.labelPosition != 'top') {
+    let maxLabelCharCount = 0;
+    dataForm.getDisplayColumns().forEach((item) => {
+      maxLabelCharCount = Math.max(
+        maxLabelCharCount,
+        item.title.length + (item.required ? 1 : 0)
+      );
+    });
+    labelWidth = (maxLabelCharCount + 1) * 18;
+  }
+  return labelWidth + 'px';
+});
+
+if (props.autoLoad) {
+  //监听recid的变化 是否自动加载数据
+  vue.watch(
+    vue.computed(() => props.record),
+    async () => {
+      if (props.recID) {
+        try {
+          await dataForm.loadDataByRecId(props.recID);
+        } catch (e) {
+          console.error(e);
+          ElementPlus.ElMessage.error('获取记录失败。');
+        }
+        return;
+      }
+
+      if (props.record) {
+        dataForm.setData(props.record);
+        return;
+      }
+
+      dataForm.setData();
+    },
+    { immediate: true }
+  );
+}
+
+//当前data table 上下文对象
+vue.provide(webBaseClientVue.dataFormKey, dataForm);
+
+/**
+ * 表单验证
+ * @param {*} data
+ */
+const validate = (callback) => {
+  return dataFormElRef.value.validate(callback);
+};
+
+window.dataFormElRef = dataFormElRef;
+window.aaavvv = validate;
+
+/**
+ * 提交表单
+ * @param {Object} 额外附加的提交数据
+ */
+const submit = (data) => {
+  return validate()
+    .then(() => {
+      dataForm
+        .submit(data)
+        .then(() => {
+          ElementPlus.ElMessage.info('保存成功!');
+        })
+        .catch((e) => ElementPlus.ElMessage.error(e.message));
+    })
+    .catch((result) => {
+      console.log(result);
+    });
+};
+
+vue.onMounted(() => {
+  vue.unref(dataForm).formValivators.push(vue.unref(dataFormElRef));
+});
+
+vue.onBeforeUnmount(() => {
+  const _dataFormEl = vue.unref(dataFormElRef);
+  vue.unref(dataForm).formValivators = vue.unref(dataForm).formValivators.filter(
+    (validate) => validate !== _dataFormEl
+  );
+});
+
+expose({
+  dataForm,
+  dataFormElRef,
+  validate,
+  submit,
+  rules,
+  computedLabelWidth,
+});
+
+return (_ctx, _cache) => {
+  return (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElForm), vue.mergeProps({
+    ref_key: "dataFormElRef",
+    ref: dataFormElRef
+  }, vue.unref(attrs), {
+    model: vue.unref(dataForm).data,
+    "label-position": __props.labelPosition,
+    "label-width": vue.unref(computedLabelWidth),
+    rules: vue.unref(rules),
+    "validate-on-rule-change": __props.validateOnRuleChange,
+    disabled: vue.unref(dataForm).disabled
+  }), {
+    default: vue.withCtx(() => [
+      vue.renderSlot(_ctx.$slots, "default", { dataForm: vue.unref(dataForm) }, () => [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(dataForm).getDisplayColumns(), (column) => {
+          return (vue.openBlock(), vue.createBlock(dataFormItem["default"], {
+            key: column.fullAttrName,
+            name: column.fullAttrName,
+            isShowLabelColon: __props.isShowLabelColon
+          }, {
+            default: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, 'form-item-' + column.fullAttrName, {
+                column: column,
+                record: vue.unref(dataForm).data,
+                dataForm: vue.unref(dataForm)
+              })
+            ]),
+            _: 2 /* DYNAMIC */
+          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["name", "isShowLabelColon"]))
+        }), 128 /* KEYED_FRAGMENT */))
+      ])
+    ]),
+    _: 3 /* FORWARDED */
+  }, 16 /* FULL_PROPS */, ["model", "label-position", "label-width", "rules", "validate-on-rule-change", "disabled"]))
+}
+}
+
+};
+var DataForm = /*#__PURE__*/_pluginVue_exportHelper["default"](_sfc_main, [['__file',"data-form.vue"]]);
 
 exports["default"] = DataForm;

package/lib/data-form/form-components/bwa-date-picker.js

@@ -6,44 +6,56 @@ var vue = require('vue');
 var ElementPlus = require('element-plus');
 var _pluginVue_exportHelper = require('../../_virtual/_plugin-vue_export-helper.js');
 
-const __default__ = vue.defineComponent({
-  name: "BwaDatePicker"
-});
-const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
-  props: {
-    modelValue: {
-      type: [String, Date],
-      default: null
-    },
-    placeholder: {
-      type: String,
-      default: "\u8BF7\u9009\u62E9"
-    }
-  },
-  emits: ["update:model-value"],
+const _sfc_main = {
+  __name: 'bwa-date-picker',
+  props: {
+  modelValue: {
+    type: [String, Date],
+    default: null,
+  },
+  placeholder: {
+    type: String,
+    default: '请选择',
+  },
+},
+  emits: ['update:model-value'],
   setup(__props, { emit }) {
-    const props = __props;
-    const attrs = vue.useAttrs();
-    const modelValue = vue.computed({
-      get: () => props.modelValue,
-      set: (v) => emit(
-        "update:model-value",
-        v ? ElementPlus.dayjs(new Date(v.getTime())).format("YYYY-MM-DD") : ""
-      )
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDatePicker), vue.mergeProps({
-        modelValue: vue.unref(modelValue),
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(modelValue) ? modelValue.value = $event : null),
-        type: "date",
-        placeholder: __props.placeholder
-      }, vue.unref(attrs), {
-        teleported: false,
-        style: { "width": "100%" }
-      }), null, 16, ["modelValue", "placeholder"]);
-    };
-  }
-});
-var DatePicker = /* @__PURE__ */ _pluginVue_exportHelper["default"](_sfc_main, [["__file", "bwa-date-picker.vue"]]);
+
+const props = __props;
+
+defineOptions({
+  name: 'BwaDatePicker',
+});
+
+
+
+const attrs = vue.useAttrs();
+
+
+
+const modelValue = vue.computed({
+  get: () => props.modelValue,
+  set: (v) =>
+    emit(
+      'update:model-value',
+        v ? ElementPlus.dayjs(new Date(v.getTime())).format('YYYY-MM-DD') : ''
+    ),
+});
+
+return (_ctx, _cache) => {
+  return (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDatePicker), vue.mergeProps({
+    modelValue: vue.unref(modelValue),
+    "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (vue.isRef(modelValue) ? (modelValue).value = $event : null)),
+    type: "date",
+    placeholder: __props.placeholder
+  }, vue.unref(attrs), {
+    teleported: false,
+    style: {"width":"100%"}
+  }), null, 16 /* FULL_PROPS */, ["modelValue", "placeholder"]))
+}
+}
+
+};
+var DatePicker = /*#__PURE__*/_pluginVue_exportHelper["default"](_sfc_main, [['__file',"bwa-date-picker.vue"]]);
 
 exports["default"] = DatePicker;

package/lib/data-form/form-components/bwa-date-time-picker.js

@@ -6,49 +6,61 @@ var vue = require('vue');
 var ElementPlus = require('element-plus');
 var _pluginVue_exportHelper = require('../../_virtual/_plugin-vue_export-helper.js');
 
-const __default__ = vue.defineComponent({
-  name: "BwaDateTimePicker"
-});
-const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
-  props: {
-    modelValue: {
-      type: [String, Date],
-      default: null
-    },
-    placeholder: {
-      type: String,
-      default: "\u8BF7\u9009\u62E9"
-    }
-  },
-  emits: ["update:model-value"],
+const _sfc_main = {
+  __name: 'bwa-date-time-picker',
+  props: {
+  modelValue: {
+    type: [String, Date],
+    default: null,
+  },
+  placeholder: {
+    type: String,
+    default: '请选择',
+  },
+},
+  emits: ['update:model-value'],
   setup(__props, { emit }) {
-    const props = __props;
-    const attrs = vue.useAttrs();
-    const modelValue = vue.computed({
-      get: () => props.modelValue,
-      set: (v) => {
-        if (!v) {
-          emit("update:model-value", "");
-          return;
-        }
-        emit(
-          "update:model-value",
-          ElementPlus.dayjs(new Date(v.getTime())).format("YYYY-MM-DD HH:mm:ss")
-        );
-      }
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDatePicker), vue.mergeProps(vue.unref(attrs), {
-        modelValue: vue.unref(modelValue),
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(modelValue) ? modelValue.value = $event : null),
-        type: "datetime",
-        placeholder: __props.placeholder,
-        teleported: false,
-        style: { "width": "100%" }
-      }), null, 16, ["modelValue", "placeholder"]);
-    };
-  }
-});
-var DateTimePicker = /* @__PURE__ */ _pluginVue_exportHelper["default"](_sfc_main, [["__file", "bwa-date-time-picker.vue"]]);
+
+const props = __props;
+
+defineOptions({
+  name: 'BwaDateTimePicker',
+});
+
+
+
+const attrs = vue.useAttrs();
+
+
+
+const modelValue = vue.computed({
+  get: () => props.modelValue,
+  set: (v) => {
+    if (!v) {
+      emit('update:model-value', '');
+      return;
+    }
+
+    emit(
+      'update:model-value',
+      ElementPlus.dayjs(new Date(v.getTime())).format('YYYY-MM-DD HH:mm:ss')
+    );
+  },
+});
+
+return (_ctx, _cache) => {
+  return (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDatePicker), vue.mergeProps(vue.unref(attrs), {
+    modelValue: vue.unref(modelValue),
+    "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (vue.isRef(modelValue) ? (modelValue).value = $event : null)),
+    type: "datetime",
+    placeholder: __props.placeholder,
+    teleported: false,
+    style: {"width":"100%"}
+  }), null, 16 /* FULL_PROPS */, ["modelValue", "placeholder"]))
+}
+}
+
+};
+var DateTimePicker = /*#__PURE__*/_pluginVue_exportHelper["default"](_sfc_main, [['__file',"bwa-date-time-picker.vue"]]);
 
 exports["default"] = DateTimePicker;