Merge remote-tracking branch 'origin/master'

h5app/src/api/login/index.ts

@@ -1,5 +1,5 @@
 //import type { BaseResponse } from '@/utils/request';
-import { request } from '@/utils/request';
+import {request} from '@/utils/request';
 import crtyptoHelp from '@/utils/crypto';
 
 /**
@@ -8,31 +8,32 @@ import crtyptoHelp from '@/utils/crypto';
  * @returns
  */
 export function login(data: API.LoginParams) {
-  const desVal = crtyptoHelp.encryptDes(`${data.username}|${crtyptoHelp.MD5(data.password)}|${data.verifyCode}`)
-  return request<API.LoginResult>(
-    {
-      url: 'account/login',
-      method: 'post',
-      data:desVal,
-    },
-    {
-      isNew: true,
-    },
-  );
+    const desVal = crtyptoHelp.encryptDes(`${data.username}|${crtyptoHelp.MD5(data.password)}|${data.verifyCode}`)
+    return request<API.LoginResult>(
+        {
+            url: 'account/login',
+            method: 'post',
+            data: desVal,
+        },
+        {
+            isNew: true,
+            isShowErrorMsg: false
+        },
+    );
 }
 
 /**
  * @description 获取验证码
  */
 export function getImageCaptcha(params?: API.CaptchaParams) {
-  return request<API.CaptchaResult>(
-    {
-      url: 'account/captcha',
-      method: 'get',
-      params,
-    },
-    {
-      isNew: true,
-    },
-  );
+    return request<API.CaptchaResult>(
+        {
+            url: 'account/captcha',
+            method: 'get',
+            params,
+        },
+        {
+            isNew: true,
+        },
+    );
 }

h5app/src/utils/request.ts

@@ -21,6 +21,8 @@ export interface RequestOptions {
   isMock?: boolean;
   /** 是否开发后台数据 */
   isNew?: boolean;
+  isShowSuccessMsg?:boolean;
+  isShowErrorMsg?:boolean;
 }
 
 export interface RequsetData {
@@ -120,7 +122,7 @@ export const request = async <T = any>(
   options: RequestOptions = {},
 ): Promise<T> => {
   try {
-    const {successMsg, errorMsg, permCode, isMock, isGetDataDirectly = true} = options;
+    const {successMsg, errorMsg, permCode, isMock, isGetDataDirectly = true,isShowSuccessMsg = true} = options;
     // 如果当前是需要鉴权的接口 并且没有权限的话 则终止请求发起 , isNew
     if (permCode && !useUserStore().perms.includes(permCode)) {
       //return $message.error('你没有访问该接口的权限，请联系管理员！');
@@ -142,14 +144,14 @@ export const request = async <T = any>(
     //   config.url.replace(/^https?:/g, location.protocol);
     // }
     const res = await service.request(config);
-    successMsg && presentAlert("成功",successMsg);
+    successMsg && isShowSuccessMsg && presentAlert("成功",successMsg);
     //successMsg && $message.success(successMsg);
     //errorMsg && $message.error(errorMsg);
 
     return isGetDataDirectly ? res.data : res;
   } catch (error: any) {
-    const {errorMsg} = options;
-    presentAlert("错误",(errorMsg|| "")+error.message);
+    const {errorMsg,isShowErrorMsg=true} = options;
+    isShowErrorMsg && presentAlert("错误",(errorMsg|| "")+error.message);
     return Promise.reject(error);
   }
 };

h5app/src/views/login.vue

@@ -1,34 +1,31 @@
 <template>
-  <ion-page v-if="isDev">
+  <ion-page>
     <ion-content>
       <div class="login-top"></div>
       <div class="login-content">
-        <div class="login-logo">
-          <img/>
-        </div>
-        <div class="login-system">
-          <img/>
+        <div class="login-item">
+          <ion-item>
+            <!--          <ion-icon :icon="personOutline" mode="md"></ion-icon>-->
+            <ion-input v-model="state.formInline.username" type="text" placeholder="请输入用户名"></ion-input>
+          </ion-item>
         </div>
-        <ion-item :class="['login-item',v$.username.$error?'ion-invalid':'ion-valid']">
-          <ion-icon :icon="personOutline" mode="md"></ion-icon>
-          <ion-input v-model="state.formInline.username" type="text" placeholder="请输入用户名"></ion-input>
-          <ion-note slot="error">用户名不能为空</ion-note>
-        </ion-item>
-        <ion-item :class="['login-item',v$.password.$error?'ion-invalid':'ion-valid']">
-          <ion-icon :icon="lockClosedOutline" mode="md"></ion-icon>
-          <ion-input v-model="state.formInline.password" type="password" placeholder="请输入密码"></ion-input>
-          <ion-note slot="error">密码不能为空</ion-note>
-        </ion-item>
         <div class="login-item">
+          <ion-item>
+            <!--          <ion-icon :icon="lockClosedOutline" mode="md"></ion-icon>-->
+            <ion-input v-model="state.formInline.password" type="password" placeholder="请输入密码"></ion-input>
+          </ion-item>
+        </div>
+        <div class="login-btn">
           <ion-buttons>
             <ion-button @click="handleSubmit()">
               登录
             </ion-button>
           </ion-buttons>
         </div>
-        <ion-label v-if="errorShow">
-          <p>
-            {{ msg }}
+        <ion-label class="error-label" v-show="state.errorShow || v$.username.$error || v$.password.$error">
+          <p v-if="v$.username.$error || v$.password.$error" >用户名或密码不能为空</p>
+          <p v-if="state.errorShow && !(v$.username.$error || v$.password.$error)">
+            {{ state.msg }}
           </p>
         </ion-label>
         <ion-loading
@@ -39,21 +36,16 @@
         </ion-loading>
       </div>
     </ion-content>
-
   </ion-page>
 </template>
 
 <script setup lang="ts">
-import {reactive, ref, toRef, computed, onMounted, getCurrentInstance, onUpdated} from 'vue';
+import {reactive, ref, toRef, computed, onMounted, getCurrentInstance} from 'vue';
 import {alertController} from '@ionic/vue';
 import {useUserStore} from '@/store/modules/user';
 import router from '../router';
-import {personOutline, lockClosedOutline} from 'ionicons/icons';
 import {useVuelidate} from '@vuelidate/core'
 import {required, minLength} from '@vuelidate/validators'
-import {getConfig} from "@/utils/config";
-import {getUrlParams} from "@/utils/urlUtils";
-import {getOAuthUrl} from "@/api/oauth";
 
 const {appContext: {config: {globalProperties}}} = getCurrentInstance();
 
@@ -66,6 +58,8 @@ const state = reactive({
     verifyCode: '',
     captchaId: '',
   },
+  errorShow:false,
+  msg:''
 });
 
 const rules = computed(() => {
@@ -98,7 +92,8 @@ const presentAlert = async (data: any) => {
 }
 
 const handleSubmit = async () => {
-
+  state.errorShow=false;
+  state.msg="";
   globalProperties.$routeActive = true;
 
   const {username, password, verifyCode} = state.formInline;
@@ -108,89 +103,20 @@ const handleSubmit = async () => {
   if (!isFormCorrect) {
     return null;
   }
-  /*
-  if (username.trim() == '' || password.trim() == '') {
-    return null;
-  }*/
-
-  /*if (!verifyCode) {
-    return message.warning('请输入验证码！');
-  }*/
-
   state.loading = true;
 
   const userReq = userStore.login(state.formInline);
   userReq.then((data: any) => {
-    //setTimeout(() => router.replace((route.query.redirect as string) ?? '/'));
     state.loading = false;
     state.formInline.password = '';
-    /*switch (parseInt(data.userInfo.userTypeId)) {
-      case 1:
-        router.push('/tapp/tabMain');
-        break;
-      case 2:
-        router.push('/tabs/tabMain');
-        break;
-      case 3:
-        presentAlert("企业端用户未配置首页！");
-        break;
-    }*/
     router.push('/tabs/tabMain');
-
   }, (err) => {
     state.loading = false;
-    //presentAlert(err);
+    state.errorShow=true;
+    state.msg=err.message;
   });
-
 };
 
-const oauthLogin = function () {
-  getConfig().then((res: any) => {
-    if (!res.isDev) {
-      const ticket = getUrlParams()["ticket"];
-      const tm = getUrlParams()["tm"];
-      if (!ticket) {
-        getOAuthUrl("cas").then(res => {
-          if (res)
-            window.location.href = res;
-          else
-            isDev.value = true;
-        }, () => {
-          isDev.value = true;
-        });
-      } else {
-        userStore.oauthLogin("cas", ticket, tm).then(data => {
-          if (data) {
-            globalProperties.$routeActive = true;
-            switch (parseInt(data.userInfo.userTypeId)) {
-              case 1:
-                router.push('/tapp/tabWork');
-                break;
-              case 2:
-                router.push('/tabs/tabMain');
-                break;
-              case 3:
-                break;
-            }
-          } else {
-            isDev.value = true;
-          }
-        }, () => {
-          isDev.value = true;
-        });
-      }
-    } else {
-      isDev.value = true;
-    }
-  }, () => {
-    isDev.value = true;
-  })
-};
-if (location.href.indexOf("loginType=1")>=0) {
-  isDev.value = true;
-}else {
-  oauthLogin();
-}
 
 onMounted(() => {
   globalProperties.$routeActive = false;
@@ -200,12 +126,12 @@ onMounted(() => {
 
 <style lang="less">
 ion-content {
-  --background: #fafafa !important;
+  --background: #ffffff !important;
   height: 100%;
 }
 
 .login-top {
-  background-image: url("./../assets/icon/login-bg.jpg");
+  background-image: url("./../assets/icon/login-bg.png");
   width: 100%;
   height: 35%;
   background-size: 100% 100%;
@@ -213,13 +139,11 @@ ion-content {
 
 .login-content {
   position: relative;
-  padding: 20px 20px;
-  top: -50px;
-  border-radius: 20px;
+  padding: 40px 40px;
+  top: -35px;
+  border-radius: 30px;
   background: #ffffff;
-  margin: 0 20px;
-  opacity: 0.9;
-  box-shadow: 0 0px 2px rgba(0, 0, 0, .2);
+  /*margin: 0 20px;*/
 
   .login-logo {
     margin-bottom: 15px;
@@ -242,52 +166,51 @@ ion-content {
     }
   }
 
-  .login-item {
+  .login-item{
     margin-bottom: 15px;
-    --border-color: #d0d1d3;
-    /*margin: 15px 0;
-
-    ion-label {
-      color: #C0C7CD;
-      margin: 10px 0;
-      font-size: 16px;
-    }
+    ion-item {
+      --inner-border-width: 0px;
+      --background: #F3F3F3;
+      border-radius: 30px;
 
-    ion-input {
-      background: #F5F5F5;
-      border-radius: 8px;
-      margin-top: 5px;
-    }*/
+      ion-icon {
+        color: #b7b8bb;
+      }
 
-    ion-icon {
-      color: #b7b8bb;
-    }
+      ion-input {
+        color: #7a7b80;
+      }
 
-    ion-input {
-      margin-left: 10px;
-      color: #7a7b80;
     }
+  }
 
+  .login-btn {
+    border: none;
   }
 
   ion-item::part(native) {
     padding: 0 30px 0 30px;
   }
 
-
   ion-buttons {
-    margin: 30px 20px;
+    margin: 30px 0px;
 
     ion-button {
       width: 100%;
+      color: white;
       --background: #39A9FF !important;
       --box-shadow: 0px 1px 5px #39A9FF;
-      color: white;
-      --border-radius: 18px !important;
+      --border-radius: 30px !important;
       height: 40px;
       font-size: 18px;
     }
+  }
 
+  .error-label{
+    text-align: center;
+    p{
+      color: red;
+    }
   }
 }
 </style>