diff --git a/src/i18n/temp/en.json b/src/i18n/temp/en.json
index b35eddd..0962bf8 100644
--- a/src/i18n/temp/en.json
+++ b/src/i18n/temp/en.json
@@ -2269,10 +2269,18 @@
 	"dropFileHereOrClickToUpload": "Drop file here or click to upload",
 	"uploadSuccess": "Upload Success",
 	"fileUploadError50": "File size exceeds 50M!",
-	"components.BomRelErp.materialCode":"Material Code",
-	"components.BomRelErp.materialName":"Material Name",
-	"components.BomRelErp.materialGroup":"Material Group",
-	"components.BomRelErp.createTime":"CreateTime",
-	"components.BomRelErp.materialGroupDesc":"Material Group Desc",
-	"components.BomRelErp.materialUnit":"Unit"
-}
+	"components.BomRelErp.materialCode": "Material Code",
+	"components.BomRelErp.materialName": "Material Name",
+	"components.BomRelErp.materialGroup": "Material Group",
+	"components.BomRelErp.createTime": "CreateTime",
+	"components.BomRelErp.materialGroupDesc": "Material Group Desc",
+	"components.BomRelErp.materialUnit": "Unit",
+	"components.task-info.251031-0": "Task execution",
+	"components.task-info.251031-1": "Regarding the task-related information of users",
+	"components.task-list.251031-0": "Task list",
+	"components.task-list.251031-1": "The list of tasks that the user is performing",
+	"components.task-compare-chart.251031-0": "Task completion statistics",
+	"components.task-compare-chart.251031-1": "Make statistics on the completion of all tasks",
+	"components.task-trend-chart.251031-0": "Task trend chart",
+	"components.task-trend-chart.251031-1": ""
+}
\ No newline at end of file
diff --git a/src/i18n/temp/zh-cn.json b/src/i18n/temp/zh-cn.json
index bebf5fe..d6c48b2 100644
--- a/src/i18n/temp/zh-cn.json
+++ b/src/i18n/temp/zh-cn.json
@@ -2269,10 +2269,18 @@
 	"dropFileHereOrClickToUpload": "在这里放下文件或点击上传",
 	"uploadSuccess": "上传成功",
 	"fileUploadError50": "上传文件大小不能超过50M!",
-	"components.BomRelErp.materialCode":"物料编码",
-	"components.BomRelErp.materialName":"物料名称",
-	"components.BomRelErp.materialGroup":"物料组",
-	"components.BomRelErp.createTime":"创建时间",
-	"components.BomRelErp.materialGroupDesc":"物料组描述",
-	"components.BomRelErp.materialUnit":"基本单位"
-}
+	"components.BomRelErp.materialCode": "物料编码",
+	"components.BomRelErp.materialName": "物料名称",
+	"components.BomRelErp.materialGroup": "物料组",
+	"components.BomRelErp.createTime": "创建时间",
+	"components.BomRelErp.materialGroupDesc": "物料组描述",
+	"components.BomRelErp.materialUnit": "基本单位",
+	"components.task-info.251031-0": "任务执行",
+	"components.task-info.251031-1": "关于用户的任务相关情况，包括发起任务数量，执行任务数量，关注任务数量和所有任务数量",
+	"components.task-list.251031-0": "任务列表",
+	"components.task-list.251031-1": "用户正在执行任务的列表",
+	"components.task-compare-chart.251031-0": "任务完成情况统计",
+	"components.task-compare-chart.251031-1": "对于所有的任务完成的情况进行统计",
+	"components.task-trend-chart.251031-0": "任务完成趋势图",
+	"components.task-trend-chart.251031-1": ""
+}
\ No newline at end of file
diff --git a/src/views/home/widgets/components/index.ts b/src/views/home/widgets/components/index.ts
index 678f745..f6c0557 100644
--- a/src/views/home/widgets/components/index.ts
+++ b/src/views/home/widgets/components/index.ts
@@ -12,5 +12,6 @@ Object.keys(files).forEach((fileName) => {
 		resultComps[key] = files[fileName];
 	}
 });
+console.log(resultComps, 'resultComps');
 
 export default markRaw(resultComps);
diff --git a/src/views/home/widgets/components/task-compare-chart.vue b/src/views/home/widgets/components/task-compare-chart.vue
new file mode 100644
index 0000000..d516122
--- /dev/null
+++ b/src/views/home/widgets/components/task-compare-chart.vue
@@ -0,0 +1,99 @@
+<script lang="ts">
+export default {
+	title: 'components.task-compare-chart.251031-0', // '请求折线图'
+	icon: 'DocumentCopy',
+	description: 'components.task-compare-chart.251031-1', // '折线图示例'
+};
+</script>
+<template>
+	<el-card class="relative h-full">
+		<div id="task-compare-chart" class="chart-content"></div>
+	</el-card>
+</template>
+<script setup lang="ts" name="task-compare-chart">
+import * as echarts from 'echarts';
+
+
+const option = ref<any>({})
+
+const initChartFn = () => {
+	const chartDom = document.getElementById('task-compare-chart')!;
+	const myChart = echarts.init(chartDom);
+
+	option.value = {
+
+		title: {
+			text: '系统任务完成状态'
+		},
+		grid: {
+			left: '3%',
+			right: '4%',
+			bottom: '3%',
+			containLabel: true
+		},
+		tooltip: {
+			trigger: 'axis',
+			axisPointer: {
+				type: 'shadow'
+			}
+		},
+		xAxis: {
+			type: 'category',
+			data: ['未开始', '进行中', '已完成', '不合格']
+		},
+		yAxis: {
+			type: 'value'
+		},
+		series: [
+			{
+				data: [
+					{
+						value: 280,
+						itemStyle: {
+							color: 'grey'
+						}
+					},
+					{
+						value: 1650,
+						itemStyle: {
+							color: '#6d9cf8'
+						}
+					},
+					{
+						value: 2345,
+						itemStyle: {
+							color: '#53b997'
+						}
+					},
+					{
+						value: 415,
+						itemStyle: {
+							color: '#fd9595'
+						}
+					}
+				],
+				type: 'bar',
+				barWidth: 30
+			}
+		]
+	};
+
+	option && myChart.setOption(option.value);
+
+}
+
+onMounted(() => {
+	initChartFn()
+})
+
+
+</script>
+
+
+<style scoped lang="scss">
+.chart-content {
+	width: 100%;
+	min-height: 260px;
+	height: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/home/widgets/components/task-info.vue b/src/views/home/widgets/components/task-info.vue
new file mode 100644
index 0000000..519ad66
--- /dev/null
+++ b/src/views/home/widgets/components/task-info.vue
@@ -0,0 +1,154 @@
+<script lang="ts">
+export default {
+    title: 'components.task-info.251031-0', // '任务管理'
+    icon: 'DocumentCopy',
+    description: 'components.task-info.251031-1', // '任务管理示例'
+};
+</script>
+<template>
+    <el-card class="relative h-full">
+        <div class="task-content">
+
+            <div v-for="item in userTaskInfos" :key="item.num" class="task-item">
+
+                <div class="task-image" :style="{ backgroundColor: getImgBgColorFn(item.name) }">
+                    <el-icon v-if="item.name === '发起任务'">
+                        <DocumentAdd />
+                    </el-icon>
+                    <el-icon v-if="item.name === '执行任务'">
+                        <DocumentChecked />
+                    </el-icon>
+                    <el-icon v-if="item.name === '关注任务'">
+                        <StarFilled />
+                    </el-icon>
+                    <el-icon v-if="item.name === '所有任务'">
+                        <Tickets />
+                    </el-icon>
+                </div>
+                <div class="task-inner">
+                    <div class="task-type">{{ item.name }}</div>
+                    <div class="task-num">{{ item.num }}</div>
+                </div>
+
+            </div>
+
+
+        </div>
+
+    </el-card>
+</template>
+<script setup lang="ts" name="taskInfo">
+
+const userTaskInfos = ref<any[]>([
+
+])
+
+const setTaskInfoFn = () => {
+
+    const num1 = Math.floor(Math.random() * 91) + 10;
+    const num2 = Math.floor(Math.random() * 91) + 10;
+    const num3 = Math.floor(Math.random() * 91) + 10;
+    const num4 = num1 + num2 + num3;
+
+    userTaskInfos.value = [{
+        name: '发起任务',
+        num: num1,
+    },
+    {
+        name: '执行任务',
+        num: num2,
+    },
+    {
+        name: '关注任务',
+        num: num3,
+    },
+    {
+        name: '所有任务',
+        num: num4,
+    },]
+}
+
+const getImgBgColorFn = (name: string) => {
+
+    let color: string = '';
+    if (name === '发起任务') {
+        color = '#6d9cf8'
+    } else if (name === '执行任务') {
+        color = '#53b997'
+
+    } else if (name === '关注任务') {
+        color = '#fd9595'
+
+    } else {
+        color = '#efd769'
+
+    }
+
+    return color
+}
+
+
+onMounted(() => {
+    setTaskInfoFn()
+})
+
+
+
+</script>
+<style scoped lang="scss">
+.task-content {
+    width: 100%;
+    height: 100%;
+    min-height: 100px;
+    display: flex;
+    justify-content: space-around;
+    flex-wrap: wrap;
+    padding: 5px;
+
+    .task-item {
+        width: calc(25% - 20px);
+        height: 80px;
+        display: flex;
+        align-items: center;
+
+        .task-image {
+            width: 60px;
+            height: 60px;
+            border-radius: 5px;
+            margin-right: 10px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 30px;
+            color: #fff;
+        }
+
+        .task-inner {
+            width: calc(100% - 70px);
+            height: 100%;
+
+            .task-type,
+            .task-num {
+                width: 100%;
+                height: 50%;
+                display: flex;
+                align-items: center;
+            }
+
+            .task-type {
+                font-size: 22px;
+                // font-weight: 600;
+            }
+
+            .task-num {
+                font-size: 20px;
+                color: rgb(138, 136, 136);
+            }
+
+        }
+
+
+    }
+
+}
+</style>
\ No newline at end of file
diff --git a/src/views/home/widgets/components/task-list.vue b/src/views/home/widgets/components/task-list.vue
new file mode 100644
index 0000000..294657f
--- /dev/null
+++ b/src/views/home/widgets/components/task-list.vue
@@ -0,0 +1,212 @@
+<script lang="ts">
+export default {
+	title: 'components.task-list.251031-0', // '任务管理'
+	icon: 'DocumentCopy',
+	description: 'components.task-list.251031-1', // '任务管理示例'
+};
+</script>
+<template>
+	<el-card class="relative h-full">
+
+		<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>
+			<pagination v-bind="paginationInfo" @current-change="currentChangeHandle" @size-change="sizeChangeHandle" />
+
+			</div>
+
+		</div>
+	</el-card>
+</template>
+<script setup lang="ts" name="taskList">
+import TableRender from '/@/components/TableRender/index.vue';
+
+
+
+const tableData = ref<any[]>([
+
+    {
+        "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": "测试阶段"
+    },
+    {
+        "id": 4,
+        "taskName": "整理Q3用户运营数据报告",
+        "taskStatus": "进行中",
+        "taskRisk": "低（数据已收集完毕，仅需汇总分析）",
+        "taskProgress": "80%（已完成数据清洗，待生成可视化图表）",
+        "beginTime": "2025-10-30",
+        "endTime": "2025-11-03",
+        "project": "Q3用户运营复盘项目",
+        "phase": "数据复盘阶段"
+    },
+    {
+        "id": 5,
+        "taskName": "开发商品分类筛选功能前端页面",
+        "taskStatus": "已暂停",
+        "taskRisk": "高（UI设计稿临时变更，需重新调整布局）",
+        "taskProgress": "40%（已完成基础框架，待对接新设计资源）",
+        "beginTime": "2025-10-26",
+        "endTime": "2025-11-01",
+        "project": "XX电商小程序优化",
+        "phase": "开发阶段"
+    },
+    {
+        "id": 6,
+        "taskName": "撰写新品上市推广软文",
+        "taskStatus": "待开始",
+        "taskRisk": "中（需等待产品部提供核心卖点，可能延期）",
+        "taskProgress": "0%",
+        "beginTime": "2025-11-04",
+        "endTime": "2025-11-06",
+        "project": "XX新品上市推广项目",
+        "phase": "内容准备阶段"
+    },
+    {
+        "id": 7,
+        "taskName": "修复用户反馈的APP闪退问题",
+        "taskStatus": "进行中",
+        "taskRisk": "低（已定位问题原因，正在编写修复代码）",
+        "taskProgress": "60%（修复方案已确定，待测试验证）",
+        "beginTime": "2025-10-29",
+        "endTime": "2025-11-02",
+        "project": "XXAPP紧急bug修复项目",
+        "phase": "紧急修复阶段"
+    },
+    {
+        "id": 8,
+        "taskName": "统计双11预热期用户点击量",
+        "taskStatus": "已完成",
+        "taskRisk": "低（数据统计工具正常，无异常）",
+        "taskProgress": "100%（数据已同步给运营团队）",
+        "beginTime": "2025-10-24",
+        "endTime": "2025-10-26",
+        "project": "2025双11电商促销项目",
+        "phase": "预热数据监控阶段"
+    },
+    {
+        "id": 9,
+        "taskName": "设计用户个人中心新版界面",
+        "taskStatus": "进行中",
+        "taskRisk": "中（用户调研反馈未完全收集，可能需调整设计）",
+        "taskProgress": "50%（已完成初稿设计，待收集反馈）",
+        "beginTime": "2025-10-31",
+        "endTime": "2025-11-04",
+        "project": "XX用户管理系统开发",
+        "phase": "UI设计阶段"
+    },
+    {
+        "id": 10,
+        "taskName": "编写APP版本更新说明文档",
+        "taskStatus": "待开始",
+        "taskRisk": "低（功能变更清单已确认，无不确定因素）",
+        "taskProgress": "0%",
+        "beginTime": "2025-11-05",
+        "endTime": "2025-11-07",
+        "project": "XX电商APP V3.5迭代",
+        "phase": "上线准备阶段"
+    },
+    {
+        "id": 11,
+        "taskName": "测试用户注册短信验证码功能",
+        "taskStatus": "进行中",
+        "taskRisk": "低（短信接口已调试完成，测试环境稳定）",
+        "taskProgress": "90%（已测试正常场景，待验证异常场景）",
+        "beginTime": "2025-10-27",
+        "endTime": "2025-10-29",
+        "project": "XX用户管理系统开发",
+        "phase": "测试阶段"
+    },
+
+]);
+const tableColumns = ref([
+	{
+		// t('hooks.requirement.09115201-21')
+		label: '任务名称',
+		prop: 'taskName',
+	},
+	{
+		label: '任务状态',
+		prop: 'taskStatus',
+	},
+	{
+		label: '风险情况',
+		prop: 'taskRisk',
+	},
+	{
+		label: '任务进度',
+		prop: 'taskProgress',
+	},
+	{
+		label: '开始时间',
+		prop: 'beginTime',
+	},
+	{
+		label: '计划完成时间',
+		prop: 'endTime',
+	},
+	{
+		label: '项目',
+		prop: 'project',
+	},
+	{
+		label: '阶段',
+		prop: 'phase',
+	},
+	
+])
+
+const paginationInfo = ref({
+    size: 20,
+    total:15
+})
+
+const currentChangeHandle = (val:any)=>{
+
+}
+
+const sizeChangeHandle = (val:any)=>{
+
+}
+
+</script>
+<style scoped lang="scss">
+.table-content {
+	width: 100%;
+	height: 100%;
+	min-height: 500px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/home/widgets/components/task-trend-chart.vue b/src/views/home/widgets/components/task-trend-chart.vue
new file mode 100644
index 0000000..68c6146
--- /dev/null
+++ b/src/views/home/widgets/components/task-trend-chart.vue
@@ -0,0 +1,81 @@
+<script lang="ts">
+export default {
+	title: 'components.task-trend-chart.251031-0', // '请求折线图'
+	icon: 'DocumentCopy',
+	description: 'components.task-trend-chart.251031-1', // '折线图示例'
+};
+</script>
+<template>
+	<el-card class="relative h-full">
+		<div id="task-trend-chart" class="chart-content"></div>
+
+	</el-card>
+</template>
+<script setup lang="ts" name="task-trend-chart">
+
+import * as echarts from 'echarts';
+const option = ref<any>({})
+
+const initChartFn = () => {
+	const chartDom = document.getElementById('task-trend-chart')!;
+	const myChart = echarts.init(chartDom);
+
+	option.value = {
+
+		title: {
+			text: '用户任务统计'
+		},
+		grid: {
+			left: '3%',
+			right: '4%',
+			bottom: '3%',
+			containLabel: true
+		},
+		legend: {
+			data: ['分配任务', '完成任务',]
+		},
+		tooltip: {
+			trigger: 'axis',
+			axisPointer: {
+				type: 'shadow'
+			}
+		},
+		xAxis: {
+			type: 'category',
+			data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月',]
+		},
+		yAxis: {
+			type: 'value'
+		},
+		series: [
+			{
+				name: '分配任务',
+				type: 'line',
+				stack: 'Total1',
+				data: [120, 132, 101, 134, 90, 111, 121,86,65,55,40,23]
+			},
+			{
+				name: '完成任务',
+				type: 'line',
+				stack: 'Total2',
+				data: [15, 65, 100, 166, 135, 165, 155,100,134,121,85,78]
+			},
+		]
+	};
+
+	option && myChart.setOption(option.value);
+
+}
+
+onMounted(() => {
+	initChartFn()
+})
+
+</script>
+<style scoped lang="scss">
+.chart-content {
+	width: 100%;
+	min-height: 260px;
+	height: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/home/widgets/index.vue b/src/views/home/widgets/index.vue
index 56614c5..8c567a9 100644
--- a/src/views/home/widgets/index.vue
+++ b/src/views/home/widgets/index.vue
@@ -2,22 +2,22 @@
 	基于 SCUI 重构适配 vite 加载和适配相关业务页面。https://gitee.com/lolicode/scui/tree/master/src/views/home
  -->
 <template>
-	<div :class="['widgets-home', customizing ? 'customizing' : '']" ref="main">
+	<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>
 					<el-button v-else type="primary" round @click="custom">{{ $t('Crontab.index.7634731-6') }}</el-button>
 				</div>
 			</div>
-			<div class="widgets" ref="widgets">
+			<div ref="widgets" class="widgets">
 				<div class="widgets-wrapper">
 					<div v-if="nowComponentList.length <= 0" class="no-widgets">
 						<el-empty :description="$t('widgets.index.0910663-2')" :image-size="280"></el-empty>
 					</div>
 					<el-row :gutter="16">
-						<el-col :gutter="16" v-for="(item, index) in grid.layout" v-bind:key="index" :md="item" :xs="24">
+						<el-col v-for="(item, index) in grid.layout" v-bind:key="index" :gutter="16" :md="item" :xs="24">
 							<draggable
 								v-model="grid.copmsList[index]"
 								animation="200"
@@ -161,6 +161,10 @@ const myCompsList = computed(() => {
 		'sys-log-line',
 		'demo-chart1',
 		'demo-chart2',
+		'task-info',
+		'task-list',
+		'task-compare-chart',
+		'task-trend-chart'
 	];
 	return allComponentList.value.filter((item) => !item.disabled && myGrid.includes(item.key));
 });