<script lang="ts" setup>
|
import type { UmsMemberProfileApi } from '#/api/ums/member/profile';
|
|
import { computed, onMounted, ref } from 'vue';
|
|
import { Page } from '@vben/common-ui';
|
|
import { Alert, Button, message } from 'ant-design-vue';
|
|
import { useVbenForm } from '#/adapter/form';
|
import {
|
applyProfileChange,
|
getMyLatestChange,
|
getMyProfile,
|
} from '#/api/ums/member/profile';
|
|
import { useProfileSchema } from './data';
|
|
defineOptions({ name: 'UmsMemberProfile' });
|
|
const loading = ref(false);
|
const submitting = ref(false);
|
const latestChange = ref<UmsMemberProfileApi.ChangeRecord>();
|
|
/** 最近一次申请待审核时禁止重复提交 */
|
const pending = computed(() => latestChange.value?.status === 0);
|
|
const [Form, formApi] = useVbenForm({
|
commonConfig: {
|
componentProps: {
|
class: 'w-full',
|
},
|
labelWidth: 130,
|
},
|
wrapperClass: 'grid-cols-2',
|
layout: 'vertical',
|
schema: useProfileSchema(),
|
showDefaultActions: false,
|
});
|
|
/** 只提交允许会员维护的字段 */
|
async function buildSubmitData(): Promise<UmsMemberProfileApi.ApplyReq> {
|
const values = (await formApi.getValues()) as UmsMemberProfileApi.ApplyReq;
|
return {
|
contactUser: values.contactUser,
|
contactPhone: values.contactPhone,
|
contactEmail: values.contactEmail,
|
workUnit: values.workUnit,
|
title: values.title,
|
researchDirection: values.researchDirection,
|
unitIntro: values.unitIntro,
|
legalPerson: values.legalPerson,
|
organizationCode: values.organizationCode,
|
regionCode: values.regionCode,
|
industry: values.industry,
|
};
|
}
|
|
async function loadData() {
|
loading.value = true;
|
try {
|
const [profile, latest] = await Promise.all([
|
getMyProfile(),
|
getMyLatestChange(),
|
]);
|
latestChange.value = latest ?? undefined;
|
await formApi.setValues(
|
{
|
no: profile.no,
|
name: profile.name,
|
memberType: profile.memberType,
|
contactUser: profile.contactUser,
|
contactPhone: profile.contactPhone,
|
contactEmail: profile.contactEmail,
|
workUnit: profile.workUnit,
|
title: profile.title,
|
researchDirection: profile.researchDirection,
|
unitIntro: profile.unitIntro,
|
legalPerson: profile.legalPerson,
|
organizationCode: profile.organizationCode,
|
regionCode: profile.regionCode,
|
industry: profile.industry,
|
},
|
false,
|
);
|
} finally {
|
loading.value = false;
|
}
|
}
|
|
async function handleSubmit() {
|
const { valid } = await formApi.validate();
|
if (!valid) {
|
return;
|
}
|
submitting.value = true;
|
try {
|
await applyProfileChange(await buildSubmitData());
|
message.success('资料变更申请已提交,等待管理员审核');
|
await loadData();
|
} finally {
|
submitting.value = false;
|
}
|
}
|
|
const latestAlert = computed(() => {
|
const latest = latestChange.value;
|
if (!latest) {
|
return null;
|
}
|
if (latest.status === 0) {
|
return {
|
type: 'info' as const,
|
message: '资料变更申请审核中',
|
description: `提交时间:${latest.createTime || '-'},请等待管理员审核。`,
|
};
|
}
|
if (latest.status === 10) {
|
return {
|
type: 'success' as const,
|
message: '最近一次资料变更已通过',
|
description: `审核时间:${latest.auditTime || '-'}`,
|
};
|
}
|
return {
|
type: 'error' as const,
|
message: '最近一次资料变更被驳回',
|
description: `驳回原因:${latest.auditRemark || '-'};审核时间:${latest.auditTime || '-'}`,
|
};
|
});
|
|
onMounted(loadData);
|
</script>
|
|
<template>
|
<Page auto-content-height>
|
<div class="mx-auto max-w-5xl p-4">
|
<div class="mb-4 rounded-lg border border-border bg-background p-4">
|
<div class="mb-1 text-base font-semibold">我的资料</div>
|
<div class="text-sm text-gray-500">
|
修改联系方式等资料后提交,管理员审核通过后生效;审核期间不可重复提交。
|
</div>
|
</div>
|
|
<Alert
|
v-if="latestAlert"
|
class="mb-4"
|
:type="latestAlert.type"
|
show-icon
|
:message="latestAlert.message"
|
:description="latestAlert.description"
|
/>
|
|
<div class="rounded-lg border border-border bg-background p-4">
|
<Form class="mx-3" />
|
<div class="mt-4 flex justify-end">
|
<Button
|
type="primary"
|
:loading="submitting || loading"
|
:disabled="pending"
|
@click="handleSubmit"
|
>
|
{{ pending ? '审核中,暂不可提交' : '提交审核' }}
|
</Button>
|
</div>
|
</div>
|
</div>
|
</Page>
|
</template>
|