fix: 修复商户中心仅展示基础信息
This commit is contained in:
@@ -1,13 +1,29 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import type {
|
||||
CurrentMerchantCenterDto,
|
||||
MerchantAuditLogDto,
|
||||
MerchantChangeLogDto,
|
||||
MerchantContractDto,
|
||||
MerchantDocumentDto,
|
||||
MerchantStaffDto,
|
||||
MerchantStoreDto,
|
||||
} from '#/api/merchant';
|
||||
|
||||
import { computed, onMounted, ref } from 'vue';
|
||||
|
||||
import { Profile } from '@vben/common-ui';
|
||||
import { useUserStore } from '@vben/stores';
|
||||
|
||||
import { Alert, Empty, List, message, Spin, Tag } from 'ant-design-vue';
|
||||
|
||||
import { getMerchantInfoApi } from '#/api/merchant';
|
||||
|
||||
import MerchantSetting from './merchant-setting.vue';
|
||||
|
||||
const userStore = useUserStore();
|
||||
const tabsValue = ref('basic');
|
||||
const loading = ref(false);
|
||||
const merchantCenter = ref<CurrentMerchantCenterDto | null>(null);
|
||||
|
||||
const tabs = [
|
||||
{ label: '基本信息', value: 'basic' },
|
||||
@@ -16,6 +32,146 @@ const tabs = [
|
||||
{ label: '员工信息', value: 'staffs' },
|
||||
{ label: '日志记录', value: 'logs' },
|
||||
];
|
||||
|
||||
const merchantStores = computed<MerchantStoreDto[]>(() => {
|
||||
return merchantCenter.value?.merchant.stores ?? [];
|
||||
});
|
||||
|
||||
const merchantDocuments = computed<MerchantDocumentDto[]>(() => {
|
||||
return merchantCenter.value?.documents ?? [];
|
||||
});
|
||||
|
||||
const merchantContracts = computed<MerchantContractDto[]>(() => {
|
||||
return merchantCenter.value?.contracts ?? [];
|
||||
});
|
||||
|
||||
const merchantStaffs = computed<MerchantStaffDto[]>(() => {
|
||||
return merchantCenter.value?.staffs ?? [];
|
||||
});
|
||||
|
||||
const merchantAuditLogs = computed<MerchantAuditLogDto[]>(() => {
|
||||
return merchantCenter.value?.auditLogs ?? [];
|
||||
});
|
||||
|
||||
const merchantChangeLogs = computed<MerchantChangeLogDto[]>(() => {
|
||||
return merchantCenter.value?.changeLogs ?? [];
|
||||
});
|
||||
|
||||
function formatDateTime(value?: null | string) {
|
||||
if (!value) {
|
||||
return '--';
|
||||
}
|
||||
|
||||
return new Date(value).toLocaleString('zh-CN', { hour12: false });
|
||||
}
|
||||
|
||||
function resolveStoreStatus(status: number) {
|
||||
if (status === 1) {
|
||||
return '营业中';
|
||||
}
|
||||
|
||||
if (status === 2) {
|
||||
return '停业中';
|
||||
}
|
||||
|
||||
return `状态${status}`;
|
||||
}
|
||||
|
||||
function resolveContractStatus(status: number) {
|
||||
if (status === 1) {
|
||||
return '生效中';
|
||||
}
|
||||
|
||||
if (status === 2) {
|
||||
return '已终止';
|
||||
}
|
||||
|
||||
if (status === 3) {
|
||||
return '已过期';
|
||||
}
|
||||
|
||||
return `状态${status}`;
|
||||
}
|
||||
|
||||
function resolveDocumentType(documentType: number) {
|
||||
if (documentType === 1) {
|
||||
return '营业执照';
|
||||
}
|
||||
|
||||
if (documentType === 2) {
|
||||
return '食品经营许可证';
|
||||
}
|
||||
|
||||
if (documentType === 3) {
|
||||
return '法人身份证';
|
||||
}
|
||||
|
||||
if (documentType === 4) {
|
||||
return '门头照';
|
||||
}
|
||||
|
||||
return `类型${documentType}`;
|
||||
}
|
||||
|
||||
function resolveDocumentStatus(status: number) {
|
||||
if (status === 1) {
|
||||
return '待审核';
|
||||
}
|
||||
|
||||
if (status === 2) {
|
||||
return '已通过';
|
||||
}
|
||||
|
||||
if (status === 3) {
|
||||
return '已驳回';
|
||||
}
|
||||
|
||||
return `状态${status}`;
|
||||
}
|
||||
|
||||
function resolveStaffRole(roleType: number) {
|
||||
if (roleType === 1) {
|
||||
return '店长';
|
||||
}
|
||||
|
||||
if (roleType === 2) {
|
||||
return '店员';
|
||||
}
|
||||
|
||||
if (roleType === 3) {
|
||||
return '财务';
|
||||
}
|
||||
|
||||
return `角色${roleType}`;
|
||||
}
|
||||
|
||||
function resolveStaffStatus(status: number) {
|
||||
if (status === 1) {
|
||||
return '在职';
|
||||
}
|
||||
|
||||
if (status === 2) {
|
||||
return '离职';
|
||||
}
|
||||
|
||||
return `状态${status}`;
|
||||
}
|
||||
|
||||
async function loadMerchantCenter() {
|
||||
loading.value = true;
|
||||
|
||||
try {
|
||||
merchantCenter.value = await getMerchantInfoApi();
|
||||
} catch {
|
||||
message.error('商户中心信息加载失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadMerchantCenter();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -31,12 +187,210 @@ const tabs = [
|
||||
:tabs="tabs"
|
||||
>
|
||||
<template #content>
|
||||
<div class="rounded-lg bg-card">
|
||||
<!-- 基本信息：使用表单形式，支持展示和修改 -->
|
||||
<MerchantSetting v-if="tabsValue === 'basic'" />
|
||||
<div class="rounded-lg bg-card p-4">
|
||||
<Spin :spinning="loading">
|
||||
<MerchantSetting v-if="tabsValue === 'basic'" />
|
||||
|
||||
<!-- 其他 Tab 暂时保留或后续根据需要优化 -->
|
||||
<div v-else class="p-6 text-center text-gray-400">正在开发中...</div>
|
||||
<template v-else-if="tabsValue === 'qualification'">
|
||||
<div class="mb-3 text-base font-medium">资质证照</div>
|
||||
<Empty
|
||||
v-if="merchantDocuments.length === 0"
|
||||
description="暂无资质证照"
|
||||
/>
|
||||
<List
|
||||
v-else
|
||||
:data-source="merchantDocuments"
|
||||
item-layout="vertical"
|
||||
>
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex flex-wrap items-center gap-2">
|
||||
<Tag color="blue">
|
||||
{{ resolveDocumentType(item.documentType) }}
|
||||
</Tag>
|
||||
<Tag>{{ resolveDocumentStatus(item.status) }}</Tag>
|
||||
<span class="text-gray-500">
|
||||
编号：{{ item.documentNumber || '--' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
签发时间：{{ formatDateTime(item.issuedAt) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
到期时间：{{ formatDateTime(item.expiresAt) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
文件地址：
|
||||
<a
|
||||
:href="item.fileUrl"
|
||||
class="text-blue-500"
|
||||
target="_blank"
|
||||
>
|
||||
{{ item.fileUrl }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
备注：{{ item.remarks || '--' }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
|
||||
<div class="mb-3 mt-6 text-base font-medium">合同信息</div>
|
||||
<Empty
|
||||
v-if="merchantContracts.length === 0"
|
||||
description="暂无合同"
|
||||
/>
|
||||
<List
|
||||
v-else
|
||||
:data-source="merchantContracts"
|
||||
item-layout="vertical"
|
||||
>
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex flex-wrap items-center gap-2">
|
||||
<Tag color="purple">
|
||||
合同号：{{ item.contractNumber }}
|
||||
</Tag>
|
||||
<Tag>{{ resolveContractStatus(item.status) }}</Tag>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
生效日期：{{ formatDateTime(item.startDate) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
截止日期：{{ formatDateTime(item.endDate) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
签署时间：{{ formatDateTime(item.signedAt) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
终止时间：{{ formatDateTime(item.terminatedAt) }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
终止原因：{{ item.terminationReason || '--' }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tabsValue === 'stores'">
|
||||
<Empty
|
||||
v-if="merchantStores.length === 0"
|
||||
description="暂无门店信息"
|
||||
/>
|
||||
<List v-else :data-source="merchantStores" item-layout="vertical">
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex items-center gap-2">
|
||||
<Tag color="green">{{ item.name }}</Tag>
|
||||
<Tag>{{ resolveStoreStatus(item.status) }}</Tag>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
门店地址：{{ item.address }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
联系电话：{{ item.contactPhone || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
营业执照号：{{ item.licenseNumber || '--' }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tabsValue === 'staffs'">
|
||||
<Empty
|
||||
v-if="merchantStaffs.length === 0"
|
||||
description="暂无员工信息"
|
||||
/>
|
||||
<List v-else :data-source="merchantStaffs" item-layout="vertical">
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex items-center gap-2">
|
||||
<Tag color="cyan">{{ item.name }}</Tag>
|
||||
<Tag>{{ resolveStaffRole(item.roleType) }}</Tag>
|
||||
<Tag>{{ resolveStaffStatus(item.status) }}</Tag>
|
||||
</div>
|
||||
<div class="text-gray-600">联系电话：{{ item.phone }}</div>
|
||||
<div class="text-gray-600">
|
||||
联系邮箱：{{ item.email || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
所属门店ID：{{ item.storeId || '--' }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tabsValue === 'logs'">
|
||||
<Alert class="mb-4" message="审核日志" type="info" />
|
||||
<Empty
|
||||
v-if="merchantAuditLogs.length === 0"
|
||||
description="暂无审核日志"
|
||||
/>
|
||||
<List
|
||||
v-else
|
||||
:data-source="merchantAuditLogs"
|
||||
item-layout="vertical"
|
||||
>
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex items-center gap-2">
|
||||
<Tag color="orange">{{ item.title }}</Tag>
|
||||
<Tag>动作{{ item.action }}</Tag>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
操作人：{{ item.operatorName || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
操作描述：{{ item.description || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
操作IP：{{ item.ipAddress || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
操作时间：{{ formatDateTime(item.createdAt) }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
|
||||
<Alert class="mb-4 mt-6" message="变更日志" type="info" />
|
||||
<Empty
|
||||
v-if="merchantChangeLogs.length === 0"
|
||||
description="暂无变更日志"
|
||||
/>
|
||||
<List
|
||||
v-else
|
||||
:data-source="merchantChangeLogs"
|
||||
item-layout="vertical"
|
||||
>
|
||||
<template #renderItem="{ item }">
|
||||
<List.Item>
|
||||
<div class="mb-2 flex items-center gap-2">
|
||||
<Tag color="gold">{{ item.fieldName }}</Tag>
|
||||
<Tag>{{ item.changedByName || '--' }}</Tag>
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
旧值：{{ item.oldValue || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
新值：{{ item.newValue || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
变更原因：{{ item.changeReason || '--' }}
|
||||
</div>
|
||||
<div class="text-gray-600">
|
||||
变更时间：{{ formatDateTime(item.changedAt) }}
|
||||
</div>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
</template>
|
||||
</Spin>
|
||||
</div>
|
||||
</template>
|
||||
</Profile>
|
||||
|
||||
Reference in New Issue
Block a user