新增用戶個人中心功能

src/App.vue

@@ -87,7 +87,7 @@ export default defineComponent({
 
 body
     font-family: 'microsoft yahei','-apple-system','BlinkMacSystemFont','Segoe UI','Roboto','Helvetica Neue','Arial','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji','MicrosoftJhengHeiBoldFix','Microsoft JhengHei' !important
-    color: var(--q-dark)
+    color: #181c32
 .n-base-selection .n-base-selection-label,
 .n-base-selection .n-base-selection-tags
     background: #f1f1f1 !important
@@ -272,5 +272,33 @@ body
     max-height: unset !important
     width: 100vw !important
     height: 100vh !important
+:root
+  --q-gray-100: #f5f8fa
+  --q-gray-200: #eff2f5
+  --q-gray-300: #E4E6EF
+  --q-gray-400: #B5B5C3
+  --q-gray-500: #A1A5B7
+  --q-gray-600: #7E8299
+  --q-gray-700: #5E6278
+  --q-gray-800: #3F4254
+  --q-gray-900: #181C32
 
+.text-grey-100
+  color: var(--q-gray-100) !important
+.text-grey-200
+  color: var(--q-gray-200) !important
+.text-grey-300
+  color: var(--q-gray-300) !important
+.text-grey-400
+  color: var(--q-gray-400) !important
+.text-grey-500
+  color: var(--q-gray-500) !important
+.text-grey-600
+  color: var(--q-gray-600) !important
+.text-grey-700
+  color: var(--q-gray-700) !important
+.text-grey-800
+  color: var(--q-gray-800) !important
+.text-grey-900
+  color: var(--q-gray-900) !important
 </style>

src/api/user.ts

@@ -184,6 +184,33 @@ class UserService {
 	static resetPassword(certificate:string,password:string):Promise<HttpResponse>{
 		return request("b2b_post_reset_password",{certificate,password});
 	}
+
+  /**
+   * 用戶修改登錄密碼
+   * @param oldPassword 老密碼
+   * @param newPassword 新密碼
+   * @returns
+   */
+  static setNewPassword(oldPassword:string,newPassword:string):Promise<HttpResponse>{
+		return request("b2b_post_ModifyAccountPassowrd",{oldPassword,newPassword});
+	}
+
+  /**
+   * 修改用戶頭像
+   * @param photo 頭像地址
+   * @returns
+   */
+  static setUserPhoto(photo:string):Promise<HttpResponse>{
+		return request("b2b_post_MdifyCustomerAccountPhoto",{photo});
+	}
+
+  /**
+   * 查詢用戶的基本資料
+   * @returns
+   */
+  static getCustomerInfo():Promise<HttpResponse>{
+		return request("b2b_get_GetCustomerManagerInfo",{});
+	}
 }
 
 export default UserService

src/components/global/svg-icon.vue

@@ -88,9 +88,9 @@ svg g [fill]{
   transition: fill 0.3s ease;
   fill: #ccc !important;
 }
-.svg-icon.svg-icon-warning g [fill] {
+.svg-icon-warning g [fill] {
   transition: fill 0.3s ease;
-  fill: var(--q-color-warning) !important;
+  fill: orange !important;
 }
 .svg-icon.svg-icon-negative g [fill] {
   transition: fill 0.3s ease;
@@ -169,7 +169,7 @@ svg g [fill]{
 }
 .hover-g-p.svg-icon g [fill] {
   transition: fill 0.3s ease;
-  fill: #666 !important; 
+  fill: #666 !important;
 }
 .hover-g-p:hover {
   color: var(--q-primary) !important;

src/components/layout/userInfo.vue

@@ -3,13 +3,13 @@
     <div class="q-px-sm">
       <div class="q-pa-sm row">
         <q-avatar size="50px" rounded class="bg-blue-2 cursor-pointer q-mr-md">
-          <img :src="user.photo" v-if="user?.photo" />
+          <q-img :src="user.photo" v-if="user?.photo" mode="cover" />
           <span class="text-primary text-h6" v-else>{{ user?.name.substring(0, 1) }}</span>
         </q-avatar>
         <div class="col column">
           <div class="col row items-center">
             <span class="text-weight-bold text-subtitle1 q-mr-md">{{ user?.name }}</span>
-            <span class="bg-green-11 text-green-14 rounded-borders q-px-sm">已認證</span>
+            <span class="bg-green-11 text-green-14 rounded-borders q-px-sm">{{$t('verified')}}</span>
           </div>
           <div class="f12 text-grey-6 f12">{{ user?.account }}</div>
         </div>
@@ -92,10 +92,10 @@ export default defineComponent({
     if(data.langs && data.langs.length>0){
       data.currentLang = data.langs.find(x=> x.langLocale==locale.value) ?? {};
     }
-    
+
     // 切换语言
     const methods = {
-        goUrl(url){
+        goUrl(url:string){
           $router.push({ path:url})
         },
         getLanguage (val:SitLang) {

src/i18n/zh-TW/index.ts

@@ -13,6 +13,7 @@ export default {
   query: "檢索",
   noneData: "沒有找到相關的數據",
   loading: "正在加載數據",
+  verified: '已認證',
   personal:{
     pageTitle: "個人檔案",
     trading: '累積交易額',
@@ -22,9 +23,23 @@ export default {
     TravelAgency: '旅行社名稱',
     numbering: '統一編號(統編)',
     LINEID: 'LINE ID',
-    Phone: '電話',
+    Phone: '聯絡電話',
+    addreess: '辦公地址',
     Name: '姓名',
-    Email: '電郵'
+    Email: '電郵',
+    post:'負責人',
+    profile: '概述',
+    security: '帳戶安全',
+    accountUpdate:'帳戶信息修改提示',
+    accountUpdateTips:'如果您需要修改以上預留的帳戶資料，請聯繫您與JVS對接業務人員進行修改',
+    resetPw:'修改密碼',
+    cpw:'當前密碼',
+    npw:'新密碼',
+    rpw:'確認新密碼',
+    subBtn:'確認修改',
+    cpwTips:'請輸入當前密碼',
+    updateSuccess:'密碼修改成功，請重新登入',
+    photoSuccess:'頭像設置成功'
   },
   upload:{
     "success":"上傳成功",

src/layouts/MainLayout.vue

@@ -22,7 +22,7 @@
             </q-popup-proxy>
           </div>
           <q-avatar size="40px" rounded class="bg-blue-2 cursor-pointer">
-            <img :src="userInfo.photo" v-if="userInfo.photo" />
+            <q-img :src="userInfo.photo" v-if="userInfo?.photo" mode="cover" />
             <span class="text-primary text-h6" v-else>{{ userInfo.name.substring(0, 1) }}</span>
             <q-popup-proxy :offset="[0,15]" class="no-shadow">
              <user-info :user="userInfo"></user-info>

src/store/modules/user/actions.ts

@@ -41,7 +41,16 @@ const userActions = {
     setStoreState('user', 'token', { })
     //清除菜单权限
     setStoreState('user', 'menuList', [])
-    
+
+  },
+
+  /**
+   * 更新用戶資料
+   * @param param0
+   * @param params
+   */
+  setUserDetail({},params:any){
+    setStoreState('user', 'userDetail', params)
   },
 
   async userLogin({},params: { account: string; password: string, platform:number }):Promise<[boolean, string]> {
@@ -67,7 +76,7 @@ const userActions = {
           const expireTime = 72 * 60 * 60 * 1000 + new Date().getTime()
           setStoreState('user', 'token', { ...token, expireTime })
         flag[0]=true;
-        
+
       }else {
         flag[1]=loginResult.data.message
         flag[0] = false
@@ -76,9 +85,9 @@ const userActions = {
       flag[1]=error as string
       flag[0] = false
     }
-    
+
     return flag;
-    
+
   }
 }