diff --git a/.umirc.ts b/.umirc.ts
index 513ad5a..0dbbfda 100644
--- a/.umirc.ts
+++ b/.umirc.ts
@@ -19,7 +19,7 @@ export default defineConfig({
     },
     dva: {},
     //  layout: {},
-    mfsu: { strategy: 'normal' },
+    // mfsu: { strategy: 'normal' },
     locale: {
         default: 'zh-CN',
         antd: true,
diff --git a/src/assets/basic_information/background_examine.png b/src/assets/basic_information/background_examine.png
new file mode 100644
index 0000000..aa06f4a
Binary files /dev/null and b/src/assets/basic_information/background_examine.png differ
diff --git a/src/assets/basic_information/timer_shaft.png b/src/assets/basic_information/timer_shaft.png
new file mode 100644
index 0000000..4b03f32
Binary files /dev/null and b/src/assets/basic_information/timer_shaft.png differ
diff --git a/src/pages/safe_majorHazard/module/ResponsibilityImplementation.js b/src/pages/safe_majorHazard/module/ResponsibilityImplementation.js
index ada5842..000090f 100644
--- a/src/pages/safe_majorHazard/module/ResponsibilityImplementation.js
+++ b/src/pages/safe_majorHazard/module/ResponsibilityImplementation.js
@@ -1,9 +1,11 @@
 
 import React from 'react'; 
 import { Card, Result, Timeline,Statistic, Table,Row, Input,Button,Col, Select} from 'antd';  
+import { ExportOutlined } from '@ant-design/icons';
 import StandardTable from '@/components/StandardTable';
 import styles from './ResponsibilityImplementation.less';
 
+import timer_shaft from '@/assets/basic_information/timer_shaft.png'
 
 
 const ResponsibilityImplementation = () => {  
@@ -114,68 +116,12 @@ const ResponsibilityImplementation = () => {
                             <div className={styles.titleIcon}></div>
                             <div>履职时间轴</div>
                         </div>
-                    </div>
-                    
-                    {/* 第二块：时间轴内容 */}
-                    <div className={styles.leftBottomSection}>
-                        <div className={styles.timelineHorizontal}>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#2E4CD4' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-01-15</div>
-                                    <div className={styles.timelineText}>完成安全培训</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#52C41A' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-02-20</div>
-                                    <div className={styles.timelineText}>设备巡检完成</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#FAAD14' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-03-10</div>
-                                    <div className={styles.timelineText}>隐患排查处理</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#2E4CD4' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-04-05</div>
-                                    <div className={styles.timelineText}>月度安全会议</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#52C41A' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-05-12</div>
-                                    <div className={styles.timelineText}>安全检查</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#FAAD14' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-06-18</div>
-                                    <div className={styles.timelineText}>应急演练</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#2E4CD4' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-07-25</div>
-                                    <div className={styles.timelineText}>设备维护</div>
-                                </div>
-                            </div>
-                            <div className={styles.timelineItem}>
-                                <div className={styles.timelineDot} style={{ backgroundColor: '#52C41A' }}></div>
-                                <div className={styles.timelineContent}>
-                                    <div className={styles.timelineDate}>2024-08-30</div>
-                                    <div className={styles.timelineText}>安全评估</div>
-                                </div>
-                            </div>
+
+                        {/* 时间轴图片 */}
+                        <div style={{ marginTop: '15px' }}>
+                            <img src={timer_shaft} alt="时间轴" style={{ width: '100%', height: 'auto' }} />
                         </div>
+                        
                     </div>
                 </div>
                 
@@ -185,7 +131,7 @@ const ResponsibilityImplementation = () => {
                         <div className={styles.rightTopLeft}>
                             <div className={styles.titleLeft}>
                                 <div className={styles.titleIcon}></div>
-                                <div>履职时间轴</div>
+                                <div>在线考核</div>
                             </div>
                             <Select
                                 style={{ width: 100, marginLeft: 15 }}
@@ -207,18 +153,28 @@ const ResponsibilityImplementation = () => {
                             <Button 
                                 type="primary" 
                                 className={styles.exportBtn}
-                                icon="📄"
+                                icon={<ExportOutlined />}
                             >
                                 导出PDF考核报告
                             </Button>
                         </div>
                     </div>
                     
-                    {/* 第二块：图片内容 */}
+                    {/* 第二块：重叠图片和div */}
                     <div className={styles.rightBottomSection}>
-                        <div className={styles.imagePlaceholder}>
-                            <div className={styles.imageIcon}>📊</div>
-                            <div className={styles.imageText}>数据图表</div>
+                        <div className={styles.overlayContainer}>
+                            {/* 背景图片1 */}
+                            <div className={styles.backgroundImage1}>
+                                <div className={styles.placeholderText}>占位图片1</div>
+                            </div>
+                            {/* 背景图片2 */}
+                            <div className={styles.backgroundImage2}>
+                                <div className={styles.placeholderText}>占位图片2</div>
+                            </div>
+                            {/* 重叠的div元素 */}
+                            <div className={styles.overlayDiv1}>待开发123</div>
+                            <div className={styles.overlayDiv2}>待开发123</div>
+                            <div className={styles.overlayDiv3}>待开发123</div>
                         </div>
                     </div>
                 </div>
diff --git a/src/pages/safe_majorHazard/module/ResponsibilityImplementation.less b/src/pages/safe_majorHazard/module/ResponsibilityImplementation.less
index b607c38..139d75f 100644
--- a/src/pages/safe_majorHazard/module/ResponsibilityImplementation.less
+++ b/src/pages/safe_majorHazard/module/ResponsibilityImplementation.less
@@ -39,85 +39,13 @@
                 }
             }
 
-            .leftBottomSection {
-                flex: 1;
-                overflow-x: auto;
-                overflow-y: hidden;
-                height: 80px;
-
-                .timelineHorizontal {
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-                    height: 100%;
-                    padding: 12px 0;
-                    width: 100%;
-
-                    .timelineItem {
-                        display: flex;
-                        flex-direction: column;
-                        align-items: center;
-                        gap: 4px;
-                        width: 20%;
-                        position: relative;
-                        flex-shrink: 0;
-
-                        .timelineDot {
-                            width: 10px;
-                            height: 10px;
-                            border-radius: 50%;
-                            flex-shrink: 0;
-                            position: relative;
-                            z-index: 2;
-
-                            &::after {
-                                content: '';
-                                position: absolute;
-                                left: 10px;
-                                top: 50%;
-                                width: calc(20% - 10px);
-                                height: 2px;
-                                background-color: #e8e8e8;
-                                transform: translateY(-50%);
-                            }
-                        }
-
-                        &:last-child .timelineDot::after {
-                            display: none;
-                        }
-
-                        .timelineContent {
-                            display: flex;
-                            flex-direction: column;
-                            align-items: center;
-                            gap: 2px;
-                            text-align: center;
-                            width: 100%;
-
-                            .timelineDate {
-                                font-size: 11px;
-                                color: #999999;
-                                font-weight: 400;
-                                white-space: nowrap;
-                            }
-
-                            .timelineText {
-                                font-size: 10px;
-                                color: #333333;
-                                font-weight: 500;
-                                white-space: nowrap;
-                                max-width: 100%;
-                                overflow: hidden;
-                                text-overflow: ellipsis;
-                            }
-                        }
-                    }
-                }
-            }
         }
 
         .containerOneRight{
-            background-color: white;
+            background: linear-gradient(258.72deg, rgba(219, 226, 255, 0.6) 0%, #FFFFFF 100%), url('@/assets/basic_information/background_examine.png');
+            background-size: cover;
+            background-position: center;
+            background-repeat: no-repeat;
             width:42%;
             display: flex;
             flex-direction: column;
@@ -176,25 +104,92 @@
                 align-items: center;
                 justify-content: center;
 
-                .imagePlaceholder {
+                .overlayContainer {
+                    position: relative;
+                    width: 100%;
+                    height: 100%;
                     display: flex;
-                    flex-direction: column;
                     align-items: center;
                     justify-content: center;
-                    width: 100%;
-                    height: 100%;
-                    background-color: #f5f5f5;
-                    border: 2px dashed #d9d9d9;
-                    border-radius: 4px;
 
-                    .imageIcon {
-                        font-size: 48px;
-                        margin-bottom: 10px;
+                    .backgroundImage1 {
+                        position: absolute;
+                        top: 10px;
+                        left: 10px;
+                        width: 60%;
+                        height: 60%;
+                        background-color: #e6f7ff;
+                        border: 2px solid #91d5ff;
+                        border-radius: 8px;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        z-index: 1;
+
+                        .placeholderText {
+                            font-size: 12px;
+                            color: #1890ff;
+                            font-weight: 500;
+                        }
                     }
 
-                    .imageText {
+                    .backgroundImage2 {
+                        position: absolute;
+                        bottom: 10px;
+                        right: 10px;
+                        width: 50%;
+                        height: 50%;
+                        background-color: #f6ffed;
+                        border: 2px solid #b7eb8f;
+                        border-radius: 8px;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        z-index: 1;
+
+                        .placeholderText {
+                            font-size: 12px;
+                            color: #52c41a;
+                            font-weight: 500;
+                        }
+                    }
+
+                    .overlayDiv1 {
+                        position: absolute;
+                        top: 20px;
+                        right: 20px;
+                        background-color: rgba(255, 77, 79, 0.8);
+                        color: white;
+                        padding: 8px 12px;
+                        border-radius: 4px;
+                        font-size: 12px;
+                        z-index: 3;
+                    }
+
+                    .overlayDiv2 {
+                        position: absolute;
+                        bottom: 30px;
+                        left: 30px;
+                        background-color: rgba(82, 196, 26, 0.8);
+                        color: white;
+                        padding: 8px 12px;
+                        border-radius: 4px;
+                        font-size: 12px;
+                        z-index: 3;
+                    }
+
+                    .overlayDiv3 {
+                        position: absolute;
+                        top: 50%;
+                        left: 50%;
+                        transform: translate(-50%, -50%);
+                        background-color: rgba(24, 144, 255, 0.8);
+                        color: white;
+                        padding: 10px 16px;
+                        border-radius: 6px;
                         font-size: 14px;
-                        color: #999999;
+                        font-weight: 500;
+                        z-index: 3;
                     }
                 }
             }