@epxing/core 5.3.0-beta.2 → 5.3.0-beta.3

package/src/ui-settings.js

@@ -31,6 +31,7 @@ const LEGACY_PERSIST = 'epx_frame_tabs_persist'
 export const DEFAULTS = {
   themeMode: 'light', // 主题模式 light|dark|auto（auto 跟随系统 prefers-color-scheme）
   themeColor: '', // 主题色预设名（classicblue/purple/...；'' = 默认蓝，走既有 data-theme 兜底）
+  customTheme: null, // 用户选择的自定义主题色快照 { code, color }，刷新后也能在引导期恢复
   grayMode: false, // 灰色模式（全站置灰，哀悼日用）
   weakMode: false, // 色弱模式（invert 反色，参考 pure-admin；与灰色模式可叠加）
   menuAccordion: true, // 菜单手风琴（唯一展开）——参考 pure-admin；false=可同时展开多组
@@ -54,7 +55,7 @@ export const DEFAULTS = {
   tabsPosition: 'below', // 标签行位置 below|nav|none
   tabsStyle: 'smart', // 页签风格 smart|card|chrome(谷歌)
   tabsKeepAlive: true, // 页签缓存(会话级 keep-alive)：开=切走保活/点回保持原样；关=切走即销毁/每次点开重新加载。不落盘不整组恢复
-  settingsGroups: ['theme', 'layout', 'tabs', 'page', 'security'] // 设置抽屉折叠分组的展开态(记住用户的折叠选择，跨会话)
+  settingsGroups: ['theme', 'style', 'layout', 'tabs', 'page', 'security'] // 设置抽屉折叠分组的展开态(记住用户的折叠选择，跨会话)
 }
 
 // 导航布局模式 → 顶部/侧边导航显示 + 双列（供 AppIndex/module-index-page 派生显隐）
@@ -173,19 +174,17 @@ let _suppressPersist = false
 // applyAppDefaults 注入的“应用默认值”（键→值）：persistDiff 据此把它排除在用户偏好之外（跨 HMR 保号）
 const _appDefaultVals = (_hot && _hot.data.appDefaultVals) || {}
 if (_hot) _hot.data.appDefaultVals = _appDefaultVals
-// 只把“用户显式改过”的键写进 localStorage（差量）：排除等于代码默认、以及等于应用默认注入值的键。
-// 关键：localStorage 只存用户偏好差量，applyAppDefaults 的 userSet[k]===undefined 判定才准确，
-// 不会把应用默认当成用户选择去遮蔽其它应用的默认（旧实现整包 JSON.stringify 落盘正是此 bug 根源）。
-function persistDiff () {
+// 只记录本次由用户改变的字段。默认值注入期间关闭监听，避免把应用默认记成个人选择。
+function persistDiff (current, previous) {
   try {
-    const out = {}
+    const out = JSON.parse(window.localStorage.getItem(KEY) || '{}') || {}
+    const next = JSON.parse(current)
+    const before = JSON.parse(previous)
     for (const k of Object.keys(DEFAULTS)) {
-      if (k in _appDefaultVals && uiSettings[k] === _appDefaultVals[k]) continue
-      // 数组键按值比较(JSON)，标量键按引用/值比较——只把「和默认不同」的写进用户差量
-      const cur = uiSettings[k]; const def = DEFAULTS[k]
-      const changed = Array.isArray(def) ? JSON.stringify(cur) !== JSON.stringify(def) : cur !== def
-      if (changed) out[k] = cur
+      // 显式选回 false、空串或平台默认值同样是个人覆盖，不能按值相等丢弃。
+      if (k !== 'tabsKeepAlive' && JSON.stringify(next[k]) !== JSON.stringify(before[k])) out[k] = next[k]
     }
+    delete out.tabsKeepAlive
     window.localStorage.setItem(KEY, JSON.stringify(out))
   } catch (e) {}
 }
@@ -195,10 +194,10 @@ export function persistUiSettings () {
   if (_hot) _hot.data.watching = true
   else _watching = true
   // flush:'sync' —— 让 _suppressPersist 的开合与写盘同步生效（设置变更低频，同步落盘无性能负担）
-  watch(uiSettings, () => {
+  watch(() => JSON.stringify(Object.fromEntries(Object.keys(DEFAULTS).map(k => [k, uiSettings[k]]))), (current, previous) => {
     if (_suppressPersist) return
-    persistDiff()
-  }, { deep: true, flush: 'sync' })
+    persistDiff(current, previous)
+  }, { flush: 'sync' })
 }
 // import 即开始持久化（副作用一次）
 persistUiSettings()
@@ -208,11 +207,41 @@ let _mql = null
 // 用户主题色之外的“底色” data-theme（角色/自定义肤色，initTheme 时快照）——清空主题色时回退到它，
 // 否则选过预设色再清空/恢复默认时 data-theme 会卡住（老 applyTheme 无 else 分支的 bug）。
 let _baseTheme = ''
+// --color-primary 使用 RGB 三元组，不能直接写入 #hex 或 rgb(...)。
+export function normalizeThemeColor (color) {
+  if (typeof color !== 'string') return ''
+  const value = color.trim()
+  const hex = value.match(/^#([\da-f]{3}|[\da-f]{6})$/i)
+  if (hex) {
+    const full = hex[1].length === 3 ? [...hex[1]].map(c => c + c).join('') : hex[1]
+    return [0, 2, 4].map(i => parseInt(full.slice(i, i + 2), 16)).join(',')
+  }
+  const rgb = value.match(/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i)
+  return rgb && rgb.slice(1).every(c => Number(c) <= 255) ? rgb.slice(1).map(Number).join(',') : ''
+}
+
 export function applyTheme () {
   const html = document.documentElement
+  const preset = THEME_COLORS.find(c => c.name === uiSettings.themeColor)
+  const custom = uiSettings.customTheme?.code === uiSettings.themeColor ? uiSettings.customTheme : null
+  const channels = normalizeThemeColor(preset?.color || custom?.color)
+  // 显式选择覆盖旧换肤写在 body 上的颜色；选择预设和自定义色走同一条路径。
+  let colorStyle = document.getElementById('epx-ui-theme-color')
+  if (channels) {
+    html.style.removeProperty('--color-primary')
+    if (!colorStyle) {
+      colorStyle = document.createElement('style')
+      colorStyle.id = 'epx-ui-theme-color'
+      document.head.appendChild(colorStyle)
+    }
+    const selector = `html[data-theme="${preset ? preset.name : 'custom'}"]`
+    colorStyle.textContent = `${selector}, ${selector} body { --color-primary: ${channels}; }`
+  } else if (colorStyle) {
+    colorStyle.remove()
+  }
   // 主题色：非空 → data-theme=预设名（既有换肤链）；为空 → 回退底色（角色/自定义肤色），无底色则移除属性
   if (uiSettings.themeColor) {
-    html.setAttribute('data-theme', uiSettings.themeColor)
+    html.setAttribute('data-theme', custom && channels ? 'custom' : uiSettings.themeColor)
   } else if (_baseTheme) {
     html.setAttribute('data-theme', _baseTheme)
   } else {
@@ -248,7 +277,7 @@ export function initTheme () {
   if (!_baseTheme) _baseTheme = document.documentElement.getAttribute('data-theme') || ''
   applyTheme()
   watch(() => [
-    uiSettings.themeMode, uiSettings.themeColor, uiSettings.grayMode, uiSettings.weakMode,
+    uiSettings.themeMode, uiSettings.themeColor, uiSettings.customTheme, uiSettings.grayMode, uiSettings.weakMode,
     uiSettings.styleRadius, uiSettings.styleFont, uiSettings.styleDensity, uiSettings.styleElevation
   ], applyTheme)
   if (window.matchMedia) {
@@ -261,22 +290,29 @@ export function initTheme () {
 
 // 应用级默认注入：页面配置里配了、且用户没在设置里改过的项，用应用默认兜底。
 // 只覆盖“用户未显式设过”的项——已在 localStorage 的用户偏好不动。
-export function applyAppDefaults (defaults = {}) {
+export function applyAppDefaults (defaults = {}, { replace = false } = {}) {
   let userSet = {}
   try { userSet = JSON.parse(window.localStorage.getItem(KEY) || '{}') || {} } catch (e) {}
   // 注入期暂停落盘：应用默认只改内存生效值，不写进用户偏好（否则会跨应用串味、且遮蔽后续应用的默认）
   _suppressPersist = true
   try {
+    if (replace) {
+      Object.keys(_appDefaultVals).forEach(k => { delete _appDefaultVals[k] })
+      _baseTheme = ''
+      document.getElementById('custom-theme')?.remove()
+      document.documentElement.style.removeProperty('--color-primary')
+    }
     for (const k of Object.keys(DEFAULTS)) {
-      // 仅兜底“用户没设过、或存量等于代码默认（含旧版整包落盘的历史数据）”的项——用户显式改过的值优先
-      if (defaults[k] !== undefined && (userSet[k] === undefined || userSet[k] === DEFAULTS[k])) {
-        uiSettings[k] = defaults[k]
-        _appDefaultVals[k] = defaults[k] // 记录应用默认注入值，persistDiff 据此不把它当用户偏好落盘
+      if (defaults[k] !== undefined) _appDefaultVals[k] = defaults[k]
+      if (replace || defaults[k] !== undefined) {
+        const value = userSet[k] !== undefined ? userSet[k] : (_appDefaultVals[k] ?? DEFAULTS[k])
+        uiSettings[k] = Array.isArray(value) ? [...value] : value
       }
     }
   } finally {
     _suppressPersist = false
   }
+  if (replace) applyTheme()
 }
 
 // 老单值主题键（epx_frame_theme：预设名 / 'dark' / 自定义肤色码）→ ui-settings 的迁移。
@@ -302,14 +338,39 @@ export function migrateLegacyTheme (src) {
 
 // 恢复默认（设置面板「恢复默认」）：回到代码默认 + 清底色/旧键/自定义肤色 style，并即时应用
 export function resetUiSettings () {
-  Object.assign(uiSettings, DEFAULTS) // 用户操作，不抑制落盘——把默认值写回覆盖存量
+  _suppressPersist = true
+  Object.assign(uiSettings, DEFAULTS, { settingsGroups: [...DEFAULTS.settingsGroups] })
+  _suppressPersist = false
+  Object.keys(_appDefaultVals).forEach(k => { delete _appDefaultVals[k] })
+  try { window.localStorage.removeItem(KEY) } catch (e) {}
   _baseTheme = '' // 清除角色/自定义肤色底色，真正回到平台默认
   try {
     const legacyKeys = ['epx_frame_theme', LEGACY_STYLE, LEGACY_PERSIST]
-    legacyKeys.forEach(k => window.localStorage.removeItem(k))
+    legacyKeys.forEach(k => {
+      window.localStorage.removeItem(k)
+      window.sessionStorage.removeItem(k)
+    })
   } catch (e) {}
   const custom = document.getElementById('custom-theme')
   if (custom && custom.parentNode) custom.parentNode.removeChild(custom)
+  document.documentElement.style.removeProperty('--color-primary')
+  applyTheme()
+}
+
+// 清除个人覆盖后重新采用当前应用默认，应用默认始终不写入个人存储。
+export function restoreAppUiDefaults () {
+  const defaults = { ..._appDefaultVals }
+  const baseTheme = _baseTheme
+  const legacyColor = document.getElementById('custom-theme')?.textContent
+  resetUiSettings()
+  applyAppDefaults(defaults, { replace: true })
+  _baseTheme = baseTheme
+  if (legacyColor) {
+    const style = document.createElement('style')
+    style.id = 'custom-theme'
+    style.textContent = legacyColor
+    document.head.appendChild(style)
+  }
   applyTheme()
 }
 

package/src/views/App.vue

@@ -0,0 +1,53 @@
+<template>
+  <!-- app入口 -->
+  <component v-if="load" :is="component" :page="firstPage"></component>
+</template>
+
+<script>
+/**
+ * 应用入口  获取应用配置模板
+ */
+export default {
+  name: 'epx-app',
+  computed: {
+    appConfig () {
+      return this.$store.state.config.appConfig
+    }
+  },
+
+  data () {
+    return {
+      load: false,
+      component: 'epx-app-index',
+      firstPage: {}
+    }
+  },
+  methods: {
+    getPage () {
+      const { FIRST_PAGE, MOBILE_FIRST_PAGE } = this.appConfig
+      this.$store.dispatch({ // 加回调
+        type: 'ADD_PAGE',
+        pageId: this.$isMobile ? MOBILE_FIRST_PAGE : FIRST_PAGE
+      })
+        .then((page = {}) => {
+          const { pagePath } = page
+          this.firstPage = page
+          this.component = this.$loadComponent(pagePath, this.component)
+          this.load = true
+        })
+        .catch(() => {
+          // this.component = this.$loadComponent(null, this.component)
+          this.load = true
+        })
+    }
+  },
+  created () {
+    this.getPage()
+  }
+
+}
+</script>
+
+<style>
+
+</style>

package/src/views/AppRoleSelect.vue

@@ -0,0 +1,334 @@
+<template>
+  <div :class="{'role-select': true, 'm-role-select': $isMobile}" v-if="roleList">
+    <div class="role-select__bg" :style="clientConfig.BACKGROUND_CHOICEROLE? {backgroundImage: `url(${$util.getFileUrl(clientConfig.BACKGROUND_CHOICEROLE)})`}: {}"></div>
+    <div class="select__modal">
+      <div class="app__title">
+        <span class="app__prefix" :style="{background: appConfig.COLOR}">
+          <i :class="['app__icon fa',appConfig.ICON || 'el-icon-menu' ]"></i>
+        </span>
+        <i class="app__name">{{appConfig.NAME}}</i>
+      </div>
+      <div class="role__title">请选择您的角色</div>
+      <template v-if="roleList.length>0">
+        <el-radio-group class="radio-group" v-model="mainRole" @change="setMainRole">
+          <ul :class="{'role__list': true, 'm_role_list': $isMobile}">
+            <li class="role__item" v-for="role in roleList" :key="role.ID" @click="openApp(role)">
+              <span class="role__prefix" :style="{background: appConfig.ROLE_COLOR}">
+                <i :class="['fa',role.ICON || 'el-icon-user-solid']"></i>
+              </span>
+              <span class="role__name">{{role.NAME}}</span>
+              <span class="role__opera" @click.stop>
+                <el-radio class="radio" :label="role.ID" :value="role.ID">设为默认</el-radio>
+              </span>
+            </li>
+          </ul>
+        </el-radio-group>
+      </template>
+      <div class="no-role" v-else>
+        <p>对不起，您还未得到该应用的访问授权！</p>
+        <el-button type="primary" @click="logout">退出登录</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { roleStorage } from '@epxing/core/src/menu-route'
+import { migrateLegacyTheme, initTheme } from '@epxing/core/src/ui-settings'
+import storage from '@epxing/utils/src/storage'
+// 应用角色选择
+export default {
+  name: 'epx-app-role-select',
+  data () {
+    return {
+      roleList: null,
+      radio: '',
+      mainRole: null
+    }
+  },
+  computed: {
+    ...mapState({
+      clientConfig: state => state.config.clientConfig || {},
+      appConfig: state => state.config.appConfig || {}, // 应用配置
+      $isMobile: state => state.config.isMobile // 是否为移动端
+    })
+  },
+
+  methods: {
+    setTheme () {
+      const { 'CLIENT|THEME': clientTheme, 'SYSTEM|THEME': systemTheme } = this.appConfig
+      // 主题应用统一交给 core/ui-settings：个性化设置抽屉里选的主题色/暗色优先，老单值键
+      // epx_frame_theme 与应用配置（SYSTEM|THEME / CLIENT|THEME）只作兜底。
+      // 老实现在这里直接 setAttribute('data-theme', 老键)，会把用户在设置抽屉里选的主题色**盖掉**
+      // ——本页是顶层路由、不渲染 AppIndex，与「登录页个性化主题色不生效」是同一个病根。
+      // 预设名单也不再在本文件手抄一份（此前 AppIndex/本文件各一份，改一处即漂移）。
+      // 读取用 storage.get（sessionStorage 优先、localStorage 兜底，隐私模式/禁用存储时不抛错）而非裸 localStorage。
+      const skinCode = migrateLegacyTheme(storage.get('epx_frame_theme') || systemTheme || clientTheme)
+      // 自定义肤色码：查 SKIN_COLOR 取色注入 body{--color-primary}（data-theme=custom 迁移函数已写好）
+      if (skinCode) {
+        this.$http.find({
+          entityId: 'SKIN_COLOR',
+          'scope.CODE': skinCode
+        })
+          .then(data => {
+            const flag = /rgb\(([\d,\s]+)\)/.test(data.data.COLOR)
+            if (flag) {
+              const style = `body {--color-primary: ${RegExp.$1}}`
+              var css = document.createElement('style')
+              css.type = 'text/css'
+              css.id = 'custom-theme'
+              if (css.styleSheet) {
+                css.styleSheet.cssText = style
+              } else {
+                css.appendChild(document.createTextNode(style))
+              }
+              document.head.appendChild(css)
+            }
+          })
+      }
+      // 引导期 src/App.vue 已 initTheme()，此处幂等 no-op；保留是为了不依赖某个外壳一定调过它。
+      initTheme()
+    },
+    getServiceRoles () {
+      return this.$http.get({
+        action: 'getServiceRoles',
+        entityId: 'FM_ROLE',
+        serviceId: this.appConfig.ID,
+        order_fields: 'ORDER_NUM,LOG_C_TIME',
+        order_mode: 'asc,asc'
+      })
+        .then(role => {
+          if (role.entitys.length === 1) {
+            this.openApp(role.entitys[0])
+          } else {
+            const mainRole = role.entitys.find(role => role.MAIN_ROLE === 'true')
+            if (mainRole) {
+              this.mainRole = mainRole.ID
+              this.openApp(mainRole)
+            } else {
+            // 多个角色且没有设置默认角色
+              this.roleList = [...role.entitys]
+            }
+          }
+        })
+    },
+    setMainRole () {
+      this.$http.save({
+        action: 'setMainRole',
+        entityId: 'FM_USER_SERVICE_MAIN_ROLE',
+        serviceId: this.appConfig.ID,
+        roleId: this.mainRole
+      })
+        .then(() => {
+          this.$message.success('设置成功')
+        })
+    },
+    openApp (role) {
+      const roleCode = role.CODE + (role.TYPE === 'client' ? '-client' : '')
+      // 获取应用参数
+      const { CODE, 'SYSTEM|CODE': systemCode, 'CLIENT|CODE': clientCode } = this.appConfig
+      const { client = clientCode, system = systemCode, name: lastRouteName, ...otherParams } = this.$route.params
+      // 选定角色持久化（菜单直达路由不带 role 段，取数点从 localStorage 读）
+      roleStorage.set(client, system, roleCode)
+      let name = 'app1'
+      if (systemCode === 'epxing-frame') {
+        switch (CODE) {
+          case 'FM_SERVICE_SYSTEM':
+            name = 'system'
+            break
+          case 'FM_SERVICE_CLIENT':
+            name = 'client'
+            break
+          case 'FM_SERVICE_HALL':
+            name = 'hall'
+            break
+        }
+      }
+      // 从菜单直达链接被拦到本页的（守卫塞了 backMenu）：选完角色回到原菜单 URL
+      const { backMenu, ...restQuery } = this.$route.query
+      if (backMenu) {
+        return this.$router.replace({
+          name: name === 'hall' ? 'hallMenu' : 'appMenu',
+          params: { client, system, app: CODE, menuKey: backMenu },
+          query: restQuery
+        })
+      }
+      this.$router.replace({
+        name: lastRouteName || name,
+        params: {
+          client,
+          system,
+          app: CODE,
+          role: roleCode,
+          ...otherParams
+        },
+        query: { ...this.$route.query }
+      })
+    },
+    logout () {
+      this.$http.logout()
+        .then(() => {
+          this.$util.toLogin(true)
+        })
+    }
+  },
+  created () {
+    this.getServiceRoles()
+    this.setTheme()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.role-select{
+  height: 100%;
+  background: #F1F3F7;
+}
+.role-select__bg {
+  height: 50%;
+  background: url('@/assets/images/role_select.webp') no-repeat center;
+  background-size: cover;
+}
+.select__modal {
+  width: 1200px;
+  height: 520px;
+  overflow: auto;
+  box-sizing: border-box;
+  padding: 30px;
+  background: var(--epx-bg-card);
+  position: relative;
+  left: 50%;
+  top: -260px;
+  margin-left: -600px;
+}
+.app__prefix {
+  float: left;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  @include bg_color_primary;
+  margin-right: 20px;
+  text-align: center;
+  i {
+    font-size: 24px;
+    color: #fff;
+    line-height: 56px;
+  }
+}
+.app__name {
+  font-size: var(--epx-font-size-xl);
+  line-height: 56px;
+}
+.role__title {
+  font-size: 18px;
+  line-height: 48px;
+  text-align: center;
+  position: relative;
+  &::after {
+    content: '';
+    display: block;
+    position: absolute;
+    left: 50%;
+    bottom: 0;
+    margin-left: -38px;
+    width: 76px;
+    height: 2px;
+    background: #333333;
+  }
+}
+.radio-group {
+  width: 100%;
+}
+.role__list {
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  margin-top: 48px;
+}
+.role__item {
+  width: 200px;
+  height: 220px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  margin: 0 12px;
+  cursor: pointer;
+  &:hover {
+    box-shadow: 0px 1px 16px 2px rgba(0, 0, 0, 0.1);
+    .role__opera .radio {
+      display: block;
+    }
+  }
+}
+
+.role__prefix {
+  display: block;
+  width: 82px;
+  height: 82px;
+  border-radius: 50%;
+  @include bg_color_primary;
+  text-align: center;
+  i {
+    font-size: 36px;
+    color: #fff;
+    line-height: 82px;
+  }
+}
+.role__name {
+  display: inline-block;
+  font-size: var(--epx-font-size-l);
+  padding: 20px 0;
+}
+.role__opera {
+  display: block;
+  height: 20px;
+  .radio {
+    display: none;
+  }
+}
+.no-role {
+  margin-top: 60px;
+  text-align: center;
+  >p {
+    font-size: 30px;
+    margin-bottom: 40px;
+    color: red;
+  }
+}
+.m-role-select {
+  .select__modal{
+    width: 100%;
+    height: 100%;
+    left: 0;
+    margin-left: 0;
+    padding: 10px 0;
+  }
+  .app__title {
+    display: none;
+  }
+  .role__list {
+    margin-top: 24px;
+    justify-content: flex-start;
+  }
+ .role__item {
+    width: calc(33.3% - 24px);
+    height: auto;
+    margin: 0 12px;
+ }
+ .role__prefix {
+   width: 48px;
+   height: 48px;
+   i {
+     font-size: 24px;
+     line-height: 48px;
+   }
+ }
+ .role__name {
+   font-size: var(--epx-font-size-base);
+   padding: 10px 0;
+ }
+}
+
+</style>

package/src/views/Error.vue

@@ -0,0 +1,63 @@
+<template>
+  <div class="error off" v-if="errCode==='error.service.off'">
+    <svg t="1646217353171" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2495" width="360" height="360"><path d="M0 759.466667a512 125.155556 0 1 0 1024 0 512 125.155556 0 1 0-1024 0Z" fill="#E5E5E5" p-id="2496"></path><path d="M910.222222 238.674489H113.777778V159.891911C113.777778 148.562489 122.936889 139.377778 134.240711 139.377778h755.518578C901.063111 139.377778 910.222222 148.562489 910.222222 159.891911v78.782578z" fill="#253369" p-id="2497"></path><path d="M889.759289 745.244444H134.240711C122.936889 745.244444 113.777778 736.059733 113.777778 724.730311V231.796622h796.444444v492.933689c0 11.329422-9.159111 20.514133-20.462933 20.514133" fill="#E9EEF7" p-id="2498"></path><path d="M162.133333 263.085511m2.844445 0l699.733333 0q2.844444 0 2.844445 2.844445l0 34.133333q0 2.844444-2.844445 2.844444l-699.733333 0q-2.844444 0-2.844445-2.844444l0-34.133333q0-2.844444 2.844445-2.844445Z" fill="#D5DCE9" opacity=".398" p-id="2499"></path><path d="M162.133333 328.507733m2.844445 0l179.2 0q2.844444 0 2.844444 2.844445l0 199.111111q0 2.844444-2.844444 2.844444l-179.2 0q-2.844444 0-2.844445-2.844444l0-199.111111q0-2.844444 2.844445-2.844445Z" fill="#D5DCE9" opacity=".398" p-id="2500"></path><path d="M369.777778 328.507733m2.844444 0l492.088889 0q2.844444 0 2.844445 2.844445l0 199.111111q0 2.844444-2.844445 2.844444l-492.088889 0q-2.844444 0-2.844444-2.844444l0-199.111111q0-2.844444 2.844444-2.844445Z" fill="#D5DCE9" opacity=".398" p-id="2501"></path><path d="M162.133333 558.907733m2.844445 0l492.088889 0q2.844444 0 2.844444 2.844445l0 145.066666q0 2.844444-2.844444 2.844445l-492.088889 0q-2.844444 0-2.844445-2.844445l0-145.066666q0-2.844444 2.844445-2.844445Z" fill="#D5DCE9" opacity=".398" p-id="2502"></path><path d="M682.666667 558.907733m2.844444 0l179.2 0q2.844444 0 2.844445 2.844445l0 145.066666q0 2.844444-2.844445 2.844445l-179.2 0q-2.844444 0-2.844444-2.844445l0-145.066666q0-2.844444 2.844444-2.844445Z" fill="#D5DCE9" opacity=".398" p-id="2503"></path><path d="M180.590933 185.585778c0 9.708089-7.850667 17.578667-17.530311 17.578666-9.682489 0-17.530311-7.870578-17.530311-17.578666 0-9.705244 7.850667-17.572978 17.530311-17.572978 9.682489 0 17.530311 7.867733 17.530311 17.572978" fill="#FF7946" p-id="2504"></path><path d="M246.055822 185.585778c0 9.708089-7.847822 17.578667-17.530311 17.578666-9.679644 0-17.527467-7.870578-17.527467-17.578666 0-9.705244 7.847822-17.572978 17.527467-17.572978 9.682489 0 17.530311 7.867733 17.530311 17.572978" fill="#FFC53D" p-id="2505"></path><path d="M311.523556 185.585778c0 9.708089-7.850667 17.578667-17.530312 17.578666-9.682489 0-17.530311-7.870578-17.530311-17.578666 0-9.705244 7.850667-17.572978 17.530311-17.572978 9.682489 0 17.530311 7.867733 17.530312 17.572978" fill="#BAE637" p-id="2506"></path><path d="M142.279111 648.533333s-26.601244 68.107378-23.665778 95.544889c2.121956 20.181333 26.493156 18.7392 29.354667 3.862756 5.532444-28.814222-5.688889-99.407644-5.688889-99.407645" fill="#75AE16" p-id="2507"></path><path d="M98.642489 682.459022s-9.597156 63.451022 0.568889 84.807111c7.486578 15.678578 32.147911 6.951822 31.212089-6.001777-1.820444-25.076622-31.780978-78.805333-31.780978-78.805334" fill="#5F960C" p-id="2508"></path><path d="M56.888889 692.969244s7.04 64.603022 22.175289 83.470223c11.087644 13.878044 32.381156 0 28.182755-12.529778C99.108978 739.569778 56.888889 692.969244 56.888889 692.969244" fill="#4B8108" p-id="2509"></path><path d="M170.197333 708.206933s-38.200889 35.134578-40.9088 53.341867c-1.979733 13.397333 20.969244 19.740444 26.567111 11.184356 10.851556-16.554667 14.341689-64.526222 14.341689-64.526223" fill="#2A6A13" p-id="2510"></path><path d="M61.604978 778.746311l3.794489-7.2704a13.175467 13.175467 0 0 1 8.684089-6.701511 13.371733 13.371733 0 0 1 10.823111 2.133333c1.991111 1.427911 4.753067 1.1776 6.448355-0.585955l3.925334-4.104534a17.194667 17.194667 0 0 1 13.357511-5.228088 17.129244 17.129244 0 0 1 12.669155 6.678755 4.952178 4.952178 0 0 0 5.944889 1.501867l2.542933-1.137778a20.622222 20.622222 0 0 1 19.029334 1.166222l7.890489 4.755911a4.969244 4.969244 0 0 0 4.639289 0.256 4.972089 4.972089 0 0 1 3.953777-0.079644c1.271467 0.517689 2.264178 1.541689 2.730667 2.816l2.338133 6.371555c0.540444 1.479111 0.318578 3.126044-0.603022 4.411734-0.918756 1.288533-2.417778 2.053689-4.010667 2.053689H65.948444a4.920889 4.920889 0 0 1-4.175644-2.321067 4.7616 4.7616 0 0 1-0.170667-4.716089" fill="#424242" p-id="2511"></path><path d="M108.168533 720.517689c2.929778 5.831111 6.411378 10.763378 6.920534 10.567111 0.509156-0.196267-0.557511-5.566578-3.447467-11.406222-2.8928-5.8368-6.638933-9.921422-7.145244-9.728-0.509156 0.201956 0.750933 4.738844 3.672177 10.567111z" fill="#8FAE16" p-id="2512"></path><path d="M140.814222 703.587556c0.605867 0 1.635556-4.8128 1.635556-10.749156 0-5.933511-1.058133-10.746311-1.635556-10.746311-0.577422 0-1.627022 4.8128-1.627022 10.746311 0 5.936356 1.021156 10.749156 1.627022 10.749156z" fill="#B3CE4F" p-id="2513"></path><path d="M152.5504 747.207111c-2.599822 5.671822-3.785956 10.4192-3.316622 10.609778 0.463644 0.187733 3.478756-4.260978 6.072889-9.938489 2.596978-5.674667 3.800178-10.402133 3.328-10.589867-0.463644-0.210489-3.478756 4.238222-6.084267 9.915734zM78.6176 733.954844c4.252444 5.262222 8.570311 9.264356 8.994133 8.96 0.426667-0.304356-2.153244-4.835556-6.4-10.089244-4.243911-5.256533-8.576-9.244444-9.005511-8.96-0.426667 0.312889 2.153244 4.827022 6.411378 10.089244z" fill="#6A960C" p-id="2514"></path><path d="M924.529778 583.111111s-39.899022 101.438578-35.498667 142.301867c3.185778 30.057244 39.739733 27.909689 44.032 5.751466 8.300089-42.916978-8.533333-148.053333-8.533333-148.053333" fill="#75AE16" p-id="2515"></path><path d="M859.073422 626.619733s-14.395733 94.498133 0.859022 126.3104c11.227022 23.3472 48.219022 10.350933 46.813867-8.942933-2.733511-37.347556-47.672889-117.367467-47.672889-117.367467" fill="#5F960C" p-id="2516"></path><path d="M796.444444 649.289956s10.561422 96.219022 33.260089 124.322133c16.631467 20.664889 48.574578 0 42.279823-18.6624C859.773156 718.697244 796.444444 649.289956 796.444444 649.289956" fill="#4B8108" p-id="2517"></path><path d="M966.405689 671.985778s-57.298489 52.3264-61.3632 79.445333c-2.9696 19.953778 31.453867 29.397333 39.850667 16.659911 16.278756-24.655644 21.512533-96.105244 21.512533-96.105244" fill="#2A6A13" p-id="2518"></path><path d="M803.518578 771.413333l5.688889-10.823111a19.740444 19.740444 0 0 1 13.0304-9.981155 20.1728 20.1728 0 0 1 16.233244 3.177244 7.486578 7.486578 0 0 0 9.671111-0.873244l5.888-6.112711a25.890133 25.890133 0 0 1 20.036267-7.788089c7.5264 0.418133 14.478222 4.059022 19.006578 9.949866a7.463822 7.463822 0 0 0 8.917333 2.235734l3.811556-1.692445a31.1296 31.1296 0 0 1 28.549688 1.732267l11.832889 7.085511c2.104889 1.262933 4.721778 1.408 6.957511 0.384a7.509333 7.509333 0 0 1 5.930667-0.125156c1.908622 0.776533 3.393422 2.301156 4.096 4.201245l3.5072 9.486222a7.051378 7.051378 0 0 1-0.904533 6.570667 7.404089 7.404089 0 0 1-6.018845 3.057778h-149.720177a7.392711 7.392711 0 0 1-6.260623-3.458845 7.048533 7.048533 0 0 1-0.256-7.025778" fill="#424242" p-id="2519"></path><path d="M873.366756 690.321067c4.388978 8.686933 9.614222 16.031289 10.376533 15.738311 0.762311-0.290133-0.836267-8.291556-5.168356-16.984178-4.340622-8.698311-9.955556-14.782578-10.720711-14.4896-0.762311 0.298667 1.1264 7.054222 5.512534 15.735467z" fill="#8FAE16" p-id="2520"></path><path d="M922.333867 665.105067c0.907378 0 2.451911-7.168 2.451911-16.005689 0-8.840533-1.5872-16.005689-2.451911-16.005689-0.8704 0-2.440533 7.165156-2.440534 16.005689 0 8.840533 1.530311 16.005689 2.440534 16.005689z" fill="#B3CE4F" p-id="2521"></path><path d="M939.938133 730.069333c-3.902578 8.450844-5.680356 15.522133-4.977777 15.803734 0.696889 0.284444 5.219556-6.345956 9.110755-14.799645 3.896889-8.453689 5.697422-15.493689 4.994845-15.772444-0.696889-0.312889-5.219556 6.314667-9.127823 14.768355zM829.036089 710.337422c6.380089 7.839289 12.856889 13.795556 13.4912 13.340445 0.642844-0.452267-3.228444-7.196444-9.597156-15.024356-6.368711-7.827911-12.868267-13.7728-13.511111-13.340444-0.634311 0.4608 3.231289 7.185067 9.614222 15.024355z" fill="#6A960C" p-id="2522"></path><path d="M418.178844 463.644444c0 51.913956 42.083556 94.000356 94.000356 94.000356 51.911111 0 93.997511-42.0864 93.997511-94.000356 0-51.913956-42.083556-94.000356-94.000355-94.000355-51.911111 0-93.997511 42.0864-93.997512 94.000355z" fill="#FF7575" p-id="2523"></path><path d="M505.179022 481.132089c1.1776 3.512889 3.510044 5.822578 6.997334 5.822578 3.512889 0 5.822578-2.332444 7.000177-5.822578l4.667734-64.1536c0-7.000178-5.822578-11.667911-11.665067-11.667911-7.000178 0-11.667911 5.822578-11.667911 12.845511l4.664889 62.976z m6.997334 17.513244c-6.997333 0-11.665067 4.664889-11.665067 11.665067 0 7.000178 4.664889 11.667911 11.665067 11.667911 7.000178 0 11.667911-4.664889 11.667911-11.667911 0-6.997333-4.664889-11.665067-11.665067-11.665067z" fill="#FFFFFF" p-id="2524"></path></svg>
+    <p>该应用已停止使用</p>
+  </div>
+  <div class="error" v-else>
+    <i class="epx-icon-color-a-500"></i>
+    <p>应用加载错误,<a @click="reload">点击刷新</a></p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'epx-error',
+  data () {
+    return {
+      errCode: ''
+    }
+  },
+  methods: {
+    reload () {
+      window.location.reload(true)
+    }
+  },
+  created () {
+    const url = this.$util.search('url')
+    this.errCode = this.$util.search('code')
+    setTimeout(() => {
+      window.history.replaceState(null, null, url)
+    }, 10)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.error {
+  font-size: 140px;
+  text-align: center;
+  line-height: 1;
+  position: absolute;
+  top: 50%;
+  width: 100%;
+  margin-top: -150px;
+  p {
+    font-size: 18px;
+    color:var(--epx-text);
+    margin-top: 30px
+  }
+  a {
+    cursor: pointer;
+  }
+}
+.off {
+  margin-top: -170px;
+  svg {
+    width: 300px;
+    height: 300px;
+  }
+  p {
+    margin-top: -10px;
+  }
+}
+</style>