perf: 优化页面

src/api/list.ts

@@ -1,56 +0,0 @@
-import axios from 'axios';
-import qs from 'query-string';
-import type { DescData } from '@arco-design/web-vue/es/descriptions/interface';
-
-export interface PolicyRecord {
-  id: string;
-  number: number;
-  name: string;
-  contentType: 'img' | 'horizontalVideo' | 'verticalVideo';
-  filterType: 'artificial' | 'rules';
-  count: number;
-  status: 'online' | 'offline';
-  createdTime: string;
-}
-
-export interface PolicyParams extends Partial<PolicyRecord> {
-  current: number;
-  pageSize: number;
-}
-
-export interface PolicyListRes {
-  list: PolicyRecord[];
-  total: number;
-}
-
-export function queryPolicyList(params: PolicyParams) {
-  return axios.get<PolicyListRes>('/api/list/policy', {
-    params,
-    paramsSerializer: (obj) => {
-      return qs.stringify(obj);
-    },
-  });
-}
-
-export interface ServiceRecord {
-  id: number;
-  title: string;
-  description: string;
-  name?: string;
-  actionType?: string;
-  icon?: string;
-  data?: DescData[];
-  enable?: boolean;
-  expires?: boolean;
-}
-export function queryInspectionList() {
-  return axios.get('/api/list/quality-inspection');
-}
-
-export function queryTheServiceList() {
-  return axios.get('/api/list/the-service');
-}
-
-export function queryRulesPresetList() {
-  return axios.get('/api/list/rules-preset');
-}

src/api/user-center.ts

@@ -1,88 +0,0 @@
-import axios from 'axios';
-
-export interface MyProjectRecord {
-  id: number;
-  name: string;
-  description: string;
-  peopleNumber: number;
-  contributors: {
-    name: string;
-    email: string;
-    avatar: string;
-  }[];
-}
-export function queryMyProjectList() {
-  return axios.post('/api/user/my-project/list');
-}
-
-export interface MyTeamRecord {
-  id: number;
-  avatar: string;
-  name: string;
-  peopleNumber: number;
-}
-export function queryMyTeamList() {
-  return axios.post('/api/user/my-team/list');
-}
-
-export interface LatestActivity {
-  id: number;
-  title: string;
-  description: string;
-  avatar: string;
-}
-export function queryLatestActivity() {
-  return axios.post<LatestActivity[]>('/api/user/latest-activity');
-}
-
-export function saveUserInfo() {
-  return axios.post('/api/user/save-info');
-}
-
-export interface BasicInfoModel {
-  email: string;
-  nickname: string;
-  countryRegion: string;
-  area: string;
-  address: string;
-  profile: string;
-}
-
-export interface EnterpriseCertificationModel {
-  accountType: number;
-  status: number;
-  time: string;
-  legalPerson: string;
-  certificateType: string;
-  authenticationNumber: string;
-  enterpriseName: string;
-  enterpriseCertificateType: string;
-  organizationCode: string;
-}
-
-export type CertificationRecord = Array<{
-  certificationType: number;
-  certificationContent: string;
-  status: number;
-  time: string;
-}>;
-
-export interface UnitCertification {
-  enterpriseInfo: EnterpriseCertificationModel;
-  record: CertificationRecord;
-}
-
-export function queryCertification() {
-  return axios.post<UnitCertification>('/api/user/certification');
-}
-
-export function userUploadApi(
-  data: FormData,
-  config: {
-    controller: AbortController;
-    onUploadProgress?: (progressEvent: any) => void;
-  }
-) {
-  // const controller = new AbortController();
-  return axios.post('/api/user/upload', data, config);
-}

src/mock/user.ts

@@ -8,7 +8,7 @@ import { MockParams } from '@/types/mock';
 import { isLogin } from '@/utils/auth';
 
 setupMock({
-  // mock: false,
+  mock: false,
 
   setup() {
     // Mock.XHR.prototype.withCredentials = true;

src/router/guard/userLoginInfo.ts

@@ -13,7 +13,7 @@ export default function setupUserLoginInfoGuard(router: Router) {
         next();
       } else {
         try {
-          await userStore.info();
+          // await userStore.info();
           next();
         } catch (error) {
           await userStore.logout();

src/store/modules/user/index.ts

@@ -4,25 +4,21 @@ import {
   logout as userLogout,
   getUserInfo,
   LoginData,
+  Data,
 } from '@/api/user';
 import { setToken, clearToken } from '@/utils/auth';
 import { removeRouteListener } from '@/utils/route-listener';
 import { UserState } from './types';
 import useAppStore from '../app';
-
 const useUserStore = defineStore('user', {
   state: (): UserState => ({
     name: undefined,
     avatar: undefined,
-    job: undefined,
     organization: undefined,
-    location: undefined,
     email: undefined,
-    introduction: undefined,
     personalWebsite: undefined,
     jobName: undefined,
     organizationName: undefined,
-    locationName: undefined,
     phone: undefined,
     registrationDate: undefined,
     accountId: undefined,
@@ -54,10 +50,10 @@ const useUserStore = defineStore('user', {
     },
 
     // Get user's information
-    async info() {
-      const res = await getUserInfo();
-
-      this.setInfo(res.data);
+    async info(data: Data) {
+      // const res = await getUserInfo();
+      const { name } = data;
+      this.setInfo({ name: name, role: 'admin' });
     },
 
     // Login
@@ -69,6 +65,9 @@ const useUserStore = defineStore('user', {
         };
         const res = await userLogin(params);
         setToken('test-token');
+        console.log('dddd', res.data);
+        this.info(res.data);
+
         return res;
       } catch (err) {
         clearToken();
@@ -85,7 +84,7 @@ const useUserStore = defineStore('user', {
     // Logout
     async logout() {
       try {
-        await userLogout();
+        // await userLogout();
       } finally {
         this.logoutCallBack();
       }

src/store/modules/user/types.ts

@@ -2,15 +2,11 @@ export type RoleType = '' | '*' | 'admin' | 'user';
 export interface UserState {
   name?: string;
   avatar?: string;
-  job?: string;
   organization?: string;
-  location?: string;
   email?: string;
-  introduction?: string;
   personalWebsite?: string;
   jobName?: string;
   organizationName?: string;
-  locationName?: string;
   phone?: string;
   registrationDate?: string;
   accountId?: string;

src/views/user/setting/components/user-panel.vue

@@ -51,107 +51,99 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref } from 'vue';
-  import type {
-    FileItem,
-    RequestOption,
-  } from '@arco-design/web-vue/es/upload/interfaces';
-  import { useUserStore } from '@/store';
-  import { userUploadApi } from '@/api/user-center';
-  import type { DescData } from '@arco-design/web-vue/es/descriptions/interface';
+import { ref } from 'vue';
+import type {
+  FileItem,
+  RequestOption,
+} from '@arco-design/web-vue/es/upload/interfaces';
+import { useUserStore } from '@/store';
+import type { DescData } from '@arco-design/web-vue/es/descriptions/interface';
 
-  const userStore = useUserStore();
-  const file = {
-    uid: '-2',
-    name: 'avatar.png',
-    url: userStore.avatar,
-  };
-  const renderData = [
-    {
-      label: 'userSetting.label.name',
-      value: userStore.name,
-    },
-    {
-      label: 'userSetting.label.certification',
-      value: userStore.certification,
-    },
-    {
-      label: 'userSetting.label.accountId',
-      value: userStore.accountId,
-    },
-    {
-      label: 'userSetting.label.phone',
-      value: userStore.phone,
-    },
-    {
-      label: 'userSetting.label.registrationDate',
-      value: userStore.registrationDate,
-    },
-  ] as DescData[];
-  const fileList = ref<FileItem[]>([file]);
-  const uploadChange = (fileItemList: FileItem[], fileItem: FileItem) => {
-    fileList.value = [fileItem];
-  };
-  const customRequest = (options: RequestOption) => {
-    // docs: https://axios-http.com/docs/cancellation
-    const controller = new AbortController();
+const userStore = useUserStore();
+const file = {
+  uid: '-2',
+  name: 'avatar.png',
+  url: userStore.avatar,
+};
+const renderData = [
+  {
+    label: 'userSetting.label.name',
+    value: userStore.name,
+  },
+  {
+    label: 'userSetting.label.certification',
+    value: userStore.certification,
+  },
+  {
+    label: 'userSetting.label.accountId',
+    value: userStore.accountId,
+  },
+  {
+    label: 'userSetting.label.phone',
+    value: userStore.phone,
+  },
+  {
+    label: 'userSetting.label.registrationDate',
+    value: userStore.registrationDate,
+  },
+] as DescData[];
+const fileList = ref<FileItem[]>([file]);
+const uploadChange = (fileItemList: FileItem[], fileItem: FileItem) => {
+  fileList.value = [fileItem];
+};
+const customRequest = (options: RequestOption) => {
+  // docs: https://axios-http.com/docs/cancellation
+  const controller = new AbortController();
 
-    (async function requestWrap() {
-      const {
-        onProgress,
-        onError,
-        onSuccess,
-        fileItem,
-        name = 'file',
-      } = options;
-      onProgress(20);
-      const formData = new FormData();
-      formData.append(name as string, fileItem.file as Blob);
-      const onUploadProgress = (event: ProgressEvent) => {
-        let percent;
-        if (event.total > 0) {
-          percent = (event.loaded / event.total) * 100;
-        }
-        onProgress(parseInt(String(percent), 10), event);
-      };
-
-      try {
-        // https://github.com/axios/axios/issues/1630
-        // https://github.com/nuysoft/Mock/issues/127
-
-        const res = await userUploadApi(formData, {
-          controller,
-          onUploadProgress,
-        });
-        onSuccess(res);
-      } catch (error) {
-        onError(error);
+  (async function requestWrap() {
+    const { onProgress, onError, onSuccess, fileItem, name = 'file' } = options;
+    onProgress(20);
+    const formData = new FormData();
+    formData.append(name as string, fileItem.file as Blob);
+    const onUploadProgress = (event: ProgressEvent) => {
+      let percent;
+      if (event.total > 0) {
+        percent = (event.loaded / event.total) * 100;
       }
-    })();
-    return {
-      abort() {
-        controller.abort();
-      },
+      onProgress(parseInt(String(percent), 10), event);
     };
+
+    try {
+      // https://github.com/axios/axios/issues/1630
+      // https://github.com/nuysoft/Mock/issues/127
+      // const res = await userUploadApi(formData, {
+      //   controller,
+      //   onUploadProgress,
+      // });
+      // onSuccess(res);
+    } catch (error) {
+      onError(error);
+    }
+  })();
+  return {
+    abort() {
+      controller.abort();
+    },
   };
+};
 </script>
 
 <style scoped lang="less">
-  .arco-card {
-    padding: 14px 0 4px 4px;
-    border-radius: 4px;
-  }
+.arco-card {
+  padding: 14px 0 4px 4px;
+  border-radius: 4px;
+}
 
-  :deep(.arco-avatar-trigger-icon-button) {
-    width: 32px;
-    height: 32px;
-    line-height: 32px;
-    background-color: #e8f3ff;
+:deep(.arco-avatar-trigger-icon-button) {
+  width: 32px;
+  height: 32px;
+  line-height: 32px;
+  background-color: #e8f3ff;
 
-    .arco-icon-camera {
-      margin-top: 8px;
-      color: rgb(var(--arcoblue-6));
-      font-size: 14px;
-    }
+  .arco-icon-camera {
+    margin-top: 8px;
+    color: rgb(var(--arcoblue-6));
+    font-size: 14px;
   }
+}
 </style>

src/views/user/setting/locale/en-US.ts

@@ -11,9 +11,6 @@ export default {
   'userSetting.title.socialInfo': 'Social Information',
   'userSetting.label.avatar': 'Avatar',
   'userSetting.label.name': 'User Name',
-  'userSetting.label.location': 'Office Location',
-  'userSetting.label.introduction': 'Introduction',
-  'userSetting.label.personalWebsite': 'Website',
   'userSetting.save': 'Save',
   'userSetting.cancel': 'Cancel',
   'userSetting.reset': 'Reset',

src/views/user/setting/locale/zh-CN.ts

@@ -10,9 +10,6 @@ export default {
   'userSetting.title.socialInfo': '社交信息',
   'userSetting.label.avatar': '头像',
   'userSetting.label.name': '用户名',
-  'userSetting.label.location': '办公地点',
-  'userSetting.label.introduction': '个人简介',
-  'userSetting.label.personalWebsite': '个人网站',
   'userSetting.save': '保存',
   'userSetting.cancel': '取消',
   'userSetting.reset': '重置',