Merge branch 'feature/manage' of http://gogs.lvfunai.com:444/ai-team/lingji-work-fe into feature/manage

src/api/all/index.ts

@@ -96,7 +96,7 @@ export const fetchGenderDistributionsList = (params: any) => {
 // 导出一个函数，用于获取产品列表
 export const fetchProductList = () => {
   // 使用Http.get方法，发送GET请求，获取产品列表
-  return Http.get('/v1/products/list', {}, { headers: { 'enterprise-id': 1 } });
+  return Http.get('/v1/products/list');
 };
 
 // 导出一个函数，用于获取成功案例列表
@@ -107,12 +107,12 @@ export const fetchSuccessCaseList = () => {
 
 // 试用产品
 export const trialProduct = (id: number) => {
-  return Http.post(`/v1/products/${id}/try`, {}, { headers: { 'enterprise-id': 1 } });
+  return Http.post(`/v1/products/${id}/try`);
 };
 
 // 修改企业名称
 export const updateEnterpriseName = (data: any) => {
-  return Http.patch(`/v1/enterprises/name`, data, { headers: { 'enterprise-id': 1 } });
+  return Http.patch(`/v1/enterprises/name`, data);
 };
 
 // 发送修改手机号验证码
@@ -132,7 +132,7 @@ export const updateMyInfo = (data: any) => {
 
 // 获取企业账号分页
 export const fetchSubAccountPage = (params: any) => {
-  return Http.get(`/v1/enterprises/users`, params, { headers: { 'enterprise-id': 1 } });
+  return Http.get(`/v1/enterprises/users`, params);
 };
 
 // 获取企业账号分页
@@ -142,10 +142,20 @@ export const fetchImageUploadFile = (params: any) => {
 
 // 移除企业子账号
 export const removeEnterpriseAccount = (userId: number) => {
-  return Http.delete(`/v1/enterprises/users/${userId}`, { headers: { 'enterprise-id': 1 } });
+  return Http.delete(`/v1/enterprises/users/${userId}`);
 };
 
 // 获取企业邀请码
 export const getEnterpriseInviteCode = () => {
-  return Http.get(`/v1/enterprises/invite-code`, {}, { headers: { 'enterprise-id': 1 } });
+  return Http.get(`/v1/enterprises/invite-code`);
+};
+
+// 根据邀请码获取企业信息
+export const getEnterpriseByInviteCode = (inviteCode: string) => {
+  return Http.get(`/v1/enterprises/by-invite-code`, { invite_code: inviteCode });
+};
+
+// 根据邀请码加入企业
+export const joinEnterpriseByInviteCode = (inviteCode: string) => {
+  return Http.post(`/v1/enterprises/join`, { invite_code: inviteCode });
 };

src/api/index.ts

@@ -8,7 +8,10 @@
 
 import axios from 'axios';
 import type { AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios';
-
+import { useEnterpriseStore } from '@/stores/modules/enterprise';
+import pinia from '@/stores';
+const store = useEnterpriseStore(pinia);
+const enterprise = store.getEnterpriseInfo();
 //* 导出Request类，可以用来自定义传递配置来创建实例
 export class Request {
   //* axios 实例
@@ -27,6 +30,10 @@ export class Request {
         } else {
           config.headers!.satoken = '123';
         }
+
+        if (enterprise) {
+          config.headers!['enterprise-id'] = enterprise.id;
+        }
         return config;
       },
       (err: any) => {

src/components/join-modal.vue

@@ -0,0 +1,47 @@
+<template>
+  <Modal title="加入企业" @ok="handleJoin">
+    <div v-if="enterprise" class="join-body flex item-center">
+      <img src="@/assets/warning.svg" alt="" />
+      {{ `确定加入 “${enterprise.name}”吗？` }}
+    </div>
+  </Modal>
+</template>
+<script setup lang="ts">
+import Modal from '@components/modal.vue';
+import { ref, onMounted } from 'vue';
+import { getQueryParam } from '@/utils/helper';
+
+import { getEnterpriseByInviteCode, joinEnterpriseByInviteCode } from '@/api/all';
+const enterprise = ref();
+const inviteCode = ref();
+
+async function getEnterprise() {
+  inviteCode.value = getQueryParam('invite_code');
+  if (inviteCode.value) {
+    enterprise.value = await getEnterpriseByInviteCode(inviteCode.value);
+  }
+}
+
+async function handleJoin() {
+  await joinEnterpriseByInviteCode(inviteCode.value);
+  AMessage.success('加入成功');
+}
+onMounted(() => {
+  getEnterprise();
+});
+</script>
+<style lang="less">
+.join-body {
+  margin: 0;
+  font-family: Alibaba PuHuiTi, serif;
+  font-weight: 400;
+  font-size: 14px;
+  color: var(--Text-1, rgba(33, 31, 36, 1));
+  img {
+    width: 20px;
+    height: 20px;
+    margin-right: 12px;
+    margin-left: 0;
+  }
+}
+</style>

src/layouts/Basic.vue

@@ -1,7 +1,11 @@
 <script setup lang="ts">
 import { useAppStore } from '@/stores';
 import { useResponsive } from '@/hooks';
+import JoinModal from '@/components/join-modal.vue';
+import { getQueryParam } from '@/utils/helper';
+import { ref, onMounted } from 'vue';
 
+const joinEnterpriseVisible = ref(false);
 const appStore = useAppStore();
 const router = useRouter();
 
@@ -27,11 +31,19 @@ const route = useRoute();
 // onMounted(() => {
 //   showSidebar.value = route.meta.requiresSidebar == true;
 // });
-
+onMounted(() => {
+  checkHasInviteCode();
+});
 const setCollapsed = (val: boolean) => {
   appStore.updateSettings({ menuCollapse: val });
 };
 
+const checkHasInviteCode = () => {
+  const inviteCode = getQueryParam('invite_code');
+  if (inviteCode) {
+    joinEnterpriseVisible.value = true;
+  }
+};
 const drawerVisible = ref(false);
 const drawerCancel = () => {
   drawerVisible.value = false;
@@ -43,6 +55,7 @@ provide('toggleDrawerMenu', () => {
 
 <template>
   <a-layout :class="['layout', { mobile: appStore.hideMenu }]">
+    <JoinModal v-model:visible="joinEnterpriseVisible" />
     <div v-if="navbar" class="layout-navbar">
       <base-navbar />
     </div>

src/stores/modules/enterprise/index.ts

@@ -0,0 +1,49 @@
+interface EnterpriseInfo {
+  id: number;
+  name: string;
+  update_name_quota: number;
+  used_update_name_count: number;
+  sub_account_quota: number;
+  used_sub_account_count: number;
+}
+
+interface EnterpriseState {
+  enterpriseInfo: EnterpriseInfo | null;
+}
+
+export const useEnterpriseStore = defineStore('enterprise', {
+  state: (): EnterpriseState => ({
+    // todo 暂时写死，登录功能完成后记得重置为null哦
+    enterpriseInfo: {
+      id: 1,
+      name: '企业1',
+      update_name_quota: 2,
+      used_update_name_count: 1,
+      sub_account_quota: 2,
+      used_sub_account_count: 2,
+    },
+  }),
+  actions: {
+    setEnterpriseInfo(enterpriseInfo: EnterpriseInfo) {
+      this.enterpriseInfo = enterpriseInfo;
+    },
+    setEnterpriseName(name: string) {
+      if (this.enterpriseInfo) {
+        this.enterpriseInfo.name = name;
+      }
+    },
+    incUsedUpdateNameCount() {
+      if (this.enterpriseInfo) {
+        this.enterpriseInfo.used_update_name_count++;
+      }
+    },
+    incUsedSubAccountCount() {
+      if (this.enterpriseInfo) {
+        this.enterpriseInfo.used_sub_account_count++;
+      }
+    },
+    getEnterpriseInfo(): EnterpriseInfo | null {
+      return this.enterpriseInfo;
+    },
+  },
+});

src/stores/modules/user/index.ts

@@ -11,12 +11,27 @@ type Role = 'ENTERPRISE' | 'PERSON';
 interface UserState {
   role: Role;
   isLogin: boolean;
+  userInfo: UserInfo | null;
+}
+
+interface UserInfo {
+  id: number;
+  mobile: string;
+  name: string;
+  head_image: string;
 }
 
 export const useUserStore = defineStore('user', {
   state: (): UserState => ({
     role: 'PERSON',
     isLogin: false,
+    // todo 暂时写死，登录功能完成后记得重置为null哦
+    userInfo: {
+      id: 1,
+      mobile: '13600000000',
+      name: '灵机用户0001',
+      head_image: '',
+    },
   }),
 
   getters: {
@@ -37,10 +52,27 @@ export const useUserStore = defineStore('user', {
       this.isLogin = isLogin;
     },
 
-    async getUserInfo() {
+    setUserInfo(userInfo: UserInfo | null) {
-      // todo 调用获取用户信息接口，当前用mock数据表示
+      this.userInfo = userInfo;
-      AMessage.success(`当前用户角色为：ENTERPRISE`)
+    },
-      this.setUserRole('ENTERPRISE');
+    setUserMobile(mobile: string) {
+      if (this.userInfo) {
+        this.userInfo.mobile = mobile;
+      }
+    },
+    setUserName(name: string) {
+      if (this.userInfo) {
+        this.userInfo.name = name;
+      }
+    },
+    setUserHeadImage(image: string) {
+      if (this.userInfo) {
+        this.userInfo.head_image = image;
+      }
+    },
+
+    getUserInfo() {
+      return this.userInfo;
     },
   },
 });

src/utils/helper.ts

@@ -0,0 +1,5 @@
+export function getQueryParam(param: string): string | null {
+  const search = window.location.search || window.location.hash.split('?')[1] || '';
+  const params = new URLSearchParams(search);
+  return params.get(param);
+}

src/views/components/management/account/index.vue

@@ -61,8 +61,10 @@ import { fetchSubAccountPage, removeEnterpriseAccount, getEnterpriseInviteCode }
 import Modal from '@/components/modal.vue';
 import DeleteModal from '@/components/delete-modal.vue';
 import CustomerServiceModal from '@/components/customer-service-modal.vue';
-import { useClipboard } from '@vueuse/core'
+import { useClipboard } from '@vueuse/core';
+import { useEnterpriseStore } from '@/stores/modules/enterprise';
 
+const store = useEnterpriseStore();
 const columns = [
   {
     title: '手机号',
@@ -93,11 +95,7 @@ const addAccountVisible = ref(false);
 const deleteVisible = ref(false);
 const deleteTitle = ref('');
 
-const enterpriseInfo = reactive({
+const enterpriseInfo = store.getEnterpriseInfo();
-  name: '123321',
-  sub_account_quota: 2,
-  used_sub_account_count: 1,
-});
 
 const okText = computed(() => {
   if (!canAddAccount.value) {

src/views/components/management/enterprise/index.vue

@@ -35,16 +35,14 @@ import Modal from '@/components/modal.vue';
 import { ref, reactive, computed } from 'vue';
 import CustomerServiceModal from '@/components/customer-service-modal.vue';
 import { updateEnterpriseName } from '@/api/all';
+import { useEnterpriseStore } from '@/stores/modules/enterprise';
 
+const store = useEnterpriseStore();
 const form = reactive({
   name: '',
 });
 
-const enterpriseInfo = reactive({
+const enterpriseInfo = store.getEnterpriseInfo();
-  name: '123321',
-  update_name_quota: 2,
-  used_update_name_count: 1,
-});
 
 const columns = [
   {
@@ -85,6 +83,8 @@ async function handleOk() {
     return;
   }
   await updateEnterpriseName({ name: form.name });
+  store.setEnterpriseName(form.name);
+  store.incUsedUpdateNameCount();
   AMessage.success('修改成功！');
 }
 </script>

src/views/components/management/person/index.vue

@@ -2,9 +2,11 @@
   <Container title="个人信息" class="container mt-24px">
     <a-table :columns="columns" :data="data" :pagination="false" class="mt-16px">
       <template #info="{ record }">
-        <a-avatar :image-url="record.head_image" :size="32" />
+        <div class="pt-3px pb-3px">
-        {{ record.name }}
+          <a-avatar :image-url="record.head_image" :size="32" />
-        <icon-edit size="13" class="ml-8px" @click="openEditInfoModal" />
+          {{ record.name }}
+          <icon-edit size="13" class="ml-8px" @click="openEditInfoModal" />
+        </div>
       </template>
       <template #mobile="{ record }">
         {{ record.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2') }}
@@ -12,7 +14,12 @@
       </template>
     </a-table>
     <Modal v-model:visible="infoVisible" title="修改用户信息" @ok="handleSubmitUserInfo">
-      <a-form :model="userInfoForm">
+      <a-form
+        class="form"
+        :model="userInfoForm"
+        :label-col-props="{ span: 3, offset: 0 }"
+        :wrapper-col-props="{ span: 21, offset: 0 }"
+      >
         <a-form-item field="head_image" label="头像">
           <div class="flex item-center">
             <a-avatar :image-url="userInfoForm.file_url" :size="48" />
@@ -42,8 +49,8 @@
         :model="form"
         class="form"
         :rules="formRules"
-        :label-col-props="{ span: 6, offset: 0 }"
+        :label-col-props="{ span: 5, offset: 0 }"
-        :wrapper-col-props="{ span: 18, offset: 0 }"
+        :wrapper-col-props="{ span: 19, offset: 0 }"
         label-align="left"
       >
         <a-form-item required field="mobile" label="新手机号">
@@ -75,13 +82,10 @@ import 'vue-cropper/dist/index.css';
 import { VueCropper } from 'vue-cropper';
 import { sendUpdateMobileCaptcha, updateMobile, fetchImageUploadFile, updateMyInfo } from '@/api/all';
 import axios from 'axios';
+import { useUserStore } from '@/stores';
 
-const userInfo = reactive({
+const store = useUserStore();
-  id: 1,
+const userInfo = store.getUserInfo();
-  name: 'Jane Doe',
-  head_image: '',
-  mobile: '13600000000',
-});
 
 const columns = [
   {
@@ -165,7 +169,6 @@ async function handleFileChange(event: Event) {
   const target = event.target as HTMLInputElement;
   const file = target.files?.[0];
   if (file) {
-    console.log('已选择的文件:', file);
     const fileExtension = getFileExtension(file.name);
     const res = await fetchImageUploadFile({
       suffix: fileExtension,
@@ -188,6 +191,8 @@ function openEditMobileModal() {
 
 async function handleSubmitUserInfo() {
   await updateMyInfo(userInfoForm);
+  store.setUserName(userInfoForm.name);
+  store.setUserHeadImage(userInfoForm.file_url);
   AMessage.success('修改成功！');
 }
 
@@ -230,6 +235,7 @@ async function handleUpdateMobile() {
   const res = await formRef.value.validate();
   if (res === true || res === undefined) {
     await updateMobile(form);
+    store.setUserMobile(form.mobile);
     AMessage.success('修改成功！');
   }
 }
@@ -241,6 +247,10 @@ function getFileExtension(filename: string): string {
 </script>
 <style scoped lang="less">
 .form {
+  margin-top: 13px;
+  :deep(.arco-row) {
+    align-items: center;
+  }
   :deep(.arco-form-item-label) {
     font-family: Alibaba PuHuiTi, serif;
     font-weight: 400;
@@ -253,6 +263,7 @@ function getFileExtension(filename: string): string {
     font-family: Alibaba PuHuiTi, serif;
     font-weight: 400;
     font-size: 14px;
+    padding: 4px 12px;
     input::placeholder {
       font-family: Alibaba PuHuiTi, serif;
       font-weight: 400;