feat: 首页添加到期提醒和项目进展

apps/web-antd/src/api/license/comment/index.ts

@@ -17,6 +17,7 @@ export namespace CommentApi {
     depth?: number; // 评论深度
     content?: string; // 评论内容
     children?: Comment[]; // 子评论
+    projectName?: string; // 项目名称
   }
 }
 
@@ -27,6 +28,11 @@ export function getCommentTree(projectId: number, sort: boolean = false) {
   );
 }
 
+/** 查询评论最新列表 */
+export function getLatestCommentList() {
+  return requestClient.get<CommentApi.Comment[]>(`/license/comment/latest`);
+}
+
 /** 新增评论 */
 export function createComment(data: CommentApi.Comment) {
   return requestClient.post('/license/comment/create', data);

apps/web-antd/src/api/license/license/index.ts

@@ -28,6 +28,8 @@ export namespace LicenseApi {
     oldLicense: License;
     hasHistory: boolean;
     showUpload?: boolean; // 是否显示上传按钮
+    customerName?: string; // 客户名称
+    projectName?: string; // 项目名称
   }
   export interface NeCode {
     id: number; // 主键
@@ -57,6 +59,13 @@ export function getLicenseHistory(id: number) {
   );
 }
 
+/** 查询License到期 */
+export function getLicenseExpiry() {
+  return requestClient.get<LicenseApi.License[]>(
+    `/license/license/list-expiry`,
+  );
+}
+
 /** 新增License */
 export function createLicense(data: LicenseApi.License) {
   return requestClient.post('/license/license/create', data);

apps/web-antd/src/views/dashboard/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import type { AnalysisOverviewItem } from '@vben/common-ui';
+import type { AnalysisOverviewItem, WorkbenchTrendItem } from '@vben/common-ui';
 
-import { onMounted, ref } from 'vue';
+import { onMounted, shallowRef } from 'vue';
 
-import { AnalysisOverview } from '@vben/common-ui';
+import { AnalysisOverview, WorkbenchTrends } from '@vben/common-ui';
 import {
   SvgBellIcon,
   SvgCakeIcon,
@@ -11,9 +11,17 @@ import {
   SvgDownloadIcon,
 } from '@vben/icons';
 
-import { dashboard } from '#/api/license/customer';
+import dayjs from 'dayjs';
+import relativeTime from 'dayjs/plugin/relativeTime';
 
-const overviewItems = ref<AnalysisOverviewItem[]>([]);
+import { getLatestCommentList } from '#/api/license/comment';
+import { dashboard } from '#/api/license/customer';
+import { getLicenseExpiry } from '#/api/license/license';
+
+const overviewItems = shallowRef<AnalysisOverviewItem[]>([]);
+const trendItems = shallowRef<WorkbenchTrendItem[]>([]);
+const projectProgressItems = shallowRef<WorkbenchTrendItem[]>([]);
+dayjs.extend(relativeTime);
 
 onMounted(async () => {
   const data = await dashboard();
@@ -48,6 +56,26 @@ onMounted(async () => {
       value: data?.licenseCount || 0,
     },
   ];
+
+  const licenses = await getLicenseExpiry();
+  trendItems.value = licenses.map((item) => {
+    return {
+      avatar: '',
+      content: `客户【<b>${item.customerName}</b>】项目【<b>${item.projectName}</b>】的License将在 <b>${dayjs(item.expiryDate).fromNow(true)}</b> 后到期`,
+      date: dayjs(item.expiryDate).format('YYYY-MM-DD HH:mm:ss') || '',
+      title: item.serialNo || '',
+    };
+  });
+
+  const comments = await getLatestCommentList();
+  projectProgressItems.value = comments.map((item) => {
+    return {
+      avatar: '',
+      content: item.content || '',
+      date: dayjs(item.updateTime).format('YYYY-MM-DD HH:mm:ss') || '',
+      title: item.projectName || '',
+    };
+  });
 });
 </script>
 
@@ -63,26 +91,24 @@ onMounted(async () => {
       <template #description> 今日晴，20℃ - 32℃！ </template>
     </WorkbenchHeader> -->
 
-    <AnalysisOverview class="mt-5" :items="overviewItems" />
+    <AnalysisOverview :items="overviewItems" />
 
-    <!-- <div class="mt-5 flex flex-col lg:flex-row">
-      <div class="mr-4 w-full lg:w-3/5">
-        <WorkbenchProject :items="projectItems" title="项目" @click="navTo" />
-        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
-      </div>
-      <div class="w-full lg:w-2/5">
-        <WorkbenchQuickNav
-          :items="quickNavItems"
-          class="mt-5 lg:mt-0"
-          title="快捷导航"
-          @click="navTo"
+    <div class="mt-2 flex flex-col lg:flex-row">
+      <div class="mr-4 w-full lg:w-1/2">
+        <WorkbenchTrends
+          :items="trendItems"
+          class="mt-5"
+          title="License最先到期"
         />
-        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
-        <AnalysisChartCard class="mt-5" title="客户类型">
-          <AnalyticsCustomerType />
-        </AnalysisChartCard>
       </div>
-    </div> -->
+      <div class="mr-4 w-full lg:w-1/2">
+        <WorkbenchTrends
+          :items="projectProgressItems"
+          class="mt-5"
+          title="项目进展"
+        />
+      </div>
+    </div>
 
     <!-- <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
       <template #trends>