feat: 调整首页图表

This commit is contained in:
caiyuchao
2025-09-29 17:39:08 +08:00
parent acda6051ef
commit c3eee10f3a
6 changed files with 121 additions and 122 deletions

View File

@@ -5,7 +5,11 @@ import type { CustomerApi } from '#/api/license/customer';
import { onMounted, ref, shallowRef } from 'vue';
import { AnalysisChartCard, WorkbenchTrends } from '@vben/common-ui';
import {
AnalysisChartCard,
AnalysisOverviewCard,
WorkbenchTrends,
} from '@vben/common-ui';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
@@ -16,11 +20,11 @@ import { getLicenseExpiry } from '#/api/license/license';
// import { DictTag } from '#/components/dict-tag';
import { DICT_TYPE, getDictObj } from '#/utils';
import AnalyticsVisitsData from './analytics-visits-data.vue';
import AnalyticsVisitsSales from './analytics-visits-sales.vue';
import AnalyticsVisitsSource from './analytics-visits-source.vue';
import AnalyticsVisitsData from './analytics-visits-lic.vue';
import AnalyticsVisitsSource from './analytics-visits-pie.vue';
import AnalyticsVisitsSales from './analytics-visits-sign.vue';
const overviewItems = shallowRef<AnalysisOverviewItem[]>([]);
const overviewItems = shallowRef<AnalysisOverviewItem>();
const trendItems = shallowRef<WorkbenchTrendItem[]>([]);
const projectProgressItems = shallowRef<WorkbenchTrendItem[]>([]);
dayjs.extend(relativeTime);
@@ -32,50 +36,13 @@ onMounted(async () => {
dashboardValue.value = data;
overviewItems.value = [
{
icon: 'icon-[streamline-plump-color--user-pin-flat] size-8 flex-shrink-0',
title: '员工总数',
totalTitle: '总用户量',
totalValue: data.userCount || 0,
value: data.userCount || 0,
},
{
icon: 'icon-[streamline-color--key-flat] size-8 flex-shrink-0',
title: '授权License数',
totalTitle: '总License量',
totalValue: data?.licenseCount || 0,
value: data?.licenseCount || 0,
},
{
icon: 'icon-[streamline-sharp-color--laptop-project-screen-flat] size-8 flex-shrink-0',
title: '项目总数',
totalTitle: '总项目量',
totalValue: data?.projectCount || 0,
value: data?.projectCount || 0,
},
{
icon: 'icon-[material-icon-theme--folder-contract-open] size-8 flex-shrink-0',
title: '已签合同数',
totalTitle: '总合同量',
totalValue: data?.contractCount || 0,
value: data?.contractCount || 0,
},
{
icon: 'icon-[streamline-color--information-desk-customer] size-8 flex-shrink-0',
title: '客户总数',
totalTitle: '总客户量',
totalValue: data?.customerCount || 0,
value: data?.customerCount || 0,
},
{
icon: 'icon-[streamline-plump-color--fill-and-sign-flat] size-8 flex-shrink-0',
title: '签单率',
totalTitle: '总签单率',
totalValue: data?.signingRate || 0,
value: data?.signingRate || 0,
},
];
overviewItems.value = {
icon: 'icon-[streamline-plump-color--user-pin-flat] size-9 flex-shrink-0',
title: '员工数',
totalTitle: '总用户量',
totalValue: data.userCount || 0,
value: data.userCount || 0,
};
const licenses = await getLicenseExpiry();
trendItems.value = licenses.map((item) => {
@@ -140,14 +107,24 @@ onMounted(async () => {
<!-- <AnalysisOverview :items="overviewItems" /> -->
<div class="w-full md:flex">
<AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="概览">
<AnalysisOverviewCard
:item="overviewItems"
class="mt-5 md:mr-4 md:mt-0 md:w-1/4"
/>
<AnalysisChartCard
class="mt-5 md:mr-4 md:mt-0 md:w-1/4"
title="项目与客户数"
>
<AnalyticsVisitsSource :dashboard-value="dashboardValue" />
</AnalysisChartCard>
<AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="完成度">
<AnalysisChartCard
class="mt-5 md:mr-4 md:mt-0 md:w-1/4"
title="交付完成率"
>
<AnalyticsVisitsData :dashboard-value="dashboardValue" />
</AnalysisChartCard>
<AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="签单率">
<AnalyticsVisitsSales :signing-rate="dashboardValue.signingRate" />
<AnalysisChartCard class="mt-5 md:mt-0 md:w-1/4" title="签单率">
<AnalyticsVisitsSales :dashboard-value="dashboardValue" />
</AnalysisChartCard>
</div>