From 9771e1e74164e8f34feb1eaab729039824ea9089 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Tue, 25 Apr 2023 10:33:25 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E5=85=BC=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/App.vue                   | 43 +++++++++++-----
 resources/assets/js/components/AutoTip.vue    |  2 +-
 resources/assets/js/components/Loading.vue    |  2 +-
 .../assets/js/components/Mobile/Tabbar.vue    |  2 +-
 .../js/components/PreviewImage/index.vue      |  2 +-
 resources/assets/js/components/ResizeLine.vue | 26 ----------
 .../assets/js/components/RightBottom.vue      |  2 +-
 .../assets/js/components/TableAction.vue      |  2 +-
 resources/assets/js/components/UserAvatar.vue |  2 +-
 resources/assets/js/pages/login.vue           |  2 +-
 resources/assets/js/pages/manage.vue          |  2 +-
 resources/assets/js/pages/manage/calendar.vue |  2 +-
 .../manage/components/ChatInput/index.vue     | 20 ++++----
 .../pages/manage/components/DialogModal.vue   |  4 +-
 .../pages/manage/components/DialogWrapper.vue | 10 ++--
 .../pages/manage/components/FileContent.vue   |  4 +-
 .../manage/components/MeetingManager.vue      |  2 +-
 .../manage/components/ProjectArchived.vue     |  2 +-
 .../pages/manage/components/ProjectDialog.vue |  2 +-
 .../pages/manage/components/ProjectList.vue   |  2 +-
 .../manage/components/ProjectManagement.vue   |  2 +-
 .../pages/manage/components/ProjectPanel.vue  | 18 +++----
 .../manage/components/ProjectWorkflow.vue     |  2 +-
 .../js/pages/manage/components/ReportEdit.vue |  4 +-
 .../js/pages/manage/components/ReportMy.vue   |  2 +-
 .../pages/manage/components/ReportReceive.vue |  2 +-
 .../js/pages/manage/components/TaskAdd.vue    |  6 +--
 .../pages/manage/components/TaskAddSimple.vue |  4 +-
 .../pages/manage/components/TaskArchived.vue  |  2 +-
 .../pages/manage/components/TaskDeleted.vue   |  2 +-
 .../js/pages/manage/components/TaskDetail.vue | 10 ++--
 .../js/pages/manage/components/TaskRow.vue    |  2 +-
 .../manage/components/TeamManagement.vue      |  6 +--
 .../assets/js/pages/manage/dashboard.vue      |  2 +-
 resources/assets/js/pages/manage/file.vue     |  8 +--
 .../assets/js/pages/manage/messenger.vue      |  8 +--
 resources/assets/js/pages/manage/project.vue  |  2 +-
 .../setting/components/SystemSetting.vue      |  2 +-
 .../assets/js/pages/manage/setting/index.vue  |  6 +--
 resources/assets/js/pages/single/file.vue     |  2 +-
 resources/assets/js/store/mixin.js            |  7 ++-
 resources/assets/js/store/state.js            | 39 +++++++++------
 resources/assets/sass/components/_.scss       |  1 +
 resources/assets/sass/components/mobile.scss  |  4 +-
 .../assets/sass/components/resize-line.scss   | 30 ++++++++++++
 .../assets/sass/components/right-bottom.scss  |  2 +-
 .../sass/pages/components/chat-input.scss     |  2 +-
 .../pages/components/dialog-group-info.scss   | 29 ++++++-----
 .../sass/pages/components/dialog-respond.scss | 20 +++++---
 .../sass/pages/components/dialog-wrapper.scss | 24 ++++-----
 .../sass/pages/components/file-content.scss   | 20 ++++----
 .../pages/components/meeting-manager.scss     | 49 ++++++++++++-------
 .../sass/pages/components/project-panel.scss  |  2 +-
 .../sass/pages/components/task-add.scss       |  2 +-
 .../sass/pages/components/task-detail.scss    |  2 +-
 .../assets/sass/pages/page-calendar.scss      | 19 +++----
 .../assets/sass/pages/page-dashboard.scss     |  2 +-
 resources/assets/sass/pages/page-file.scss    |  2 +-
 resources/assets/sass/pages/page-login.scss   |  2 +-
 resources/assets/sass/pages/page-manage.scss  |  2 +-
 .../assets/sass/pages/page-messenger.scss     |  2 +-
 resources/assets/sass/pages/page-setting.scss |  2 +-
 resources/views/desktop.blade.php             |  2 +-
 63 files changed, 278 insertions(+), 215 deletions(-)
 create mode 100644 resources/assets/sass/components/resize-line.scss

diff --git a/resources/assets/js/App.vue b/resources/assets/js/App.vue
index 8fbe870f5..ddba29555 100755
--- a/resources/assets/js/App.vue
+++ b/resources/assets/js/App.vue
@@ -13,12 +13,12 @@
         <!--右下角客户端-->
         <RightBottom/>
 
-        <!--网络提示-->
-        <NetworkException v-if="windowLarge"/>
-
         <!--图片预览-->
         <PreviewImageState/>
 
+        <!--网络提示-->
+        <NetworkException v-if="windowLandscape"/>
+
         <!--Hidden IFrame-->
         <iframe v-for="item in iframes" :key="item.key" v-if="item.url" v-show="false" :src="item.url"></iframe>
     </div>
@@ -73,7 +73,7 @@ export default {
     },
 
     computed: {
-        ...mapState(['ws', 'themeMode', 'supportTouch']),
+        ...mapState(['ws', 'themeMode', 'windowOrientation']),
 
         isSoftware() {
             return this.$Electron || this.$isEEUiApp;
@@ -139,17 +139,25 @@ export default {
             immediate: true
         },
 
-        supportTouch: {
+        windowTouch: {
             handler(support) {
                 if (support) {
-                    $A("body").addClass("support-touch")
+                    $A("body").addClass("window-touch")
                 } else {
-                    $A("body").removeClass("support-touch")
+                    $A("body").removeClass("window-touch")
                 }
             },
             immediate: true
         },
 
+        windowOrientation: {
+            handler(direction) {
+                $A("body").removeClass(["window-landscape", "window-portrait"])
+                $A("body").addClass("window-" + direction)
+            },
+            immediate: true
+        },
+
         windowActive(active) {
             if (active) {
                 this.__windowTimer && clearTimeout(this.__windowTimer)
@@ -223,12 +231,21 @@ export default {
         },
 
         windowSizeListener() {
-            this.$store.state.windowWidth = $A(window).width()
-            this.$store.state.windowHeight = $A(window).height()
-            this.$store.state.windowLarge = this.$store.state.windowWidth > 834
-            this.$store.state.windowSmall = this.$store.state.windowWidth <= 834
-            this.$store.state.formLabelPosition = this.$store.state.windowWidth > 576 ? 'right' : 'top'
-            this.$store.state.formLabelWidth = this.$store.state.windowWidth > 576 ? 'auto' : ''
+            const windowWidth = $A(window).width(),
+                windowHeight = $A(window).height(),
+                windowOrientation = $A.strExists(window.screen.orientation.type, 'portrait') ? 'portrait' : 'landscape'
+
+            this.$store.state.windowTouch = "ontouchend" in document
+
+            this.$store.state.windowWidth = windowWidth
+            this.$store.state.windowHeight = windowHeight
+
+            this.$store.state.windowOrientation = windowOrientation
+            this.$store.state.windowLandscape = windowOrientation === 'landscape'
+            this.$store.state.windowPortrait = windowOrientation === 'portrait'
+
+            this.$store.state.formLabelPosition = windowWidth > 576 ? 'right' : 'top'
+            this.$store.state.formLabelWidth = windowWidth > 576 ? 'auto' : ''
         },
 
         windowScrollListener() {
diff --git a/resources/assets/js/components/AutoTip.vue b/resources/assets/js/components/AutoTip.vue
index 04466b33a..4bdf8c5e1 100644
--- a/resources/assets/js/components/AutoTip.vue
+++ b/resources/assets/js/components/AutoTip.vue
@@ -4,7 +4,7 @@
         :placement="placement"
         :effect="tooltipTheme"
         :delay="delay"
-        :disabled="windowSmall || $isEEUiApp || !showTooltip || disabled"
+        :disabled="$isEEUiApp || windowTouch || !showTooltip || disabled"
         :max-width="tooltipMaxWidth"
         transfer>
         <span ref="content" @mouseenter="handleTooltipIn" class="common-auto-tip" @click="onClick">
diff --git a/resources/assets/js/components/Loading.vue b/resources/assets/js/components/Loading.vue
index 4447ebe31..bd2d5a8c1 100644
--- a/resources/assets/js/components/Loading.vue
+++ b/resources/assets/js/components/Loading.vue
@@ -1,5 +1,5 @@
 <template>
-    <ETooltip :disabled="windowSmall || $isEEUiApp || content == ''" :content="content">
+    <ETooltip :disabled="$isEEUiApp || windowTouch || content == ''" :content="content">
         <svg v-if="type === 'svg'" viewBox="25 25 50 50" class="common-loading">
             <circle cx="50" cy="50" r="20" fill="none" stroke-width="5" stroke-miterlimit="10" class="common-path"></circle>
         </svg>
diff --git a/resources/assets/js/components/Mobile/Tabbar.vue b/resources/assets/js/components/Mobile/Tabbar.vue
index 7e6c09b4e..debe9fc32 100644
--- a/resources/assets/js/components/Mobile/Tabbar.vue
+++ b/resources/assets/js/components/Mobile/Tabbar.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="mobile-tabbar">
-        <NetworkException v-if="windowSmall" type="alert"/>
+        <NetworkException v-if="windowPortrait" type="alert"/>
         <transition name="mobile-fade">
             <div v-if="isMore" class="more-mask" @click="toggleRoute('more')"></div>
         </transition>
diff --git a/resources/assets/js/components/PreviewImage/index.vue b/resources/assets/js/components/PreviewImage/index.vue
index 1f710a806..ba2f84443 100644
--- a/resources/assets/js/components/PreviewImage/index.vue
+++ b/resources/assets/js/components/PreviewImage/index.vue
@@ -108,7 +108,7 @@ export default {
             if (this.mode) {
                 return this.mode
             }
-            return this.$store.state.windowLarge ? 'desktop' : 'mobile'
+            return this.windowTouch ? 'mobile' : 'desktop'
         }
     }
 };
diff --git a/resources/assets/js/components/ResizeLine.vue b/resources/assets/js/components/ResizeLine.vue
index 220ea75f6..fa28550ca 100644
--- a/resources/assets/js/components/ResizeLine.vue
+++ b/resources/assets/js/components/ResizeLine.vue
@@ -1,32 +1,6 @@
 <template>
     <div class="component-resize-line" :class="[resizing ? 'resizing' : '', placement]" @mousedown.left.stop.prevent="resizeDown"></div>
 </template>
-<style lang="scss" scoped>
-    .component-resize-line {
-        cursor: col-resize;
-        @media (max-width: 834px) {
-            display: none;
-        }
-        &.resizing {
-            &:after {
-                content: '';
-                position: fixed;
-                top: 0;
-                left: 0;
-                right: 0;
-                bottom: 0;
-                z-index: 99999;
-                cursor: col-resize;
-            }
-        }
-        &.bottom {
-            cursor: row-resize;
-            &:after {
-                cursor: row-resize;
-            }
-        }
-    }
-</style>
 <script>
     export default {
         name: 'ResizeLine',
diff --git a/resources/assets/js/components/RightBottom.vue b/resources/assets/js/components/RightBottom.vue
index ae0730e07..ded349394 100644
--- a/resources/assets/js/components/RightBottom.vue
+++ b/resources/assets/js/components/RightBottom.vue
@@ -106,7 +106,7 @@ export default {
         },
 
         showDown() {
-            return !this.$isEEUiApp && this.windowLarge && ['login', 'index', 'manage-dashboard'].includes(this.$route.name)
+            return !this.$isEEUiApp && !this.windowTouch && ['login', 'index', 'manage-dashboard'].includes(this.$route.name)
         },
 
         showPrivacy() {
diff --git a/resources/assets/js/components/TableAction.vue b/resources/assets/js/components/TableAction.vue
index 0380d889f..de292ecb7 100644
--- a/resources/assets/js/components/TableAction.vue
+++ b/resources/assets/js/components/TableAction.vue
@@ -12,7 +12,7 @@
                 v-if="item.hidden !== true"
                 placement="top"
                 :key="key"
-                :disabled="windowSmall || $isEEUiApp || !item.title"
+                :disabled="$isEEUiApp || windowTouch || !item.title"
                 :content="item.title"
                 :enterable="false"
                 :open-delay="600">
diff --git a/resources/assets/js/components/UserAvatar.vue b/resources/assets/js/components/UserAvatar.vue
index c2f496cc3..8b1c2278a 100755
--- a/resources/assets/js/components/UserAvatar.vue
+++ b/resources/assets/js/components/UserAvatar.vue
@@ -3,7 +3,7 @@
         v-if="user"
         class="common-avatar"
         :open-delay="openDelay"
-        :disabled="windowSmall || $isEEUiApp || tooltipDisabled || isBot"
+        :disabled="$isEEUiApp || windowTouch || tooltipDisabled || isBot"
         :placement="tooltipPlacement">
         <div slot="content" class="common-avatar-transfer">
             <slot/>
diff --git a/resources/assets/js/pages/login.vue b/resources/assets/js/pages/login.vue
index 9c2342994..4681ca2ef 100644
--- a/resources/assets/js/pages/login.vue
+++ b/resources/assets/js/pages/login.vue
@@ -6,7 +6,7 @@
             <div class="login-box">
                 <div class="login-mode-switch">
                     <div class="login-mode-switch-box">
-                        <ETooltip :disabled="windowSmall || $isEEUiApp" :content="$L(loginMode=='qrcode' ? '帐号登录' : '扫码登录')" placement="left">
+                        <ETooltip :disabled="$isEEUiApp || windowTouch" :content="$L(loginMode=='qrcode' ? '帐号登录' : '扫码登录')" placement="left">
                             <span class="login-mode-switch-icon" @click="switchLoginMode">
                                 <svg v-if="loginMode=='qrcode'" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" data-icon="PcOutlined"><path d="M23 16a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h18a2 2 0 0 1 2 2v12ZM21 4H3v9h18V4ZM3 15v1h18v-1H3Zm3 6a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Z" fill="currentColor"></path></svg>
                                 <svg v-else viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" data-icon="QrOutlined"><path d="M6.5 7.5a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1h-1a1 1 0 0 1-1-1v-1Z" fill="currentColor"></path><path d="M4.5 2.5c-1.1 0-2 .9-2 2v7c0 1.1.9 2 2 2h7c1.1 0 2-.9 2-2v-7c0-1.1-.9-2-2-2h-7Zm0 2h7v7h-7v-7ZM11 16a1 1 0 1 1 2 0 1 1 0 0 1-2 0Zm0 3.5a1 1 0 1 1 2 0v1a1 1 0 1 1-2 0v-1Zm4-7.5a1 1 0 1 1 2 0 1 1 0 0 1-2 0Zm3.5 0a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2h-1a1 1 0 0 1-1-1ZM15 17c0-1.1.9-2 2-2h2.5c1.1 0 2 .9 2 2v2.5c0 1.1-.9 2-2 2H17c-1.1 0-2-.9-2-2V17Zm4.5 0H17v2.5h2.5V17Zm-15-2c-1.1 0-2 .9-2 2v2.5c0 1.1.9 2 2 2H7c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2H4.5Zm0 2H7v2.5H4.5V17ZM15 4.5c0-1.1.9-2 2-2h2.5c1.1 0 2 .9 2 2V7c0 1.1-.9 2-2 2H17c-1.1 0-2-.9-2-2V4.5Zm4.5 0H17V7h2.5V4.5Z" fill="currentColor"></path></svg>
diff --git a/resources/assets/js/pages/manage.vue b/resources/assets/js/pages/manage.vue
index 30ed21c4b..f38112dd8 100644
--- a/resources/assets/js/pages/manage.vue
+++ b/resources/assets/js/pages/manage.vue
@@ -152,7 +152,7 @@
             <div class="operate-position" :style="operateStyles" v-show="operateVisible">
                 <Dropdown
                     trigger="custom"
-                    :placement="windowLarge ? 'bottom' : 'top'"
+                    :placement="windowLandscape ? 'bottom' : 'top'"
                     :visible="operateVisible"
                     @on-clickoutside="operateVisible = false"
                     transfer>
diff --git a/resources/assets/js/pages/manage/calendar.vue b/resources/assets/js/pages/manage/calendar.vue
index d79ac6a52..139d61ac6 100644
--- a/resources/assets/js/pages/manage/calendar.vue
+++ b/resources/assets/js/pages/manage/calendar.vue
@@ -106,7 +106,7 @@ export default {
             'month.dayname.borderLeft': '1px solid rgba(0,0,0,0)',
             'month.dayname.height': '50px',
         }
-        if (this.windowLarge) {
+        if (this.windowLandscape) {
             this.calendarTheme = {
                 'common.border': '1px solid #f4f5f5',
                 'month.dayname.fontSize': '14px',
diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue
index ab2e3f28d..3f12e4096 100755
--- a/resources/assets/js/pages/manage/components/ChatInput/index.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue
@@ -45,24 +45,24 @@
                         :visibleArrow="false"
                         placement="top"
                         popperClass="chat-input-emoji-popover">
-                        <ETooltip slot="reference" ref="emojiTip" :disabled="windowSmall || $isEEUiApp || showEmoji" placement="top" :content="$L('表情')">
+                        <ETooltip slot="reference" ref="emojiTip" :disabled="$isEEUiApp || windowTouch || showEmoji" placement="top" :content="$L('表情')">
                             <i class="taskfont">&#xe7ad;</i>
                         </ETooltip>
                         <ChatEmoji v-if="showEmoji" @on-select="onSelectEmoji" :searchKey="emojiQuickKey"/>
                     </EPopover>
-                    <ETooltip v-else ref="emojiTip" :disabled="windowSmall || $isEEUiApp || showEmoji" placement="top" :content="$L('表情')">
+                    <ETooltip v-else ref="emojiTip" :disabled="$isEEUiApp || windowTouch || showEmoji" placement="top" :content="$L('表情')">
                         <i class="taskfont" @click="showEmoji=!showEmoji">&#xe7ad;</i>
                     </ETooltip>
                 </li>
 
                 <!-- @ # -->
                 <li>
-                    <ETooltip placement="top" :disabled="windowSmall || $isEEUiApp" :content="$L('选择成员')">
+                    <ETooltip placement="top" :disabled="$isEEUiApp || windowTouch" :content="$L('选择成员')">
                         <i class="taskfont" @click="onToolbar('user')">&#xe78f;</i>
                     </ETooltip>
                 </li>
                 <li>
-                    <ETooltip placement="top" :disabled="windowSmall || $isEEUiApp" :content="$L('选择任务')">
+                    <ETooltip placement="top" :disabled="$isEEUiApp || windowTouch" :content="$L('选择任务')">
                         <i class="taskfont" @click="onToolbar('task')">&#xe7d6;</i>
                     </ETooltip>
                 </li>
@@ -74,7 +74,7 @@
                         :visibleArrow="false"
                         placement="top"
                         popperClass="chat-input-more-popover">
-                        <ETooltip slot="reference" ref="moreTip" :disabled="windowSmall || $isEEUiApp || showMore" placement="top" :content="$L('展开')">
+                        <ETooltip slot="reference" ref="moreTip" :disabled="$isEEUiApp || windowTouch || showMore" placement="top" :content="$L('展开')">
                             <i class="taskfont">&#xe790;</i>
                         </ETooltip>
                         <div v-if="recordReady" class="chat-input-popover-item" @click="onToolbar('meeting')">
@@ -113,7 +113,7 @@
                         trigger="manual"
                         placement="top"
                         popperClass="chat-input-more-popover">
-                        <ETooltip slot="reference" ref="sendTip" placement="top" :disabled="windowSmall || $isEEUiApp || showMenu" :content="$L(sendContent)">
+                        <ETooltip slot="reference" ref="sendTip" placement="top" :disabled="$isEEUiApp || windowTouch || showMenu" :content="$L(sendContent)">
                             <div v-if="loading">
                                 <div class="chat-load">
                                     <Loading/>
@@ -338,7 +338,7 @@ export default {
             if (typeof this.enterSend === "boolean") {
                 return this.enterSend;
             } else {
-                return this.$store.state.windowLarge
+                return !this.windowTouch
             }
         },
 
@@ -557,7 +557,7 @@ export default {
                 if (this.isSpecVersion) {
                     // ios11.0-11.3 对scrollTop及scrolIntoView解释有bug
                     // 直接执行会导致输入框滚到底部被遮挡
-                } else if (this.windowSmall) {
+                } else if (this.windowPortrait) {
                     this.timerScroll = setInterval(() => {
                         if (this.quill?.hasFocus()) {
                             this.windowScrollY > 0 && $A.scrollIntoViewIfNeeded(this.$refs.editor);
@@ -1065,7 +1065,7 @@ export default {
             if (item.type === 'emoji') {
                 this.quill.insertText(this.rangeIndex, item.text);
                 this.rangeIndex += item.text.length
-                if (this.windowLarge) {
+                if (this.windowLandscape) {
                     this.showEmoji = false;
                 }
             } else if (item.type === 'emoticon') {
@@ -1073,7 +1073,7 @@ export default {
                 if (item.asset === "emosearch") {
                     this.$emit('input', "")
                 }
-                if (this.windowLarge) {
+                if (this.windowLandscape) {
                     this.showEmoji = false;
                 }
             }
diff --git a/resources/assets/js/pages/manage/components/DialogModal.vue b/resources/assets/js/pages/manage/components/DialogModal.vue
index 9047fd69c..5ab2b31ee 100644
--- a/resources/assets/js/pages/manage/components/DialogModal.vue
+++ b/resources/assets/js/pages/manage/components/DialogModal.vue
@@ -8,7 +8,7 @@
         :beforeClose="onBeforeClose"
         class-name="dialog-modal"
         fullscreen>
-        <DialogWrapper v-if="windowSmall && dialogId > 0" :dialogId="dialogId" :beforeBack="onBeforeClose"/>
+        <DialogWrapper v-if="windowPortrait && dialogId > 0" :dialogId="dialogId" :beforeBack="onBeforeClose"/>
     </Modal>
 </template>
 
@@ -61,7 +61,7 @@ export default {
         ...mapState(['dialogId']),
 
         visible() {
-            return this.dialogId > 0 && this.windowSmall
+            return this.dialogId > 0 && this.windowPortrait
         }
     },
 
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index a6065eeef..defb24868 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -212,7 +212,7 @@
                 ref="input"
                 v-model="msgText"
                 :dialog-id="dialogId"
-                :emoji-bottom="windowSmall"
+                :emoji-bottom="windowPortrait"
                 :maxlength="200000"
                 @on-focus="onEventFocus"
                 @on-blur="onEventBlur"
@@ -1517,7 +1517,7 @@ export default {
         },
 
         onTouchMove(e) {
-            if (this.windowSmall && this.windowScrollY > 0) {
+            if (this.windowPortrait && this.windowScrollY > 0) {
                 if (this.wrapperStart.exclud) {
                     e.preventDefault();
                     return;
@@ -1680,7 +1680,7 @@ export default {
         },
 
         onEventEmojiVisibleChange(val) {
-            if (val && this.windowSmall) {
+            if (val && this.windowPortrait) {
                 this.onToBottom();
             }
         },
@@ -1744,7 +1744,7 @@ export default {
             if (!this.dialogData.group_info) {
                 return;
             }
-            if (this.windowSmall) {
+            if (this.windowPortrait) {
                 this.$store.dispatch("openDialog", 0);
             }
             this.goForward({name: 'manage-project', params: {projectId:this.dialogData.group_info.id}});
@@ -2302,7 +2302,7 @@ export default {
                     break;
 
                 case 'filepos':
-                    if (this.windowSmall) {
+                    if (this.windowPortrait) {
                         this.$store.dispatch("openDialog", 0);
                     }
                     this.goForward({name: 'manage-file', params: value});
diff --git a/resources/assets/js/pages/manage/components/FileContent.vue b/resources/assets/js/pages/manage/components/FileContent.vue
index dec245fca..6fa9f9111 100644
--- a/resources/assets/js/pages/manage/components/FileContent.vue
+++ b/resources/assets/js/pages/manage/components/FileContent.vue
@@ -55,14 +55,14 @@
                 </Dropdown>
                 <template v-if="!file.only_view">
                     <div class="header-icons">
-                        <ETooltip :disabled="windowSmall || $isEEUiApp" :content="$L('文件链接')">
+                        <ETooltip :disabled="$isEEUiApp || windowTouch" :content="$L('文件链接')">
                             <div class="header-icon" @click="handleClick('link')"><i class="taskfont">&#xe785;</i></div>
                         </ETooltip>
                         <EPopover v-model="historyShow" trigger="click">
                             <div class="file-content-history">
                                 <FileHistory :value="historyShow" :file="file" @on-restore="onRestoreHistory"/>
                             </div>
-                            <ETooltip slot="reference" ref="historyTip" :disabled="windowSmall || $isEEUiApp || historyShow" :content="$L('历史版本')">
+                            <ETooltip slot="reference" ref="historyTip" :disabled="$isEEUiApp || windowTouch || historyShow" :content="$L('历史版本')">
                                 <div class="header-icon"><i class="taskfont">&#xe71d;</i></div>
                             </ETooltip>
                         </EPopover>
diff --git a/resources/assets/js/pages/manage/components/MeetingManager.vue b/resources/assets/js/pages/manage/components/MeetingManager.vue
index 4123de1e2..0d54810a0 100644
--- a/resources/assets/js/pages/manage/components/MeetingManager.vue
+++ b/resources/assets/js/pages/manage/components/MeetingManager.vue
@@ -66,7 +66,7 @@
                 <Button type="primary" :loading="videoLoad" @click="onVideo">
                     <i class="taskfont" v-html="localUser.videoTrack ? '&#xe7c1;' : '&#xe7c8;'"></i>
                 </Button>
-                <template v-if="windowSmall">
+                <template v-if="windowPortrait">
                     <Button type="primary" @click="onInvitation('open')">
                         <i class="taskfont">&#xe646;</i>
                     </Button>
diff --git a/resources/assets/js/pages/manage/components/ProjectArchived.vue b/resources/assets/js/pages/manage/components/ProjectArchived.vue
index 018a91163..d6e36ddda 100644
--- a/resources/assets/js/pages/manage/components/ProjectArchived.vue
+++ b/resources/assets/js/pages/manage/components/ProjectArchived.vue
@@ -43,7 +43,7 @@
                 :current="page"
                 :page-size="pageSize"
                 :disabled="loadIng > 0"
-                :simple="windowSmall"
+                :simple="windowPortrait"
                 :page-size-opts="[10,20,30,50,100]"
                 show-elevator
                 show-sizer
diff --git a/resources/assets/js/pages/manage/components/ProjectDialog.vue b/resources/assets/js/pages/manage/components/ProjectDialog.vue
index 6edd1aea9..c9f2b739f 100644
--- a/resources/assets/js/pages/manage/components/ProjectDialog.vue
+++ b/resources/assets/js/pages/manage/components/ProjectDialog.vue
@@ -41,7 +41,7 @@ export default {
         ...mapGetters(['projectData']),
 
         dialogShow() {
-            return this.windowLarge && this.projectData.dialog_id && this.projectData.cacheParameter.chat
+            return this.windowLandscape && this.projectData.dialog_id && this.projectData.cacheParameter.chat
         }
     },
 
diff --git a/resources/assets/js/pages/manage/components/ProjectList.vue b/resources/assets/js/pages/manage/components/ProjectList.vue
index caada5be1..a634aa9bc 100644
--- a/resources/assets/js/pages/manage/components/ProjectList.vue
+++ b/resources/assets/js/pages/manage/components/ProjectList.vue
@@ -55,7 +55,7 @@
         <div class="operate-position" :style="operateStyles" v-show="operateVisible">
             <Dropdown
                 trigger="custom"
-                :placement="windowLarge ? 'bottom' : 'top'"
+                :placement="windowLandscape ? 'bottom' : 'top'"
                 :visible="operateVisible"
                 @on-clickoutside="operateVisible = false"
                 transfer>
diff --git a/resources/assets/js/pages/manage/components/ProjectManagement.vue b/resources/assets/js/pages/manage/components/ProjectManagement.vue
index 56fe6ecc7..e5a8ea41e 100644
--- a/resources/assets/js/pages/manage/components/ProjectManagement.vue
+++ b/resources/assets/js/pages/manage/components/ProjectManagement.vue
@@ -67,7 +67,7 @@
                 :current="page"
                 :page-size="pageSize"
                 :disabled="loadIng > 0"
-                :simple="windowSmall"
+                :simple="windowPortrait"
                 :page-size-opts="[10,20,30,50,100]"
                 show-elevator
                 show-sizer
diff --git a/resources/assets/js/pages/manage/components/ProjectPanel.vue b/resources/assets/js/pages/manage/components/ProjectPanel.vue
index b8d38fbab..73509e575 100644
--- a/resources/assets/js/pages/manage/components/ProjectPanel.vue
+++ b/resources/assets/js/pages/manage/components/ProjectPanel.vue
@@ -20,7 +20,7 @@
                         </li>
                         <template v-if="!(windowWidth <= 980 || projectData.cacheParameter.chat) && projectUser.length > 0" v-for="item in projectUser">
                             <li v-if="item.userid === -1" class="more">
-                                <ETooltip :disabled="windowSmall || $isEEUiApp" :content="$L('共' + (projectData.project_user.length) + '个成员')">
+                                <ETooltip :disabled="$isEEUiApp || windowTouch" :content="$L('共' + (projectData.project_user.length) + '个成员')">
                                     <Icon type="ios-more"/>
                                 </ETooltip>
                             </li>
@@ -31,7 +31,7 @@
                     </ul>
                 </li>
                 <li class="project-icon" @click="addTaskOpen(0)">
-                    <ETooltip :disabled="windowSmall || $isEEUiApp" :content="$L('添加任务')">
+                    <ETooltip :disabled="$isEEUiApp || windowTouch" :content="$L('添加任务')">
                         <Icon class="menu-icon" type="md-add" />
                     </ETooltip>
                 </li>
@@ -43,7 +43,7 @@
                         </div>
                     </Tooltip>
                 </li>
-                <li :class="['project-icon', windowLarge && projectData.cacheParameter.chat ? 'active' : '']" @click="toggleParameter('chat')">
+                <li :class="['project-icon', windowLandscape && projectData.cacheParameter.chat ? 'active' : '']" @click="toggleParameter('chat')">
                     <Icon class="menu-icon" type="ios-chatbubbles" />
                     <Badge class="menu-badge" :overflow-count="999" :count="msgUnread"></Badge>
                 </li>
@@ -95,7 +95,7 @@
             <Draggable
                 :list="columnList"
                 :animation="150"
-                :disabled="sortDisabled || windowSmall || $isEEUiApp"
+                :disabled="sortDisabled || $isEEUiApp || windowTouch"
                 class="column-list"
                 tag="ul"
                 draggable=".column-item"
@@ -150,7 +150,7 @@
                         <Draggable
                             :list="column.tasks"
                             :animation="150"
-                            :disabled="sortDisabled || windowSmall || $isEEUiApp"
+                            :disabled="sortDisabled || $isEEUiApp || windowTouch"
                             class="task-list"
                             draggable=".task-draggable"
                             filter=".complete"
@@ -195,7 +195,7 @@
                                     <ETooltip
                                         v-if="item.end_at"
                                         :class="['task-time', item.today ? 'today' : '', item.overdue ? 'overdue' : '']"
-                                        :disabled="windowSmall || $isEEUiApp"
+                                        :disabled="$isEEUiApp || windowTouch"
                                         :open-delay="600"
                                         :content="item.end_at">
                                         <div v-if="!item.complete_at"><i class="taskfont">&#xe71d;</i>{{ expiresFormat(item.end_at) }}</div>
@@ -876,7 +876,7 @@ export default {
 
     methods: {
         showName() {
-            if (this.windowLarge) {
+            if (this.windowLandscape) {
                 return;
             }
             $A.modalInfo({
@@ -887,7 +887,7 @@ export default {
         },
 
         showDesc() {
-            if (this.windowLarge) {
+            if (this.windowLandscape) {
                 return;
             }
             $A.modalInfo({
@@ -1477,7 +1477,7 @@ export default {
             if (data === 'completedTask') {
                 this.$store.dispatch("forgetTaskCompleteTemp", true);
             } else if (data === 'chat') {
-                if (this.windowSmall) {
+                if (this.windowPortrait) {
                     this.$store.dispatch('openDialog', this.projectData.dialog_id)
                     return;
                 }
diff --git a/resources/assets/js/pages/manage/components/ProjectWorkflow.vue b/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
index 261490fbf..ea82e7490 100644
--- a/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
+++ b/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
@@ -67,7 +67,7 @@
                                 <Draggable
                                     :list="data.project_flow_item"
                                     :animation="150"
-                                    :disabled="windowSmall || $isEEUiApp"
+                                    :disabled="$isEEUiApp || windowTouch"
                                     class="taskflow-config-table-list-wrapper"
                                     tag="div"
                                     draggable=".column-border"
diff --git a/resources/assets/js/pages/manage/components/ReportEdit.vue b/resources/assets/js/pages/manage/components/ReportEdit.vue
index fae87b7b2..49837f7e0 100644
--- a/resources/assets/js/pages/manage/components/ReportEdit.vue
+++ b/resources/assets/js/pages/manage/components/ReportEdit.vue
@@ -12,13 +12,13 @@
                 <Radio label="daily" :disabled="id > 0 && reportData.type =='weekly'">{{ $L("日报") }}</Radio>
             </RadioGroup>
             <ButtonGroup v-if="id === 0" class="report-buttongroup">
-                <ETooltip :disabled="windowSmall || $isEEUiApp" :content="prevCycleText" placement="bottom">
+                <ETooltip :disabled="$isEEUiApp || windowTouch" :content="prevCycleText" placement="bottom">
                     <Button type="primary" @click="prevCycle">
                         <Icon type="ios-arrow-back" />
                     </Button>
                 </ETooltip>
                 <div class="report-buttongroup-vertical"></div>
-                <ETooltip :disabled="windowSmall || $isEEUiApp || reportData.offset >= 0" :content="nextCycleText" placement="bottom">
+                <ETooltip :disabled="$isEEUiApp || windowTouch || reportData.offset >= 0" :content="nextCycleText" placement="bottom">
                     <Button type="primary" @click="nextCycle" :disabled="reportData.offset >= 0">
                         <Icon type="ios-arrow-forward" />
                     </Button>
diff --git a/resources/assets/js/pages/manage/components/ReportMy.vue b/resources/assets/js/pages/manage/components/ReportMy.vue
index 96649fc3d..7c296f29e 100644
--- a/resources/assets/js/pages/manage/components/ReportMy.vue
+++ b/resources/assets/js/pages/manage/components/ReportMy.vue
@@ -59,7 +59,7 @@
                 :current="listPage"
                 :page-size="listPageSize"
                 :disabled="loadIng > 0"
-                :simple="windowSmall"
+                :simple="windowPortrait"
                 :page-size-opts="[10,20,30,50,100]"
                 show-elevator
                 show-sizer
diff --git a/resources/assets/js/pages/manage/components/ReportReceive.vue b/resources/assets/js/pages/manage/components/ReportReceive.vue
index e05b591fb..8a268f801 100644
--- a/resources/assets/js/pages/manage/components/ReportReceive.vue
+++ b/resources/assets/js/pages/manage/components/ReportReceive.vue
@@ -73,7 +73,7 @@
                     :current="listPage"
                     :page-size="listPageSize"
                     :disabled="loadIng > 0"
-                    :simple="windowSmall"
+                    :simple="windowPortrait"
                     :page-size-opts="[10,20,30,50,100]"
                     show-elevator
                     show-sizer
diff --git a/resources/assets/js/pages/manage/components/TaskAdd.vue b/resources/assets/js/pages/manage/components/TaskAdd.vue
index 1afdb8c48..8062266e2 100644
--- a/resources/assets/js/pages/manage/components/TaskAdd.vue
+++ b/resources/assets/js/pages/manage/components/TaskAdd.vue
@@ -31,7 +31,7 @@
                     :plugins="taskPlugins"
                     :options="taskOptions"
                     :option-full="taskOptionFull"
-                    :placeholder="$L(windowLarge ? '详细描述，选填...（点击右键使用工具栏）' : '详细描述，选填...')"
+                    :placeholder="$L(windowLandscape ? '详细描述，选填...（点击右键使用工具栏）' : '详细描述，选填...')"
                     :placeholderFull="$L('详细描述...')"
                     inline/>
             </div>
@@ -39,7 +39,7 @@
                 <Button :class="{advanced: advanced}" @click="advanced=!advanced">{{$L('高级选项')}}</Button>
                 <ul class="advanced-priority">
                     <li v-for="(item, key) in taskPriority" :key="key">
-                        <ETooltip :disabled="windowSmall || $isEEUiApp" :content="taskPriorityContent(item)">
+                        <ETooltip :disabled="$isEEUiApp || windowTouch" :content="taskPriorityContent(item)">
                             <i
                                 class="taskfont"
                                 :style="{color:item.color}"
@@ -87,7 +87,7 @@
                     :transfer="false"/>
                 <div v-if="showAddAssist" class="task-add-assist">
                     <Checkbox v-model="addData.add_assist" :true-value="1" :false-value="0">{{$L('加入任务协助人员列表')}}</Checkbox>
-                    <ETooltip :disabled="windowSmall || $isEEUiApp" :content="$L('你不是任务负责人时建议加入任务协助人员列表')">
+                    <ETooltip :disabled="$isEEUiApp || windowTouch" :content="$L('你不是任务负责人时建议加入任务协助人员列表')">
                         <Icon type="ios-alert-outline" />
                     </ETooltip>
                 </div>
diff --git a/resources/assets/js/pages/manage/components/TaskAddSimple.vue b/resources/assets/js/pages/manage/components/TaskAddSimple.vue
index c678d8895..eedb13a4a 100644
--- a/resources/assets/js/pages/manage/components/TaskAddSimple.vue
+++ b/resources/assets/js/pages/manage/components/TaskAddSimple.vue
@@ -17,7 +17,7 @@
                 <div v-if="parentId == 0" class="priority">
                     <ul>
                         <li v-for="(item, key) in taskPriority" :key="key">
-                            <ETooltip v-if="active" :disabled="windowSmall || $isEEUiApp" :content="taskPriorityContent(item)">
+                            <ETooltip v-if="active" :disabled="$isEEUiApp || windowTouch" :content="taskPriorityContent(item)">
                                 <i
                                     class="taskfont"
                                     :style="{color:item.color}"
@@ -57,7 +57,7 @@
         <div class="priority">
             <ul>
                 <li v-for="(item, key) in taskPriority" :key="key">
-                    <ETooltip v-if="active" :disabled="windowSmall || $isEEUiApp" :content="taskPriorityContent(item)">
+                    <ETooltip v-if="active" :disabled="$isEEUiApp || windowTouch" :content="taskPriorityContent(item)">
                         <i
                             class="taskfont"
                             :style="{color:item.color}"
diff --git a/resources/assets/js/pages/manage/components/TaskArchived.vue b/resources/assets/js/pages/manage/components/TaskArchived.vue
index 86fb86c3d..311cd6291 100644
--- a/resources/assets/js/pages/manage/components/TaskArchived.vue
+++ b/resources/assets/js/pages/manage/components/TaskArchived.vue
@@ -43,7 +43,7 @@
                 :current="page"
                 :page-size="pageSize"
                 :disabled="loadIng > 0"
-                :simple="windowSmall"
+                :simple="windowPortrait"
                 :page-size-opts="[10,20,30,50,100]"
                 show-elevator
                 show-sizer
diff --git a/resources/assets/js/pages/manage/components/TaskDeleted.vue b/resources/assets/js/pages/manage/components/TaskDeleted.vue
index f15b96163..87683318a 100644
--- a/resources/assets/js/pages/manage/components/TaskDeleted.vue
+++ b/resources/assets/js/pages/manage/components/TaskDeleted.vue
@@ -43,7 +43,7 @@
                 :current="page"
                 :page-size="pageSize"
                 :disabled="loadIng > 0"
-                :simple="windowSmall"
+                :simple="windowPortrait"
                 :page-size-opts="[10,20,30,50,100]"
                 show-elevator
                 show-sizer
diff --git a/resources/assets/js/pages/manage/components/TaskDetail.vue b/resources/assets/js/pages/manage/components/TaskDetail.vue
index ad2d00628..ccd3e1985 100644
--- a/resources/assets/js/pages/manage/components/TaskDetail.vue
+++ b/resources/assets/js/pages/manage/components/TaskDetail.vue
@@ -122,7 +122,7 @@
                         </div>
                         <Button slot="reference" :loading="ownerLoad > 0" class="pick" type="primary">{{$L('我要领取任务')}}</Button>
                     </EPopover>
-                    <ETooltip v-if="$Electron" :disabled="windowSmall || $isEEUiApp" :content="$L('新窗口打开')">
+                    <ETooltip v-if="$Electron" :disabled="$isEEUiApp || windowTouch" :content="$L('新窗口打开')">
                         <i class="taskfont open" @click="openNewWin">&#xe776;</i>
                     </ETooltip>
                     <div class="menu">
@@ -287,7 +287,7 @@
                                     trigger="click"
                                     placement="bottom"
                                     @command="updateData('loop', $event)">
-                                    <ETooltip :disabled="windowSmall || $isEEUiApp || !taskDetail.loop_at" :content="`${$L('下个周期')}: ${taskDetail.loop_at}`" placement="right">
+                                    <ETooltip :disabled="$isEEUiApp || windowTouch || !taskDetail.loop_at" :content="`${$L('下个周期')}: ${taskDetail.loop_at}`" placement="right">
                                         <span>{{$L(loopLabel(taskDetail.loop))}}</span>
                                     </ETooltip>
                                     <EDropdownMenu slot="dropdown" class="task-detail-loop">
@@ -665,7 +665,7 @@ export default {
         },
 
         hasOpenDialog() {
-            return this.taskDetail.dialog_id > 0 && this.windowLarge;
+            return this.taskDetail.dialog_id > 0 && this.windowLandscape;
         },
 
         dialogStyle() {
@@ -810,7 +810,7 @@ export default {
                 if (id > 0) {
                     this.ready = true;
                 } else {
-                    if (this.windowSmall) {
+                    if (this.windowPortrait) {
                         $A.onBlur();
                     }
                     this.timeOpen = false;
@@ -1287,7 +1287,7 @@ export default {
                     });
                 } else {
                     this.$nextTick(() => {
-                        if (this.windowSmall) {
+                        if (this.windowPortrait) {
                             $A.onBlur();
                             const transferData = {
                                 time: $A.Time() + 10,
diff --git a/resources/assets/js/pages/manage/components/TaskRow.vue b/resources/assets/js/pages/manage/components/TaskRow.vue
index b91c0a4b2..161f1587f 100644
--- a/resources/assets/js/pages/manage/components/TaskRow.vue
+++ b/resources/assets/js/pages/manage/components/TaskRow.vue
@@ -86,7 +86,7 @@
                     <ETooltip
                         v-if="!item.complete_at && item.end_at"
                         :class="['task-time', item.today ? 'today' : '', item.overdue ? 'overdue' : '']"
-                        :disabled="windowSmall || $isEEUiApp"
+                        :disabled="$isEEUiApp || windowTouch"
                         :open-delay="600"
                         :content="item.end_at">
                         <div @click="openTask(item)">{{expiresFormat(item.end_at)}}</div>
diff --git a/resources/assets/js/pages/manage/components/TeamManagement.vue b/resources/assets/js/pages/manage/components/TeamManagement.vue
index d80064282..9488d1aef 100644
--- a/resources/assets/js/pages/manage/components/TeamManagement.vue
+++ b/resources/assets/js/pages/manage/components/TeamManagement.vue
@@ -144,7 +144,7 @@
                         :current="page"
                         :page-size="pageSize"
                         :disabled="loadIng > 0"
-                        :simple="windowSmall"
+                        :simple="windowPortrait"
                         :page-size-opts="[10,20,30,50,100]"
                         show-elevator
                         show-sizer
@@ -769,7 +769,7 @@ export default {
         departmentSelect() {
             this.setPage(1)
         },
-        windowSmall: {
+        windowPortrait: {
             handler(v) {
                 this.minBox = v
             },
@@ -1082,7 +1082,7 @@ export default {
         },
 
         onSelectDepartment(id) {
-            if (this.windowSmall) {
+            if (this.windowPortrait) {
                 this.minBox = true
             }
             //
diff --git a/resources/assets/js/pages/manage/dashboard.vue b/resources/assets/js/pages/manage/dashboard.vue
index 482a4671d..44370690c 100644
--- a/resources/assets/js/pages/manage/dashboard.vue
+++ b/resources/assets/js/pages/manage/dashboard.vue
@@ -72,7 +72,7 @@
                                 <i class="taskfont">&#xe71f;</i>
                                 <em>{{item.sub_complete}}/{{item.sub_num}}</em>
                             </div>
-                            <ETooltip v-if="item.end_at" :disabled="windowSmall || $isEEUiApp" :content="item.end_at" placement="right">
+                            <ETooltip v-if="item.end_at" :disabled="$isEEUiApp || windowTouch" :content="item.end_at" placement="right">
                                 <div :class="['item-icon', item.today ? 'today' : '', item.overdue ? 'overdue' : '']">
                                     <i class="taskfont">&#xe71d;</i>
                                     <em>{{expiresFormat(item.end_at)}}</em>
diff --git a/resources/assets/js/pages/manage/file.vue b/resources/assets/js/pages/manage/file.vue
index a741e3242..af876e8da 100644
--- a/resources/assets/js/pages/manage/file.vue
+++ b/resources/assets/js/pages/manage/file.vue
@@ -813,7 +813,7 @@ export default {
         },
 
         isPreview() {
-            return this.windowSmall || this.fileInfo.permission === 0
+            return this.windowPortrait || this.fileInfo.permission === 0
         },
 
         isParentShare() {
@@ -841,7 +841,7 @@ export default {
         },
 
         tableHeight() {
-            if (this.windowLarge) {
+            if (this.windowLandscape) {
                 return Math.max(300, this.windowHeight - 160)
             } else {
                 return Math.max(300, this.windowHeight - 200)
@@ -871,7 +871,7 @@ export default {
         fileShow(val) {
             if (!val) {
                 this.browseFile(0)
-                if (this.windowSmall) {
+                if (this.windowPortrait) {
                     $A.onBlur(true)
                 }
             }
@@ -978,7 +978,7 @@ export default {
         },
 
         handleContextmenu(event) {
-            if (this.windowLarge) {
+            if (this.windowLandscape) {
                 this.handleRightClick(event)
             }
         },
diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue
index ed57c4a5f..c9657d0da 100644
--- a/resources/assets/js/pages/manage/messenger.vue
+++ b/resources/assets/js/pages/manage/messenger.vue
@@ -145,7 +145,7 @@
                     <div class="operate-position" :style="operateStyles" v-show="operateVisible">
                         <Dropdown
                             trigger="custom"
-                            :placement="windowLarge ? 'bottom' : 'top'"
+                            :placement="windowLandscape ? 'bottom' : 'top'"
                             :visible="operateVisible"
                             @on-clickoutside="operateVisible = false"
                             transfer>
@@ -180,7 +180,7 @@
                     <div class="msg-dialog-bg-icon"><Icon type="ios-chatbubbles" /></div>
                     <div class="msg-dialog-bg-text">{{$L('选择一个会话开始聊天')}}</div>
                 </div>
-                <DialogWrapper v-if="windowLarge && dialogId > 0" :dialogId="dialogId" @on-active="scrollIntoActive" :auto-focus="$A.isDesktop()"/>
+                <DialogWrapper v-if="windowLandscape && dialogId > 0" :dialogId="dialogId" @on-active="scrollIntoActive" :auto-focus="$A.isDesktop()"/>
             </div>
         </div>
     </div>
@@ -624,7 +624,7 @@ export default {
             }
             this.$set(user, 'loading', true);
             this.$store.dispatch("openDialogUserid", user.userid).then(_ => {
-                if (this.windowLarge) {
+                if (this.windowLandscape) {
                     this.tabActive = 'dialog';
                 }
             }).catch(({msg}) => {
@@ -831,7 +831,7 @@ export default {
 
         scrollIntoActive() {
             this.$nextTick(() => {
-                if (this.windowLarge && this.$refs.list) {
+                if (this.windowLandscape && this.$refs.list) {
                     const active = this.$refs.list.querySelector(".active")
                     if (active) {
                         $A.scrollIntoViewIfNeeded(active);
diff --git a/resources/assets/js/pages/manage/project.vue b/resources/assets/js/pages/manage/project.vue
index 6864aca28..50920b4fc 100644
--- a/resources/assets/js/pages/manage/project.vue
+++ b/resources/assets/js/pages/manage/project.vue
@@ -4,7 +4,7 @@
             <ProjectPanel/>
             <ProjectDialog/>
         </template>
-        <ProjectList v-if="windowSmall" v-show="projectId === 0"/>
+        <ProjectList v-if="windowPortrait" v-show="projectId === 0"/>
     </div>
 </template>
 
diff --git a/resources/assets/js/pages/manage/setting/components/SystemSetting.vue b/resources/assets/js/pages/manage/setting/components/SystemSetting.vue
index f3435d8ed..b09243213 100644
--- a/resources/assets/js/pages/manage/setting/components/SystemSetting.vue
+++ b/resources/assets/js/pages/manage/setting/components/SystemSetting.vue
@@ -69,7 +69,7 @@
                             <Radio label="close">{{$L('关闭')}}</Radio>
                         </RadioGroup>
                         <div class="form-tip">{{$L('任务完成后自动归档。')}}</div>
-                        <ETooltip v-if="formDatum.auto_archived=='open'" placement="right" :disabled="windowSmall || $isEEUiApp">
+                        <ETooltip v-if="formDatum.auto_archived=='open'" placement="right" :disabled="$isEEUiApp || windowTouch">
                             <div class="setting-auto-day">
                                 <Input v-model="formDatum.archived_day" type="number">
                                     <span slot="append">{{$L('天')}}</span>
diff --git a/resources/assets/js/pages/manage/setting/index.vue b/resources/assets/js/pages/manage/setting/index.vue
index dbb1b29e2..65f8ae42c 100644
--- a/resources/assets/js/pages/manage/setting/index.vue
+++ b/resources/assets/js/pages/manage/setting/index.vue
@@ -116,7 +116,7 @@ export default {
         },
 
         settingTitleName() {
-            if (this.windowSmall) {
+            if (this.windowPortrait) {
                 return this.titleNameRoute
             }
             return '设置'
@@ -126,7 +126,7 @@ export default {
     watch: {
         routeName: {
             handler(name) {
-                if (name === 'manage-setting' && this.windowLarge) {
+                if (name === 'manage-setting' && this.windowLandscape) {
                     this.goForward({name: 'manage-setting-personal'}, true);
                 }
             },
@@ -191,7 +191,7 @@ export default {
 
         classNameRoute(path, divided) {
             return {
-                "active": this.windowLarge && this.routeName === `manage-setting-${path}`,
+                "active": this.windowLandscape && this.routeName === `manage-setting-${path}`,
                 "divided": !!divided
             };
         },
diff --git a/resources/assets/js/pages/single/file.vue b/resources/assets/js/pages/single/file.vue
index ff2804356..c3dc454d3 100644
--- a/resources/assets/js/pages/single/file.vue
+++ b/resources/assets/js/pages/single/file.vue
@@ -43,7 +43,7 @@ export default {
             return this.$route.query ? $A.runNum(this.$route.query.history_id) : 0;
         },
         isPreview() {
-            return this.windowSmall || this.code || this.historyId > 0 || (this.fileInfo && this.fileInfo.permission === 0)
+            return this.windowPortrait || this.code || this.historyId > 0 || (this.fileInfo && this.fileInfo.permission === 0)
         },
         pageName() {
             let name = this.fileInfo ? this.fileInfo.name : '';
diff --git a/resources/assets/js/store/mixin.js b/resources/assets/js/store/mixin.js
index e1ef30879..edd44a3b1 100644
--- a/resources/assets/js/store/mixin.js
+++ b/resources/assets/js/store/mixin.js
@@ -7,10 +7,13 @@ export default {
             'windowHeight',
 
             'windowActive',
+
             'windowScrollY',
 
-            'windowLarge',
-            'windowSmall',
+            'windowTouch',
+
+            'windowLandscape',
+            'windowPortrait',
 
             'userId',
             'userToken',
diff --git a/resources/assets/js/store/state.js b/resources/assets/js/store/state.js
index eb036051d..7b745a838 100644
--- a/resources/assets/js/store/state.js
+++ b/resources/assets/js/store/state.js
@@ -1,22 +1,33 @@
+const windowWidth = $A(window).width(),
+    windowHeight = $A(window).height(),
+    windowOrientation = $A.strExists(window.screen.orientation.type, 'portrait') ? 'portrait' : 'landscape'
+
 export default {
     // 客户端ID（希望不变的，除非清除浏览器缓存或者卸载应用）
     clientId: "",
 
-    // 是否移动端（支持触摸）
-    supportTouch: "ontouchend" in document,
-
-    // 浏览器尺寸信息
-    windowWidth: $A(window).width(),
-    windowHeight: $A(window).height(),
-    windowScrollY: 0,
-
-    // 浏览器窗口类型
-    windowLarge: $A(window).width() > 834, // 大窗口
-    windowSmall: $A(window).width() <= 834, // 小窗口
-
     // 窗口是否激活
     windowActive: true,
 
+    // 窗口滚动条位置
+    windowScrollY: 0,
+
+    // 浏览器支持触摸事件
+    windowTouch: "ontouchend" in document,
+
+    // 浏览器尺寸信息
+    windowWidth: windowWidth,
+    windowHeight: windowHeight,
+
+    // 浏览器窗口方向
+    windowOrientation: windowOrientation,
+    windowLandscape: windowOrientation === 'landscape', // 横屏
+    windowPortrait: windowOrientation === 'portrait',   // 竖屏
+
+    // 表单布局
+    formLabelPosition: windowWidth > 576 ? 'right' : 'top',
+    formLabelWidth: windowWidth > 576 ? 'auto' : '',
+
     // App通知权限
     appNotificationPermission: true,
 
@@ -171,10 +182,6 @@ export default {
     // 工作报告未读数量
     reportUnreadNumber: 0,
 
-    // 表单布局
-    formLabelPosition: $A(window).width() > 576 ? 'right' : 'top',
-    formLabelWidth: $A(window).width() > 576 ? 'auto' : '',
-
     // 加密相关
     apiKeyData: {},
     localKeyPair: {},
diff --git a/resources/assets/sass/components/_.scss b/resources/assets/sass/components/_.scss
index 6a532a70a..acaa65ebe 100644
--- a/resources/assets/sass/components/_.scss
+++ b/resources/assets/sass/components/_.scss
@@ -13,4 +13,5 @@
 @import "user-avatar";
 @import "user-input";
 @import "report";
+@import "resize-line";
 @import "right-bottom";
diff --git a/resources/assets/sass/components/mobile.scss b/resources/assets/sass/components/mobile.scss
index 566276ee0..54057624f 100644
--- a/resources/assets/sass/components/mobile.scss
+++ b/resources/assets/sass/components/mobile.scss
@@ -314,13 +314,13 @@
     opacity: 0;
 }
 
-body.support-touch {
+body.window-touch {
     .mobile-back {
         display: block;
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .mobile-tabbar {
         display: flex;
     }
diff --git a/resources/assets/sass/components/resize-line.scss b/resources/assets/sass/components/resize-line.scss
new file mode 100644
index 000000000..dfa42dd02
--- /dev/null
+++ b/resources/assets/sass/components/resize-line.scss
@@ -0,0 +1,30 @@
+.component-resize-line {
+    cursor: col-resize;
+
+    &.resizing {
+        &:after {
+            content: '';
+            position: fixed;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            z-index: 99999;
+            cursor: col-resize;
+        }
+    }
+
+    &.bottom {
+        cursor: row-resize;
+
+        &:after {
+            cursor: row-resize;
+        }
+    }
+}
+
+body.window-portrait {
+    .component-resize-line {
+        display: none;
+    }
+}
diff --git a/resources/assets/sass/components/right-bottom.scss b/resources/assets/sass/components/right-bottom.scss
index 464ca41c3..8548dbdf8 100644
--- a/resources/assets/sass/components/right-bottom.scss
+++ b/resources/assets/sass/components/right-bottom.scss
@@ -88,7 +88,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .common-right-bottom {
         bottom: 20px;
         right: auto;
diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss
index 4a74cd89c..dadee23e8 100755
--- a/resources/assets/sass/pages/components/chat-input.scss
+++ b/resources/assets/sass/pages/components/chat-input.scss
@@ -788,7 +788,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .chat-input-box {
         .chat-input-quick-emoji {
             right: 10px;
diff --git a/resources/assets/sass/pages/components/dialog-group-info.scss b/resources/assets/sass/pages/components/dialog-group-info.scss
index 4015be21d..6b6b9a264 100644
--- a/resources/assets/sass/pages/components/dialog-group-info.scss
+++ b/resources/assets/sass/pages/components/dialog-group-info.scss
@@ -71,12 +71,6 @@
                     }
                 }
 
-                @media (max-width: 834px) {
-                    &:hover {
-                        background-color: transparent;
-                    }
-                }
-
                 &.no {
                     &:hover {
                         background-color: transparent;
@@ -123,11 +117,6 @@
                     transform: translateX(50%);
                     transition: all 0.2s;
 
-                    @media (max-width: 834px) {
-                        opacity: 1;
-                        transform: translateX(0);
-                    }
-
                     &:hover {
                         > i {
                             color: $primary-text-color;
@@ -150,3 +139,21 @@
         }
     }
 }
+
+body.window-portrait {
+    .dialog-group-info {
+        .group-info-user {
+            > ul {
+                > li {
+                    &:hover {
+                        background-color: transparent;
+                    }
+                    .user-exit {
+                        opacity: 1;
+                        transform: translateX(0);
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/resources/assets/sass/pages/components/dialog-respond.scss b/resources/assets/sass/pages/components/dialog-respond.scss
index eab69ddc7..77e4248bd 100644
--- a/resources/assets/sass/pages/components/dialog-respond.scss
+++ b/resources/assets/sass/pages/components/dialog-respond.scss
@@ -42,12 +42,6 @@
                     background-color: rgba($primary-desc-color, 0.1);
                 }
 
-                @media (max-width: 834px) {
-                    &:hover {
-                        background-color: transparent;
-                    }
-                }
-
                 .common-avatar {
                     width: 0;
                     flex: 1;
@@ -59,3 +53,17 @@
         }
     }
 }
+
+body.window-portrait {
+    .dialog-respond {
+        .respond-user {
+            > ul {
+                > li {
+                    &:hover {
+                        background-color: transparent;
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index abcfc1260..8b164ec62 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -1602,7 +1602,7 @@
     }
 }
 
-body.support-touch {
+body.window-touch {
     .dialog-wrapper {
         .dialog-scroller {
             user-select: none;
@@ -1621,7 +1621,7 @@ body.support-touch {
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .dialog-wrapper {
         background-color: #f8f8f8;
         &.drawer-list {
@@ -1851,18 +1851,18 @@ body.support-touch {
             }
         }
     }
-}
 
-@media (max-width: 834px) and (min-width: 390px){
-    .dialog-wrapper-operate {
-        .operate-action {
-            width: 376px;
-        }
-        .operate-emoji {
-            width: 376px;
+    @media (max-width: 768px) and (min-width: 390px){
+        .dialog-wrapper-operate {
+            .operate-action {
+                width: 376px;
+            }
+            .operate-emoji {
+                width: 376px;
 
-            > li {
-                width: 46px;
+                > li {
+                    width: 46px;
+                }
             }
         }
     }
diff --git a/resources/assets/sass/pages/components/file-content.scss b/resources/assets/sass/pages/components/file-content.scss
index ee7973b3b..296061654 100644
--- a/resources/assets/sass/pages/components/file-content.scss
+++ b/resources/assets/sass/pages/components/file-content.scss
@@ -314,16 +314,6 @@
     }
 }
 
-@media (max-width: 834px) {
-    .file-preview {
-        .edit-header {
-            .header-hint {
-                display: none;
-            }
-        }
-    }
-}
-
 @media (max-width: 1200px) {
     .file-content {
         overflow: auto;
@@ -343,3 +333,13 @@
         }
     }
 }
+
+body.window-portrait {
+    .file-preview {
+        .edit-header {
+            .header-hint {
+                display: none;
+            }
+        }
+    }
+}
diff --git a/resources/assets/sass/pages/components/meeting-manager.scss b/resources/assets/sass/pages/components/meeting-manager.scss
index 52bac354b..1b6b05e97 100644
--- a/resources/assets/sass/pages/components/meeting-manager.scss
+++ b/resources/assets/sass/pages/components/meeting-manager.scss
@@ -49,23 +49,6 @@ body {
                                     }
                                 }
                             }
-                            @media (max-width: 834px) {
-                                grid-template-columns: none;
-                                grid-gap: 12px;
-                                display: flex;
-                                flex-wrap: wrap;
-                                justify-content: flex-start;
-                                > li {
-                                    width: calc(50% - 6px);
-                                    max-width: 180px;
-                                    .meeting-player {
-                                        .player {
-                                            width: 100%;
-                                            height: 176px;;
-                                        }
-                                    }
-                                }
-                            }
                         }
                     }
                 }
@@ -76,6 +59,37 @@ body {
         }
     }
 }
+
+body.window-portrait {
+    .ivu-modal-wrap {
+        &.meeting-manager {
+            .ivu-modal {
+                .ivu-modal-content {
+                    .ivu-modal-body {
+                        > ul {
+                            grid-template-columns: none;
+                            grid-gap: 12px;
+                            display: flex;
+                            flex-wrap: wrap;
+                            justify-content: flex-start;
+                            > li {
+                                width: calc(50% - 6px);
+                                max-width: 180px;
+                                .meeting-player {
+                                    .player {
+                                        width: 100%;
+                                        height: 176px;;
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
 .meeting-drag-ball {
     position: relative;
     background-color: #ffffff;
@@ -97,6 +111,7 @@ body {
         padding-left: 4px;
     }
 }
+
 .meeting-button-group {
     display: flex;
     justify-content: flex-end;
diff --git a/resources/assets/sass/pages/components/project-panel.scss b/resources/assets/sass/pages/components/project-panel.scss
index fc600d1a1..b24d2e29f 100644
--- a/resources/assets/sass/pages/components/project-panel.scss
+++ b/resources/assets/sass/pages/components/project-panel.scss
@@ -1026,7 +1026,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .project-panel {
         .project-titbox {
             position: sticky;
diff --git a/resources/assets/sass/pages/components/task-add.scss b/resources/assets/sass/pages/components/task-add.scss
index 97ffda21b..85f6f707c 100644
--- a/resources/assets/sass/pages/components/task-add.scss
+++ b/resources/assets/sass/pages/components/task-add.scss
@@ -206,7 +206,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .task-add {
         .task-add-form,
         .task-add-advanced {
diff --git a/resources/assets/sass/pages/components/task-detail.scss b/resources/assets/sass/pages/components/task-detail.scss
index 519e7967d..d04cf0c87 100644
--- a/resources/assets/sass/pages/components/task-detail.scss
+++ b/resources/assets/sass/pages/components/task-detail.scss
@@ -858,7 +858,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .task-detail {
         .task-info {
             .scroller {
diff --git a/resources/assets/sass/pages/page-calendar.scss b/resources/assets/sass/pages/page-calendar.scss
index 389f59720..e405c8699 100644
--- a/resources/assets/sass/pages/page-calendar.scss
+++ b/resources/assets/sass/pages/page-calendar.scss
@@ -191,7 +191,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-calendar {
         .calendar-head {
             .calendar-titbox {
@@ -229,16 +229,17 @@
             }
         }
     }
-}
-
-@media (max-width: 640px) {
-    .page-calendar {
-        .calendar-box {
-            .calendar-wrapper {
-                .tui-full-calendar-popup-arrow {
-                    display: none;
+    @media (max-width: 640px) {
+        .page-calendar {
+            .calendar-box {
+                .calendar-wrapper {
+                    .tui-full-calendar-popup-arrow {
+                        display: none;
+                    }
                 }
             }
         }
     }
 }
+
+
diff --git a/resources/assets/sass/pages/page-dashboard.scss b/resources/assets/sass/pages/page-dashboard.scss
index 8969ae294..33be7daa8 100644
--- a/resources/assets/sass/pages/page-dashboard.scss
+++ b/resources/assets/sass/pages/page-dashboard.scss
@@ -286,7 +286,7 @@
     opacity: 0;
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-dashboard {
         .dashboard-wrapper {
             display: block;
diff --git a/resources/assets/sass/pages/page-file.scss b/resources/assets/sass/pages/page-file.scss
index af499651b..73eff41af 100644
--- a/resources/assets/sass/pages/page-file.scss
+++ b/resources/assets/sass/pages/page-file.scss
@@ -695,7 +695,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-file {
         .file-wrapper {
             .file-head {
diff --git a/resources/assets/sass/pages/page-login.scss b/resources/assets/sass/pages/page-login.scss
index ca8393a6b..e872fd117 100644
--- a/resources/assets/sass/pages/page-login.scss
+++ b/resources/assets/sass/pages/page-login.scss
@@ -198,7 +198,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-login {
         .login-body {
             padding: 0 0 110px;
diff --git a/resources/assets/sass/pages/page-manage.scss b/resources/assets/sass/pages/page-manage.scss
index bf3cbeed0..58f46a407 100644
--- a/resources/assets/sass/pages/page-manage.scss
+++ b/resources/assets/sass/pages/page-manage.scss
@@ -421,7 +421,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-manage {
         &.show-tabbar {
             .manage-box-main {
diff --git a/resources/assets/sass/pages/page-messenger.scss b/resources/assets/sass/pages/page-messenger.scss
index b868822fb..c251f513b 100644
--- a/resources/assets/sass/pages/page-messenger.scss
+++ b/resources/assets/sass/pages/page-messenger.scss
@@ -590,7 +590,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-messenger {
         .messenger-wrapper {
             .messenger-select {
diff --git a/resources/assets/sass/pages/page-setting.scss b/resources/assets/sass/pages/page-setting.scss
index 81f5fc15c..9ee0b6c7f 100755
--- a/resources/assets/sass/pages/page-setting.scss
+++ b/resources/assets/sass/pages/page-setting.scss
@@ -372,7 +372,7 @@
     }
 }
 
-@media (max-width: 834px) {
+body.window-portrait {
     .page-setting {
         .setting-head {
             margin: 32px 32px 0;
diff --git a/resources/views/desktop.blade.php b/resources/views/desktop.blade.php
index 6b49c3447..f3d23c4b0 100755
--- a/resources/views/desktop.blade.php
+++ b/resources/views/desktop.blade.php
@@ -100,7 +100,7 @@
             line-height: 26px
         }
 
-        @media (max-width: 834px) {
+        @media (max-width: 768px) {
             .mirror {
                 width: 100%;
                 padding: 0 15px 10px