From 68857a8e65417b46c006158e621e376084eba033 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E9=9C=84?= <zhaoxiaox0053@163.com>
Date: Thu, 28 Sep 2023 14:48:39 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E5=B5=8C=E5=85=A5=E5=85=B6=E4=BB=96?=
 =?UTF-8?q?=E7=B3=BB=E7=BB=9F=E9=9A=90=E8=97=8F=E8=8F=9C=E5=8D=95=E5=92=8C?=
 =?UTF-8?q?=E7=94=A8=E6=88=B7=E4=BF=A1=E6=81=AF=EF=BC=88=E9=A1=B6=E9=83=A8?=
 =?UTF-8?q?=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                          |  4 ++++
 src/assets/less/common.less          |  7 +++++--
 src/components/page/GlobalLayout.vue |  7 +++++--
 src/components/tools/setting.js      | 21 ++++++++++++++++++++-
 src/permission.js                    |  5 +++++
 src/store/getters.js                 |  3 ++-
 src/store/modules/app.js             |  6 +++++-
 7 files changed, 46 insertions(+), 7 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 9bfac9a7..92fc6c01 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,6 +17,7 @@ import '@/utils/warterMark'
 // 引入自定义icon
 import '@/assets/icon/iconfont.less'
 import Vue from 'vue'
+import { updatePageHeight } from './components/tools/setting.js'
 
 moment.locale('zh-cn')
 
@@ -100,6 +101,9 @@ export default {
       const { href } = this.$router.resolve(params)
       window.open(href, '_blank')
     }
+
+    updatePageHeight()
+
   }
 }
 </script>
diff --git a/src/assets/less/common.less b/src/assets/less/common.less
index 3d56158c..b5898634 100644
--- a/src/assets/less/common.less
+++ b/src/assets/less/common.less
@@ -1,7 +1,10 @@
 @primary-color: #D52C26;
+/*用户信息部分的高度*/
+@user-info-height: var(--user-info-height, 59px);
+/*面包屑的高度，高度21，上下margin24*/
+@breadcrumb-height: var(--breadcrumb-height, 45px);
 /* 页面不出全局滚动条的高度，如果在vue文件使用，就只能在style里引入common.less */
-/*59px是用户信息那块，21px是面包屑，24px是上下的留白*/
-@page-content-h: calc(100vh - 59px - 21px - 24px);
+@page-content-h: calc(100vh - @user-info-height - @breadcrumb-height);
 
 /*列表上方操作按钮区域*/
 /*.ant-card-body .table-operator {
diff --git a/src/components/page/GlobalLayout.vue b/src/components/page/GlobalLayout.vue
index 46b6643d..2265e279 100644
--- a/src/components/page/GlobalLayout.vue
+++ b/src/components/page/GlobalLayout.vue
@@ -1,7 +1,7 @@
 <template>
   <a-layout class="layout" :class="[device]">
 
-    <template v-if="layoutMode === 'sidemenu'">
+    <template v-if="layoutMode === 'sidemenu' && !isEmbedded">
       <a-drawer
         v-if="device === 'mobile'"
         :wrapClassName="'drawer-sider ' + navTheme"
@@ -59,6 +59,7 @@
       :style="{ paddingLeft: fixSiderbar && isDesktop() ? `${sidebarOpened ? 200 : 80}px` : '0' }">
       <!-- layout header -->
       <global-header
+        v-if="!isEmbedded"
         :mode="layoutMode"
         :menus="menus"
         :theme="navTheme"
@@ -122,7 +123,9 @@ export default {
       // 主路由
       mainRouters: state => state.permission.addRouters,
       // 后台菜单
-      permissionMenuList: state => state.user.permissionList
+      permissionMenuList: state => state.user.permissionList,
+      // 是否嵌入在别的系统中
+      isEmbedded: state => state.app.isEmbedded
     })
   },
   watch: {
diff --git a/src/components/tools/setting.js b/src/components/tools/setting.js
index 1fda9234..412a7b25 100644
--- a/src/components/tools/setting.js
+++ b/src/components/tools/setting.js
@@ -1,5 +1,6 @@
 import { message } from 'ant-design-vue/es'
 // import defaultSettings from '../defaultSettings';
+import store from '../../store/index.js'
 
 let lessNodesAppended
 
@@ -41,6 +42,7 @@ const updateTheme = primaryColor => {
   }
   const hideMessage = message.loading('正在编译主题！', 0)
   console.info(`正在编译主题!`)
+
   function buildIt () {
     // 正确的判定less是否已经加载less.modifyVars可用
     if (!window.less || !window.less.modifyVars) {
@@ -58,6 +60,7 @@ const updateTheme = primaryColor => {
         hideMessage()
       })
   }
+
   if (!lessNodesAppended) {
     // insert less.js and color.less
     const lessStyleNode = document.createElement('link')
@@ -93,4 +96,20 @@ const updateColorWeak = colorWeak => {
   colorWeak ? document.body.classList.add('colorWeak') : document.body.classList.remove('colorWeak')
 }
 
-export { updateTheme, colorList, updateColorWeak }
+/**
+ * 设置页面高度
+ */
+const updatePageHeight = () => {
+  const isEmbedded = store.getters.isEmbedded
+  const obj = {
+    'user-info-height': isEmbedded ? '0px' : '59px', // 用户信息的高度
+    'breadcrumb-height': '45px' // 面包屑的高度
+  }
+  for (const key in obj) {
+    document
+      .getElementsByTagName('body')[0]
+      .style.setProperty(`--${key}`, obj[key])
+  }
+}
+
+export { updateTheme, colorList, updateColorWeak, updatePageHeight }
diff --git a/src/permission.js b/src/permission.js
index ae623576..2dda1cd5 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -12,6 +12,11 @@ const whiteList = ['/user/login', '/user/register', '/user/register-result', '/u
 whiteList.push(OAUTH2_LOGIN_PAGE_PATH)
 
 router.beforeEach((to, from, next) => {
+  // 处理是否是嵌入其他系统，是需要隐藏左侧和上面，如果当前值是true，就不需要修改了
+  const isEmbedded = store.getters.isEmbedded
+  if (!isEmbedded && to.query.code === 'implant') {
+    store.commit('SET_IS_EMBEDDED', true)
+  }
   NProgress.start() // start progress bar
   if (Vue.ls.get(ACCESS_TOKEN)) {
     /* has token */
diff --git a/src/store/getters.js b/src/store/getters.js
index 3ed4cbd6..b7e17968 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -16,7 +16,8 @@ const getters = {
   enhanceJs: (state) => (code) => {
     state.enhance.enhanceJs[code] = Vue.ls.get(ENHANCE_PRE + code)
     return state.enhance.enhanceJs[code]
-  }
+  },
+  isEmbedded: state => state.app.isEmbedded
 
 }
 
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index 5010e878..c3202f06 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -27,7 +27,8 @@ const app = {
     autoHideHeader: false,
     color: null,
     weak: false,
-    multipage: true // 默认多页签模式
+    multipage: true, // 默认多页签模式
+    isEmbedded: false // 是否嵌入其他系统
   },
   mutations: {
     SET_SIDEBAR_TYPE: (state, type) => {
@@ -78,6 +79,9 @@ const app = {
     SET_MULTI_PAGE (state, multipageFlag) {
       Vue.ls.set(DEFAULT_MULTI_PAGE, multipageFlag)
       state.multipage = multipageFlag
+    },
+    SET_IS_EMBEDDED (state, isEmbedded) {
+      state.isEmbedded = isEmbedded
     }
   },
   actions: {