Merge branch 'fork/xueyitt/feat/feat3'
This commit is contained in:
@@ -2,13 +2,15 @@ import type { Component } from 'vue';
|
||||
|
||||
interface AnalysisOverviewItem {
|
||||
icon: Component | string;
|
||||
title: string;
|
||||
title?: string;
|
||||
totalTitle: string;
|
||||
totalValue: number;
|
||||
value: number;
|
||||
value?: number;
|
||||
}
|
||||
|
||||
interface WorkbenchProjectItem {
|
||||
/** 临时字段 */
|
||||
[key: string]: any;
|
||||
color?: string;
|
||||
content: string;
|
||||
date: string;
|
||||
|
||||
@@ -15,7 +15,7 @@ withDefaults(defineProps<Props>(), {
|
||||
</script>
|
||||
<template>
|
||||
<div class="card-box p-4 py-6 lg:flex">
|
||||
<VbenAvatar :src="avatar" class="size-20" />
|
||||
<VbenAvatar v-if="avatar" :src="avatar" class="size-20" />
|
||||
<div
|
||||
v-if="$slots.title || $slots.description"
|
||||
class="flex flex-col justify-center md:mt-0 md:ml-6"
|
||||
@@ -28,19 +28,21 @@ withDefaults(defineProps<Props>(), {
|
||||
</span>
|
||||
</div>
|
||||
<div class="mt-4 flex flex-1 justify-end md:mt-0">
|
||||
<div class="flex flex-col justify-center text-right">
|
||||
<span class="text-foreground/80"> 待办 </span>
|
||||
<span class="text-2xl">2/10</span>
|
||||
</div>
|
||||
<slot name="actions">
|
||||
<div class="flex flex-col justify-center text-right">
|
||||
<span class="text-foreground/80"> 待办 </span>
|
||||
<span class="text-2xl">2/10</span>
|
||||
</div>
|
||||
|
||||
<div class="mx-12 flex flex-col justify-center text-right md:mx-16">
|
||||
<span class="text-foreground/80"> 项目 </span>
|
||||
<span class="text-2xl">8</span>
|
||||
</div>
|
||||
<div class="mr-4 flex flex-col justify-center text-right md:mr-10">
|
||||
<span class="text-foreground/80"> 团队 </span>
|
||||
<span class="text-2xl">300</span>
|
||||
</div>
|
||||
<div class="mx-12 flex flex-col justify-center text-right md:mx-16">
|
||||
<span class="text-foreground/80"> 项目 </span>
|
||||
<span class="text-2xl">8</span>
|
||||
</div>
|
||||
<div class="mr-4 flex flex-col justify-center text-right md:mr-10">
|
||||
<span class="text-foreground/80"> 团队 </span>
|
||||
<span class="text-2xl">300</span>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -35,29 +35,37 @@ defineEmits(['click']);
|
||||
<div
|
||||
:class="{
|
||||
'border-r-0': index % 3 === 2,
|
||||
'border-b-0': index < 3,
|
||||
'border-t-0': index > 2,
|
||||
'pb-4': index > 2,
|
||||
'rounded-bl-xl': index === items.length - 3,
|
||||
'rounded-br-xl': index === items.length - 1,
|
||||
'rounded-bl-xl': index >= items.length - 3 && index % 3 === 0,
|
||||
'rounded-br-xl': index === items.length - 1 && index % 3 === 2,
|
||||
}"
|
||||
class="group w-full cursor-pointer border-t border-r border-border p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
|
||||
class="border-border group w-full cursor-pointer border-b border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
|
||||
@click="$emit('click', item)"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<VbenIcon
|
||||
:color="item.color"
|
||||
:icon="item.icon"
|
||||
class="size-8 transition-all duration-300 group-hover:scale-110"
|
||||
@click="$emit('click', item)"
|
||||
/>
|
||||
<span class="ml-4 text-lg font-medium">{{ item.title }}</span>
|
||||
</div>
|
||||
<div class="mt-4 flex h-10 text-foreground/80">
|
||||
{{ item.content }}
|
||||
</div>
|
||||
<div class="flex justify-between text-foreground/80">
|
||||
<span>{{ item.group }}</span>
|
||||
<span>{{ item.date }}</span>
|
||||
</div>
|
||||
|
||||
<!-- 内容区域支持插槽自定义 -->
|
||||
<slot name="content" :item="item" :index="index">
|
||||
<div class="text-foreground/80 mt-4 flex h-10">
|
||||
{{ item.content }}
|
||||
</div>
|
||||
</slot>
|
||||
|
||||
<!-- 底部信息区域支持插槽自定义 -->
|
||||
<slot name="footer" :item="item" :index="index">
|
||||
<div class="text-foreground/80 flex justify-between">
|
||||
<span>{{ item.group }}</span>
|
||||
<span>{{ item.date }}</span>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
</CardContent>
|
||||
|
||||
Reference in New Issue
Block a user