super-page-designer 2.0.17 → 2.0.23

package/dist/es/components/design/views/design/view/components/quick-add-dialog.vue.js

@@ -0,0 +1,678 @@
+import { defineComponent, ref, reactive, computed, resolveComponent, openBlock, createElementBlock, Fragment, createVNode, withCtx, createElementVNode, unref, createTextVNode, renderList, createBlock } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Check, Search, Close } from "@element-plus/icons";
+import _sfc_main$2 from "../../../assemblys/common/common-select-table.vue.js";
+import _sfc_main$1 from "./quick-add-fields.vue.js";
+import "agilebuilder-ui/src/utils/request";
+import { queryTableFields } from "../../../../utils/page-table-util.js";
+import { deepCopy, getUuidv4 } from "../../../../utils/common-util.js";
+import { standardButtonOperations, getDesignConfByName } from "../../../../utils/assemblys-config.js";
+import { usePageContextStore } from "../../../../../../stores/page-store.js";
+const _hoisted_1 = { style: { "background-color": "rgba(88, 147, 239, 0.06)", "padding": "10px" } };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "quick-add-dialog",
+  emits: ["close"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const pageDesignUtil = usePageContextStore();
+    const pageDesign = pageDesignUtil.pageContext ? pageDesignUtil.pageContext : {};
+    const emits = __emit;
+    const tableHeight = ref(300);
+    const dialogVisible = ref(false);
+    const selectTableDialog = ref(null);
+    const addFieldsRef = ref(null);
+    const model = reactive({
+      tableName: "",
+      tableAlias: "",
+      systemCode: "",
+      systemVersion: 0,
+      pageType: "form",
+      isWorkflow: null,
+      buttons: [],
+      listButtons: [],
+      modelFields: [],
+      fieldInfos: []
+    });
+    const typeSelectMap = {};
+    function btnSelectChange() {
+      if (model.pageType) {
+        typeSelectMap[model.pageType] = model.buttons;
+      }
+    }
+    const buttonMap = {};
+    let btnIndex = 1;
+    const buttonOptions = computed(() => {
+      const options = [];
+      for (let g of standardButtonOperations) {
+        if (g.type == model.pageType) {
+          const tempOptions = g.options;
+          for (let option of tempOptions) {
+            const o = {};
+            Object.assign(o, option);
+            o.name = "button-detail";
+            options.push(o);
+            o.index = btnIndex++;
+            buttonMap[o.value] = o;
+          }
+        }
+      }
+      if (model.isWorkflow && model.pageType == "form") {
+        const item = {
+          name: "workflow-button",
+          value: "workflow-button",
+          label: "工作流按钮",
+          index: btnIndex++
+        };
+        options.push(item.value);
+        buttonMap[item.value] = item;
+      }
+      if (model.pageType) {
+        if (!typeSelectMap[model.pageType]) {
+          const selectValues = [];
+          for (let o of options) {
+            selectValues.push(o.value);
+          }
+          typeSelectMap[model.pageType] = selectValues;
+        }
+        model.buttons = typeSelectMap[model.pageType];
+      }
+      return options;
+    });
+    const listEditButtons = [];
+    for (let g of standardButtonOperations) {
+      if (g.type == "list-edit") {
+        const tempOptions = g.options;
+        for (let option of tempOptions) {
+          const o = {};
+          Object.assign(o, option);
+          listEditButtons.push(o);
+          o.index = btnIndex++;
+          buttonMap[o.value] = o;
+        }
+      }
+    }
+    function selectTable() {
+      selectTableDialog.value.openDialog();
+    }
+    function clearTable() {
+      model.tableAlias = "";
+      model.tableName = "";
+      model.modelFields = [];
+    }
+    function onSelectTable(tableInfo) {
+      let hisKey = model.systemCode ? model.systemCode : "";
+      hisKey += "_";
+      hisKey += model.systemVersion ? model.systemVersion : "";
+      hisKey += "_";
+      hisKey += model.tableName ? model.tableName : "";
+      let newKey = tableInfo.systemCode ? tableInfo.systemCode : "";
+      newKey += "_";
+      newKey += tableInfo.systemVersion ? tableInfo.systemVersion : "";
+      newKey += "_";
+      newKey += tableInfo.name ? tableInfo.name : "";
+      if (newKey != hisKey) {
+        model.systemCode = tableInfo.systemCode;
+        model.systemVersion = tableInfo.systemVersion;
+        model.tableName = tableInfo.name;
+        model.tableAlias = tableInfo.alias;
+        const systemCode = tableInfo.systemCode ? tableInfo.systemCode : pageDesign.systemCode;
+        const systemVersion = tableInfo.systemVersion ? tableInfo.systemVersion : pageDesign.systemVersion;
+        queryTableFields(systemCode, systemVersion, tableInfo.name).then((tableFields) => {
+          model.modelFields = tableFields;
+          if (addFieldsRef.value) {
+            addFieldsRef.value.updateInitFields();
+          }
+        });
+      }
+    }
+    function openDialog() {
+      let tempHeight = window.innerHeight - 110 - 310 - 20;
+      if (tempHeight > 500) {
+        tempHeight = 500;
+      } else if (tempHeight < 100) {
+        tempHeight = 100;
+      }
+      tableHeight.value = tempHeight;
+      dialogVisible.value = true;
+    }
+    function confirmAdd() {
+      if (!model.tableName) {
+        ElMessage.error("数据表不能为空!");
+        return;
+      }
+      if ((!model.buttons || model.buttons.length == 0) && (!model.fieldInfos || model.fieldInfos.length == 0)) {
+        ElMessage.error("未选择功能或字段信息，无需添加!");
+        return;
+      }
+      ElMessageBox.confirm("确定要添加吗?", "确认", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(({ value }) => {
+        if (model.pageType == "form") {
+          addForm();
+        } else {
+          addList();
+        }
+        dialogVisible.value = false;
+      });
+    }
+    function addForm() {
+      const items = [];
+      if (model.buttons && model.buttons.length > 0) {
+        const tools = generateTools();
+        if (tools) {
+          items.push(tools);
+        }
+      }
+      const baseItem = generateConf("form");
+      if (!baseItem.items) {
+        baseItem.items = [];
+      }
+      const flexItem = generateConf("layout");
+      if (!flexItem.items) {
+        flexItem.items = [];
+      }
+      baseItem.items.push(flexItem);
+      if (model.isWorkflow) {
+        const tabsItem = generateConf("tabs");
+        if (!tabsItem.items) {
+          tabsItem.items = [];
+        }
+        const firstItem = {
+          index: 1,
+          label: "基本信息",
+          items: [baseItem]
+        };
+        tabsItem.items.push(firstItem);
+        const pictureFlowItem = generateConf("picture-flow");
+        const secondItem = {
+          index: 2,
+          label: "图形历史",
+          items: [pictureFlowItem]
+        };
+        tabsItem.items.push(secondItem);
+        const textFlowItem = generateConf("text-flow");
+        const thirdItem = {
+          index: 3,
+          label: "文本历史",
+          items: [textFlowItem]
+        };
+        tabsItem.items.push(thirdItem);
+        tabsItem.props.defaultOpen = 1;
+        items.push(tabsItem);
+      } else {
+        items.push(baseItem);
+      }
+      if (model.fieldInfos) {
+        for (let f of model.fieldInfos) {
+          if (!f.componentName) {
+            continue;
+          }
+          const itemConf = generateConf(f.componentName);
+          if (!itemConf.props.base) {
+            itemConf.props.base = {};
+          }
+          itemConf.props.base.title = f.title;
+          if (f.fieldName) {
+            itemConf.props.base.prop = "${data." + f.fieldName + "}";
+          }
+          itemConf.props.base.defaultValue = f.value;
+          if (!itemConf.props.verification) {
+            itemConf.props.verification = {};
+          }
+          if (f.valid) {
+            const valids = f.valid;
+            const validIndex = valids.indexOf("required");
+            if (validIndex > -1) {
+              itemConf.props.verification.required = true;
+              valids.splice(validIndex, 1);
+            }
+            itemConf.props.verification.type = valids;
+          }
+          if (f.state) {
+            itemConf.props.base.state = f.state;
+          }
+          if (f.width) {
+            if (!itemConf.props.size) {
+              itemConf.props.size = {};
+            }
+            itemConf.props.size.widthType = "flex";
+            itemConf.props.size.flexSpan = f.width;
+          }
+          flexItem.items.push(itemConf);
+        }
+      }
+      updatePageDesignInfo(items);
+    }
+    function addList() {
+      const items = [];
+      if (model.buttons && model.buttons.length > 0) {
+        const tools = generateTools();
+        if (tools) {
+          items.push(tools);
+        }
+      }
+      const tableItem = generateConf("table");
+      if (!tableItem.items) {
+        tableItem.items = [];
+      }
+      if (model.fieldInfos) {
+        const templateItem = tableItem.items[2];
+        tableItem.items.splice(2, 1);
+        for (let f of model.fieldInfos) {
+          if (!f.fieldName && !f.title && !f.componentName) {
+            continue;
+          }
+          const newColumn = deepCopy(templateItem);
+          newColumn.uuid = getUuidv4();
+          newColumn.name = f.componentName ? f.componentName : "";
+          newColumn.props.base.name = f.title;
+          if (f.align) {
+            newColumn.props.base.alignTittle = f.align;
+          }
+          newColumn.props.base.prop = f.fieldName;
+          if (f.componentName) {
+            newColumn.props.editLine.plugType = f.componentName;
+            newColumn.props.editLine.editable = true;
+            newColumn.props.base.defaultValue = f.value;
+            if (f.valid) {
+              if (!newColumn.props.verification) {
+                newColumn.props.verification = {};
+              }
+              const valids = f.valid;
+              const validIndex = valids.indexOf("required");
+              if (validIndex > -1) {
+                newColumn.props.verification.required = true;
+                valids.splice(validIndex, 1);
+              }
+              newColumn.props.verification.type = valids;
+            }
+          } else {
+            newColumn.props.editLine.editable = false;
+          }
+          if (!newColumn.props.format) {
+            newColumn.props.format = {};
+          }
+          tableItem.items.push(newColumn);
+        }
+      }
+      generateListOperateColumn(tableItem);
+      if (!tableItem.props.dataOrigin) {
+        tableItem.props.dataOrigin = {};
+      }
+      tableItem.props.dataOrigin.optionValueSetType = "dataTable";
+      tableItem.tableSysCode = model.systemCode;
+      tableItem.tableSysVersion = model.systemVersion;
+      tableItem.props.dataOrigin.tableName = model.tableName;
+      tableItem.props.dataOrigin.alias = model.tableAlias;
+      tableItem.modelFields = model.modelFields;
+      items.push(tableItem);
+      if (!pageDesign.items) {
+        pageDesign.items = [];
+      }
+      for (let item of items) {
+        pageDesign.items.push(item);
+      }
+      pageDesign.pageType = model.pageType;
+    }
+    function generateListOperateColumn(gridConf) {
+      let operateIndex = -1;
+      const gridItems = gridConf.items;
+      for (let index = 0; index < gridItems.length; index++) {
+        const item = gridItems[index];
+        if (item.props && item.props.base && item.props.base.prop == "operation") {
+          operateIndex = index;
+          break;
+        }
+      }
+      if (operateIndex == -1) {
+        console.log("未找到操作列!", gridConf);
+        return;
+      }
+      const operateItem = gridItems[operateIndex];
+      if (model.listButtons.length == 0) {
+        gridItems.splice(operateIndex, 1);
+        gridConf.props.base.showOperation = false;
+        return;
+      }
+      gridConf.props.base.showOperation = true;
+      operateItem.props.base.listColumnFixed = "right";
+      gridItems.splice(operateIndex, 1);
+      gridItems.push(operateItem);
+      gridConf.btnList = [];
+      model.listButtons.sort((a, b) => {
+        const btnOption1 = buttonMap[a];
+        const btnOption2 = buttonMap[b];
+        if (!btnOption1 || !btnOption2) {
+          return 0;
+        }
+        const index1 = btnOption1.index;
+        const index2 = btnOption2.index;
+        if (index1 < index2) {
+          return -1;
+        } else if (index2 > index1) {
+          return 1;
+        } else {
+          return 0;
+        }
+      });
+      for (let eventName of model.listButtons) {
+        const option = buttonMap[eventName];
+        const btnItem = generateBtnConf(option ? option.label : "按钮", eventName);
+        if (btnItem.props && btnItem.props.base) {
+          btnItem.props.base.size = "small";
+        }
+        gridConf.btnList.push(btnItem);
+      }
+    }
+    function updatePageDesignInfo(newItems) {
+      if (!pageDesign.items) {
+        pageDesign.items = [];
+      }
+      if (newItems) {
+        for (let item of newItems) {
+          pageDesign.items.push(item);
+        }
+      }
+      pageDesign.pageType = model.pageType;
+      pageDesign.tableAlias = model.tableAlias;
+      pageDesign.tableName = model.tableName;
+      pageDesign.tableSysCode = model.systemCode;
+      pageDesign.tableSysVersion = model.systemVersion;
+      pageDesign.props.activeWorkflow = model.isWorkflow;
+      pageDesign.modelFields = model.modelFields;
+      pageDesignUtil.setPageContext(pageDesign);
+    }
+    function generateTools() {
+      const toolsConf = generateConf("tools");
+      if (!toolsConf) {
+        return null;
+      }
+      if (!toolsConf.items) {
+        toolsConf.items = [];
+      }
+      if (!model.buttons) {
+        return toolsConf;
+      }
+      model.buttons.sort((a, b) => {
+        const btnOption1 = buttonMap[a];
+        const btnOption2 = buttonMap[b];
+        if (!btnOption1 || !btnOption2) {
+          return 0;
+        }
+        const index1 = btnOption1.index;
+        const index2 = btnOption2.index;
+        return index2 > index1 ? 1 : 0;
+      });
+      for (let eventName of model.buttons) {
+        const btnOption2 = buttonMap[eventName];
+        if (!btnOption2) {
+          continue;
+        }
+        let btnItem = null;
+        if (btnOption2.name == "button-detail") {
+          btnItem = generateBtnConf(btnOption2.label, eventName);
+        } else {
+          btnItem = generateConf(btnOption2.name);
+        }
+        if (!btnItem) {
+          console.log("未知的类型,", btnOption2);
+          continue;
+        }
+        toolsConf.items.push(btnItem);
+      }
+      return toolsConf;
+    }
+    function generateBtnConf(title, eventName) {
+      const btnItem = generateConf("button-detail");
+      if (!btnItem) {
+        console.log("未知的类型,", btnOption);
+        return;
+      }
+      if (!btnItem.props.base) {
+        btnItem.props.base = {};
+      }
+      btnItem.props.base.title = title;
+      if (eventName && btnItem.events) {
+        const clickEvents = btnItem.events.filter((event) => {
+          return event.name === "click";
+        });
+        for (let clickEvent of clickEvents) {
+          clickEvent.componentName = btnItem.name;
+          clickEvent.componentLabel = btnItem.label;
+          clickEvent.componentUuid = btnItem.uuid;
+          clickEvent.componentProp = null;
+          clickEvent.componentIndex = null;
+          clickEvent.eventName = eventName;
+          clickEvent.isStandard = true;
+          clickEvent.title = title;
+        }
+      }
+      return btnItem;
+    }
+    function generateConf(name) {
+      const itemConf = getDesignConfByName(name);
+      if (!itemConf) {
+        return null;
+      }
+      const newConf = deepCopy(itemConf);
+      newConf.uuid = getUuidv4();
+      delete newConf.designComponent;
+      delete newConf.attrComponent;
+      delete newConf.renderComponent;
+      if (!newConf.props) {
+        newConf.props = {};
+      }
+      return newConf;
+    }
+    __expose({
+      openDialog
+    });
+    return (_ctx, _cache) => {
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_radio = resolveComponent("el-radio");
+      const _component_el_radio_group = resolveComponent("el-radio-group");
+      const _component_el_form_item = resolveComponent("el-form-item");
+      const _component_el_col = resolveComponent("el-col");
+      const _component_el_switch = resolveComponent("el-switch");
+      const _component_el_input = resolveComponent("el-input");
+      const _component_el_row = resolveComponent("el-row");
+      const _component_el_checkbox = resolveComponent("el-checkbox");
+      const _component_el_checkbox_group = resolveComponent("el-checkbox-group");
+      const _component_el_form = resolveComponent("el-form");
+      const _component_el_divider = resolveComponent("el-divider");
+      const _component_el_dialog = resolveComponent("el-dialog");
+      return openBlock(), createElementBlock(Fragment, null, [
+        createVNode(_component_el_dialog, {
+          modelValue: dialogVisible.value,
+          "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => dialogVisible.value = $event),
+          "close-on-press-escape": "",
+          title: "快捷添加",
+          onClose: _cache[6] || (_cache[6] = ($event) => emits("close")),
+          width: "900"
+        }, {
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_1, [
+              createVNode(_component_el_button, {
+                size: "small",
+                type: "primary",
+                style: { "margin-left": "10px" },
+                icon: unref(Check),
+                onClick: confirmAdd
+              }, {
+                default: withCtx(() => [
+                  createTextVNode("确定")
+                ]),
+                _: 1
+              }, 8, ["icon"])
+            ]),
+            createVNode(_component_el_form, {
+              style: { "margin-top": "15px" },
+              size: "small"
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_el_row, null, {
+                  default: withCtx(() => [
+                    createVNode(_component_el_col, { span: 6 }, {
+                      default: withCtx(() => [
+                        createVNode(_component_el_form_item, {
+                          label: "    页面类型",
+                          class: "amb-design-attr-item"
+                        }, {
+                          default: withCtx(() => [
+                            createVNode(_component_el_radio_group, {
+                              modelValue: model.pageType,
+                              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.pageType = $event)
+                            }, {
+                              default: withCtx(() => [
+                                createVNode(_component_el_radio, { value: "form" }, {
+                                  default: withCtx(() => [
+                                    createTextVNode("表单")
+                                  ]),
+                                  _: 1
+                                }),
+                                createVNode(_component_el_radio, { value: "list" }, {
+                                  default: withCtx(() => [
+                                    createTextVNode("台帐")
+                                  ]),
+                                  _: 1
+                                })
+                              ]),
+                              _: 1
+                            }, 8, ["modelValue"])
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    }),
+                    createVNode(_component_el_col, { span: 4 }, {
+                      default: withCtx(() => [
+                        createVNode(_component_el_form_item, {
+                          label: "工作流模式",
+                          class: "amb-design-attr-item"
+                        }, {
+                          default: withCtx(() => [
+                            createVNode(_component_el_switch, {
+                              disabled: model.pageType != "form",
+                              modelValue: model.isWorkflow,
+                              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => model.isWorkflow = $event)
+                            }, null, 8, ["disabled", "modelValue"])
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    }),
+                    createVNode(_component_el_col, { span: 12 }, {
+                      default: withCtx(() => [
+                        createVNode(_component_el_form_item, {
+                          label: "数据表",
+                          class: "amb-design-attr-item"
+                        }, {
+                          default: withCtx(() => [
+                            createVNode(_component_el_input, {
+                              modelValue: model.tableAlias,
+                              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => model.tableAlias = $event),
+                              title: model.tableAlias,
+                              clearable: "",
+                              readonly: "true",
+                              onClick: selectTable
+                            }, {
+                              append: withCtx(() => [
+                                createVNode(_component_el_button, {
+                                  icon: unref(Search),
+                                  onClick: selectTable,
+                                  size: "small"
+                                }, null, 8, ["icon"]),
+                                createVNode(_component_el_button, {
+                                  icon: unref(Close),
+                                  onClick: clearTable,
+                                  title: "Clear",
+                                  size: "small"
+                                }, null, 8, ["icon"])
+                              ]),
+                              _: 1
+                            }, 8, ["modelValue", "title"])
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                createVNode(_component_el_form_item, {
+                  label: "    可选功能",
+                  class: "amb-design-attr-item"
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_el_checkbox_group, {
+                      modelValue: model.buttons,
+                      "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => model.buttons = $event),
+                      onChange: btnSelectChange
+                    }, {
+                      default: withCtx(() => [
+                        (openBlock(true), createElementBlock(Fragment, null, renderList(buttonOptions.value, (btn) => {
+                          return openBlock(), createBlock(_component_el_checkbox, {
+                            value: btn.value,
+                            label: btn.label
+                          }, null, 8, ["value", "label"]);
+                        }), 256))
+                      ]),
+                      _: 1
+                    }, 8, ["modelValue"])
+                  ]),
+                  _: 1
+                }),
+                createVNode(_component_el_form_item, {
+                  label: "行编辑功能",
+                  class: "amb-design-attr-item"
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_el_checkbox_group, {
+                      modelValue: model.listButtons,
+                      "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => model.listButtons = $event)
+                    }, {
+                      default: withCtx(() => [
+                        (openBlock(), createElementBlock(Fragment, null, renderList(listEditButtons, (btn) => {
+                          return createVNode(_component_el_checkbox, {
+                            disabled: model.pageType != "list",
+                            value: btn.value,
+                            label: btn.label
+                          }, null, 8, ["disabled", "value", "label"]);
+                        }), 64))
+                      ]),
+                      _: 1
+                    }, 8, ["modelValue"])
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }),
+            createVNode(_component_el_divider, { style: { "margin-bottom": "10px", "margin-top": "-10px" } }),
+            createVNode(_sfc_main$1, {
+              model,
+              ref_key: "addFieldsRef",
+              ref: addFieldsRef,
+              height: tableHeight.value
+            }, null, 8, ["model", "height"])
+          ]),
+          _: 1
+        }, 8, ["modelValue"]),
+        createVNode(_sfc_main$2, {
+          ref_key: "selectTableDialog",
+          ref: selectTableDialog,
+          onSelectTable,
+          systemCode: unref(pageDesign).systemCode,
+          systemVersion: unref(pageDesign).systemVersion
+        }, null, 8, ["systemCode", "systemVersion"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/es/components/design/views/design/view/components/quick-add-dialog.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./quick-add-dialog.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/es/components/design/views/design/view/components/quick-add-fields.vue.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 修改默认的字段
+ */
+declare function updateInitFields(): void;
+declare const _default: import('vue').DefineComponent<{
+    model: {
+        type: ObjectConstructor;
+    };
+}, {
+    updateInitFields: typeof updateInitFields;
+}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    model: {
+        type: ObjectConstructor;
+    };
+}>>, {}, {}>;
+export default _default;