super-page-designer 0.0.2-tmp9 → 1.0.2

package/dist/lib/components/design/views/assemblys/chart/scatter/scatter-design.vue2.js

@@ -0,0 +1,147 @@
+"use strict";
+const vue = require("vue");
+const containerDesignUtil = require("../../../../utils/container-design-util.js");
+const chartDesignUtil = require("../../../../utils/chart-design-util.js");
+const chartUtil_ts = require("super-page-runtime/src/components/runtime/utils/charts/chart-util.ts");
+const scatterSeriesAttr_vue_vue_type_script_setup_true_lang = require("./series/scatter-series-attr.vue.js");
+const core = require("echarts/core");
+const renderers = require("echarts/renderers");
+const charts = require("echarts/charts");
+const components = require("echarts/components");
+const VChart = require("vue-echarts");
+const _hoisted_1 = { style: { "position": "absolute", "top": "0px", "right": "60px", "text-align": "center" } };
+const _hoisted_2 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "scatter-design",
+  props: {
+    configure: {
+      type: Object,
+      required: true
+    },
+    indexObj: Object,
+    selectWidget: Object
+  },
+  emits: ["onSelectWidget", "onCustomAttrWidget"],
+  setup(__props, { emit: __emit }) {
+    core.use([
+      renderers.CanvasRenderer,
+      charts.ScatterChart,
+      components.GridComponent,
+      components.LegendComponent,
+      components.TitleComponent,
+      components.TooltipComponent,
+      components.ToolboxComponent,
+      components.DataZoomComponent
+    ]);
+    const props = __props;
+    if (!props.configure.props) {
+      props.configure.props = {};
+    }
+    if (!props.configure.items) {
+      props.configure.items = [];
+    }
+    if (props.configure.items.length == 0) {
+      props.configure.items.push({
+        index: 1,
+        type: "scatter",
+        label: "散点图",
+        props: {
+          title: "系列1"
+        },
+        style: {}
+      });
+    }
+    if (!props.configure.runtime) {
+      props.configure.runtime = {};
+    }
+    const designStyle = vue.ref({});
+    const designClass = vue.ref("");
+    const customTheme = vue.ref(null);
+    const chartOption = vue.ref({});
+    vue.watch(
+      props.configure.style,
+      () => {
+        customCaculateStyle();
+        customChartOption();
+      },
+      { immediate: true }
+    );
+    vue.watch(props.configure.props, () => {
+      customChartOption();
+    });
+    vue.watch(props.configure.items, () => {
+      customChartOption();
+    });
+    function customCaculateStyle() {
+      containerDesignUtil.caculateComponentStyle(props.configure, designStyle, designClass, null);
+      props.configure.runtime.style = designStyle.value;
+      props.configure.runtime.class = designClass.value;
+    }
+    function customChartOption() {
+      chartDesignUtil.generateChartOption(props.configure, chartOption);
+      customTheme.value = chartUtil_ts.getCustomTheme(props.configure.props.customTheme);
+      props.configure.runtime.chartOption = chartOption.value;
+    }
+    if (props.selectWidget) {
+      vue.watch(props.selectWidget, () => {
+        if (props.selectWidget && props.selectWidget.value != props.configure.componentIndex) {
+          clearSelectedSeries();
+        }
+      });
+    }
+    function clearSelectedSeries() {
+      if (props.configure.items) {
+        for (let item of props.configure.items) {
+          item.selected = false;
+        }
+      }
+    }
+    function selectParent(evt) {
+      clearSelectedSeries();
+    }
+    function selectSeries(evt, itemIndex) {
+      if (evt) {
+        evt.preventDefault();
+      }
+      const selItem = props.configure.items[itemIndex];
+      if (selItem.selected) {
+        return;
+      }
+      for (let tempItem of props.configure.items) {
+        if (tempItem.selected) {
+          tempItem.selected = false;
+          break;
+        }
+      }
+      selItem.selected = true;
+      $emits("onCustomAttrWidget", selItem, scatterSeriesAttr_vue_vue_type_script_setup_true_lang);
+    }
+    const $emits = __emit;
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        style: vue.normalizeStyle(designStyle.value),
+        class: vue.normalizeClass([designClass.value, "amb-widget-chart"]),
+        onClick: vue.withModifiers(selectParent, ["stop"]),
+        ref: "thisRef"
+      }, [
+        vue.createVNode(vue.unref(VChart), {
+          ref: "chartRef",
+          theme: customTheme.value,
+          option: chartOption.value,
+          autoresize: ""
+        }, null, 8, ["theme", "option"]),
+        vue.withDirectives(vue.createElementVNode("div", _hoisted_1, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.configure.items, (item, itemIndex) => {
+            return vue.openBlock(), vue.createElementBlock("label", {
+              class: vue.normalizeClass([[item.selected ? "amb-design-chart-series-selected" : ""], "amb-design-chart-series"]),
+              onClick: vue.withModifiers(($event) => selectSeries($event, itemIndex), ["stop"])
+            }, vue.toDisplayString(item.props.title), 11, _hoisted_2);
+          }), 256))
+        ], 512), [
+          [vue.vShow, __props.configure.componentIndex == __props.selectWidget.value]
+        ])
+      ], 6);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr-base.vue.js

@@ -0,0 +1,139 @@
+"use strict";
+const vue = require("vue");
+const commonAttrDataset_vue_vue_type_script_setup_true_lang = require("../../common-series/common-attr-dataset.vue.js");
+const commonAttrTestdatas_vue_vue_type_script_setup_true_lang = require("../../common-series/common-attr-testdatas.vue.js");
+const _hoisted_1 = { style: { "padding": "8px 0px 0px 0px" } };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "scatter-series-attr-base",
+  props: {
+    configure: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const openCollapseItems = vue.ref(["1", "dataList", "propsDynamic", "propsTestDatas"]);
+    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_switch = vue.resolveComponent("el-switch");
+      const _component_el_input = vue.resolveComponent("el-input");
+      const _component_el_radio_button = vue.resolveComponent("el-radio-button");
+      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[4] || (_cache[4] = ($event) => openCollapseItems.value = $event),
+            style: { "margin-top": "6px" }
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_el_collapse_item, {
+                title: "基本",
+                name: "1",
+                class: "amb-design-attr-group-header"
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_1, [
+                    vue.createVNode(_component_el_form_item, {
+                      label: "系列类型",
+                      style: { "margin-top": "4px" }
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_select, {
+                          modelValue: __props.configure.type,
+                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.configure.type = $event)
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_option, {
+                              label: "柱状图",
+                              value: "bar"
+                            }),
+                            vue.createVNode(_component_el_option, {
+                              label: "折线图",
+                              value: "line"
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.withDirectives(vue.createVNode(_component_el_form_item, {
+                      label: "曲线",
+                      style: { "margin-top": "-10px" }
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_switch, {
+                          modelValue: __props.configure.style.isSmooth,
+                          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => __props.configure.style.isSmooth = $event)
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }, 512), [
+                      [vue.vShow, __props.configure.type == "line"]
+                    ]),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "系列名称",
+                      style: { "margin-top": "-10px" }
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_input, {
+                          modelValue: __props.configure.props.title,
+                          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => __props.configure.props.title = $event),
+                          placeholder: "请输入"
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    }),
+                    vue.createVNode(_component_el_form_item, {
+                      label: "Y坐标参照",
+                      style: { "margin-top": "-10px", "margin-bottom": "-15px" }
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(_component_el_radio_group, {
+                          modelValue: __props.configure.props.yAxisIndex,
+                          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => __props.configure.props.yAxisIndex = $event)
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(_component_el_radio_button, { value: "0" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("左坐标")
+                              ]),
+                              _: 1
+                            }),
+                            vue.createVNode(_component_el_radio_button, { value: "1" }, {
+                              default: vue.withCtx(() => [
+                                vue.createTextVNode("右坐标")
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                    })
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createVNode(commonAttrDataset_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]),
+              vue.createVNode(commonAttrTestdatas_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"])
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr-base.vue2.js

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

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr-style.vue.js

@@ -0,0 +1,39 @@
+"use strict";
+const vue = require("vue");
+const commonStyleLabel_vue_vue_type_script_setup_true_lang = require("../../common-series/common-style-label.vue.js");
+const styleScatter_vue_vue_type_script_setup_true_lang = require("./styles/style-scatter.vue.js");
+const commonStyleCustom_vue_vue_type_script_setup_true_lang = require("../../common/common-style-custom.vue.js");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "scatter-series-attr-style",
+  props: {
+    configure: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const openCollapseItems = ["styleLabel", "styleScatter"];
+    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" }, {
+        default: vue.withCtx(() => [
+          vue.createVNode(_component_el_collapse, {
+            modelValue: openCollapseItems,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => openCollapseItems = $event),
+            style: { "margin-top": "6px" }
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(styleScatter_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]),
+              vue.createVNode(commonStyleLabel_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]),
+              vue.createVNode(commonStyleCustom_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"])
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr-style.vue2.js

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

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr.vue.js

@@ -0,0 +1,108 @@
+"use strict";
+const vue = require("vue");
+const scatterSeriesAttrBase_vue_vue_type_script_setup_true_lang = require("./scatter-series-attr-base.vue.js");
+const scatterSeriesAttrStyle_vue_vue_type_script_setup_true_lang = require("./scatter-series-attr-style.vue.js");
+const commonAttrEvents_vue_vue_type_script_setup_true_lang = require("../../../common-attr-events.vue.js");
+const _hoisted_1 = { class: "amb-design-attr-content" };
+const _hoisted_2 = { class: "amb-design-attr-header" };
+const _hoisted_3 = { class: "amb-design-attr-header-type" };
+const _hoisted_4 = { class: "amb-design-attr-list" };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "scatter-series-attr",
+  props: {
+    configure: {
+      type: Object,
+      required: true
+    }
+  },
+  emits: [],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const typeBaseClass = vue.ref("selected");
+    const typeStyleClass = vue.ref("");
+    const typeEventClass = vue.ref("");
+    const typeAdviceClass = vue.ref("");
+    function changeType(typeName) {
+      if (typeName == "base") {
+        typeBaseClass.value = "selected";
+        typeStyleClass.value = "";
+        typeEventClass.value = "";
+        typeAdviceClass.value = "";
+      } else if (typeName == "style") {
+        typeBaseClass.value = "";
+        typeStyleClass.value = "selected";
+        typeEventClass.value = "";
+        typeAdviceClass.value = "";
+      } else if (typeName == "event") {
+        typeBaseClass.value = "";
+        typeStyleClass.value = "";
+        typeEventClass.value = "selected";
+        typeAdviceClass.value = "";
+      } else {
+        typeBaseClass.value = "";
+        typeStyleClass.value = "";
+        typeEventClass.value = "";
+        typeAdviceClass.value = "selected";
+      }
+    }
+    if (props.configure.events == void 0) {
+      props.configure.events = [];
+    }
+    const selEventCount = vue.ref(0);
+    caculateSelEventCount();
+    function caculateSelEventCount() {
+      const allEvents = props.configure.events;
+      for (let index = 0; index < allEvents.length; index++) {
+        if (allEvents[index].selLogicCode) {
+          selEventCount.value++;
+        }
+      }
+    }
+    vue.watch(props.configure.events, (newValue) => {
+      caculateSelEventCount();
+    });
+    return (_ctx, _cache) => {
+      const _component_el_badge = vue.resolveComponent("el-badge");
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createElementVNode("div", _hoisted_3, [
+            vue.createElementVNode("label", {
+              class: vue.normalizeClass(typeBaseClass.value),
+              onClick: _cache[0] || (_cache[0] = ($event) => changeType("base"))
+            }, "属性", 2),
+            vue.createElementVNode("label", {
+              class: vue.normalizeClass(typeStyleClass.value),
+              onClick: _cache[1] || (_cache[1] = ($event) => changeType("style"))
+            }, "样式", 2),
+            vue.createElementVNode("label", {
+              class: vue.normalizeClass(typeEventClass.value),
+              onClick: _cache[2] || (_cache[2] = ($event) => changeType("event"))
+            }, [
+              vue.createTextVNode(" 事件 "),
+              selEventCount.value > 0 ? (vue.openBlock(), vue.createBlock(_component_el_badge, {
+                key: 0,
+                value: selEventCount.value
+              }, null, 8, ["value"])) : vue.createCommentVNode("", true)
+            ], 2),
+            vue.createElementVNode("label", {
+              class: vue.normalizeClass(typeAdviceClass.value),
+              onClick: _cache[3] || (_cache[3] = ($event) => changeType("advice"))
+            }, "高级", 2)
+          ])
+        ]),
+        vue.createElementVNode("div", _hoisted_4, [
+          vue.withDirectives(vue.createVNode(scatterSeriesAttrBase_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, typeBaseClass.value]
+          ]),
+          vue.withDirectives(vue.createVNode(scatterSeriesAttrStyle_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, typeStyleClass.value]
+          ]),
+          vue.withDirectives(vue.createVNode(commonAttrEvents_vue_vue_type_script_setup_true_lang, { configure: __props.configure }, null, 8, ["configure"]), [
+            [vue.vShow, typeEventClass.value]
+          ])
+        ])
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/design/views/assemblys/chart/scatter/series/scatter-series-attr.vue2.js

@@ -0,0 +1,3 @@
+"use strict";
+const scatterSeriesAttr_vue_vue_type_script_setup_true_lang = require("./scatter-series-attr.vue.js");
+module.exports = scatterSeriesAttr_vue_vue_type_script_setup_true_lang;