super-page-designer 2.0.9 → 2.0.17

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

@@ -1,11 +1,10 @@
 import { defineComponent, ref, resolveComponent, openBlock, createBlock, withCtx, createVNode } from "vue";
 import _sfc_main$1 from "../common/common-attr-base.vue.js";
-import _sfc_main$2 from "../common/common-attr-serieslist.vue.js";
-import _sfc_main$3 from "../common/common-attr-groupby.vue.js";
-import _sfc_main$4 from "../common/common-attr-sortby.vue.js";
-import _sfc_main$5 from "../common/common-attr-drill.vue.js";
-import _sfc_main$6 from "../common/common-attr-assistant.vue.js";
-import _sfc_main$7 from "../../common/common-attr-size.vue.js";
+import _sfc_main$3 from "../common/common-attr-serieslist.vue.js";
+import _sfc_main$5 from "../common/common-attr-assistant.vue.js";
+import _sfc_main$6 from "../../common/common-attr-size.vue.js";
+import _sfc_main$4 from "../../form/common/data-linkage.vue.js";
+import _sfc_main$2 from "./scatter-attr-data.vue.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "scatter-attr-base",
   props: {
@@ -15,7 +14,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
   },
   setup(__props) {
-    const openCollapseItems = ref(["propsBase", "seriesList", "propsGroup", "attrSize", "propsSort", "propsDrill", "propsAssistant"]);
+    const openCollapseItems = ref([
+      "propsBase",
+      "seriesList",
+      "propsGroup",
+      "attrSize",
+      "propsSort",
+      "propsDrill",
+      "propsAssistant",
+      "linkage",
+      "dataSet"
+    ]);
     return (_ctx, _cache) => {
       const _component_el_collapse = resolveComponent("el-collapse");
       const _component_el_form = resolveComponent("el-form");
@@ -32,17 +41,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             default: withCtx(() => [
               createVNode(_sfc_main$1, {
                 configure: __props.configure,
-                chartType: "columnLine"
+                chartType: "scatter"
               }, null, 8, ["configure"]),
-              createVNode(_sfc_main$2, {
+              createVNode(_sfc_main$2, { configure: __props.configure }, null, 8, ["configure"]),
+              createVNode(_sfc_main$3, {
                 configure: __props.configure,
                 defaultType: "scatter"
               }, null, 8, ["configure"]),
-              createVNode(_sfc_main$3, { configure: __props.configure }, null, 8, ["configure"]),
-              createVNode(_sfc_main$4, { configure: __props.configure }, null, 8, ["configure"]),
+              createVNode(_sfc_main$4, {
+                configureProps: __props.configure.props
+              }, null, 8, ["configureProps"]),
               createVNode(_sfc_main$5, { configure: __props.configure }, null, 8, ["configure"]),
-              createVNode(_sfc_main$6, { configure: __props.configure }, null, 8, ["configure"]),
-              createVNode(_sfc_main$7, {
+              createVNode(_sfc_main$6, {
                 size: __props.configure.props.size
               }, null, 8, ["size"])
             ]),

package/dist/es/components/design/views/assemblys/chart/scatter/scatter-attr-data.vue.js

@@ -0,0 +1,205 @@
+import { defineComponent, ref, computed, resolveComponent, openBlock, createBlock, withCtx, createElementVNode, createVNode, unref, createElementBlock, Fragment, renderList, toDisplayString, createTextVNode } from "vue";
+import _sfc_main$1 from "../../common/page-permission-select.vue.js";
+import { usePageContextStore } from "../../../../../../stores/page-store.js";
+import { queryServiceReturnFields } from "../../../../utils/page-service-util.js";
+const _hoisted_1 = { style: { "padding": "8px 0px 0px 0px" } };
+const _hoisted_2 = { style: { "float": "left" } };
+const _hoisted_3 = { style: { "float": "right", "color": "var(--el-text-color-secondary)", "font-size": "13px" } };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "scatter-attr-data",
+  props: {
+    configure: {
+      type: Object,
+      required: true
+    },
+    defaultType: {
+      type: String,
+      default: ""
+    },
+    chartType: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const pageContextUtil = usePageContextStore();
+    const pageDesign = pageContextUtil.pageContext;
+    const serviceFields = ref([]);
+    const showFields = computed(() => {
+      return serviceFields.value.filter((item) => {
+        return item.type == "array" || item.type == "any" || !item.type;
+      });
+    });
+    computed(() => {
+      return serviceFields.value.filter((item) => {
+        if (item.type == "string" || item.type == "any" || !item.type) {
+          const prevField = props.configure.serviceDataField;
+          if (!prevField || item.value.startsWith(prevField + ".")) {
+            let nameValue = item.value;
+            let nameLabel = item.label;
+            if (prevField) {
+              nameValue = nameValue.substring(prevField.length + 1);
+              if (nameLabel) {
+                nameLabel = nameLabel.replace(prevField + ".", "");
+              }
+            }
+            item.nameValue = nameValue;
+            item.nameLabel = nameLabel;
+            return true;
+          }
+        }
+        return false;
+      });
+    });
+    computed(() => {
+      return serviceFields.value.filter((item) => {
+        if (item.type == "number" || item.type == "any" || !item.type) {
+          const prevField = props.configure.serviceDataField;
+          if (!prevField || item.value.startsWith(prevField + ".")) {
+            let numValue = item.value;
+            let numLabel = item.label;
+            if (prevField) {
+              numValue = numValue.substring(prevField.length + 1);
+              if (numLabel) {
+                numLabel = numLabel.replace(prevField + ".", "");
+              }
+            }
+            item.numValue = numValue;
+            item.numLabel = numLabel;
+            return true;
+          }
+        }
+        return false;
+      });
+    });
+    if (!props.configure.props.dataOrigin) {
+      props.configure.props.dataOrigin = {};
+    }
+    const dataOriginInfo = props.configure.props.dataOrigin;
+    if (!dataOriginInfo.service) {
+      dataOriginInfo.service = {};
+    }
+    function afterSelectService(type, code, name, serviceId) {
+      dataOriginInfo.service.simpleCode = code;
+      dataOriginInfo.service.id = serviceId;
+      dataOriginInfo.service.name = name;
+      getServiceReturnFields();
+    }
+    let hisQueryId = null;
+    function getServiceReturnFields() {
+      const serviceId = dataOriginInfo.service.id;
+      if (hisQueryId == serviceId) {
+        return;
+      }
+      hisQueryId = serviceId;
+      if (!serviceId) {
+        props.configure.serviceFields = [];
+        serviceFields.value = [];
+        props.configure.serviceDataField = null;
+        return;
+      }
+      queryServiceReturnFields(serviceId).then((fields) => {
+        props.configure.serviceFields = fields;
+        serviceFields.value = fields;
+        checkDataFieldExist();
+      });
+    }
+    function checkDataFieldExist() {
+      if (!props.configure.serviceDataField) {
+        return;
+      }
+      let isExist = false;
+      if (serviceFields.value) {
+        for (let o of serviceFields.value) {
+          if (o.value == props.configure.serviceDataField) {
+            isExist = true;
+            break;
+          }
+        }
+      }
+      if (!isExist) {
+        props.configure.serviceDataField = null;
+      }
+    }
+    setTimeout(() => {
+      getServiceReturnFields();
+    }, 10);
+    return (_ctx, _cache) => {
+      const _component_el_form_item = resolveComponent("el-form-item");
+      const _component_el_option = resolveComponent("el-option");
+      const _component_el_select = resolveComponent("el-select");
+      const _component_el_text = resolveComponent("el-text");
+      const _component_el_collapse_item = resolveComponent("el-collapse-item");
+      return openBlock(), createBlock(_component_el_collapse_item, {
+        title: "数据设置",
+        name: "dataSet",
+        class: "amb-design-attr-group-header"
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_component_el_form_item, {
+              label: "选择服务",
+              style: { "margin-top": "4px" }
+            }, {
+              default: withCtx(() => [
+                createVNode(_sfc_main$1, {
+                  pageDesign: unref(pageDesign),
+                  rowObj: unref(dataOriginInfo).service,
+                  onlyService: "",
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = (type, code, name, serviceId) => afterSelectService(type, code, name, serviceId))
+                }, null, 8, ["pageDesign", "rowObj"])
+              ]),
+              _: 1
+            }),
+            createVNode(_component_el_form_item, {
+              label: "数据集",
+              style: { "margin-top": "-10px", "margin-bottom": "-15px" }
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_el_select, {
+                  modelValue: __props.configure.serviceDataField,
+                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => __props.configure.serviceDataField = $event),
+                  filterable: "",
+                  clearable: "",
+                  placeholder: "请选择"
+                }, {
+                  default: withCtx(() => [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList(showFields.value, (field, index) => {
+                      return openBlock(), createBlock(_component_el_option, {
+                        key: index,
+                        label: field.label,
+                        value: field.value
+                      }, {
+                        default: withCtx(() => [
+                          createElementVNode("span", _hoisted_2, toDisplayString(field.label), 1),
+                          createElementVNode("span", _hoisted_3, toDisplayString(field.type), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["label", "value"]);
+                    }), 128))
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"]),
+                createVNode(_component_el_text, {
+                  type: "success",
+                  size: "small"
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode("默认为根目录.")
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/es/components/design/views/assemblys/chart/scatter/scatter-attr-data.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./scatter-attr-data.vue.js";
+export {
+  _sfc_main as default
+};

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

@@ -32,7 +32,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       const _component_el_collapse = resolveComponent("el-collapse");
       const _component_el_form = resolveComponent("el-form");
-      return openBlock(), createBlock(_component_el_form, { "label-width": "80px" }, {
+      return openBlock(), createBlock(_component_el_form, {
+        "label-width": "80px",
+        size: "small"
+      }, {
         default: withCtx(() => [
           createVNode(_component_el_collapse, {
             modelValue: openCollapseItems.value,
@@ -52,12 +55,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               createVNode(_sfc_main$6, {
                 yaxis: __props.configure.style.yaxisLeft,
                 name: "styleYaxisLeft",
-                title: "纵坐标(左)"
-              }, null, 8, ["yaxis"]),
-              createVNode(_sfc_main$6, {
-                yaxis: __props.configure.style.yaxisRight,
-                name: "styleYaxisRight",
-                title: "纵坐标(右)"
+                title: "纵坐标"
               }, null, 8, ["yaxis"]),
               createVNode(_sfc_main$7, { configure: __props.configure }, null, 8, ["configure"]),
               createVNode(_sfc_main$8, { configure: __props.configure }, null, 8, ["configure"]),

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

@@ -1,8 +1,10 @@
-import { defineComponent, ref, watch, openBlock, createElementBlock, normalizeStyle, normalizeClass, withModifiers, createVNode, unref, withDirectives, createElementVNode, Fragment, renderList, toDisplayString, vShow } from "vue";
+import { defineComponent, ref, watch, onUnmounted, openBlock, createElementBlock, normalizeStyle, normalizeClass, withModifiers, withDirectives, createVNode, vShow, unref, createElementVNode, Fragment, renderList, toDisplayString } from "vue";
+import { getUuidv4 } from "../../../../utils/common-util.js";
 import { caculateComponentStyle } from "../../../../utils/container-design-util.js";
-import { generateChartOption } from "../../../../utils/chart-design-util.js";
+import { removComponentDataConfig, generateChartHeader, generateChartOption, initComponentDataConfig } from "../../../../utils/chart-design-util.js";
 import { getCustomTheme } from "super-page-runtime";
-import _sfc_main$1 from "./series/scatter-series-attr.vue.js";
+import _sfc_main$2 from "./series/scatter-series-attr.vue.js";
+import _sfc_main$1 from "../common/common-chart-header.vue.js";
 import { use } from "echarts/core";
 import { CanvasRenderer } from "echarts/renderers";
 import { ScatterChart } from "echarts/charts";
@@ -13,12 +15,10 @@ const _hoisted_2 = ["onClick"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "scatter-design",
   props: {
-    configure: {
-      type: Object,
-      required: true
-    },
-    indexObj: Object,
-    selectWidget: Object
+    pageDesign: {},
+    configure: {},
+    indexObj: {},
+    selectWidget: {}
   },
   emits: ["onSelectWidget", "onCustomAttrWidget"],
   setup(__props, { emit: __emit }) {
@@ -41,7 +41,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
     if (props.configure.items.length == 0) {
       props.configure.items.push({
+        uuid: getUuidv4(),
         index: 1,
+        name: "",
         type: "scatter",
         label: "散点图",
         props: {
@@ -57,6 +59,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const designClass = ref("");
     const customTheme = ref(null);
     const chartOption = ref({});
+    const headerInfo = ref({});
     watch(
       props.configure.style,
       () => {
@@ -65,21 +68,36 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       },
       { immediate: true }
     );
+    function updateDataConfig() {
+      const dataConfig = initComponentDataConfig(props.configure, headerInfo.value);
+      props.configure.runtime.dataConfig = dataConfig;
+    }
     watch(props.configure.props, () => {
       customChartOption();
+      updateDataConfig();
     });
     watch(props.configure.items, () => {
       customChartOption();
     });
+    setTimeout(() => {
+      updateDataConfig();
+    }, 100);
+    onUnmounted(() => {
+      removComponentDataConfig(props.configure);
+    });
     function customCaculateStyle() {
       caculateComponentStyle(props.configure, designStyle, designClass, null);
       props.configure.runtime.style = designStyle.value;
       props.configure.runtime.class = designClass.value;
+      headerInfo.value = generateChartHeader(props.configure);
+      props.configure.runtime.headerInfo = headerInfo.value;
     }
     function customChartOption() {
       generateChartOption(props.configure, chartOption);
+      headerInfo.value = generateChartHeader(props.configure);
       customTheme.value = getCustomTheme(props.configure.props.customTheme);
       props.configure.runtime.chartOption = chartOption.value;
+      props.configure.runtime.headerInfo = headerInfo.value;
     }
     if (props.selectWidget) {
       watch(props.selectWidget, () => {
@@ -112,8 +130,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           break;
         }
       }
+      selItem.serviceFields = props.configure.serviceFields;
+      selItem.serviceDataField = props.configure.serviceDataField;
       selItem.selected = true;
-      $emits("onCustomAttrWidget", selItem, _sfc_main$1);
+      $emits("onCustomAttrWidget", selItem, _sfc_main$2);
     }
     const $emits = __emit;
     return (_ctx, _cache) => {
@@ -123,6 +143,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         onClick: withModifiers(selectParent, ["stop"]),
         ref: "thisRef"
       }, [
+        withDirectives(createVNode(_sfc_main$1, { headerInfo: headerInfo.value }, null, 8, ["headerInfo"]), [
+          [vShow, headerInfo.value.showHeader]
+        ]),
         createVNode(unref(VChart), {
           ref: "chartRef",
           theme: customTheme.value,
@@ -130,14 +153,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           autoresize: ""
         }, null, 8, ["theme", "option"]),
         withDirectives(createElementVNode("div", _hoisted_1, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.configure.items, (item, itemIndex) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.configure.items, (item, itemIndex) => {
             return openBlock(), createElementBlock("label", {
               class: normalizeClass([[item.selected ? "amb-design-chart-series-selected" : ""], "amb-design-chart-series"]),
               onClick: withModifiers(($event) => selectSeries($event, itemIndex), ["stop"])
             }, toDisplayString(item.props.title), 11, _hoisted_2);
           }), 256))
         ], 512), [
-          [vShow, __props.configure.componentIndex == __props.selectWidget.value]
+          [vShow, _ctx.configure.componentIndex == _ctx.selectWidget.value]
         ])
       ], 6);
     };

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

@@ -1,5 +1,5 @@
-import { defineComponent, ref, resolveComponent, openBlock, createBlock, withCtx, createVNode, createElementVNode, withDirectives, vShow, createTextVNode } from "vue";
-import _sfc_main$1 from "../../common-series/common-attr-dataset.vue.js";
+import { defineComponent, ref, resolveComponent, openBlock, createBlock, withCtx, createVNode, createElementVNode } from "vue";
+import _sfc_main$1 from "./scatter-series-data.vue.js";
 import _sfc_main$2 from "../../common-series/common-attr-testdatas.vue.js";
 const _hoisted_1 = { style: { "padding": "8px 0px 0px 0px" } };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -13,13 +13,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const openCollapseItems = ref(["1", "dataList", "propsDynamic", "propsTestDatas"]);
     return (_ctx, _cache) => {
-      const _component_el_option = resolveComponent("el-option");
-      const _component_el_select = resolveComponent("el-select");
-      const _component_el_form_item = resolveComponent("el-form-item");
-      const _component_el_switch = resolveComponent("el-switch");
       const _component_el_input = resolveComponent("el-input");
-      const _component_el_radio_button = resolveComponent("el-radio-button");
-      const _component_el_radio_group = resolveComponent("el-radio-group");
+      const _component_el_form_item = resolveComponent("el-form-item");
       const _component_el_collapse_item = resolveComponent("el-collapse-item");
       const _component_el_collapse = resolveComponent("el-collapse");
       const _component_el_form = resolveComponent("el-form");
@@ -30,7 +25,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           createVNode(_component_el_collapse, {
             modelValue: openCollapseItems.value,
-            "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => openCollapseItems.value = $event),
+            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => openCollapseItems.value = $event),
             style: { "margin-top": "6px" }
           }, {
             default: withCtx(() => [
@@ -41,84 +36,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               }, {
                 default: withCtx(() => [
                   createElementVNode("div", _hoisted_1, [
-                    createVNode(_component_el_form_item, {
-                      label: "系列类型",
-                      style: { "margin-top": "4px" }
-                    }, {
-                      default: withCtx(() => [
-                        createVNode(_component_el_select, {
-                          modelValue: __props.configure.type,
-                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.configure.type = $event)
-                        }, {
-                          default: withCtx(() => [
-                            createVNode(_component_el_option, {
-                              label: "柱状图",
-                              value: "bar"
-                            }),
-                            createVNode(_component_el_option, {
-                              label: "折线图",
-                              value: "line"
-                            })
-                          ]),
-                          _: 1
-                        }, 8, ["modelValue"])
-                      ]),
-                      _: 1
-                    }),
-                    withDirectives(createVNode(_component_el_form_item, {
-                      label: "曲线",
-                      style: { "margin-top": "-10px" }
-                    }, {
-                      default: withCtx(() => [
-                        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), [
-                      [vShow, __props.configure.type == "line"]
-                    ]),
                     createVNode(_component_el_form_item, {
                       label: "系列名称",
-                      style: { "margin-top": "-10px" }
+                      style: { "margin-top": "4px", "margin-bottom": "-15px" }
                     }, {
                       default: withCtx(() => [
                         createVNode(_component_el_input, {
                           modelValue: __props.configure.props.title,
-                          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => __props.configure.props.title = $event),
+                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.configure.props.title = $event),
                           placeholder: "请输入"
                         }, null, 8, ["modelValue"])
                       ]),
                       _: 1
-                    }),
-                    createVNode(_component_el_form_item, {
-                      label: "Y坐标参照",
-                      style: { "margin-top": "-10px", "margin-bottom": "-15px" }
-                    }, {
-                      default: withCtx(() => [
-                        createVNode(_component_el_radio_group, {
-                          modelValue: __props.configure.props.yAxisIndex,
-                          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => __props.configure.props.yAxisIndex = $event)
-                        }, {
-                          default: withCtx(() => [
-                            createVNode(_component_el_radio_button, { value: "0" }, {
-                              default: withCtx(() => [
-                                createTextVNode("左坐标")
-                              ]),
-                              _: 1
-                            }),
-                            createVNode(_component_el_radio_button, { value: "1" }, {
-                              default: withCtx(() => [
-                                createTextVNode("右坐标")
-                              ]),
-                              _: 1
-                            })
-                          ]),
-                          _: 1
-                        }, 8, ["modelValue"])
-                      ]),
-                      _: 1
                     })
                   ])
                 ]),

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

@@ -15,7 +15,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       const _component_el_collapse = resolveComponent("el-collapse");
       const _component_el_form = resolveComponent("el-form");
-      return openBlock(), createBlock(_component_el_form, { "label-width": "80px" }, {
+      return openBlock(), createBlock(_component_el_form, {
+        "label-width": "80px",
+        size: "small"
+      }, {
         default: withCtx(() => [
           createVNode(_component_el_collapse, {
             modelValue: openCollapseItems.value,