fix: Captcha optimize (#560)

* fix: yarn无法启动

* fix(login.vue): 验证码操作优化，el-message调用修复

* fix: 原配置会导致linux下直接显示宋体，修复为自动选择非衬线字体

Author: gadfly3173

package.json

@@ -17,7 +17,7 @@
     "@babel/polyfill": "^7.4.4",
     "@tinymce/tinymce-vue": "^4.0.0",
     "axios": "^0.24.0",
-    "core-js": "^3.6.5",
+    "core-js": "^3.23.5",
     "dayjs": "^1.10.4",
     "element-plus": "^2.1.4",
     "event-source-polyfill": "^1.0.7",

src/assets/style/realize/reset.scss

@@ -84,7 +84,7 @@ input {
   border: 0;
   font-size: 100%;
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
-    Microsoft YaHei, SimSun, sans-serif;
+    Microsoft YaHei, sans-serif;
   font-weight: normal;
   vertical-align: baseline;
 }

src/view/login/login.vue

@@ -13,8 +13,8 @@
           <input type="password" v-model="account.password" autocomplete="off" placeholder="请填写用户登录密码" />
         </div>
         <div class="form-item password" v-if="captchaImage">
-          <img class="captcha" :src="captchaImage" />
-          <input type="password" v-model="account.captcha" autocomplete="off" placeholder="请填写验证码" />
+          <img class="captcha" :src="captchaImage" @click.stop="getCaptcha()" />
+          <input type="text" v-model="account.captcha" autocomplete="off" placeholder="请填写验证码" />
         </div>
         <button class="submit-btn" type="submit">登录</button>
       </form>
@@ -23,9 +23,10 @@
 </template>
 
 <script>
-import { reactive, ref, onMounted, getCurrentInstance } from 'vue'
+import { reactive, ref, onMounted } from 'vue'
 import { useStore } from 'vuex'
 import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
 import axios from 'lin/plugin/axios'
 import UserModel from '@/lin/model/user'
 import Utils from '@/lin/util/util'
@@ -40,7 +41,6 @@ export default {
     const store = useStore()
     const router = useRouter()
     const throttleLogin = ref(null)
-    const { ctx } = getCurrentInstance()
 
     const account = reactive({
       username: '',
@@ -59,11 +59,12 @@ export default {
         await getInformation()
         loading.value = false
         router.push(Config.defaultRoute)
-        ctx.$message({
+        ElMessage({
           message: '登录成功',
           type: 'success',
         })
       } catch (e) {
+        getCaptcha()
         loading.value = false
       }
     }
@@ -103,6 +104,7 @@ export default {
     return {
       account,
       loading,
+      getCaptcha,
       captchaImage,
       throttleLogin,
     }
@@ -114,8 +116,8 @@ export default {
 .login {
   width: 100%;
   height: 100%;
-  background-size: auto;
   background: #1b2c5f url('../../assets/image/login/login-ba.png') no-repeat center center;
+  background-size: cover;
 
   .team-name {
     position: fixed;
@@ -172,6 +174,7 @@ export default {
           width: 80px;
           right: 30px;
           top: -22px;
+          cursor: pointer;
         }
       }