| | |
| | | v-for="(item, index) in statsItems" |
| | | :key="index" |
| | | class="stat-item" |
| | | :class="{ 'stat-item-highlight': item.highlight }" |
| | | :class="{ |
| | | 'stat-item-highlight': item.highlight, |
| | | 'stat-item-top': item.id === 'myTasks', |
| | | }" |
| | | @click="handleItemClick(item)" |
| | | > |
| | | <div class="stat-icon"> |
| | |
| | | <path |
| | | d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" |
| | | /> |
| | | </svg> |
| | | <svg |
| | | v-else-if="item.icon === 'IconClock'" |
| | | viewBox="0 0 24 24" |
| | | fill="none" |
| | | stroke="currentColor" |
| | | stroke-width="2" |
| | | > |
| | | <circle cx="12" cy="12" r="9" /> |
| | | <path d="M12 7v5l3 3" /> |
| | | </svg> |
| | | </div> |
| | | <div class="stat-info"> |
| | |
| | | import { |
| | | getCurrentUserServiceSubtaskCount, |
| | | sendMsg, |
| | | getNearTimeoutCount, |
| | | } from "@/api/AiCentre/index"; |
| | | import { |
| | | listSmstemplet, |
| | |
| | | // 统计数据 |
| | | statsItems: [ |
| | | { |
| | | id: "myTasks", |
| | | label: "我的任务", |
| | | value: "0", |
| | | unread: 0, |
| | | urltype: 5, |
| | | icon: "IconTask", |
| | | url: "/followvisit/discharge", |
| | | trend: { type: "stable", arrow: "", value: "" }, |
| | | }, |
| | | { |
| | | id: "pending", |
| | | label: "待随访", |
| | | value: "0", |
| | |
| | | trend: { type: "up", arrow: "", value: "" }, |
| | | }, |
| | | { |
| | | id: "myTasks", |
| | | label: "我的任务", |
| | | id: "nearTimeout", |
| | | label: "临近超时任务", |
| | | value: "0", |
| | | unread: 0, |
| | | urltype: 5, |
| | | icon: "IconTask", |
| | | icon: "IconClock", |
| | | url: "/followvisit/discharge", |
| | | trend: { type: "stable", arrow: "", value: "" }, |
| | | }, |
| | |
| | | }, |
| | | |
| | | handleItemClick(item) { |
| | | // 临近超时任务:打开登录后弹窗,而非跳转列表页 |
| | | if (item.id === "nearTimeout") { |
| | | this.$root.$emit("open-near-timeout"); |
| | | this.toggleExpand(); |
| | | return; |
| | | } |
| | | |
| | | if (item.url) { |
| | | console.log(item.url, "item.url"); |
| | | |
| | |
| | | |
| | | // 模拟数据更新 |
| | | const mockData = { |
| | | myTasks: { |
| | | value: "156", |
| | | unread: null, |
| | | trend: { type: "stable", arrow: "→", value: "0" }, |
| | | }, |
| | | pending: { |
| | | value: "128", |
| | | unread: null, |
| | |
| | | unread: null, |
| | | trend: { type: "up", arrow: "↑", value: "3" }, |
| | | }, |
| | | myTasks: { |
| | | value: "156", |
| | | nearTimeout: { |
| | | value: "0", |
| | | unread: null, |
| | | trend: { type: "stable", arrow: "→", value: "0" }, |
| | | }, |
| | |
| | | mockData.failed.value = response.failedVisitCount; |
| | | mockData.abnormal.value = response.abnormalVisitCount; |
| | | mockData.myTasks.value = response.allVisitCount; |
| | | // 临近超时任务数量(接口未就绪,先用 mock) |
| | | mockData.nearTimeout.value = await getNearTimeoutCount(); |
| | | this.statsItems = this.statsItems.map((item) => { |
| | | const data = mockData[item.id] || {}; |
| | | return { |
| | |
| | | background: linear-gradient(to bottom right, #f0f9ff, #f8fafc); |
| | | } |
| | | |
| | | .stat-item-top { |
| | | grid-column: 1 / -1; |
| | | display: flex; |
| | | align-items: center; |
| | | flex-direction: row; |
| | | gap: 16px; |
| | | } |
| | | |
| | | .stat-item-top .stat-icon { |
| | | margin-bottom: 0; |
| | | } |
| | | |
| | | .stat-icon { |
| | | width: 32px; |
| | | height: 32px; |