v3.10.0【新增】全屏模式Modal等终极解决方案；【新增】生成环境去掉跨域；【优化】其他一些小细节

smart-admin-web-javascript/src/App.vue

@@ -32,7 +32,6 @@
         },
       },
     }"
-    :getPopupContainer="getPopupContainer"
   >
     <!---全局loading--->
     <a-spin :spinning="spinning" tip="稍等片刻，我在拼命加载中..." size="large">
@@ -50,8 +49,6 @@
   import { useSpinStore } from '/@/store/modules/system/spin';
   import { theme } from 'ant-design-vue';
   import { themeColors } from '/@/theme/color.js';
-  import { SmartLoading } from '/@/components/framework/smart-loading/index.js';
-  import { LAYOUT_ELEMENT_IDS } from '/@/layout/layout-const.js';
 
   const antdLocale = computed(() => messages[useAppConfigStore().language].antdLocale);
   const dayjsLocale = computed(() => messages[useAppConfigStore().language].dayjsLocale);
@@ -70,31 +67,4 @@
   const borderRadius = computed(() => {
     return useAppConfigStore().borderRadius;
   });
-
-  function getPopupContainer(node, dialogContext) {
-    let fullScreenFlag = useAppConfigStore().$state.fullScreenFlag;
-    if(fullScreenFlag){
-      return getFullScreenContainer(node, dialogContext);
-    }else{
-      return getNotFullScreenContainer(node, dialogContext);
-    }
-  }
-
-  function getFullScreenContainer(node, dialogContext) {
-    if (node === document.body) {
-      return document.getElementById(LAYOUT_ELEMENT_IDS.content);
-    }else if (node) {
-      return node.parentNode;
-    } else {
-      return document.getElementById(LAYOUT_ELEMENT_IDS.content);
-    }
-  }
-
-  function getNotFullScreenContainer(node, dialogContext) {
-    if (node) {
-      return node.parentNode;
-    } else {
-      return document.body;
-    }
-  }
 </script>

smart-admin-web-javascript/src/components/support/table-operator/index.vue

@@ -38,13 +38,13 @@
 <script setup>
   import _ from 'lodash';
   import { tableColumnApi } from '/@/api/support/table-column-api';
-  import { onMounted, reactive, ref, watch } from 'vue';
+  import { onMounted, ref, watch } from 'vue';
   import SmartTableColumnModal from './smart-table-column-modal.vue';
   import { message } from 'ant-design-vue';
   import { mergeColumn } from './smart-table-column-merge';
   import { smartSentry } from '/@/lib/smart-sentry';
-  import { LAYOUT_ELEMENT_IDS } from '/@/layout/layout-const.js';
   import { useAppConfigStore } from '/@/store/modules/system/app-config.js';
+
   const props = defineProps({
     // 表格列数组
     modelValue: {
@@ -89,7 +89,6 @@
     } catch (e) {
       smartSentry.captureError(e);
     }
-
     updateColumn(userTableColumnArray);
   }
 
@@ -100,24 +99,16 @@
     if (fullScreenFlag.value) {
       // 退出全屏
       handleExitFullScreen();
-      exitElementFullscreen(document.getElementById(LAYOUT_ELEMENT_IDS.content));
+      exitElementFullscreen(document.body);
     } else {
-      //全屏
-      message.config({
-        getContainer: () => document.getElementById(LAYOUT_ELEMENT_IDS.content),
-      });
       fullScreenFlag.value = true;
       useAppConfigStore().startFullScreen();
-      launchElementFullScreen(document.getElementById(LAYOUT_ELEMENT_IDS.content));
+      launchElementFullScreen(document.body);
     }
   }
 
   // 处理退出全屏
-  function handleExitFullScreen(){
-    //取消全屏
-    message.config({
-      getContainer: () => document.body,
-    });
+  function handleExitFullScreen() {
     fullScreenFlag.value = false;
     useAppConfigStore().exitFullScreen();
     document.removeEventListener('fullscreenchange', handleFullscreenChange);

smart-admin-web-javascript/src/layout/side-expand-layout.vue

@@ -10,7 +10,7 @@
 <template>
   <a-layout class="admin-layout" style="min-height: 100%">
     <!-- 侧边菜单 side-menu -->
-    <a-layout-sider :id="LAYOUT_ELEMENT_IDS.menu" :theme="theme" class="side-menu" :collapsed="collapsed" :trigger="null">
+    <a-layout-sider :id="LAYOUT_ELEMENT_IDS.menu" :theme="theme" class="side-menu" :collapsed="collapsed" :trigger="null" v-show="!fullScreenFlag">
       <!-- 左侧菜单 -->
       <SideExpandMenu :collapsed="collapsed" />
     </a-layout-sider>
@@ -18,7 +18,7 @@
     <!--中间内容，一共三部分：1、顶部;2、中间内容区域;3、底部（一般是公司版权信息）;-->
     <a-layout class="admin-layout-main" :style="`height: ${windowHeight}px`" :id="LAYOUT_ELEMENT_IDS.main">
       <!-- 顶部头部信息 -->
-      <a-layout-header class="smart-layout-header" :id="LAYOUT_ELEMENT_IDS.header">
+      <a-layout-header class="smart-layout-header" :id="LAYOUT_ELEMENT_IDS.header" v-show="!fullScreenFlag">
         <a-row justify="space-between" class="smart-layout-header-user">
           <a-col class="smart-layout-header-left">
             <span class="collapsed-button">
@@ -101,7 +101,8 @@
   import { LAYOUT_ELEMENT_IDS } from '/@/layout/layout-const.js';
 
   const windowHeight = ref(window.innerHeight);
-
+  //是否全屏
+  const fullScreenFlag = computed(() => useAppConfigStore().$state.fullScreenFlag);
   //主题颜色
   const theme = computed(() => useAppConfigStore().$state.sideMenuTheme);
   //是否显示标签页

smart-admin-web-javascript/src/layout/side-layout.vue

@@ -1,7 +1,7 @@
 <template>
   <a-layout class="admin-layout" style="min-height: 100%">
     <!-- 侧边菜单 side-menu -->
-    <a-layout-sider :id="LAYOUT_ELEMENT_IDS.menu" class="side-menu" :width="sideMenuWidth" :collapsed="collapsed" :theme="theme">
+    <a-layout-sider :id="LAYOUT_ELEMENT_IDS.menu" class="side-menu" :width="sideMenuWidth" :collapsed="collapsed" :theme="theme" v-show="!fullScreenFlag">
       <!-- 左侧菜单 -->
       <SideMenu :collapsed="collapsed" />
     </a-layout-sider>
@@ -9,7 +9,7 @@
     <!--中间内容，一共三部分：1、顶部;2、中间内容区域;3、底部（一般是公司版权信息）;-->
     <a-layout :id="LAYOUT_ELEMENT_IDS.main" :style="`height: ${windowHeight}px`" class="admin-layout-main">
       <!-- 顶部头部信息 -->
-      <a-layout-header class="layout-header" :id="LAYOUT_ELEMENT_IDS.header">
+      <a-layout-header class="layout-header" :id="LAYOUT_ELEMENT_IDS.header" v-show="!fullScreenFlag">
         <a-row class="layout-header-user" justify="space-between">
           <a-col class="layout-header-left">
             <span class="collapsed-button">
@@ -96,6 +96,8 @@
   import { LAYOUT_ELEMENT_IDS } from '/@/layout/layout-const.js';
 
   const windowHeight = ref(window.innerHeight);
+  //是否全屏
+  const fullScreenFlag = computed(() => useAppConfigStore().$state.fullScreenFlag);
   //菜单宽度
   const sideMenuWidth = computed(() => useAppConfigStore().$state.sideMenuWidth);
   //主题颜色

smart-admin-web-javascript/src/layout/top-layout.vue

@@ -1,14 +1,14 @@
 <template>
   <a-layout class="admin-layout">
     <!-- 顶部菜单  -->
-    <a-layout-header class="top-menu" :theme="theme" :id="LAYOUT_ELEMENT_IDS.menu">
+    <a-layout-header class="top-menu" :theme="theme" :id="LAYOUT_ELEMENT_IDS.menu" v-if="!fullScreenFlag">
       <TopMenu />
     </a-layout-header>
 
     <!--中间内容-->
     <a-layout-content :id="LAYOUT_ELEMENT_IDS.content" class="admin-layout-content">
       <!---标签页-->
-      <div class="page-tag-div" v-show="pageTagFlag" :id="LAYOUT_ELEMENT_IDS.header">
+      <div class="page-tag-div" v-show="pageTagFlag && !fullScreenFlag" :id="LAYOUT_ELEMENT_IDS.header">
         <PageTag />
       </div>
 
@@ -68,6 +68,8 @@
     };
   });
 
+  //是否全屏
+  const fullScreenFlag = computed(() => useAppConfigStore().$state.fullScreenFlag);
   //是否显示标签页
   const pageTagFlag = computed(() => useAppConfigStore().$state.pageTagFlag);
   // 是否显示页脚
@@ -78,6 +80,10 @@
   const pageWidth = computed(() => useAppConfigStore().$state.pageWidth);
   // 多余高度
   const dueHeight = computed(() => {
+    if (fullScreenFlag.value) {
+      return '0';
+    }
+
     let due = '45px';
     if (useAppConfigStore().$state.pageTagFlag) {
       due = '85px';