feat(store): 新增用户和企业信息管理功能
- 在 user store 中添加 userInfo 相关状态和操作 - 创建 enterprise store管理企业信息 - 更新相关组件以使用新的 store 方法
This commit is contained in:
39
src/stores/modules/enterprise/index.ts
Normal file
39
src/stores/modules/enterprise/index.ts
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
interface EnterpriseInfo {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
update_name_quota: number;
|
||||||
|
used_update_name_count: number;
|
||||||
|
sub_account_quota: number;
|
||||||
|
used_sub_account_count: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useEnterpriseStore = defineStore('enterprise', {
|
||||||
|
state: () => ({
|
||||||
|
// 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) {
|
||||||
|
this.enterpriseInfo.name = name;
|
||||||
|
},
|
||||||
|
incUsedUpdateNameCount() {
|
||||||
|
this.enterpriseInfo.used_update_name_count++;
|
||||||
|
},
|
||||||
|
incUsedSubAccountCount() {
|
||||||
|
this.enterpriseInfo.used_sub_account_count++;
|
||||||
|
},
|
||||||
|
getEnterpriseInfo(): EnterpriseInfo {
|
||||||
|
return this.enterpriseInfo;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
@ -11,12 +11,27 @@ type Role = 'ENTERPRISE' | 'PERSON';
|
|||||||
interface UserState {
|
interface UserState {
|
||||||
role: Role;
|
role: Role;
|
||||||
isLogin: boolean;
|
isLogin: boolean;
|
||||||
|
userInfo: UserInfo | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UserInfo {
|
||||||
|
id: number;
|
||||||
|
mobile: string;
|
||||||
|
name: string;
|
||||||
|
head_image: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useUserStore = defineStore('user', {
|
export const useUserStore = defineStore('user', {
|
||||||
state: (): UserState => ({
|
state: (): UserState => ({
|
||||||
role: 'PERSON',
|
role: 'PERSON',
|
||||||
isLogin: false,
|
isLogin: false,
|
||||||
|
// todo 暂时写死,登录功能完成后记得重置为null哦
|
||||||
|
userInfo: {
|
||||||
|
id: 1,
|
||||||
|
mobile: '13600000000',
|
||||||
|
name: '灵机用户0001',
|
||||||
|
head_image: '',
|
||||||
|
},
|
||||||
}),
|
}),
|
||||||
|
|
||||||
getters: {
|
getters: {
|
||||||
@ -37,10 +52,27 @@ export const useUserStore = defineStore('user', {
|
|||||||
this.isLogin = isLogin;
|
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;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@ -61,8 +61,10 @@ import { fetchSubAccountPage, removeEnterpriseAccount, getEnterpriseInviteCode }
|
|||||||
import Modal from '@/components/modal.vue';
|
import Modal from '@/components/modal.vue';
|
||||||
import DeleteModal from '@/components/delete-modal.vue';
|
import DeleteModal from '@/components/delete-modal.vue';
|
||||||
import CustomerServiceModal from '@/components/customer-service-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 = [
|
const columns = [
|
||||||
{
|
{
|
||||||
title: '手机号',
|
title: '手机号',
|
||||||
@ -93,11 +95,7 @@ const addAccountVisible = ref(false);
|
|||||||
const deleteVisible = ref(false);
|
const deleteVisible = ref(false);
|
||||||
const deleteTitle = ref('');
|
const deleteTitle = ref('');
|
||||||
|
|
||||||
const enterpriseInfo = reactive({
|
const enterpriseInfo = store.getEnterpriseInfo();
|
||||||
name: '123321',
|
|
||||||
sub_account_quota: 2,
|
|
||||||
used_sub_account_count: 1,
|
|
||||||
});
|
|
||||||
|
|
||||||
const okText = computed(() => {
|
const okText = computed(() => {
|
||||||
if (!canAddAccount.value) {
|
if (!canAddAccount.value) {
|
||||||
|
|||||||
@ -35,16 +35,14 @@ import Modal from '@/components/modal.vue';
|
|||||||
import { ref, reactive, computed } from 'vue';
|
import { ref, reactive, computed } from 'vue';
|
||||||
import CustomerServiceModal from '@/components/customer-service-modal.vue';
|
import CustomerServiceModal from '@/components/customer-service-modal.vue';
|
||||||
import { updateEnterpriseName } from '@/api/all';
|
import { updateEnterpriseName } from '@/api/all';
|
||||||
|
import { useEnterpriseStore } from '@/stores/modules/enterprise';
|
||||||
|
|
||||||
|
const store = useEnterpriseStore();
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
name: '',
|
name: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
const enterpriseInfo = reactive({
|
const enterpriseInfo = store.getEnterpriseInfo();
|
||||||
name: '123321',
|
|
||||||
update_name_quota: 2,
|
|
||||||
used_update_name_count: 1,
|
|
||||||
});
|
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
{
|
||||||
@ -85,6 +83,8 @@ async function handleOk() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
await updateEnterpriseName({ name: form.name });
|
await updateEnterpriseName({ name: form.name });
|
||||||
|
store.setEnterpriseName(form.name);
|
||||||
|
store.incUsedUpdateNameCount();
|
||||||
AMessage.success('修改成功!');
|
AMessage.success('修改成功!');
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -82,13 +82,10 @@ import 'vue-cropper/dist/index.css';
|
|||||||
import { VueCropper } from 'vue-cropper';
|
import { VueCropper } from 'vue-cropper';
|
||||||
import { sendUpdateMobileCaptcha, updateMobile, fetchImageUploadFile, updateMyInfo } from '@/api/all';
|
import { sendUpdateMobileCaptcha, updateMobile, fetchImageUploadFile, updateMyInfo } from '@/api/all';
|
||||||
import axios from 'axios';
|
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 = [
|
const columns = [
|
||||||
{
|
{
|
||||||
@ -172,7 +169,6 @@ async function handleFileChange(event: Event) {
|
|||||||
const target = event.target as HTMLInputElement;
|
const target = event.target as HTMLInputElement;
|
||||||
const file = target.files?.[0];
|
const file = target.files?.[0];
|
||||||
if (file) {
|
if (file) {
|
||||||
console.log('已选择的文件:', file);
|
|
||||||
const fileExtension = getFileExtension(file.name);
|
const fileExtension = getFileExtension(file.name);
|
||||||
const res = await fetchImageUploadFile({
|
const res = await fetchImageUploadFile({
|
||||||
suffix: fileExtension,
|
suffix: fileExtension,
|
||||||
@ -195,6 +191,8 @@ function openEditMobileModal() {
|
|||||||
|
|
||||||
async function handleSubmitUserInfo() {
|
async function handleSubmitUserInfo() {
|
||||||
await updateMyInfo(userInfoForm);
|
await updateMyInfo(userInfoForm);
|
||||||
|
store.setUserName(userInfoForm.name);
|
||||||
|
store.setUserHeadImage(userInfoForm.file_url);
|
||||||
AMessage.success('修改成功!');
|
AMessage.success('修改成功!');
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -237,6 +235,7 @@ async function handleUpdateMobile() {
|
|||||||
const res = await formRef.value.validate();
|
const res = await formRef.value.validate();
|
||||||
if (res === true || res === undefined) {
|
if (res === true || res === undefined) {
|
||||||
await updateMobile(form);
|
await updateMobile(form);
|
||||||
|
store.setUserMobile(form.mobile);
|
||||||
AMessage.success('修改成功!');
|
AMessage.success('修改成功!');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user