hs-admin-ui 5.8.0 → 5.8.2

package/dist/baseFormConfig-mWvkOXBw.mjs

@@ -0,0 +1,712 @@
+import { ref } from "vue";
+let parentFormData = ref({
+  size: "default",
+  rules: "",
+  //  表单校验规则
+  labelWidth: "80",
+  // 表单域标签的宽度
+  hideRequiredAsterisk: false,
+  // 是否隐藏必填标识
+  showMessage: true,
+  // 是否显示校验错误信息
+  inlineMessage: false,
+  // 是否以行内展示校验信息
+  disabled: false,
+  // 是否禁用该表单项
+  gutter: 10,
+  // 栅格间隔
+  justify: "start",
+  // flex 布局下的水平排列方式
+  align: "",
+  // flex 布局下的垂直排列方式
+  isSetDictDefaultValue: true,
+  // 是否取字典项的默认值
+  isSupportShortcutKey: true,
+  // 是否支持表单回车快捷功能
+  rowGap: 0,
+  // 行间隔
+  columnGap: 0,
+  // 列间隔
+  readonly: false
+  // 表单项只读
+});
+let parentFormConfig = ref([
+  { prop: "rules", label: "表单验证规则", type: "textarea", el: "hs-input" },
+  {
+    prop: "labelWidth",
+    label: "标签的宽度",
+    tooltip: '标签的长度，例如 "50px"。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。',
+    el: "hs-input"
+  },
+  {
+    prop: "hideRequiredAsterisk",
+    label: "是否隐藏必填标识",
+    tooltip: "是否隐藏必填字段标签旁边的红色星号。",
+    el: "hs-switch"
+  },
+  {
+    prop: "showMessage",
+    label: "是否显示校验错误信息",
+    tooltip: "是否显示校验错误信息",
+    el: "hs-switch"
+  },
+  {
+    prop: "size",
+    label: "表单项组件的尺寸",
+    el: "hs-select",
+    tooltip: "用于控制该表单内组件的尺寸",
+    op: [
+      { label: " 大尺寸", value: "large" },
+      { label: "默认尺寸", value: "default" },
+      { label: "小尺寸", value: "small" }
+    ],
+    cel: "hs-option"
+  },
+  {
+    prop: "disabled",
+    label: "是否禁用表单项",
+    tooltip: "是否禁用该表单内的所有组件。 如果设置为 true, 它将覆盖内部组件的 disabled 属性",
+    el: "hs-switch"
+  },
+  {
+    label: "是否取字典项的默认值",
+    prop: "isSetDictDefaultValue",
+    el: "hs-switch",
+    tooltip: "当校验有失败结果时，滚动到第一个失败的表单项目 可通过 scrollIntoView 配置"
+  },
+  {
+    label: "是否支持表单回车快捷功能",
+    prop: "isSupportShortcutKey",
+    el: "hs-switch"
+  },
+  {
+    label: "行间隔",
+    prop: "rowGap",
+    type: "number",
+    el: "hs-input"
+  },
+  {
+    label: "列间隔",
+    prop: "columnGap",
+    type: "number",
+    el: "hs-input"
+  },
+  {
+    label: "区域背景色",
+    prop: "bg",
+    el: "hs-color-picker"
+  },
+  {
+    label: "表单项只读",
+    prop: "readonly",
+    el: "hs-switch"
+  }
+]);
+const configElList = ref([
+  { label: "输入框", value: "hs-input" },
+  { label: "选择器", value: "hs-select" },
+  { label: "开关", value: "hs-switch" },
+  { label: "日期选择器", value: "hs-date-picker" },
+  { label: "按钮", value: "hs-button" },
+  { label: "自动补全", value: "hs-autocomplete" },
+  { label: "上传", value: "hs-upload" },
+  { label: "多选框", value: "hs-checkbox" },
+  { label: "单选框", value: "hs-radio" },
+  { label: "数字输入框", value: "hs-input-number" },
+  { label: "级联面板", value: "hs-cascader-panel" },
+  { label: "树形选择", value: "hs-tree-select" },
+  { label: "级联选择器", value: "hs-cascader" }
+]);
+const baseType = ref([
+  { label: "string", value: "string" },
+  { label: "number", value: "number" },
+  { label: "boolean", value: "boolean" }
+]);
+const complexType = ref([
+  { label: "Array", value: "Array" },
+  { label: "Object", value: "Object" }
+]);
+const compConfig = {
+  "hs-input": "hs-config-input",
+  "hs-select": "hs-config-select",
+  "hs-switch": "hs-config-switch",
+  "hs-date-picker": "hs-config-date-picker",
+  "hs-button": "hs-config-button",
+  "hs-autocomplete": "hs-config-autocomplete",
+  "hs-upload": "hs-config-upload",
+  "hs-checkbox": "hs-config-checkbox",
+  "hs-radio": "hs-config-radio",
+  "hs-input-number": "hs-config-input-number",
+  "hs-cascader-panel": "hs-config-cascader-panel",
+  "hs-tree-select": "hs-config-tree-select",
+  "hs-cascader": "hs-config-cascader"
+};
+let formItemConfig = ref({
+  id: "",
+  // 配置绑定的值
+  data: {
+    baseData: {
+      label: "参数名称",
+      prop: "",
+      el: "",
+      // 'hs-input',
+      isSlot: false,
+      isApply: true,
+      isShow: true
+    },
+    elementItem: [
+      {
+        baseData: {
+          label: "参数名称",
+          prop: "",
+          el: "",
+          // 'hs-input',
+          isSlot: false,
+          isApply: true,
+          isShow: true
+        },
+        elData: {}
+      }
+    ],
+    layoutData: {
+      rowSpan: 1,
+      colSpan: 1,
+      labelBg: "#FFFFFF",
+      labelColor: "#000000"
+    }
+  },
+  baseConfig: {
+    visible: true
+  },
+  // 配置
+  // baseConfig: {
+  // 	title: {
+  // 		subTitle: '表单项属性',
+  // 	},
+  // 	visible: true,
+  // 	list: [
+  // 		{
+  // 			prop: 'label',
+  // 			label: '参数名称',
+  // 			el: 'hs-input',
+  // 			required: false,
+  // 		},
+  // 		{
+  // 			prop: 'prop',
+  // 			label: '查询参数',
+  // 			el: 'hs-input',
+  // 			slotValue: 'prop',
+  // 		},
+  // 		{
+  // 			prop: 'el',
+  // 			label: '组件类型',
+  // 			clearable: false,
+  // 			tooltip: '下拉选择组件类型，组件类型取自配置文件',
+  // 			el: 'hs-select',
+  // 			cel: 'hs-option',
+  // 			op: configElList.value,
+  // 		},
+  // 		{
+  // 			prop: 'baseType',
+  // 			label: '基础类型',
+  // 			clearable: false,
+  // 			tooltip: '基础类型',
+  // 			el: 'hs-select',
+  // 			cel: 'hs-option',
+  // 			op: baseType.value,
+  // 		},
+  // 		{
+  // 			prop: 'complexType',
+  // 			label: '复杂类型',
+  // 			clearable: true,
+  // 			tooltip: '复杂类型',
+  // 			el: 'hs-select',
+  // 			cel: 'hs-option',
+  // 			op: complexType.value,
+  // 		},
+  // 		{
+  // 			prop: 'isSlot',
+  // 			label: '是否自定义插槽',
+  // 			el: 'hs-switch',
+  // 			tooltip: '下拉选择，自定义模板，选择的名称就是模板名称',
+  // 		},
+  // 		{
+  // 			prop: 'isApply',
+  // 			label: '是否启用',
+  // 			tooltip: '是否启用该表单项',
+  // 			el: 'hs-switch',
+  // 		},
+  // 		{
+  // 			prop: 'isShow',
+  // 			label: '是否显示该表单项',
+  // 			el: 'hs-switch',
+  // 		},
+  // 		{
+  // 			prop: 'tooltip',
+  // 			label: 'tooltip',
+  // 			el: 'hs-input',
+  // 		},
+  // 	],
+  // },
+  // baseConfig2: {
+  // 	title: {
+  // 		subTitle: '表单项属性',
+  // 	},
+  // 	visible: true,
+  // 	list: [
+  // 		// {
+  // 		// 	prop: 'label',
+  // 		// 	label: '参数名称',
+  // 		// 	el: 'hs-input',
+  // 		// 	required: false,
+  // 		// },
+  // 		// {
+  // 		// 	prop: 'prop',
+  // 		// 	label: '查询参数',
+  // 		// 	el: 'hs-input',
+  // 		// },
+  // 		{
+  // 			prop: 'el',
+  // 			label: '组件类型',
+  // 			clearable: false,
+  // 			tooltip: '下拉选择组件类型，组件类型取自配置文件',
+  // 			el: 'hs-select',
+  // 			cel: 'hs-option',
+  // 			op: configElList.value,
+  // 		},
+  // 		{
+  // 			prop: 'isSlot',
+  // 			label: '是否自定义插槽',
+  // 			el: 'hs-switch',
+  // 			tooltip: '下拉选择，自定义模板，选择的名称就是模板名称',
+  // 		},
+  // 		{
+  // 			prop: 'isApply',
+  // 			label: '是否启用',
+  // 			tooltip: '是否启用该表单项',
+  // 			el: 'hs-switch',
+  // 		},
+  // 		{
+  // 			prop: 'isShow',
+  // 			label: '是否显示该表单项',
+  // 			el: 'hs-switch',
+  // 		},
+  // 	],
+  // },
+  elConfig: {
+    title: {
+      subTitle: "元素项属性"
+    },
+    visible: true,
+    list: []
+  },
+  layoutConfig: {
+    title: {
+      subTitle: "布局配置"
+    },
+    visible: false,
+    list: [
+      {
+        prop: "rowSpan",
+        label: "行数",
+        tooltip: "栅格占据的行数",
+        type: "number",
+        el: "hs-input"
+      },
+      {
+        prop: "colSpan",
+        label: "列数",
+        tooltip: "栅格占据的列数",
+        type: "number",
+        el: "hs-input"
+      },
+      {
+        prop: "labelBg",
+        label: "标签背景色",
+        tooltip: "标签背景色",
+        type: "string",
+        el: "hs-color-picker"
+      },
+      {
+        prop: "labelColor",
+        label: "标签字体颜色",
+        tooltip: "标签字体颜色",
+        type: "string",
+        el: "hs-color-picker"
+      }
+    ]
+  },
+  defaultConfig: {
+    title: {
+      subTitle: "数据配置"
+    },
+    visible: false,
+    list: []
+  }
+});
+let baseConfig = ref({
+  title: {
+    subTitle: "表单项属性"
+  },
+  visible: true,
+  list: [
+    {
+      prop: "label",
+      label: "参数名称",
+      el: "hs-input",
+      required: false
+    },
+    {
+      prop: "prop",
+      label: "查询参数",
+      el: "hs-input",
+      slotValue: "prop"
+    },
+    {
+      prop: "el",
+      label: "组件类型",
+      clearable: false,
+      tooltip: "下拉选择组件类型，组件类型取自配置文件",
+      el: "hs-select",
+      cel: "hs-option",
+      op: configElList.value
+    },
+    {
+      prop: "baseType",
+      label: "基础类型",
+      clearable: false,
+      tooltip: "基础类型",
+      el: "hs-select",
+      cel: "hs-option",
+      op: baseType.value
+    },
+    {
+      prop: "complexType",
+      label: "复杂类型",
+      clearable: true,
+      tooltip: "复杂类型",
+      el: "hs-select",
+      cel: "hs-option",
+      op: complexType.value
+    },
+    {
+      prop: "isSlot",
+      label: "是否自定义插槽",
+      el: "hs-switch",
+      tooltip: "下拉选择，自定义模板，选择的名称就是模板名称"
+    },
+    {
+      prop: "isApply",
+      label: "是否启用",
+      tooltip: "是否启用该表单项",
+      el: "hs-switch"
+    },
+    {
+      prop: "isShow",
+      label: "是否显示该表单项",
+      el: "hs-switch"
+    },
+    {
+      prop: "tooltip",
+      label: "tooltip",
+      el: "hs-input"
+    }
+  ]
+});
+let baseConfig2 = ref({
+  title: {
+    subTitle: "表单项属性"
+  },
+  visible: true,
+  list: [
+    // {
+    // 	prop: 'label',
+    // 	label: '参数名称',
+    // 	el: 'hs-input',
+    // 	required: false,
+    // },
+    // {
+    // 	prop: 'prop',
+    // 	label: '查询参数',
+    // 	el: 'hs-input',
+    // },
+    {
+      prop: "el",
+      label: "组件类型",
+      clearable: false,
+      tooltip: "下拉选择组件类型，组件类型取自配置文件",
+      el: "hs-select",
+      cel: "hs-option",
+      op: configElList.value
+    },
+    {
+      prop: "isSlot",
+      label: "是否自定义插槽",
+      el: "hs-switch",
+      tooltip: "下拉选择，自定义模板，选择的名称就是模板名称"
+    },
+    {
+      prop: "isApply",
+      label: "是否启用",
+      tooltip: "是否启用该表单项",
+      el: "hs-switch"
+    },
+    {
+      prop: "isShow",
+      label: "是否显示该表单项",
+      el: "hs-switch"
+    }
+  ]
+});
+let emptyFormItemData = ref({
+  id: "",
+  // 配置绑定的值
+  data: {
+    layoutData: {},
+    defaultData: {},
+    elementItem: [
+      {
+        baseData: {},
+        elData: {}
+      }
+    ]
+  },
+  // 配置
+  baseConfig: {
+    title: {
+      subTitle: "表单项属性"
+    },
+    visible: true,
+    list: []
+  },
+  // [],
+  elConfig: {
+    title: {
+      subTitle: "元素项属性"
+    },
+    visible: true,
+    list: []
+  },
+  layoutConfig: {
+    title: {
+      subTitle: "布局配置"
+    },
+    visible: false,
+    list: []
+  },
+  defaultConfig: {
+    title: {
+      subTitle: "默认数据配置"
+    },
+    visible: false,
+    list: []
+  }
+});
+let formTitleConfig = ref({
+  code: {
+    visible: false,
+    subTitle: "表单配置代码",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  form: {
+    visible: true,
+    subTitle: "表单项配置",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  formItem: {
+    visible: true,
+    subTitle: "表单元素配置项集合",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  formExample: {
+    visible: false,
+    subTitle: "表单配置示例",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  component: {
+    visible: true,
+    subTitle: "组件配置",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  slot: {
+    visible: true,
+    subTitle: "插槽配置",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  base: {
+    visible: true,
+    subTitle: "基础表单项配置",
+    class: "font-bold my-3",
+    iconSize: 20
+  },
+  baseForm: {
+    visible: true,
+    subTitle: "基础表单配置",
+    class: "font-bold my-3",
+    iconSize: 20
+  }
+});
+const formBaseRule = {
+  label: [{ required: false, message: "请输入参数名称" }],
+  prop: [{ required: false, message: "请输入查询参数" }],
+  el: [{ required: true, message: "请选择组件类型" }],
+  baseType: [{ required: true, message: "请选择基础类型" }]
+};
+const componentList = ref([
+  { label: "输入框", value: "hs-input" },
+  { label: "选择器", value: "hs-select" },
+  { label: "开关", value: "hs-switch" },
+  { label: "日期选择器", value: "hs-date-picker" },
+  { label: "按钮", value: "hs-button" },
+  { label: "自动补全", value: "hs-autocomplete" },
+  { label: "上传", value: "hs-upload" },
+  { label: "多选框", value: "hs-checkbox" },
+  { label: "单选框", value: "hs-radio" },
+  { label: "数字输入框", value: "hs-input-number" },
+  { label: "级联选面板", value: "hs-cascader-panel" },
+  { label: "树形选择", value: "hs-tree-select" },
+  { label: "级联选择器", value: "hs-cascader" }
+]);
+const parentComponentConfig = ref([{ prop: "name", label: "选择组件", el: "hs-select", op: componentList.value, cel: "hs-option" }]);
+const parentSlotConfig = ref([{ prop: "name", label: "插槽名称", el: "hs-input" }]);
+const parentBaseConfig = ref([
+  { prop: "label", label: "表单标题", el: "hs-input" },
+  { prop: "isShowLabel", label: "是否显示表单标题", el: "hs-switch" },
+  { prop: "fieldID", label: "字段标识", el: "hs-input" },
+  { prop: "grid", label: "栅格", el: "hs-input", type: "number" }
+]);
+const parentBaseFormConfig = ref([
+  {
+    prop: "labelWidth",
+    label: "标签的宽度",
+    tooltip: '标签的长度，例如 "50px"。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。',
+    el: "hs-input"
+  },
+  {
+    prop: "labelPosition",
+    label: "表单域标签的位置",
+    el: "hs-select",
+    tooltip: "表单域标签的位置， 当设置为 left 或 right 时，则也需要设置 label-width 属性",
+    required: false,
+    multiple: false,
+    op: [
+      { label: " 靠左", value: "left" },
+      { label: "靠右", value: "right" },
+      { label: "靠上", value: "top" }
+    ],
+    cel: "hs-option"
+  },
+  {
+    prop: "size",
+    label: "表单项组件的尺寸",
+    el: "hs-select",
+    tooltip: "用于控制该表单内组件的尺寸",
+    op: [
+      { label: " 大尺寸", value: "large" },
+      { label: "默认尺寸", value: "default" },
+      { label: "小尺寸", value: "small" }
+    ],
+    cel: "hs-option"
+  },
+  {
+    prop: "labelSuffix",
+    label: "表单域标签的后缀",
+    tooltip: "表单域标签的后缀",
+    el: "hs-input"
+  },
+  {
+    prop: "requireAsteriskPosition",
+    label: "必填标识的位置",
+    tooltip: "星号的位置。",
+    el: "hs-select",
+    op: [
+      { label: " 靠左", value: "left" },
+      { label: "靠右", value: "right" }
+    ],
+    cel: "hs-option"
+  },
+  {
+    prop: "statusIcon",
+    label: "是否框中显示校验反馈图标",
+    tooltip: "是否在输入框中显示校验结果反馈图标",
+    el: "hs-switch"
+  },
+  {
+    prop: "validateOnRuleChange",
+    label: "是否触发第一次验证",
+    tooltip: "是否在 rules 属性改变后立即触发一次验证",
+    el: "hs-switch"
+  },
+  {
+    prop: "scrollToError",
+    label: "滚动至首个校验失败的表单",
+    tooltip: "当校验失败时，滚动到第一个错误表单项",
+    el: "hs-switch"
+  },
+  { prop: "submitUrl", label: "提交表单的请求api", el: "hs-input" },
+  {
+    prop: "method",
+    label: "请求方式",
+    type: "",
+    op: [
+      { label: " POST", value: "post" },
+      { label: "GET", value: "get" },
+      { label: "DELETE", value: "delete" },
+      { label: "PUT", value: "put" }
+    ],
+    el: "hs-select",
+    cel: "hs-option"
+  },
+  {
+    prop: "proxy",
+    label: "系统代理",
+    type: "",
+    el: "hs-input"
+  },
+  {
+    prop: "action_name",
+    label: "操作名称",
+    type: "",
+    el: "hs-input"
+  },
+  {
+    prop: "disabled",
+    label: "是否禁用该表单",
+    type: "",
+    el: "hs-switch"
+  }
+]);
+const formItemChildConfig = {
+  baseData: {
+    label: "参数名称",
+    prop: "",
+    el: "",
+    // 'hs-input',
+    isSlot: false,
+    isApply: true,
+    isShow: true
+  },
+  elData: {}
+};
+export {
+  baseConfig2 as a,
+  baseConfig as b,
+  compConfig as c,
+  formBaseRule as d,
+  emptyFormItemData as e,
+  formItemChildConfig as f,
+  formItemConfig as g,
+  formTitleConfig as h,
+  parentBaseConfig as i,
+  parentFormConfig as j,
+  parentComponentConfig as k,
+  parentSlotConfig as l,
+  parentFormData as m,
+  parentBaseFormConfig as p
+};