From 2f67aa5486db4a09cb28371aabcaa48297de6764 Mon Sep 17 00:00:00 2001
From: marvzhang <tikazyq@163.com>
Date: Fri, 7 Feb 2020 10:10:35 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=A0=E5=85=A5=E7=99=BB=E5=BD=95=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E7=A7=BB=E5=8A=A8=E7=AB=AF=E6=8F=90=E9=86=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/i18n/zh.js            |  1 +
 frontend/src/views/login/index.vue | 24 ++++++++++++++++++++++--
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/frontend/src/i18n/zh.js b/frontend/src/i18n/zh.js
index 8a3fb800..0a703620 100644
--- a/frontend/src/i18n/zh.js
+++ b/frontend/src/i18n/zh.js
@@ -496,6 +496,7 @@ docker run -d --restart always --name crawlab_worker \\
   'Here you can set your password.': '这里您可以设置您的密码',
   'In this tab you can configure your notification settings.': '在这个标签中，您可以配置您的消息通知配置',
   'Here you can add/edit/delete global environment variables which will be passed into your spider programs.': '这里您可以添加/修改/删除全局环境变量，它们会被传入爬虫程序中',
+  'You are running on a mobile device, which is not optimized yet. Please try with a laptop or desktop.': '您正在没有优化过的移动端上浏览，我们建议您用电脑来访问',
 
   // 其他
   'Star crawlab-team/crawlab on GitHub': '在 GitHub 上为 Crawlab 加星吧'
diff --git a/frontend/src/views/login/index.vue b/frontend/src/views/login/index.vue
index 5bad9935..b3559e49 100644
--- a/frontend/src/views/login/index.vue
+++ b/frontend/src/views/login/index.vue
@@ -73,6 +73,11 @@
         <span @click="setLang('zh')" :class="lang==='zh'?'active':''">中文</span>
         <span @click="setLang('en')" :class="lang==='en'?'active':''">English</span>
       </div>
+      <div v-if="isShowMobileWarning" class="mobile-warning">
+        <el-alert type="error" :closable="false">
+          {{$t('You are running on a mobile device, which is not optimized yet. Please try with a laptop or desktop.')}}
+        </el-alert>
+      </div>
     </el-form>
   </div>
 </template>
@@ -121,7 +126,8 @@ export default {
         confirmPassword: [{ required: true, trigger: 'blur', validator: validateConfirmPass }]
       },
       loading: false,
-      pwdType: 'password'
+      pwdType: 'password',
+      isShowMobileWarning: false
     }
   },
   computed: {
@@ -179,7 +185,11 @@ export default {
     }
   },
   mounted () {
-    initCanvas()
+    if (window.innerWidth >= 1024) {
+      initCanvas()
+    } else {
+      this.isShowMobileWarning = true
+    }
   }
 }
 
@@ -455,5 +465,15 @@ const initCanvas = () => {
         text-decoration: underline;
       }
     }
+
+    .mobile-warning {
+      margin-top: 20px;
+    }
+
+  }
+</style>
+<style scoped>
+  .mobile-warning >>> .el-alert .el-alert__description {
+    font-size: 1.2rem;
   }
 </style>