fix: 修复商户中心仅展示基础信息
This commit is contained in:
@@ -1,13 +1,29 @@
|
|||||||
<script setup lang="ts">
|
<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 { Profile } from '@vben/common-ui';
|
||||||
import { useUserStore } from '@vben/stores';
|
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';
|
import MerchantSetting from './merchant-setting.vue';
|
||||||
|
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const tabsValue = ref('basic');
|
const tabsValue = ref('basic');
|
||||||
|
const loading = ref(false);
|
||||||
|
const merchantCenter = ref<CurrentMerchantCenterDto | null>(null);
|
||||||
|
|
||||||
const tabs = [
|
const tabs = [
|
||||||
{ label: '基本信息', value: 'basic' },
|
{ label: '基本信息', value: 'basic' },
|
||||||
@@ -16,6 +32,146 @@ const tabs = [
|
|||||||
{ label: '员工信息', value: 'staffs' },
|
{ label: '员工信息', value: 'staffs' },
|
||||||
{ label: '日志记录', value: 'logs' },
|
{ 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>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -31,12 +187,210 @@ const tabs = [
|
|||||||
:tabs="tabs"
|
:tabs="tabs"
|
||||||
>
|
>
|
||||||
<template #content>
|
<template #content>
|
||||||
<div class="rounded-lg bg-card">
|
<div class="rounded-lg bg-card p-4">
|
||||||
<!-- 基本信息：使用表单形式，支持展示和修改 -->
|
<Spin :spinning="loading">
|
||||||
<MerchantSetting v-if="tabsValue === 'basic'" />
|
<MerchantSetting v-if="tabsValue === 'basic'" />
|
||||||
|
|
||||||
<!-- 其他 Tab 暂时保留或后续根据需要优化 -->
|
<template v-else-if="tabsValue === 'qualification'">
|
||||||
<div v-else class="p-6 text-center text-gray-400">正在开发中...</div>
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</Profile>
|
</Profile>
|
||||||
|
|||||||
Reference in New Issue
Block a user