super-page-designer 0.0.2-tmp8 → 1.0.1

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-base.vue.js

@@ -0,0 +1,334 @@
+"use strict";
+const vue = require("vue");
+const assemblysConfig = require("../../../../utils/assemblys-config.js");
+require("@element-plus/icons-vue");
+const commonAttrSize_vue_vue_type_script_setup_true_lang = require("../../common/common-attr-size.vue.js");
+;/* empty css                                     */
+require("@element-plus/icons");
+require("agilebuilder-ui/src/utils/request");
+const dataoriginInputTable_vue_vue_type_script_setup_true_lang = require("../../form/common/dataorigin-input-table.vue.js");
+const _hoisted_1 = { style: { "padding": "8px 0px 0px 0px" } };
+const _hoisted_2 = { style: { "padding": "8px 0px 0px 0px" } };
+const _hoisted_3 = { key: 2 };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "barcode-attr-base",
+  props: {
+    configure: Object,
+    default: () => ({ props: {} })
+  },
+  setup(__props) {
+    const openCollapseItems = vue.ref("");
+    const dataRule = vue.ref([]);
+    vue.ref(false);
+    return (_ctx, _cache) => {
+      const _component_el_option = vue.resolveComponent("el-option");
+      const _component_el_select = vue.resolveComponent("el-select");
+      const _component_el_form_item = vue.resolveComponent("el-form-item");
+      const _component_el_input = vue.resolveComponent("el-input");
+      const _component_el_radio = vue.resolveComponent("el-radio");
+      const _component_el_radio_group = vue.resolveComponent("el-radio-group");
+      const _component_el_collapse_item = vue.resolveComponent("el-collapse-item");
+      const _component_el_collapse = vue.resolveComponent("el-collapse");
+      const _component_el_form = vue.resolveComponent("el-form");
+      return vue.openBlock(), vue.createBlock(_component_el_form, {
+        "label-width": "80px",
+        size: "small"
+      }, {
+        default: vue.withCtx(() => [
+          vue.createVNode(_component_el_collapse, {
+            modelValue: openCollapseItems.value,
+            "onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => openCollapseItems.value = $event),
+            style: { "margin-top": "6px" }
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_el_collapse_item, {
+                title: "基本",
+                name: "base",
+                class: "amb-design-attr-group-header"
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_1, [
+                    vue.createVNode(_component_el_form_item, {
+                      label: "组件类型",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_select, {
+                          modelValue: __props.configure.name,
+                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.configure.name = $event),
+                          placeholder: "请选择"
+                        }, {
+                          default: vue.withCtx(() => [
+                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(assemblysConfig.getFormComponentOptions)(), (item) => {
+                              return vue.openBlock(), vue.createBlock(_component_el_option, {
+                                key: item.name,
+                                label: item.label,
+                                value: item.name
+                              }, null, 8, ["label", "value"]);
+                            }), 128))
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "组件名",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_input, {
+                          modelValue: __props.configure.props.base.name,
+                          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => __props.configure.props.base.name = $event),
+                          placeholder: "请输入"
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "条码类型",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_radio_group, {
+                          modelValue: __props.configure.props.base.type,
+                          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => __props.configure.props.base.type = $event),
+                          class: "ml-4"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_radio, { value: "br-code" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("条形码")
+                              ]),
+                              _: 1
+                            }),
+                            vue.createVNode(_component_el_radio, { value: "QR-code" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("二维码")
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "条形码格式",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_select, {
+                          modelValue: __props.configure.props.base.format,
+                          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => __props.configure.props.base.format = $event),
+                          placeholder: "请选择"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_option, {
+                              label: "默认",
+                              value: "CODE128"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "CODE128A",
+                              value: "CODE128A"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "CODE128B",
+                              value: "CODE128B"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "CODE128C",
+                              value: "CODE128C"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "CODE39",
+                              value: "CODE39"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "EAN-13",
+                              value: "EAN-13"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "EAN-8",
+                              value: "EAN-8"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "EAN-5",
+                              value: "EAN-5"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "EAN-2",
+                              value: "EAN-2"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "UPC（A）",
+                              value: "UPC（A）"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "ITF",
+                              value: "ITF"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "ITF-14",
+                              value: "ITF-14"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "MSI",
+                              value: "MSI"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "MSI10",
+                              value: "MSI10"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "MSI11",
+                              value: "MSI11"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "MSI1010",
+                              value: "MSI1010"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "MSI1110",
+                              value: "MSI1110"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "Pharmacode",
+                              value: "Pharmacode"
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "状态",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_radio_group, {
+                          modelValue: __props.configure.props.base.state,
+                          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => __props.configure.props.base.state = $event),
+                          class: "ml-4"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_radio, { value: "default" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("普通")
+                              ]),
+                              _: 1
+                            }),
+                            vue.createVNode(_component_el_radio, { value: "hidden" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("隐藏")
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    })
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createVNode(_component_el_collapse_item, {
+                title: "数据",
+                name: "data",
+                class: "amb-design-attr-group-header"
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_2, [
+                    vue.createVNode(_component_el_form_item, {
+                      label: "绑定",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_radio_group, {
+                          modelValue: __props.configure.props.base.way,
+                          "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => __props.configure.props.base.way = $event),
+                          class: "ml-4"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_radio, { value: "data" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("绑定变量")
+                              ]),
+                              _: 1
+                            }),
+                            vue.createVNode(_component_el_radio, { value: "regulation" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("绑定规则")
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    __props.configure.props.base.way === "data" ? (vue.openBlock(), vue.createBlock(_component_el_form_item, {
+                      key: 0,
+                      label: "绑定变量",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(dataoriginInputTable_vue_vue_type_script_setup_true_lang, {
+                          modelValue: __props.configure.props.base.bindProp,
+                          "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => __props.configure.props.base.bindProp = $event)
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    })) : vue.createCommentVNode("", true),
+                    __props.configure.props.base.way === "regulation" ? (vue.openBlock(), vue.createBlock(_component_el_form_item, {
+                      key: 1,
+                      label: "绑定规则",
+                      class: "amb-design-attr-item"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(dataoriginInputTable_vue_vue_type_script_setup_true_lang, {
+                          modelValue: __props.configure.props.base.regulation,
+                          "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => __props.configure.props.base.regulation = $event)
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    })) : vue.createCommentVNode("", true),
+                    dataRule.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+                      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(dataRule.value, (item, index) => {
+                        return vue.openBlock(), vue.createBlock(_component_el_form_item, {
+                          key: index,
+                          label: item.name,
+                          class: "amb-design-attr-item"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(dataoriginInputTable_vue_vue_type_script_setup_true_lang, {
+                              modelValue: item.date,
+                              "onUpdate:modelValue": ($event) => item.date = $event
+                            }, null, 8, ["modelValue", "onUpdate:modelValue"])
+                          ]),
+                          _: 2
+                        }, 1032, ["label"]);
+                      }), 128))
+                    ])) : vue.createCommentVNode("", true)
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createVNode(commonAttrSize_vue_vue_type_script_setup_true_lang, {
+                size: __props.configure.props.size
+              }, null, 8, ["size"])
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-base.vue2.js

@@ -0,0 +1,3 @@
+"use strict";
+const barcodeAttrBase_vue_vue_type_script_setup_true_lang = require("./barcode-attr-base.vue.js");
+module.exports = barcodeAttrBase_vue_vue_type_script_setup_true_lang;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-event.vue.js

@@ -0,0 +1,29 @@
+"use strict";
+const vue = require("vue");
+const attrEvent = require("../../form/common/attr-event.vue.js");
+require("../../../../utils/assemblys-config.js");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "barcode-attr-event",
+  props: {
+    configure: Object
+  },
+  setup(__props) {
+    const events = ["click", "remove", "show", "hidden"];
+    return (_ctx, _cache) => {
+      const _component_el_form = vue.resolveComponent("el-form");
+      return vue.openBlock(), vue.createBlock(_component_el_form, {
+        "label-width": "80px",
+        size: "small"
+      }, {
+        default: vue.withCtx(() => [
+          vue.createVNode(attrEvent, {
+            configure: __props.configure,
+            events
+          }, null, 8, ["configure"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-event.vue2.js

@@ -0,0 +1,3 @@
+"use strict";
+const barcodeAttrEvent_vue_vue_type_script_setup_true_lang = require("./barcode-attr-event.vue.js");
+module.exports = barcodeAttrEvent_vue_vue_type_script_setup_true_lang;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-style.vue.js

@@ -0,0 +1,57 @@
+"use strict";
+const vue = require("vue");
+const attrStyle_vue_vue_type_script_setup_true_lang = require("../../form/common/attr-style.vue.js");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "barcode-attr-style",
+  props: {
+    configure: Object
+  },
+  setup(__props) {
+    const blankOption = {
+      showTittleFont: false,
+      // 是否显示标题字体
+      showBackground: true,
+      // 是否显示背景
+      showPosition: true,
+      // 是否显示定位
+      showMargin: true,
+      // 是否显示外边距
+      showPadding: true,
+      // 是否显示内边距
+      showBorder: true,
+      // 是否显示边框
+      showShadow: true,
+      // 是否显示阴影
+      showCursor: true,
+      // 是否显示鼠标手势
+      showCustom: true
+      // 是否显示自定义
+    };
+    return (_ctx, _cache) => {
+      const _component_el_collapse = vue.resolveComponent("el-collapse");
+      const _component_el_form = vue.resolveComponent("el-form");
+      return vue.openBlock(), vue.createBlock(_component_el_form, {
+        "label-width": "80px",
+        size: "small"
+      }, {
+        default: vue.withCtx(() => [
+          vue.createVNode(_component_el_collapse, {
+            modelValue: _ctx.openCollapseItems,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.openCollapseItems = $event),
+            style: { "margin-top": "6px" }
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(attrStyle_vue_vue_type_script_setup_true_lang, {
+                configure: __props.configure,
+                blankOption
+              }, null, 8, ["configure"])
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr-style.vue2.js

@@ -0,0 +1,3 @@
+"use strict";
+const barcodeAttrStyle_vue_vue_type_script_setup_true_lang = require("./barcode-attr-style.vue.js");
+module.exports = barcodeAttrStyle_vue_vue_type_script_setup_true_lang;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr.vue.js

@@ -0,0 +1,4 @@
+"use strict";
+const barcodeAttr_vue_vue_type_script_setup_true_lang = require("./barcode-attr.vue2.js");
+;/* empty css                   */
+module.exports = barcodeAttr_vue_vue_type_script_setup_true_lang;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-attr.vue2.js

@@ -0,0 +1,41 @@
+"use strict";
+const vue = require("vue");
+const barcodeAttrBase_vue_vue_type_script_setup_true_lang = require("./barcode-attr-base.vue.js");
+const barcodeAttrStyle_vue_vue_type_script_setup_true_lang = require("./barcode-attr-style.vue.js");
+const attrHeader = require("../../form/common/attr-header.vue.js");
+const barcodeAttrEvent_vue_vue_type_script_setup_true_lang = require("./barcode-attr-event.vue.js");
+const _hoisted_1 = { class: "amb-design-attr-content" };
+const _hoisted_2 = { class: "amb-design-attr-list" };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "barcode-attr",
+  props: {
+    configure: {
+      type: Object,
+      default: () => ({ title: "Text", props: { type: "input-text" } })
+      // 设置默认值
+    }
+  },
+  setup(__props) {
+    let currentConfigType = vue.ref("base");
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createVNode(attrHeader, {
+          modelValue: vue.unref(currentConfigType),
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(currentConfigType) ? currentConfigType.value = $event : currentConfigType = $event)
+        }, null, 8, ["modelValue"]),
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.withDirectives(vue.createVNode(barcodeAttrBase_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, vue.unref(currentConfigType) === "base"]
+          ]),
+          vue.withDirectives(vue.createVNode(barcodeAttrStyle_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, vue.unref(currentConfigType) === "style"]
+          ]),
+          vue.withDirectives(vue.createVNode(barcodeAttrEvent_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, vue.unref(currentConfigType) === "event"]
+          ])
+        ])
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-design.vue.js

@@ -0,0 +1,3 @@
+"use strict";
+const barcodeDesign_vue_vue_type_script_setup_true_lang = require("./barcode-design.vue2.js");
+module.exports = barcodeDesign_vue_vue_type_script_setup_true_lang;

package/dist/lib/components/design/views/assemblys/data/bar-code/barcode-design.vue2.js

@@ -0,0 +1,83 @@
+"use strict";
+const vue = require("vue");
+const qrcode = require("qrcode");
+const JsBarcode = require("jsbarcode");
+const formDesignUtil = require("../../../../utils/form-design-util.js");
+const _hoisted_1 = ["src"];
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "barcode-design",
+  props: {
+    configure: Object
+  },
+  setup(__props) {
+    const props = __props;
+    const qrCodeData = vue.ref("Hello br code");
+    const qrUrl = vue.ref("");
+    const barcode = vue.ref(null);
+    const barcodeFormat = vue.ref("CODE128");
+    function createBarCode() {
+      JsBarcode(barcode.value, qrCodeData.value, { format: barcodeFormat.value });
+    }
+    function createQrCode() {
+      qrcode.toDataURL(qrCodeData.value, (err, url) => {
+        if (err) {
+          console.error(err);
+        } else {
+          qrUrl.value = url;
+        }
+      });
+    }
+    function getRestsParameter() {
+      let defineProps = {};
+      const tempProps = {};
+      if (props.configure.props.preSuffix) {
+        defineProps = props.configure.props;
+      }
+      if (defineProps["base"]["bindProp"]) {
+        qrCodeData.value = defineProps["base"]["bindProp"];
+      }
+      if (defineProps["base"] && defineProps["base"]["type"] === "br-code") {
+        createBarCode();
+        tempProps["type"] = defineProps["base"]["type"];
+      }
+      if (defineProps["base"] && defineProps["base"]["type"] === "QR-code") {
+        createQrCode();
+        tempProps["type"] = defineProps["base"]["type"];
+      }
+      if (tempProps != {}) {
+        for (const tempPropsKey in tempProps) {
+          designProperty.value[tempPropsKey] = tempProps[tempPropsKey];
+        }
+      }
+    }
+    vue.onMounted(() => {
+      createBarCode();
+    });
+    const designStyle = vue.ref({});
+    const designClass = vue.ref("");
+    const designHeaderStyle = vue.ref({});
+    const designProperty = vue.ref({});
+    vue.watch(props.configure.style, () => {
+      formDesignUtil.caculateDetailComponentStyle(props.configure, designStyle, designClass, designHeaderStyle);
+    }, { immediate: true });
+    vue.watch(props.configure.props, () => {
+      formDesignUtil.caculateComponentProps(props.configure, designProperty), getRestsParameter();
+    }, { immediate: true });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(designClass.value),
+        style: vue.normalizeStyle(designStyle.value)
+      }, [
+        designProperty.value.type === "QR-code" ? (vue.openBlock(), vue.createElementBlock("img", {
+          key: 0,
+          src: qrUrl.value
+        }, null, 8, _hoisted_1)) : (vue.openBlock(), vue.createElementBlock("canvas", {
+          key: 1,
+          ref_key: "barcode",
+          ref: barcode
+        }, null, 512))
+      ], 6);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/data/component/attr-header.css

@@ -0,0 +1,38 @@
+
+.amb-design-attr-header[data-v-f72f4657] {
+  position: sticky;
+  position: -webkit-sticky;
+  top: 0px;
+  z-index: 1;
+  text-align: center;
+  padding: 20px 0px 10px 0px;
+}
+.amb-design-attr-header-type[data-v-f72f4657] {
+  border-radius: 100px 100px 100px 100px;
+  background: #ffffff;
+  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
+  padding: 10px;
+  padding-bottom: 12px;
+	width: 230px;
+	white-space: nowrap;
+	overflow:auto;
+}
+.amb-design-attr-header-type[data-v-f72f4657]::-webkit-scrollbar {
+  max-width: 6px;
+  height: 6px;
+}
+.amb-design-attr-header-type[data-v-f72f4657]::-webkit-scrollbar-thumb {
+  background: #eaeaea;
+  border: none;
+  border-radius: 4px;
+}
+.amb-design-attr-header-type > label[data-v-f72f4657] {
+  padding: 4px 14px;
+  cursor: pointer;
+  font-size: 14px;
+}
+.amb-design-attr-header-type > label.selected[data-v-f72f4657] {
+  border-radius: 100px 100px 100px 100px;
+  background: #5893ef;
+  color: #ffffff;
+}

package/dist/lib/components/design/views/assemblys/data/component/attr-header.vue.js

@@ -0,0 +1,6 @@
+"use strict";
+const attrHeader_vue_vue_type_script_setup_true_lang = require("./attr-header.vue2.js");
+;/* empty css                  */
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.js");
+const AttrHeader = /* @__PURE__ */ _pluginVue_exportHelper(attrHeader_vue_vue_type_script_setup_true_lang, [["__scopeId", "data-v-f72f4657"]]);
+module.exports = AttrHeader;

package/dist/lib/components/design/views/assemblys/data/component/attr-header.vue2.js

@@ -0,0 +1,51 @@
+"use strict";
+const vue = require("vue");
+const _hoisted_1 = { class: "amb-design-attr-header" };
+const _hoisted_2 = { class: "amb-design-attr-header-type" };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "attr-header",
+  props: {
+    modelValue: {
+      type: String,
+      default: "base"
+      // 设置默认值
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const clickType = vue.ref(props.modelValue);
+    function changeType(type) {
+      clickType.value = type;
+      emit("update:modelValue", type);
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createElementVNode("label", {
+            class: vue.normalizeClass({ selected: clickType.value === "base" }),
+            onClick: _cache[0] || (_cache[0] = ($event) => changeType("base"))
+          }, "属性", 2),
+          vue.createElementVNode("label", {
+            class: vue.normalizeClass({ selected: clickType.value === "advanced" }),
+            onClick: _cache[1] || (_cache[1] = ($event) => changeType("advanced"))
+          }, "高级", 2),
+          vue.createElementVNode("label", {
+            class: vue.normalizeClass({ selected: clickType.value === "import" }),
+            onClick: _cache[2] || (_cache[2] = ($event) => changeType("import"))
+          }, "导入配置", 2),
+          vue.createElementVNode("label", {
+            class: vue.normalizeClass({ selected: clickType.value === "style" }),
+            onClick: _cache[3] || (_cache[3] = ($event) => changeType("style"))
+          }, "样式", 2),
+          vue.createElementVNode("label", {
+            class: vue.normalizeClass({ selected: clickType.value === "event" }),
+            onClick: _cache[4] || (_cache[4] = ($event) => changeType("event"))
+          }, "事件", 2)
+        ])
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;