starfish-form-custom 1.0.18 → 1.0.20

package/dist/{main-5c7bd9ea.mjs → main-c0754020.mjs}

@@ -140,8 +140,9 @@ const fieldsMap = {
     default: "",
     maxLength: 100,
     minLength: 0,
-    state: "normal"
+    state: "normal",
     // 状态：normal, disabled, readonly
+    align: "left"
   },
   Info: {
     fieldName: "",
@@ -513,6 +514,18 @@ function getMoren(fieldName, component, label) {
         rule: "[]"
       }
     },
+    rule: {
+      ControlType: "Rule",
+      data: {
+        fieldName: "rule",
+        tip: "",
+        label: "校验规则",
+        showRule: "{}",
+        required: false,
+        rule: "[]",
+        default: "[]"
+      }
+    },
     precision: {
       ControlType: "InputNumber",
       data: {
@@ -572,6 +585,26 @@ function getMoren(fieldName, component, label) {
         }
       }
     },
+    align: {
+      ControlType: "Radio",
+      data: {
+        fieldName: "align",
+        tip: "",
+        label: "对齐方式",
+        placeholder: "",
+        showRule: "{}",
+        required: false,
+        rule: "[]",
+        itemConfig: {
+          value: "left",
+          items: [
+            { label: "左", value: "left" },
+            { label: "中", value: "center" },
+            { label: "右", value: "right" }
+          ]
+        }
+      }
+    },
     arrangeMent: {
       ControlType: "Radio",
       data: {
@@ -1069,7 +1102,7 @@ const _hoisted_1$r = {
   class: "item_require"
 };
 const _hoisted_2$k = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
-const _hoisted_3$7 = { class: "keyValueSelect" };
+const _hoisted_3$f = { class: "keyValueSelect" };
 const _hoisted_4$4 = { class: "keyValueInput" };
 const _hoisted_5$2 = { class: "inputItem" };
 const _hoisted_6$2 = /* @__PURE__ */ createElementVNode("span", null, "\u6587\u672C\uFF1A", -1);
@@ -1123,7 +1156,7 @@ function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
           class: "starfish-keyValueItem",
           key: index
         }, [
-          createElementVNode("div", _hoisted_3$7, [
+          createElementVNode("div", _hoisted_3$f, [
             createVNode(_component_el_checkbox, {
               modelValue: items.select,
               "onUpdate:modelValue": ($event) => items.select = $event,
@@ -1303,7 +1336,7 @@ const _hoisted_1$q = {
   class: "item_require"
 };
 const _hoisted_2$j = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
-const _hoisted_3$6 = { class: "keyValueSelect" };
+const _hoisted_3$e = { class: "keyValueSelect" };
 const _hoisted_4$3 = { class: "keyValueInput" };
 const _hoisted_5$1 = { class: "inputItem" };
 const _hoisted_6$1 = /* @__PURE__ */ createElementVNode("span", null, "\u6587\u672C\uFF1A", -1);
@@ -1357,7 +1390,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
           class: "starfish-keyValueItem",
           key: index
         }, [
-          createElementVNode("div", _hoisted_3$6, [
+          createElementVNode("div", _hoisted_3$e, [
             createVNode(_component_el_checkbox, {
               modelValue: items.select,
               "onUpdate:modelValue": ($event) => items.select = $event,
@@ -1497,7 +1530,7 @@ const _hoisted_1$o = {
   class: "item_require"
 };
 const _hoisted_2$i = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
-const _hoisted_3$5 = /* @__PURE__ */ createTextVNode(" \u65B0\u5EFA\u52A8\u4F5C+ ");
+const _hoisted_3$d = /* @__PURE__ */ createTextVNode(" \u65B0\u5EFA\u52A8\u4F5C+ ");
 function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_option = ElOption;
@@ -1654,7 +1687,7 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
             size: _ctx.size
           }, {
             default: withCtx(() => [
-              _hoisted_3$5
+              _hoisted_3$d
             ]),
             _: 1
           }, 8, ["size"])
@@ -1803,7 +1836,7 @@ const _sfc_main$m = defineComponent({
 });
 const _hoisted_1$m = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
 const _hoisted_2$h = /* @__PURE__ */ createElementVNode("i", { class: "iconfontui icon-bars handle" }, null, -1);
-const _hoisted_3$4 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0\u9762\u677F");
+const _hoisted_3$c = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0\u9762\u677F");
 function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_col = ElCol;
@@ -1908,7 +1941,7 @@ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
             size: "default"
           }, {
             default: withCtx(() => [
-              _hoisted_3$4
+              _hoisted_3$c
             ]),
             _: 1
           }, 8, ["onClick"])
@@ -1959,7 +1992,7 @@ const _hoisted_2$g = {
   key: 0,
   class: "item_require"
 };
-const _hoisted_3$3 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$b = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
 const _hoisted_4$2 = { class: "control" };
 function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
@@ -1979,7 +2012,7 @@ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
         placement: "top"
       }, {
         default: withCtx(() => [
-          _hoisted_3$3
+          _hoisted_3$b
         ]),
         _: 1
       }, 8, ["content"])) : createCommentVNode("", true)
@@ -2033,6 +2066,7 @@ const _hoisted_1$k = {
   class: "item_require"
 };
 const _hoisted_2$f = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$a = { key: 0 };
 function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_checkbox = ElCheckbox;
@@ -2063,8 +2097,8 @@ function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
       class: "control",
       style: normalizeStyle({ marginLeft: _ctx.labelalign != "top" ? _ctx.labelWidth + "px" : "" })
     }, [
-      !_ctx.drag && _ctx.data[_ctx.item.data.fieldName] ? (openBlock(), createBlock(_component_el_checkbox_group, {
-        key: 0,
+      !_ctx.drag && _ctx.data[_ctx.item.data.fieldName] && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$a, toDisplayString(_ctx.data[_ctx.item.data.fieldName].join(",") || "--"), 1)) : !_ctx.drag && _ctx.data[_ctx.item.data.fieldName] ? (openBlock(), createBlock(_component_el_checkbox_group, {
+        key: 1,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         class: normalizeClass({ "vertical-group": _ctx.item.data.arrangeMent === "vertical" }),
@@ -2087,7 +2121,7 @@ function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
         _: 1
       }, 8, ["modelValue", "class", "size", "disabled"])) : createCommentVNode("", true),
       _ctx.drag ? (openBlock(), createBlock(_component_el_checkbox_group, {
-        key: 1,
+        key: 2,
         modelValue: _ctx.item.data.itemConfig.value,
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.item.data.itemConfig.value = $event),
         class: normalizeClass({ "vertical-group": _ctx.item.data.arrangeMent === "vertical" }),
@@ -2141,7 +2175,7 @@ const _hoisted_1$j = {
   class: "item_require"
 };
 const _hoisted_2$e = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1));
-const _hoisted_3$2 = { key: 0 };
+const _hoisted_3$9 = { key: 0 };
 const _hoisted_4$1 = { key: 1 };
 function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
@@ -2173,7 +2207,7 @@ function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
       class: "control",
       style: normalizeStyle({ marginLeft: _ctx.labelalign != "top" ? _ctx.labelWidth + "px" : "" })
     }, [
-      _ctx.drag ? (openBlock(), createElementBlock("div", _hoisted_3$2, [
+      _ctx.drag ? (openBlock(), createElementBlock("div", _hoisted_3$9, [
         createVNode(_component_el_input, {
           modelValue: _ctx.item.data.default,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.item.data.default = $event),
@@ -2219,7 +2253,7 @@ const _sfc_main$i = defineComponent({
   nameCn: "\u65E5\u671F",
   icon: "icon-24gl-calendar",
   formConfig: getFormConfig("Date", [
-    { fieldName: "default", component: "Date" },
+    { fieldName: "default", component: "DateTime" },
     { fieldName: "placeholder", component: "Text" },
     { fieldName: "format", component: "Selected" },
     { fieldName: "state", component: "Radio" }
@@ -2243,8 +2277,34 @@ const _sfc_main$i = defineComponent({
       };
       return formatTypeMap[format] || "date";
     };
+    const formatReadonlyDate = (dateValue, format) => {
+      if (!dateValue)
+        return "--";
+      if (typeof dateValue === "string") {
+        return dateValue;
+      }
+      if (dateValue instanceof Date) {
+        const year = dateValue.getFullYear();
+        const month = String(dateValue.getMonth() + 1).padStart(2, "0");
+        const day = String(dateValue.getDate()).padStart(2, "0");
+        const hours = String(dateValue.getHours()).padStart(2, "0");
+        const minutes = String(dateValue.getMinutes()).padStart(2, "0");
+        const seconds = String(dateValue.getSeconds()).padStart(2, "0");
+        const formatMap = {
+          "YYYY": `${year}`,
+          "YYYY-MM": `${year}-${month}`,
+          "YYYY-MM-DD": `${year}-${month}-${day}`,
+          "YYYY-MM-DD HH": `${year}-${month}-${day} ${hours}`,
+          "YYYY-MM-DD HH:mm": `${year}-${month}-${day} ${hours}:${minutes}`,
+          "YYYY-MM-DD HH:mm:ss": `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+        };
+        return formatMap[format] || `${year}-${month}-${day}`;
+      }
+      return String(dateValue);
+    };
     return {
-      getPickerType
+      getPickerType,
+      formatReadonlyDate
     };
   }
 });
@@ -2253,6 +2313,7 @@ const _hoisted_1$i = {
   class: "item_require"
 };
 const _hoisted_2$d = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$8 = { key: 1 };
 function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_date_picker = ElDatePicker;
@@ -2295,8 +2356,8 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
         disabled: _ctx.item.data.state === "disabled",
         readonly: _ctx.item.data.state === "readonly"
       }, null, 8, ["modelValue", "type", "format", "value-format", "placeholder", "size", "disabled", "readonly"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_date_picker, {
-        key: 1,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$8, toDisplayString(_ctx.formatReadonlyDate(_ctx.data[_ctx.item.data.fieldName], _ctx.item.data.format)), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_date_picker, {
+        key: 2,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         width: "240px",
@@ -2420,7 +2481,21 @@ const _sfc_main$g = defineComponent({
   setup(props) {
     const vm = getCurrentInstance();
     useWatch(props);
+    const formatReadonlyNumber = (value, precision) => {
+      if (value === null || value === void 0 || value === "") {
+        return "-";
+      }
+      const numValue = Number(value);
+      if (isNaN(numValue)) {
+        return String(value);
+      }
+      if (precision !== void 0 && precision !== null) {
+        return numValue.toFixed(precision);
+      }
+      return String(numValue);
+    };
     return {
+      formatReadonlyNumber,
       execFunc(type) {
         if (props.item.data.action && props.item.data.action[type]) {
           window.VApp.$Flex.funcExec(props.item.data.action[type], vm.proxy, [
@@ -2436,6 +2511,7 @@ const _hoisted_1$g = {
   class: "item_require"
 };
 const _hoisted_2$b = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$7 = { key: 1 };
 function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_input_number = ElInputNumber;
@@ -2479,8 +2555,8 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
         precision: _ctx.item.data.precision,
         disabled: _ctx.item.data.state === "disabled" || _ctx.item.data.state === "readonly"
       }, null, 8, ["modelValue", "controls-position", "size", "precision", "disabled"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_input_number, {
-        key: 1,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(_ctx.formatReadonlyNumber(_ctx.data[_ctx.item.data.fieldName], _ctx.item.data.precision)), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_input_number, {
+        key: 2,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         width: "240px",
@@ -2524,6 +2600,7 @@ const _hoisted_1$f = {
   class: "item_require"
 };
 const _hoisted_2$a = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$6 = { key: 0 };
 function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_radio = ElRadio;
@@ -2558,8 +2635,8 @@ function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
       class: "control",
       style: normalizeStyle({ marginLeft: _ctx.labelalign != "top" ? _ctx.labelWidth + "px" : "" })
     }, [
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_radio_group, {
-        key: 0,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$6, toDisplayString(_ctx.data[_ctx.item.data.fieldName] || "--"), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_radio_group, {
+        key: 1,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         size: _ctx.size,
@@ -2582,7 +2659,7 @@ function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
         _: 1
       }, 8, ["modelValue", "size", "class"])) : createCommentVNode("", true),
       _ctx.drag ? (openBlock(), createBlock(_component_el_radio_group, {
-        key: 1,
+        key: 2,
         modelValue: _ctx.item.data.itemConfig.value,
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.item.data.itemConfig.value = $event),
         size: _ctx.size,
@@ -3072,6 +3149,7 @@ const _hoisted_1$e = {
   class: "item_require"
 };
 const _hoisted_2$9 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$5 = { key: 1 };
 function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_option = ElOption;
@@ -3126,8 +3204,8 @@ function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         _: 1
       }, 8, ["modelValue", "placeholder", "size", "disabled"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_select, {
-        key: 1,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$5, toDisplayString(_ctx.data[_ctx.item.data.fieldName] || "--"), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_select, {
+        key: 2,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         width: "240px",
@@ -3191,6 +3269,7 @@ const _hoisted_1$d = {
   class: "item_require"
 };
 const _hoisted_2$8 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$4 = { key: 1 };
 function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_option = ElOption;
@@ -3246,8 +3325,8 @@ function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         _: 1
       }, 8, ["modelValue", "placeholder", "disabled", "size"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_select, {
-        key: 1,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$4, toDisplayString(_ctx.data[_ctx.item.data.fieldName].join(",") || "--"), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_select, {
+        key: 2,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
         width: "240px",
@@ -3309,7 +3388,7 @@ const _hoisted_1$c = {
   class: "item_require"
 };
 const _hoisted_2$7 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
-const _hoisted_3$1 = /* @__PURE__ */ createTextVNode("\u5DF2\u8BBE\u7F6E");
+const _hoisted_3$3 = /* @__PURE__ */ createTextVNode("\u5DF2\u8BBE\u7F6E");
 const _hoisted_4 = /* @__PURE__ */ createTextVNode("\u672A\u8BBE\u7F6E");
 const _hoisted_5 = /* @__PURE__ */ createTextVNode("\u666E\u901A\u8BBE\u7F6E");
 const _hoisted_6 = /* @__PURE__ */ createTextVNode("\u9AD8\u7EA7\u8BBE\u7F6E");
@@ -3351,7 +3430,7 @@ function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
         size: _ctx.size
       }, {
         default: withCtx(() => [
-          _hoisted_3$1
+          _hoisted_3$3
         ]),
         _: 1
       }, 8, ["size"])) : (openBlock(), createBlock(_component_el_button, {
@@ -3576,7 +3655,9 @@ const _sfc_main$9 = defineComponent({
     { fieldName: "placeholder", component: "Text" },
     { fieldName: "maxLength", component: "InputNumber" },
     { fieldName: "minLength", component: "InputNumber" },
-    { fieldName: "state", component: "Radio" }
+    { fieldName: "state", component: "Radio" },
+    { fieldName: "align", component: "Radio" },
+    { fieldName: "rule", component: "Rule" }
   ]),
   actionType: ["onChange", "onFocus", "onBlur"],
   props: {
@@ -3601,6 +3682,7 @@ const _hoisted_1$9 = {
   class: "item_require"
 };
 const _hoisted_2$4 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$2 = { key: 1 };
 function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_input = ElInput;
@@ -3638,30 +3720,32 @@ function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
         key: 0,
         modelValue: _ctx.item.data.default,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.item.data.default = $event),
-        width: "240px",
+        width: "200px",
         placeholder: _ctx.item.data.placeholder,
         size: _ctx.size,
         clearable: "",
         disabled: _ctx.item.data.state === "disabled",
         readonly: _ctx.item.data.state === "readonly",
         maxlength: _ctx.item.data.maxLength,
-        minlength: _ctx.item.data.minLength
-      }, null, 8, ["modelValue", "placeholder", "size", "disabled", "readonly", "maxlength", "minlength"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_input, {
-        key: 1,
+        minlength: _ctx.item.data.minLength,
+        class: normalizeClass("input-" + _ctx.item.data.align)
+      }, null, 8, ["modelValue", "placeholder", "size", "disabled", "readonly", "maxlength", "minlength", "class"])) : createCommentVNode("", true),
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$2, toDisplayString(_ctx.data[_ctx.item.data.fieldName] || "--"), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_input, {
+        key: 2,
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
-        width: "240px",
+        width: "200px",
         placeholder: _ctx.item.data.placeholder,
         size: _ctx.size,
         disabled: _ctx.item.data.state === "disabled",
         readonly: _ctx.item.data.state === "readonly",
         maxlength: _ctx.item.data.maxLength,
         minlength: _ctx.item.data.minLength,
+        class: normalizeClass("input-" + _ctx.item.data.align),
         clearable: "",
         onFocus: _cache[2] || (_cache[2] = ($event) => _ctx.execFunc("onFocus")),
         onBlur: _cache[3] || (_cache[3] = ($event) => _ctx.execFunc("onBlur"))
-      }, null, 8, ["modelValue", "placeholder", "size", "disabled", "readonly", "maxlength", "minlength"])) : createCommentVNode("", true)
+      }, null, 8, ["modelValue", "placeholder", "size", "disabled", "readonly", "maxlength", "minlength", "class"])) : createCommentVNode("", true)
     ], 4)
   ], 2);
 }
@@ -3708,6 +3792,7 @@ const _hoisted_1$8 = {
   class: "item_require"
 };
 const _hoisted_2$3 = /* @__PURE__ */ createElementVNode("span", { class: "tip iconfontui icon-tishi" }, null, -1);
+const _hoisted_3$1 = { key: 1 };
 function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_tooltip = ElTooltip;
   const _component_el_input = ElInput;
@@ -3754,8 +3839,8 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
         autosize: _ctx.item.data.autoHeight,
         size: _ctx.size
       }, null, 8, ["modelValue", "placeholder", "disabled", "readonly", "maxlength", "minlength", "autosize", "size"])) : createCommentVNode("", true),
-      !_ctx.drag ? (openBlock(), createBlock(_component_el_input, {
-        key: 1,
+      !_ctx.drag && _ctx.item.data.state === "readonly" ? (openBlock(), createElementBlock("span", _hoisted_3$1, toDisplayString(_ctx.data[_ctx.item.data.fieldName] || "--"), 1)) : !_ctx.drag ? (openBlock(), createBlock(_component_el_input, {
+        key: 2,
         type: "textarea",
         modelValue: _ctx.data[_ctx.item.data.fieldName],
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.data[_ctx.item.data.fieldName] = $event),
@@ -5181,7 +5266,7 @@ Object.keys(files).forEach((fileName) => {
   }
 });
 const RichText = defineAsyncComponent({
-  loader: () => import('./index-1246b8e1.mjs'),
+  loader: () => import('./index-015ed509.mjs'),
   loadingComponent: Loading
 });
 RichText.ControlType = "RichText";
@@ -5190,7 +5275,7 @@ RichText.icon = "icon-textEdit";
 RichText.formConfig = getFormConfig("RichText");
 utilFuns[RichText.ControlType] = RichText;
 const jsonEditor = defineAsyncComponent({
-  loader: () => import('./index-4830f3c2.mjs'),
+  loader: () => import('./index-115b67c5.mjs'),
   loadingComponent: Loading
 });
 jsonEditor.ControlType = "JsonEditor";
@@ -5200,14 +5285,14 @@ jsonEditor.formConfig = getFormConfig("JsonEditor", [{ fieldName: "default", com
 jsonEditor.rule = _.getJsonValidate();
 utilFuns[jsonEditor.ControlType] = jsonEditor;
 const formAction = defineAsyncComponent({
-  loader: () => import('./formAction-f8e6d2c0.mjs'),
+  loader: () => import('./formAction-922332c1.mjs'),
   loadingComponent: Loading
 });
 formAction.ControlType = "FormAction";
 formAction.isHide = true;
 utilFuns[formAction.ControlType] = formAction;
 const Rule = defineAsyncComponent({
-  loader: () => import('./index-de1a59fb.mjs'),
+  loader: () => import('./index-afbcc030.mjs'),
   loadingComponent: Loading
 });
 Rule.ControlType = "Rule";
@@ -5216,7 +5301,7 @@ utilFuns[Rule.ControlType] = Rule;
 const install = (app) => {
   app.config.globalProperties.$formcomponents = utilFuns;
 };
-const Dynamicform = defineAsyncComponent(() => import('./starfish-form-2cde30c5.mjs'));
+const Dynamicform = defineAsyncComponent(() => import('./starfish-form-9cc90058.mjs'));
 const main = {
   install
 };

package/dist/{starfish-form-2cde30c5.mjs → starfish-form-9cc90058.mjs}

@@ -3,7 +3,7 @@ import 'element-plus/es/components/base/style/css';
 import 'element-plus/es/components/form/style/css';
 import 'element-plus/es/components/form-item/style/css';
 import { defineComponent, getCurrentInstance, ref, onMounted, openBlock, createElementBlock, createVNode, mergeProps, withCtx, Fragment, renderList, createBlock, resolveDynamicComponent, createCommentVNode, toRaw } from 'vue';
-import { _ as _export_sfc } from './main-5c7bd9ea.mjs';
+import { _ as _export_sfc } from './main-c0754020.mjs';
 import 'element-plus/es/components/icon/style/css';
 import 'element-plus/es/components/input/style/css';
 import 'element-plus/es/components/checkbox/style/css';

package/dist/starfish-form.mjs

@@ -1,4 +1,4 @@
-export { D as Dynamicform, m as default } from './main-5c7bd9ea.mjs';
+export { D as Dynamicform, m as default } from './main-c0754020.mjs';
 import 'vue';
 import 'element-plus/es';
 import 'element-plus/es/components/base/style/css';

package/dist/style.css

@@ -84,6 +84,21 @@
   flex-direction: column;
   align-items: flex-start;
 }
+.starfish-editor .starfish-formitem.starfish-vertical .control .input-left .el-input__inner,
+.starfish-form .starfish-formitem.starfish-vertical .control .input-left .el-input__inner,
+.starfish-dynamicform .starfish-formitem.starfish-vertical .control .input-left .el-input__inner {
+  text-align: left;
+}
+.starfish-editor .starfish-formitem.starfish-vertical .control .input-right .el-input__inner,
+.starfish-form .starfish-formitem.starfish-vertical .control .input-right .el-input__inner,
+.starfish-dynamicform .starfish-formitem.starfish-vertical .control .input-right .el-input__inner {
+  text-align: right;
+}
+.starfish-editor .starfish-formitem.starfish-vertical .control .input-center .el-input__inner,
+.starfish-form .starfish-formitem.starfish-vertical .control .input-center .el-input__inner,
+.starfish-dynamicform .starfish-formitem.starfish-vertical .control .input-center .el-input__inner {
+  text-align: center;
+}
 .starfish-editor .starfish-formitem.starfish-vertical .control .el-input.el-input--default.el-input--suffix,
 .starfish-editor .starfish-formitem.starfish-vertical .control .el-select.el-select--default,
 .starfish-editor .starfish-formitem.starfish-vertical .control .el-input-number.el-input-number--default,
@@ -96,12 +111,12 @@
 .starfish-dynamicform .starfish-formitem.starfish-vertical .control .el-select.el-select--default,
 .starfish-dynamicform .starfish-formitem.starfish-vertical .control .el-input-number.el-input-number--default,
 .starfish-dynamicform .starfish-formitem.starfish-vertical .control .el-input.el-input--default.el-date-editor.el-date-editor--date {
-  width: 240px;
+  width: 200px;
 }
 .starfish-editor .starfish-formitem.starfish-vertical .control .el-input__wrapper,
 .starfish-form .starfish-formitem.starfish-vertical .control .el-input__wrapper,
 .starfish-dynamicform .starfish-formitem.starfish-vertical .control .el-input__wrapper {
-  width: 220px;
+  width: 200px;
 }
 .starfish-editor .starfish-formitem.formCover,
 .starfish-form .starfish-formitem.formCover,

package/dist/types/form/src/utils/fieldConfig.d.ts

@@ -27,6 +27,7 @@ export interface fields {
     /**
      * 校验规则
      */
+    rule?: string;
     /**
      * 默认内容
      */
@@ -61,6 +62,7 @@ interface Config {
     fieldName: string;
     component: string;
     label?: string;
+    format?: string;
 }
 interface FormConfigReturn {
     data: () => fields;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "starfish-form-custom",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "main": "dist/starfish-form.mjs",
   "style": "dist/style.css",
   "module": "dist/starfish-form.mjs",

package/src/components/CheckBox/index.vue

@@ -8,7 +8,9 @@
       </el-tooltip>
     </div>
     <div class="control" :style="{marginLeft: labelalign != 'top'?labelWidth + 'px': ''}">
-      <el-checkbox-group v-model="data[item.data.fieldName]" :class="{'vertical-group': item.data.arrangeMent === 'vertical'}" v-if="!drag && data[item.data.fieldName]" :size="size" :disabled="item.data.state === 'disabled' || item.data.state === 'readonly'">
+      <!-- 只读的时候就只展示文本 -->
+      <span v-if="!drag && data[item.data.fieldName] && item.data.state === 'readonly'">{{ data[item.data.fieldName].join(',') || '--' }}</span>
+      <el-checkbox-group v-model="data[item.data.fieldName]" :class="{'vertical-group': item.data.arrangeMent === 'vertical'}" v-else-if="!drag && data[item.data.fieldName]" :size="size" :disabled="item.data.state === 'disabled' || item.data.state === 'readonly'">
         <el-checkbox v-for="(sitem, sindex) in item.data.itemConfig.items" :key="sindex" :label="sitem.value">{{ sitem.label }}</el-checkbox>
       </el-checkbox-group>
       <el-checkbox-group v-model="item.data.itemConfig.value" :class="{'vertical-group': item.data.arrangeMent === 'vertical'}" v-if="drag" :size="size" :disabled="item.data.state === 'disabled' || item.data.state === 'readonly'">

package/src/components/Date/index.vue

@@ -23,6 +23,8 @@
       ></el-date-picker>
       
       <!-- 实际运行时的组件 -->
+      <!-- 只读的时候就展示文字 -->
+      <span v-if="!drag && item.data.state === 'readonly'">{{ formatReadonlyDate(data[item.data.fieldName], item.data.format) }}</span>
       <el-date-picker 
         v-model="data[item.data.fieldName]" 
         width="240px"
@@ -30,7 +32,7 @@
         :format="item.data.format" 
         :value-format="item.data.format" 
         :placeholder="item.data.placeholder" 
-        v-if="!drag" 
+        v-else-if="!drag" 
         :size="size" 
         :disabled="item.data.state === 'disabled'" 
         :readonly="item.data.state === 'readonly'"
@@ -48,7 +50,7 @@
     nameCn: "日期",
     icon: "icon-24gl-calendar",
     formConfig: getFormConfig("Date", [
-      { fieldName: "default", component: "Date" },
+      { fieldName: "default", component: "DateTime" },
       { fieldName: "placeholder", component: "Text" },
       { fieldName: "format", component: "Selected" },
       { fieldName: "state", component: "Radio" },
@@ -73,9 +75,43 @@
         };
         
         return formatTypeMap[format] || 'date';
+      };
+       // 格式化只读日期显示
+      const formatReadonlyDate = (dateValue: any, format: string) => {
+        if (!dateValue) return '--';
+        
+        // 如果已经是格式化好的字符串，直接返回
+        if (typeof dateValue === 'string') {
+          return dateValue;
+        }
+        
+        // 如果是日期对象，进行格式化
+        if (dateValue instanceof Date) {
+          const year = dateValue.getFullYear();
+          const month = String(dateValue.getMonth() + 1).padStart(2, '0');
+          const day = String(dateValue.getDate()).padStart(2, '0');
+          const hours = String(dateValue.getHours()).padStart(2, '0');
+          const minutes = String(dateValue.getMinutes()).padStart(2, '0');
+          const seconds = String(dateValue.getSeconds()).padStart(2, '0');
+          
+          const formatMap: Record<string, string> = {
+            'YYYY': `${year}`,
+            'YYYY-MM': `${year}-${month}`,
+            'YYYY-MM-DD': `${year}-${month}-${day}`,
+            'YYYY-MM-DD HH': `${year}-${month}-${day} ${hours}`,
+            'YYYY-MM-DD HH:mm': `${year}-${month}-${day} ${hours}:${minutes}`,
+            'YYYY-MM-DD HH:mm:ss': `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+          };
+          
+          return formatMap[format] || `${year}-${month}-${day}`;
+        }
+        
+        // 其他情况返回原始值
+        return String(dateValue);
       };
       return {
-        getPickerType
+        getPickerType,
+        formatReadonlyDate
       };
     },
   });