@web-utils/component 2.0.10 → 2.0.11

package/dist/components/dynamic-table/index.js

@@ -1,102 +1,108 @@
-import { fastClone as u, validateNumber as d, validateIdCard as c, validatePhoneNum as m } from "@web-utils/core";
-import { n as f } from "../../chunks/5d4282fb.js";
-var h = function() {
-  var e = this, i = e.$createElement, t = e._self._c || i;
-  return t("div", {
+import { fastClone, validateNumber, validateIdCard, validatePhoneNum } from "@web-utils/core";
+import { n as normalizeComponent } from "../../chunks/3d28cc08.js";
+var render = function() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", {
     staticClass: "dynamic-table"
-  }, [t("ElTable", {
-    key: e.key,
+  }, [_c("ElTable", {
+    key: _vm.key,
     staticStyle: {
-      width: "100%"
+      "width": "100%"
     },
     attrs: {
-      data: e.value
+      "data": _vm.value
     }
-  }, [e._l(e.columns, function(a) {
-    return t("ElTableColumn", {
-      key: a.prop,
+  }, [_vm._l(_vm.columns, function(column) {
+    return _c("ElTableColumn", {
+      key: column.prop,
       attrs: {
-        prop: a.prop,
-        label: a.label,
+        "prop": column.prop,
+        "label": column.label,
         "min-width": "150"
       },
-      scopedSlots: e._u([{
+      scopedSlots: _vm._u([{
         key: "default",
-        fn: function(l) {
-          var n = l.row, r = l.$index;
-          return [t("ElFormItem", {
+        fn: function(_ref) {
+          var row = _ref.row, $index = _ref.$index;
+          return [_c("ElFormItem", {
             style: {
-              marginBottom: e.inputDisabled ? "0px" : "16px"
+              marginBottom: _vm.inputDisabled ? "0px" : "16px"
             },
             attrs: {
-              prop: `${e.prop}.${r}.${a.prop}`,
-              size: "mini",
-              rules: e.getRules(a)
+              "prop": `${_vm.prop}.${$index}.${column.prop}`,
+              "size": "mini",
+              "rules": _vm.getRules(column)
             }
-          }, [t("ElInput", {
+          }, [_c("ElInput", {
             attrs: {
-              "prefix-icon": e.getIcon(a),
-              disabled: e.inputDisabled,
-              placeholder: e.inputDisabled ? "" : `请输入${a.label}！`
+              "prefix-icon": _vm.getIcon(column),
+              "disabled": _vm.inputDisabled,
+              "placeholder": _vm.inputDisabled ? "" : `请输入${column.label}！`
             },
             model: {
-              value: n[a.prop],
-              callback: function(s) {
-                e.$set(n, a.prop, s);
+              value: row[column.prop],
+              callback: function($$v) {
+                _vm.$set(row, column.prop, $$v);
               },
               expression: "row[column.prop]"
             }
           })], 1)];
         }
-      }], null, !0)
+      }], null, true)
     });
-  }), e.inputDisabled ? e._e() : t("ElTableColumn", {
+  }), !_vm.inputDisabled ? _c("ElTableColumn", {
     attrs: {
-      label: "操作",
-      width: "60",
-      fixed: "right"
+      "label": "操作",
+      "width": "60",
+      "fixed": "right"
     },
-    scopedSlots: e._u([{
+    scopedSlots: _vm._u([{
       key: "default",
-      fn: function(a) {
-        var l = a.row, n = a.column, r = a.$index;
-        return [t("i", {
+      fn: function(_ref2) {
+        var row = _ref2.row, column = _ref2.column, $index = _ref2.$index;
+        return [_c("i", {
           staticClass: "el-icon-minus dynamic-table-action-icon",
           staticStyle: {
-            position: "relative",
-            top: "-8px",
-            color: "#f00"
+            "position": "relative",
+            "top": "-8px",
+            "color": "#f00"
           },
           attrs: {
-            title: "删除"
+            "title": "删除"
           },
           on: {
-            click: function(s) {
-              return s.stopPropagation(), e.removeRow(l, r, n);
+            "click": function($event) {
+              $event.stopPropagation();
+              return _vm.removeRow(row, $index, column);
             }
           }
         })];
       }
-    }], null, !1, 410881950)
-  })], 2), e.inputDisabled ? e._e() : t("ElButton", {
+    }], null, false, 410881950)
+  }) : _vm._e()], 2), !_vm.inputDisabled ? _c("ElButton", {
     staticStyle: {
-      color: "#08c108"
+      "color": "#08c108"
     },
     attrs: {
-      type: "text",
-      icon: "el-icon-plus"
+      "type": "text",
+      "icon": "el-icon-plus"
     },
     on: {
-      click: e.addRow
+      "click": _vm.addRow
     }
-  }, [e._v(" 添加 ")])], 1);
-}, y = [];
-const o = {
+  }, [_vm._v(" 添加 ")]) : _vm._e()], 1);
+};
+var staticRenderFns = [];
+const DynamicTable_vue_vue_type_style_index_0_lang = "";
+const icons = {
   number: "fa fa-superscript",
   email: "el-icon-lx-mail",
   phone: "fa fa-phone",
   idCard: "el-icon-lx-news"
-}, v = {
+};
+const __vue2_script = {
   name: "DynamicTable",
   inject: {
     elForm: {
@@ -133,63 +139,81 @@ const o = {
   },
   watch: {
     value: {
-      deep: !0,
-      handler(e) {
-        this.$emit("input", e);
+      deep: true,
+      handler(newVal) {
+        this.$emit("input", newVal);
       }
     },
     columns: {
-      deep: !0,
+      deep: true,
       handler() {
         this.key++;
       }
     }
   },
   methods: {
-    getIcon(e) {
-      return o[e.type] ? o[e.type] : "";
+    getIcon(column) {
+      return icons[column.type] ? icons[column.type] : "";
     },
     addRow() {
-      const e = this.value;
-      e.push(this.newRow()), this.$emit("input", e);
+      const value = this.value;
+      value.push(this.newRow());
+      this.$emit("input", value);
     },
-    removeRow(e, i) {
-      const t = this.value;
-      t.splice(i, 1), this.$emit("input", t);
+    removeRow(row, index) {
+      const value = this.value;
+      value.splice(index, 1);
+      this.$emit("input", value);
     },
     newRow() {
-      const e = {};
-      return this.columns.forEach((i) => {
-        e[i.prop] = void 0;
-      }), e;
+      const row = {};
+      this.columns.forEach((value) => {
+        row[value.prop] = void 0;
+      });
+      return row;
     },
-    getRules(e) {
-      const i = e.rules;
-      if (["email", "idCard", "phone", "number"].includes(e.type)) {
-        const t = u(i || []);
-        return e.type === "number" && t.push({ validator: d, message: "请输入数字！" }), e.type === "email" && t.push({ type: "email", message: "请输入正确的邮箱地址！" }), e.type === "idCard" && t.push({ validator: c, message: "请输入正确的身份证号码！" }), e.type === "phone" && t.push({ validator: m, message: "请输入正确的手机号码！" }), t;
-      } else
-        return i;
+    getRules(column) {
+      const userRules = column.rules;
+      if (["email", "idCard", "phone", "number"].includes(column.type)) {
+        const rules = fastClone(userRules || []);
+        if (column.type === "number") {
+          rules.push({ validator: validateNumber, message: "请输入数字！" });
+        }
+        if (column.type === "email") {
+          rules.push({ type: "email", message: "请输入正确的邮箱地址！" });
+        }
+        if (column.type === "idCard") {
+          rules.push({ validator: validateIdCard, message: "请输入正确的身份证号码！" });
+        }
+        if (column.type === "phone") {
+          rules.push({ validator: validatePhoneNum, message: "请输入正确的手机号码！" });
+        }
+        return rules;
+      } else {
+        return userRules;
+      }
     }
   }
-}, p = {};
-var b = /* @__PURE__ */ f(
-  v,
-  h,
-  y,
-  !1,
-  _,
+};
+const __cssModules = {};
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  __vue2_script,
+  render,
+  staticRenderFns,
+  false,
+  __vue2_injectStyles,
   null,
   null,
   null
 );
-function _(e) {
-  for (let i in p)
-    this[i] = p[i];
+function __vue2_injectStyles(context) {
+  for (let o in __cssModules) {
+    this[o] = __cssModules[o];
+  }
 }
-const g = /* @__PURE__ */ function() {
-  return b.exports;
+const DynamicTable = /* @__PURE__ */ function() {
+  return __component__.exports;
 }();
 export {
-  g as default
+  DynamicTable as default
 };

package/dist/components/dynamic-table/style.css

@@ -1 +1,30 @@
-.dynamic-table{display:flex;flex-direction:column;align-items:center;width:100%}.dynamic-table .dynamic-table-action-icon{margin-left:10px;font-weight:700;cursor:pointer}.dynamic-table .el-form-item{margin-bottom:0}.dynamic-table .el-table{flex:1 1 auto}.dynamic-table .el-table td{padding:2px 0}.dynamic-table .el-input.is-disabled .el-input__inner{background-color:transparent;border:none}
+/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
+/* 应用头部高度 */
+/* 页面宽度 */
+/* 侧栏宽度 */
+/* 标签高度 */
+/* 页面头部工具条高度 */
+.dynamic-table {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+}
+.dynamic-table .dynamic-table-action-icon {
+  margin-left: 10px;
+  font-weight: bold;
+  cursor: pointer;
+}
+.dynamic-table .el-form-item {
+  margin-bottom: 0;
+}
+.dynamic-table .el-table {
+  flex: 1 1 auto;
+}
+.dynamic-table .el-table td {
+  padding: 2px 0;
+}
+.dynamic-table .el-input.is-disabled .el-input__inner {
+  background-color: transparent;
+  border: none;
+}