Home Explore Help
Register Sign In
semi
/
langchat
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

fix client login page

tycoding 1 year ago
parent
f79643f745
commit
4ea3aa1833
5 changed files with 93 additions and 53 deletions
Split View Show Diff Stats
  1. 15 5
      langchat-auth/src/main/resources/email/template.html
  2. 18 0
      langchat-ui-client/src/utils/is/index.ts
  3. 22 9
      langchat-ui-client/src/utils/request/index.ts
  4. 18 19
      langchat-ui-client/src/views/login/EmailRegister.vue
  5. 20 20
      langchat-ui-client/src/views/login/Forget.vue

+ 15 - 5
langchat-auth/src/main/resources/email/template.html
View File 

@@ -7,7 +7,7 @@
 
 <body>
 
 <div style="width: 100%; height: 100%;display: flex;justify-content: center">
 
   <div
 
-      style="width: calc(100%/3);display: flex;justify-content: center;align-items: center;flex-direction: column;margin-top: 30px">
 
+      style="display: flex;justify-content: center;align-items: center;flex-direction: column;margin-top: 30px">
 
     <div style="color: #333;font-size: 20px;padding: 4px 0;">LangChat</div>
 
     <div style="color: #4d4c4cf0;margin-top: 12px;margin-bottom: 8px;">The verification code for this operation is as follows：</div>
 
     <div
 
@@ -16,13 +16,23 @@
 
     </div>
 
     <div style="font-size: 12px; margin-top: 8px;color: #AAAAAA;">Note: This operation verification code is valid for 10 minutes</div>
 
     <br/>
 
-    <div style="color: #8a8a8a;">
 
-      <a href="https://github.com/tycoding/langchat">LangChat</a>
 
-      帮助企业快速构建私有知识库
 
+    <div style="color: #8a8a8a">
 
+      官网首页：
 
+      <a href="https://github.com/tycoding/langchat" style="color: #35b378;border-bottom: 1px solid #35b378;text-decoration: none;font-weight: bold;">
 
+        https://github.com/tycoding/langchat
 
+      </a>
 
     </div>
 
     <div style="color: #8a8a8a;margin-top: 4px">
 
       Github：
 
-      <a href="https://github.com/tycoding/langchat">https://github.com/tycoding/langchat</a>
 
+      <a href="https://github.com/tycoding/langchat" style="color: #35b378;border-bottom: 1px solid #35b378;text-decoration: none;font-weight: bold;">
 
+        https://github.com/tycoding/langchat
 
+      </a>
 
+    </div>
 
+    <div style="color: #8a8a8a;margin-top: 12px;margin-bottom: 30px;">
 
+      <a href="https://github.com/tycoding/langchat" style="color: #35b378;border-bottom: 1px solid #35b378;text-decoration: none;font-weight: bold;">
 
+        LangChat
 
+      </a>
 
+      Java生态下AI大模型产品解决方案，快速构建企业级AI知识库、AI机器人应用
 
     </div>
 
   </div>
 
 </div>

+ 18 - 0
langchat-ui-client/src/utils/is/index.ts
View File 

@@ -59,3 +59,21 @@ export function isFile<T extends File>(value: T | unknown): value is T {
 
 export function isBlank(val: unknown): val is null {
 
   return val === null || val === undefined || val === '' || String(val).trim() === '';
 
 }
 
+export const isDef = <T = unknown>(val?: T): val is T => {
 
+  return typeof val !== 'undefined';
 
+};
 
+
 
+export const isUnDef = <T = unknown>(val?: T): val is T => {
 
+  return !isDef(val);
 
+};
 
+export function isNullOrUnDef(val: unknown): val is null | undefined {
 
+  return isUnDef(val) || isNull(val);
 
+}
 
+
 
+export function isWhitespace(val: unknown) {
 
+  return val === '';
 
+}
 
+
 
+export function isNullOrWhitespace(val: unknown) {
 
+  return isNullOrUnDef(val) || isWhitespace(val);
 
+}

+ 22 - 9
langchat-ui-client/src/utils/request/index.ts
View File 

@@ -1,6 +1,8 @@
 
 import type { AxiosProgressEvent, AxiosResponse, GenericAbortSignal } from 'axios';
 
 import request from './axios';
 
 import { router } from '@/router';
 
+import { useUserStore } from '@/store';
 
+import { isNullOrWhitespace } from '@/utils/is';
 
 
 export interface HttpOption {
 
   url: string;
 
@@ -69,18 +71,29 @@ function axios<T = any>({
 
     const $message = window['$message'];
 
     const $dialog = window['$dialog'];
 
     const { status } = error.response;
 
+    const userStore = useUserStore();
 
+
 
     if (status === 401) {
 
       // $message!.error('Login failed, please login again');
 
       // await router.push({ name: 'Login' });
 
-      $dialog!.warning({
 
-        title: 'Tips',
 
-        content: 'You have not logged in or the login is invalid',
 
-        positiveText: 'Login',
 
-        negativeText: 'Cancel',
 
-        onPositiveClick: async () => {
 
-          await router.push({ name: 'Login' });
 
-        },
 
-      });
 
+
 
+      if (isNullOrWhitespace(userStore.token)) {
 
+        $dialog!.warning({
 
+          title: 'Tips',
 
+          content: 'You have not logged in or the login is invalid',
 
+          positiveText: 'Login',
 
+          negativeText: 'Cancel',
 
+          onPositiveClick: async () => {
 
+            await router.push({ name: 'Login' });
 
+          },
 
+        });
 
+      } else {
 
+        $dialog!.warning({
 
+          title: 'Tips',
 
+          content: 'You do not have operation permission, please contact the administrator',
 
+        });
 
+      }
 
+
 
       return;
 
     }

+ 18 - 19
langchat-ui-client/src/views/login/EmailRegister.vue
View File 

@@ -1,11 +1,10 @@
 
-<script setup lang="ts">
 
+<script lang="ts" setup>
 
   import { SvgIcon } from '@/components/common';
 
   import { reactive, ref, toRaw } from 'vue';
 
-  import { useMessage, CountdownInst } from 'naive-ui';
 
+  import { CountdownInst, useMessage } from 'naive-ui';
 
   import { useUserStore } from '@/store/modules/user';
 
   import { useRouter } from 'vue-router';
 
-  import { getEmailCode, emailRegister } from '@/api/auth';
 
-  import { isBlank } from '@/utils/is';
 
+  import { emailRegister, getEmailCode } from '@/api/auth';
 
   import { t } from '@/locales';
 
   import { rules } from '@/views/login/data';
 
 
@@ -73,58 +72,58 @@
 
 
 <template>
 
   <div class="mt-4 login-content-form">
 
-    <n-form ref="formRef" label-placement="left" size="large" :model="form" :rules="rules">
 
-      <n-form-item path="email" class="login-animation1">
 
+    <n-form ref="formRef" :model="form" :rules="rules" label-placement="left" size="large">
 
+      <n-form-item class="login-animation1" path="email">
 
         <n-input
 
           v-model:value="form.email"
 
-          :placeholder="t('login.namePlaceholder')"
 
           :input-props="{ type: 'email' }"
 
+          :placeholder="t('login.namePlaceholder')"
 
         >
 
           <template #prefix>
 
-            <n-icon size="18" color="#808695">
 
+            <n-icon color="#808695" size="18">
 
               <SvgIcon icon="material-symbols:person-outline" />
 
             </n-icon>
 
           </template>
 
         </n-input>
 
       </n-form-item>
 
-      <n-form-item path="code" class="login-animation2">
 
+      <n-form-item class="login-animation2" path="code">
 
         <n-input v-model:value="form.code" :placeholder="t('login.codePlaceholder')">
 
           <template #prefix>
 
-            <n-icon size="18" color="#808695">
 
+            <n-icon color="#808695" size="18">
 
               <SvgIcon icon="ph:key" />
 
             </n-icon>
 
           </template>
 
           <template #suffix>
 
-            <n-button @click="onGetCode()" :disabled="codeLoading" text type="success">
 
+            <n-button :disabled="codeLoading" text type="success" @click="onGetCode()">
 
               <n-countdown
 
                 v-if="codeLoading"
 
                 :active="codeLoading"
 
-                @finish="codeLoading = false"
 
                 :duration="59000"
 
                 :render="({ seconds }) => `${String(seconds) + t('login.codeExp')}`"
 
+                @finish="codeLoading = false"
 
               />
 
               <template v-else>{{ t('login.getCode') }}</template>
 
             </n-button>
 
           </template>
 
         </n-input>
 
       </n-form-item>
 
-      <n-form-item path="password" class="login-animation2">
 
+      <n-form-item class="login-animation2" path="password">
 
         <n-input
 
           v-model:value="form.password"
 
-          type="password"
 
-          showPasswordOn="click"
 
           :placeholder="t('login.passPlaceholder')"
 
+          showPasswordOn="click"
 
+          type="password"
 
         >
 
           <template #prefix>
 
-            <n-icon size="18" color="#808695">
 
+            <n-icon color="#808695" size="18">
 
               <SvgIcon icon="mdi:lock-outline" />
 
             </n-icon>
 
           </template>
 
         </n-input>
 
       </n-form-item>
 
       <n-form-item class="login-animation3">
 
-        <n-space vertical class="w-full">
 
-          <n-button type="primary" @click="onSubmit" :loading="loading" block secondary>
 
+        <n-space class="w-full" vertical>
 
+          <n-button :loading="loading" block secondary type="primary" @click="onSubmit">
 
             {{ t('login.register') }}
 
           </n-button>
 
         </n-space>
 
@@ -133,4 +132,4 @@
 
   </div>
 
 </template>
 
 
-<style scoped lang="less"></style>
 
+<style lang="less" scoped></style>

+ 20 - 20
langchat-ui-client/src/views/login/Forget.vue
View File 

@@ -63,13 +63,13 @@
 
   <div class="account-root">
 
     <div class="account-root-item root-left-item">
 
       <div class="root-left-logo">
 
-        <img src="@/assets/login/logo.png" alt="" />
 
+        <img alt="" src="@/assets/login/logo.png" />
 
         <div class="stand-title ml-1">{{ t('app') }}</div>
 
       </div>
 
       <div class="root-left-title">{{ t('login.slogan') }}</div>
 
       <div class="root-left-desc" v-html="t('login.des')"> </div>
 
       <div class="coding-img">
 
-        <img src="@/assets/login/login_bg.svg" alt="" />
 
+        <img alt="" src="@/assets/login/login_bg.svg" />
 
       </div>
 
     </div>
 
     <div class="account-root-item root-right-item">
 
@@ -78,61 +78,61 @@
 
           <div class="user-account">{{ t('login.forgetTitle') }}</div>
 
           <div class="user-register">
 
             <span>{{ t('login.noAccount') }}</span>
 
-            <n-button @click="router.push('/register')" type="success" text>
 
-              {{ t('login.toRegister') }}
 
+            <n-button text type="success" @click="router.push('/login')">
 
+              {{ t('login.toLogin') }}
 
             </n-button>
 
           </div>
 
         </div>
 
 
         <div class="mt-4 login-content-form">
 
-          <n-form ref="formRef" label-placement="left" size="large" :model="form" :rules="rules">
 
-            <n-form-item path="username" class="login-animation1">
 
+          <n-form ref="formRef" :model="form" :rules="rules" label-placement="left" size="large">
 
+            <n-form-item class="login-animation1" path="username">
 
               <n-input v-model:value="form.email" :placeholder="t('login.emailPlaceholder')">
 
                 <template #prefix>
 
-                  <n-icon size="18" color="#808695">
 
+                  <n-icon color="#808695" size="18">
 
                     <SvgIcon icon="material-symbols:person-outline" />
 
                   </n-icon>
 
                 </template>
 
               </n-input>
 
             </n-form-item>
 
-            <n-form-item path="code" class="login-animation2">
 
+            <n-form-item class="login-animation2" path="code">
 
               <n-input v-model:value="form.code" :placeholder="t('login.codePlaceholder')">
 
                 <template #prefix>
 
-                  <n-icon size="18" color="#808695">
 
+                  <n-icon color="#808695" size="18">
 
                     <SvgIcon icon="ph:key" />
 
                   </n-icon>
 
                 </template>
 
                 <template #suffix>
 
-                  <n-button @click="onGetCode()" :disabled="codeLoading" text type="success">
 
+                  <n-button :disabled="codeLoading" text type="success" @click="onGetCode()">
 
                     <n-countdown
 
                       v-if="codeLoading"
 
                       :active="codeLoading"
 
-                      @finish="codeLoading = false"
 
                       :duration="59000"
 
                       :render="({ seconds }) => `${String(seconds) + t('login.codeExp')}`"
 
+                      @finish="codeLoading = false"
 
                     />
 
                     <template v-else>{{ t('login.getCode') }}</template>
 
                   </n-button>
 
                 </template>
 
               </n-input>
 
             </n-form-item>
 
-            <n-form-item path="password" class="login-animation2">
 
+            <n-form-item class="login-animation2" path="password">
 
               <n-input
 
                 v-model:value="form.password"
 
-                type="password"
 
-                showPasswordOn="click"
 
                 :placeholder="t('login.forgetPassPlaceholder')"
 
+                showPasswordOn="click"
 
+                type="password"
 
               >
 
                 <template #prefix>
 
-                  <n-icon size="18" color="#808695">
 
+                  <n-icon color="#808695" size="18">
 
                     <SvgIcon icon="mdi:lock-outline" />
 
                   </n-icon>
 
                 </template>
 
               </n-input>
 
             </n-form-item>
 
             <n-form-item class="login-animation3">
 
-              <n-space vertical class="w-full">
 
-                <n-button type="primary" @click="handleSubmit" :loading="loading" block secondary>
 
+              <n-space class="w-full" vertical>
 
+                <n-button :loading="loading" block secondary type="primary" @click="handleSubmit">
 
                   {{ t('login.forgetSubmit') }}
 
                 </n-button>
 
               </n-space>
 
@@ -147,19 +147,19 @@
 
         </n-divider>
 
         <div class="pb-8">
 
           <n-space vertical>
 
-            <n-button dashed block round>
 
+            <n-button block dashed round>
 
               <template #icon>
 
                 <SvgIcon icon="uiw:weixin" />
 
               </template>
 
               {{ t('login.wxType') }}
 
             </n-button>
 
-            <n-button block round dashed>
 
+            <n-button block dashed round>
 
               <template #icon>
 
                 <SvgIcon icon="ri:google-fill" />
 
               </template>
 
               {{ t('login.googleType') }}
 
             </n-button>
 
-            <n-button block round dashed>
 
+            <n-button block dashed round>
 
               <template #icon>
 
                 <SvgIcon icon="ri:github-fill" />
 
               </template>