卡片样式修改

This commit is contained in:
2025-10-31 17:47:39 +08:00
parent a597971772
commit 6e28cf059b
5 changed files with 79 additions and 20 deletions

View File

@@ -11,24 +11,49 @@ const tenantInfo = ref<any>(null);
const taskCountMap = ref<Record<string, number>>({});
const list = computed(() => [
// {
// label: t('project.task.09116237-0'),
// prop: 'backlogCount',
// color: '#FD9595',
// path: '/task/pending',
// },
// {
// label: t('components.TopNav.0910664-1'),
// prop: 'createCount',
// color: '#6D9CF8',
// path: '/task/started',
// },
// {
// label: t('components.TopNav.0910664-2'),
// prop: 'finishCount',
// color: '#53B997',
// path: '/task/completed',
// },
{
label: t('project.task.09116237-0'),
prop: 'backlogCount',
color: '#FD9595',
path: '/task/pending',
},
{
label: t('components.TopNav.0910664-1'),
label:'完成任务',
prop: 'createCount',
color: '#6D9CF8',
path: '/task/started',
},
{
label: t('components.TopNav.0910664-2'),
label: '关注任务',
prop: 'backlogCount',
color: '#FD9595',
path: '/task/pending',
},
{
label: '发起任务',
prop: 'finishCount',
color: '#53B997',
path: '/task/completed',
},
{
label: '所有任务',
prop: 'allCount',
color: '#808080',
path: '/task/completed',
},
]);
const getTenantList = () => {
@@ -41,6 +66,9 @@ const getTenantList = () => {
const getTaskCount = async () => {
const res = await getTaskCountApi();
taskCountMap.value = res.data;
taskCountMap.value.allCount = Number(taskCountMap.value.backlogCount) + Number(taskCountMap.value.createCount) + Number(taskCountMap.value.finishCount)
console.log(taskCountMap.value,'taskCountMap.value');
};
onActivated(() => {
@@ -73,10 +101,10 @@ const handleClick = (path: string) => {
<div class="font-bold text-lg">{{ userInfos.user.nickname }}</div>
</div>
</div>
<div class="col-span-2 grid grid-cols-3 h-[40px] justify-between">
<div class="col-span-2 grid grid-cols-4 h-[40px] justify-between">
<div v-for="item in list" :key="item.prop" class="flex flex-col justify-between">
<div class="text-sm text-[#000000A6]">{{ item.label }}</div>
<div class="text-xl cursor-pointer" @click="handleClick(item.path)" :style="{ color: item.color }">{{
<div class="text-xl cursor-pointer" :style="{ color: item.color }" @click="handleClick(item.path)">{{
taskCountMap[item.prop] ?? 0 }}</div>
</div>
</div>

View File

@@ -23,7 +23,7 @@ const initChartFn = () => {
option.value = {
title: {
text: '系统任务完成状态'
text: '系统任务状态'
},
grid: {
left: '3%',
@@ -93,7 +93,7 @@ onMounted(() => {
<style scoped lang="scss">
.chart-content {
width: 100%;
min-height: 260px;
min-height: 295px;
height: 100%;
}
</style>

View File

@@ -11,10 +11,8 @@ export default {
<div class="table-content">
<div class="title-content"></div>
<div class="table-inner">
<TableRender style="width: 100%" row-key="id" border :data="tableData" :columns="tableColumns">
</TableRender>
</TableRender>
<pagination v-bind="paginationInfo" @current-change="currentChangeHandle" @size-change="sizeChangeHandle" />
</div>
@@ -150,6 +148,39 @@ const tableData = ref<any[]>([
"project": "XX用户管理系统开发",
"phase": "测试阶段"
},
{
"id": 1,
"taskName": "搭建用户登录模块数据库表结构",
"taskStatus": "进行中",
"taskRisk": "低(技术方案已确认,无明确风险)",
"taskProgress": "70%(已完成核心字段设计,待优化索引)",
"beginTime": "2025-10-28",
"endTime": "2025-11-01",
"project": "XX用户管理系统开发",
"phase": "开发阶段"
},
{
"id": 2,
"taskName": "设计双11促销活动海报",
"taskStatus": "待开始",
"taskRisk": "中(需与运营确认活动主题,可能影响设计进度)",
"taskProgress": "0%",
"beginTime": "2025-11-02",
"endTime": "2025-11-05",
"project": "2025双11电商促销项目",
"phase": "策划设计阶段"
},
{
"id": 3,
"taskName": "测试APP订单支付异常场景",
"taskStatus": "已完成",
"taskRisk": "低(测试用例覆盖全面)",
"taskProgress": "100%发现2个bug已修复",
"beginTime": "2025-10-25",
"endTime": "2025-10-27",
"project": "XX电商APP V3.5迭代",
"phase": "测试阶段"
},
]);
const tableColumns = ref([
@@ -207,6 +238,6 @@ const sizeChangeHandle = (val:any)=>{
.table-content {
width: 100%;
height: 100%;
min-height: 500px;
min-height: 650px;
}
</style>

View File

@@ -52,13 +52,13 @@ const initChartFn = () => {
name: '分配任务',
type: 'line',
stack: 'Total1',
data: [120, 132, 101, 134, 90, 111, 121,86,65,55,40,23]
data: [15, 17, 22, 31, 21, 16, 10,8,14,19,21,16]
},
{
name: '完成任务',
type: 'line',
stack: 'Total2',
data: [15, 65, 100, 166, 135, 165, 155,100,134,121,85,78]
data: [12, 15, 18, 25, 20, 12, 10,8,12,16,20,15]
},
]
};
@@ -75,7 +75,7 @@ onMounted(() => {
<style scoped lang="scss">
.chart-content {
width: 100%;
min-height: 260px;
min-height: 295px;
height: 100%;
}
</style>

View File

@@ -4,7 +4,7 @@
<template>
<div ref="main" :class="['widgets-home', customizing ? 'customizing' : '']">
<div class="widgets-content">
<!-- <TopNav /> -->
<TopNav />
<div class="widgets-top">
<div class="flex justify-end custom_btn">
<el-button v-if="customizing" type="primary" round @click="save">{{ $t('widgets.index.0910663-0') }}</el-button>