@epxing/business 5.3.0-beta.2 → 5.3.0-beta.4

package/dist/src/base/AppConfigFormItem.vue.js

@@ -2,23 +2,61 @@ import __cjsReq7 from "../assets/images/nav/0.png.js";
 import __cjsReq6 from "../assets/images/nav/1.png.js";
 import __cjsReq8 from "../assets/images/nav/2.png.js";
 import __cjsReq9 from "../assets/images/nav/3.svg.js";
-import { createVNode, resolveComponent, isVNode } from "vue";
+import { createVNode, resolveComponent, createTextVNode, isVNode } from "vue";
 import AddFormItem from "@epxing/components/src/add-form-item";
+import TableForm from "@epxing/components/src/form";
+import AppSettings from "@epxing/components/src/app-settings/AppSettings.vue";
+import AppAppearancePreview from "@epxing/components/src/app-settings/AppAppearancePreview.vue";
+import { createAppUiDraft } from "@epxing/core/src/app-ui-settings";
+import { captureRef } from "@epxing/core/src/capture-ref";
 function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
 }
 const _sfc_main = {
   name: "epx-base-app-config-form-item",
   extends: AddFormItem,
+  components: {
+    AppSettings,
+    AppAppearancePreview,
+    TableForm
+  },
   data() {
     return {
       config: {},
-      fieldsConfigs: []
+      fieldsConfigs: [],
+      layoutFieldsConfigs: [],
+      activeGroup: "theme",
+      uiDraft: {},
+      initialConfig: "{}",
+      syncingDraft: true,
+      settingsGroups: [{
+        key: "theme",
+        label: "主题与配色"
+      }, {
+        key: "layout",
+        label: "导航与布局"
+      }, {
+        key: "style",
+        label: "界面风格"
+      }, {
+        key: "tabs",
+        label: "页签设置"
+      }, {
+        key: "page",
+        label: "页面与效果"
+      }]
     };
   },
   computed: {
+    readOnly() {
+      return ["DETAIL", "READONLY"].includes(this.componentType);
+    },
     showFieldsConfigs() {
-      return this.fieldsConfigs.filter((item) => {
+      return this.layoutFieldsConfigs.filter((item) => {
+        const themeKeys = ["navBackgroundColorType", "navBackgroundColor"];
+        const pageKeys = ["pageBackgroundType", "pageBackgroundColor", "pageBackgroundGradient", "pageBackgroundImage", "pageBackgroundSize"];
+        const group = themeKeys.includes(item.key) ? "theme" : pageKeys.includes(item.key) ? "page" : "layout";
+        if (group !== this.activeGroup) return false;
         let flag = true;
         if (item.showFlag) {
           for (const key in item.showFlag) {
@@ -35,6 +73,7 @@ const _sfc_main = {
   watch: {
     config: {
       handler(v) {
+        if (this.syncingDraft || this.readOnly) return;
         const APP_CONFIG = JSON.stringify(v);
         this.$emit("change", {
           ...this.data,
@@ -42,6 +81,15 @@ const _sfc_main = {
         });
       },
       deep: true
+    },
+    uiDraft: {
+      deep: true,
+      handler(value) {
+        if (!this.syncingDraft && !this.readOnly) this.config.uiDefaults = JSON.parse(JSON.stringify(value));
+      }
+    },
+    "formData.APP_CONFIG"(value) {
+      if (value !== JSON.stringify(this.config)) this.loadConfig(value);
     }
   },
   methods: {
@@ -122,6 +170,9 @@ const _sfc_main = {
         key: "navBackgroundColor",
         label: "自定义导航背景色",
         type: "color",
+        showFlag: {
+          navBackgroundColorType: "custom"
+        },
         predefineColors: []
       }, {
         key: "navOperates",
@@ -218,42 +269,6 @@ const _sfc_main = {
         type: "number",
         defaultValue: 992
       }];
-      if (this.appConfig["SYSTEM|TYPE"] === "hall") {
-        fieldsConfigs.splice(9, 0, {
-          key: "componentMargin",
-          label: "页面组件间距",
-          type: "radio",
-          options: [{
-            label: "小",
-            value: "small"
-          }, {
-            label: "中",
-            value: "medium"
-          }, {
-            label: "默认",
-            value: "base"
-          }],
-          defaultValue: "base"
-        }, {
-          key: "borderRadius",
-          label: "圆角",
-          type: "radio",
-          options: [{
-            label: "无",
-            value: "zero"
-          }, {
-            label: "默认",
-            value: "base"
-          }, {
-            label: "中",
-            value: "medium"
-          }, {
-            label: "大",
-            value: "large"
-          }],
-          defaultValue: "base"
-        });
-      }
       for (const item of fieldsConfigs) {
         item.state = pageType;
         if (item.options) item.options = item.options.map((item2) => ({
@@ -263,12 +278,23 @@ const _sfc_main = {
           preview: item2.preview
         }));
       }
-      this.fieldsConfigs = fieldsConfigs;
+      this.layoutFieldsConfigs = fieldsConfigs;
+      this.fieldsConfigs = [{
+        attriName: "APP_CONFIG",
+        state: "HIDDEN"
+      }];
     },
     changeConfigItem(key, value) {
+      if (this.readOnly) return;
       this.config[key] = value;
     },
     save() {
+      var _a;
+      if (this.readOnly) return;
+      if (((_a = this.form) == null ? void 0 : _a.submitForm) && !this.isEdit) {
+        this.$nextTick(() => this.form.submitForm());
+        return;
+      }
       const params = {};
       const {
         submitParams: querySumitParams = {}
@@ -276,7 +302,12 @@ const _sfc_main = {
       if (this.formData[this.$metaKey]) {
         params[`bean.${this.$metaKey}`] = this.formData[this.$metaKey];
       }
-      params["bean.APP_CONFIG"] = this.formData.APP_CONFIG;
+      Object.entries({
+        ...this.formData,
+        APP_CONFIG: JSON.stringify(this.config)
+      }).forEach(([key, value]) => {
+        params[`bean.${key}`] = value;
+      });
       const {
         componentEvents = {}
       } = this.$configs;
@@ -298,47 +329,150 @@ const _sfc_main = {
       });
     },
     switchNav(value, item) {
-      if (item.state !== "DETAIL") {
+      if (!["DETAIL", "READONLY"].includes(item.state)) {
         this.config[item.key] = value;
       }
     },
+    loadConfig(value = "{}") {
+      this.syncingDraft = true;
+      const config = JSON.parse(value || "{}");
+      this.initialConfig = JSON.stringify(config);
+      for (const item of this.layoutFieldsConfigs) {
+        if (config[item.key] === void 0 && item.defaultValue !== void 0) config[item.key] = item.defaultValue;
+      }
+      this.config = config;
+      this.uiDraft = createAppUiDraft(config);
+      this.$nextTick(() => {
+        this.syncingDraft = false;
+      });
+    },
+    restorePlatform() {
+      if (this.readOnly) return;
+      this.uiDraft = createAppUiDraft();
+      const businessKeys = ["appPageType", "pageId", "navComponent", "navOperates", "mobileSize"];
+      for (const field of this.layoutFieldsConfigs) {
+        if (businessKeys.includes(field.key)) continue;
+        if (field.defaultValue !== void 0) this.config[field.key] = field.defaultValue;
+        else delete this.config[field.key];
+      }
+    },
+    discardDraft() {
+      const initial = this.initialConfig;
+      this.loadConfig(initial);
+      this.$emit("change", {
+        ...this.data,
+        APP_CONFIG: initial
+      });
+    },
     renderForm() {
-      let _slot;
-      return createVNode(resolveComponent("el-form"), {
-        "class": "app-config-form",
-        "inline": true,
-        "label-position": "right",
-        "label-width": "140px"
-      }, _isSlot(_slot = this.showFieldsConfigs.map((item) => createVNode(resolveComponent("el-form-item"), {
-        "label": `${item.label}`,
-        "style": item.block ? {
-          width: "100%"
-        } : null
+      var _a;
+      return createVNode("section", {
+        "class": "epx-app-interface-settings"
+      }, [createVNode("div", {
+        "hidden": true
+      }, [createVNode(TableForm, {
+        "ref": captureRef(this, "form"),
+        "fieldsConfigs": this.fieldsConfigs,
+        "modelValue": {
+          ...this.data,
+          APP_CONFIG: JSON.stringify(this.config)
+        },
+        "type": "auto",
+        "showRelyFlag": false,
+        "valueRelyFlag": false,
+        "requiredRelyFlag": false
+      }, null)]), createVNode("div", {
+        "class": "epx-app-interface-settings__heading"
+      }, [createVNode("p", null, [createTextVNode("设置当前应用的默认外观；用户的个人选择优先。右侧预览不会改变当前界面。")])]), createVNode("div", {
+        "class": "epx-app-interface-settings__workspace"
+      }, [createVNode("nav", {
+        "class": "epx-app-interface-settings__nav",
+        "aria-label": "界面设置分组"
+      }, [this.settingsGroups.map((group) => createVNode("button", {
+        "type": "button",
+        "key": group.key,
+        "class": {
+          "is-active": this.activeGroup === group.key
+        },
+        "aria-current": this.activeGroup === group.key ? "page" : void 0,
+        "onClick": () => {
+          this.activeGroup = group.key;
+        }
+      }, [group.label]))]), createVNode("div", {
+        "class": "epx-app-interface-settings__editor"
+      }, [createVNode("h4", null, [(_a = this.settingsGroups.find((group) => group.key === this.activeGroup)) == null ? void 0 : _a.label]), createVNode(AppSettings, {
+        "embedded": true,
+        "settings": this.uiDraft,
+        "sections": [this.activeGroup],
+        "disabled": this.readOnly
+      }, null), this.renderLayoutFields()]), createVNode(AppAppearancePreview, {
+        "config": this.config,
+        "settings": this.uiDraft,
+        "title": this.data.NAME || "应用名称"
+      }, null)]), !this.readOnly && createVNode("div", {
+        "class": "epx-app-interface-settings__actions"
+      }, [createVNode(resolveComponent("el-button"), {
+        "onClick": this.restorePlatform
       }, {
-        default: () => [item.key === "navType" ? createVNode("div", {
-          "class": ["nav-type", {
-            "is-disabled": item.state === "DETAIL"
+        default: () => [createTextVNode("恢复平台默认")]
+      }), createVNode(resolveComponent("el-button"), {
+        "onClick": this.discardDraft
+      }, {
+        default: () => [createTextVNode("撤销本次修改")]
+      }), createVNode(resolveComponent("el-button"), {
+        "type": "primary",
+        "onClick": this.save
+      }, {
+        default: () => [createTextVNode("保存")]
+      })])]);
+    },
+    renderLayoutFields() {
+      let _slot2;
+      return createVNode(resolveComponent("el-form"), {
+        "disabled": this.readOnly,
+        "class": "epx-base-app-config-form-item__form"
+      }, _isSlot(_slot2 = this.showFieldsConfigs.map((item) => {
+        let _slot;
+        return createVNode("div", {
+          "key": item.key,
+          "class": ["epx-app-interface-settings__field", {
+            "epx-app-interface-settings__field--block": item.block || item.type === "radio"
           }]
-        }, [item.options.map((option) => createVNode("div", {
+        }, [createVNode("span", {
+          "class": "epx-app-interface-settings__label"
+        }, [item.label]), createVNode("div", {
+          "class": "epx-app-interface-settings__control"
+        }, [item.key === "navType" ? createVNode("div", {
+          "class": "nav-type",
+          "role": "group",
+          "aria-label": item.label
+        }, [item.options.map((option) => createVNode("button", {
+          "type": "button",
           "class": ["nav-type__item", {
             "is-active": this.config[item.key] === option.id
           }],
           "key": option.id,
+          "disabled": this.readOnly,
+          "aria-pressed": this.config[item.key] === option.id,
           "onClick": this.switchNav.bind(this, option.id, item)
-        }, [createVNode("div", null, [createVNode("img", {
-          "src": option.preview
-        }, null)]), createVNode("p", null, [option.name])]))]) : item.type === "radio" ? createVNode(resolveComponent("epx-radio"), {
-          "modelValue": this.config[item.key],
-          "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
-          "fieldConfigs": {
-            state: item.state,
-            attriName: item.key,
-            attriLabel: item.label,
-            options: item.options
-          }
-        }, null) : item.type === "object" ? createVNode(resolveComponent("epx-visual-config-object"), {
+        }, [createVNode("img", {
+          "src": option.preview,
+          "alt": ""
+        }, null), createVNode("span", null, [option.name])]))]) : item.type === "radio" ? createVNode(resolveComponent("el-radio-group"), {
           "modelValue": this.config[item.key],
           "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
+          "size": "small",
+          "aria-label": item.label
+        }, _isSlot(_slot = item.options.map((option) => createVNode(resolveComponent("el-radio-button"), {
+          "key": option.id,
+          "value": option.id
+        }, {
+          default: () => [option.name]
+        }))) ? _slot : {
+          default: () => [_slot]
+        }) : item.type === "object" ? createVNode(resolveComponent("epx-visual-config-object"), {
+          "value": this.config[item.key],
+          "onChangeConfigs": this.changeConfigItem.bind(this, item.key),
           "label": item.label,
           "object": item.object,
           "flag": item.flag,
@@ -348,11 +482,11 @@ const _sfc_main = {
           "modelValue": this.config[item.key],
           "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
           "predefine": item.predefineColors,
-          "disabled": item.state === "DETAIL"
+          "disabled": this.readOnly
         }, null) : item.type === "gradient" ? createVNode(resolveComponent("epx-color-picker"), {
           "modelValue": this.config[item.key],
           "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
-          "disabled": item.state === "DETAIL"
+          "disabled": this.readOnly
         }, null) : item.type === "photo" ? createVNode(resolveComponent("epx-photo"), {
           "modelValue": this.config[item.key],
           "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
@@ -361,7 +495,7 @@ const _sfc_main = {
             attriName: item.key,
             attriLabel: item.label
           }
-        }, null) : item.type === "num" ? createVNode(resolveComponent("epx-number"), {
+        }, null) : ["num", "number"].includes(item.type) ? createVNode(resolveComponent("epx-number"), {
           "modelValue": this.config[item.key],
           "onUpdate:modelValue": ($event) => this.config[item.key] = $event,
           "fieldConfigs": {
@@ -383,23 +517,14 @@ const _sfc_main = {
             attriName: item.key,
             attriLabel: item.label
           }
-        }, null)]
-      }))) ? _slot : {
-        default: () => [_slot]
+        }, null)])]);
+      })) ? _slot2 : {
+        default: () => [_slot2]
       });
     }
   },
   created() {
-    const {
-      APP_CONFIG = "{}"
-    } = this.data;
-    const appConfig = JSON.parse(APP_CONFIG);
-    for (const item of this.fieldsConfigs) {
-      if (!appConfig[item.key] && item.defaultValue) {
-        appConfig[item.key] = item.defaultValue;
-      }
-    }
-    this.config = appConfig;
+    this.loadConfig(this.data.APP_CONFIG);
   }
 };
 export {

package/dist/src/base/CommonFieldList.js

@@ -5,7 +5,7 @@ import _sfc_main from "./CommonFieldList.vue.js";
 /* empty css                     */
 /* empty css                     */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
-const CommonFieldList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f01084a3"]]);
+const CommonFieldList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2c565e21"]]);
 export {
   CommonFieldList as default
 };

package/dist/src/base/CommonFieldList.vue.js

@@ -376,7 +376,7 @@ const _sfc_main = {
         }
       }, {
         "append-to-body": true,
-        "class": "show-field-dialog",
+        "class": "show-field-dialog epx-common-field-dialog",
         "destroy-on-close": true,
         "width": "800px",
         "top": "10vh"
@@ -476,6 +476,7 @@ const _sfc_main = {
     },
     renderNameDialog() {
       return createVNode(resolveComponent("el-dialog"), mergeProps({
+        "class": "epx-common-field-dialog",
         "modelValue": this.addCommonFieldDialod
       }, {
         "onUpdate:modelValue": (v) => {

package/dist/src/base/ConfigModuleIndex.js

@@ -1,6 +1,7 @@
 import '../../style.css';
 import ModuleIndexVue from "@epxing/components/src/menu-index";
 import { openExternalMenu } from "@epxing/utils/src/menu-open";
+import { findMenuByKey, getRouteMenuKey } from "@epxing/core/src/menu-route";
 import { resolveComponent, openBlock, createElementBlock, createBlock, KeepAlive, createCommentVNode, createElementVNode } from "vue";
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
 const _comp = {
@@ -11,7 +12,42 @@ const _comp = {
       data: {}
     };
   },
+  computed: {
+    configMenuKey() {
+      return this.$route.name === "system" ? getRouteMenuKey(this.$route) : "";
+    },
+    initRoute() {
+      const menu = findMenuByKey(this.menu, this.configMenuKey);
+      if (menu && menu.OPEN_TYPE !== "1") {
+        return { moduleId: menu.ID, component: "module-list-page", pageId: menu.MAIN_PAGE, menuTitle: menu.text };
+      }
+      return ModuleIndexVue.computed.initRoute.call(this);
+    }
+  },
+  watch: {
+    configMenuKey: "restoreMenuFromRoute",
+    menu: "restoreMenuFromRoute",
+    "data.ID": "restoreMenuFromRoute"
+  },
   methods: {
+    restoreMenuFromRoute() {
+      if (this.$route.name !== "system") return;
+      this.$nextTick(() => {
+        var _a;
+        const view = this.$refs.router;
+        if (!view || !this.data.ID) return;
+        const menu = findMenuByKey(this.menu, this.configMenuKey);
+        if (menu) {
+          if (((_a = view.route) == null ? void 0 : _a.moduleId) === menu.ID) return;
+          const activeTab = this.$tabs.find((tab) => tab.active);
+          if (menu.OPEN_TYPE === "1" && (activeTab == null ? void 0 : activeTab.moduleId) === menu.ID) return;
+          this.toPage(menu);
+        } else if (!this.configMenuKey) {
+          view.clearPage();
+          view.createPage(this.initRoute);
+        }
+      });
+    },
     getInfo() {
       const { name, params = {}, query = {} } = this.$route;
       const { system: querySystem = "" } = query;
@@ -113,11 +149,12 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           showNav: false,
           class: "aside hidden-sm-and-down",
           modules: _ctx.menu,
+          activeMenuId: _ctx.configMenuKey,
           moduleName: `${_ctx.data.NAME || _ctx.$t("application")}${_ctx.$t("configuration")}`,
           subTitle: _ctx.data["CLIENT#"],
           toPages: _ctx.toPages,
           clickItem: _ctx.toPage
-        }, null, 8, ["modules", "moduleName", "subTitle", "toPages", "clickItem"])) : createCommentVNode("", true)
+        }, null, 8, ["modules", "activeMenuId", "moduleName", "subTitle", "toPages", "clickItem"])) : createCommentVNode("", true)
       ], 1024)),
       createElementVNode("div", _hoisted_3, [
         _ctx.menu.length > 0 ? (openBlock(), createBlock(_component_epx_router_view, {

package/dist/src/base/ManageAppNav.js

@@ -3,7 +3,7 @@ import _sfc_main from "./ManageAppNav.vue.js";
 /* empty css                  */
 /* empty css                  */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
-const ManageAppNav = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2016b718"]]);
+const ManageAppNav = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-da55cb5e"]]);
 export {
   ManageAppNav as default
 };

package/dist/src/base/ManageMenu.js

@@ -910,7 +910,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, 8, ["title", "modelValue", "width"])
   ], 4);
 }
-const ManageMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3c56dadf"]]);
+const ManageMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-1d8c4e0d"]]);
 export {
   ManageMenu as default
 };