diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}

diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/images/bench/1671087276259.jpg b/src/assets/images/bench/1671087276259.jpg
new file mode 100644
index 0000000..34b76f5
--- /dev/null
+++ b/src/assets/images/bench/1671087276259.jpg
Binary files differ

diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/images/bench/1671087276259.jpg b/src/assets/images/bench/1671087276259.jpg
new file mode 100644
index 0000000..34b76f5
--- /dev/null
+++ b/src/assets/images/bench/1671087276259.jpg
Binary files differ
diff --git a/src/components.d.ts b/src/components.d.ts
index a188907..8b37b44 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -34,6 +34,7 @@
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
+    Pie: typeof import('./components/echarts/pie.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']

diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/images/bench/1671087276259.jpg b/src/assets/images/bench/1671087276259.jpg
new file mode 100644
index 0000000..34b76f5
--- /dev/null
+++ b/src/assets/images/bench/1671087276259.jpg
Binary files differ
diff --git a/src/components.d.ts b/src/components.d.ts
index a188907..8b37b44 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -34,6 +34,7 @@
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
+    Pie: typeof import('./components/echarts/pie.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/echarts/index.vue b/src/components/echarts/index.vue
index 02c4413..1f6f6aa 100644
--- a/src/components/echarts/index.vue
+++ b/src/components/echarts/index.vue
@@ -33,17 +33,18 @@
           max: 400,
         },
       ],
-      title: [
-        {
-          top: '2%',
-          left: 'right',
-          text: props.title,
-          textStyle: {
-            color: '#000',
-            fontSize: 15,
-          },
+      color: ['#000'],
+      legend: {
+        data: [props.title],
+        itemHeight: 10, // 圆点大小
+        itemWidth: 0, // 线的长度
+        x: 'right', // 居右显示
+        y: -2,
+        textStyle: { // 图例文字的样式
+          color: '#000',
+          fontSize: 12,
         },
-      ],
+      },
       tooltip: {
         trigger: 'axis',
         textStyle: {
@@ -96,7 +97,9 @@
         containLabel: true,
       },
       series: [
+
         {
+          name: props.title,
           type: 'line',
           smooth: true,
           data: props.xAxisData,
@@ -104,38 +107,32 @@
           symbolSize: 2, // 拐点大小
           // 折线条的样式
           lineStyle: {
-            color: 'rgba(0,0,0,0)',
+            color: '#58abf0',
           },
           // 折线拐点的样式
           itemStyle: {
             normal: {
               // 静止时：
-              color: '#fff',
-              borderColor: '#fff', // 拐点的边框颜色
+              color: 'rgb(40 184 228)',
+              borderColor: 'rgb(40 184 228)', // 拐点的边框颜色
               borderWidth: 4,
             },
             emphasis: {
               // 鼠标经过时：
-              color: '#fff',
+              color: 'rgb(40 184 228)',
             },
           },
           areaStyle: {
-            color: {
-              type: 'linear',
-              x: 1,
-              y: 1,
-              colorStops: [
-                {
-                  offset: 0,
-                  color: '#00EAD1', // 0% 处的颜色
-                },
-                {
-                  offset: 1,
-                  color: '#0055CB', // 100% 处的颜色
-                },
-              ],
-              global: false, // 缺省为 false
-            },
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: '#60b4f1',
+              },
+              {
+                offset: 1,
+                color: '#fff',
+              },
+            ]),
           },
         },
       ],

diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/images/bench/1671087276259.jpg b/src/assets/images/bench/1671087276259.jpg
new file mode 100644
index 0000000..34b76f5
--- /dev/null
+++ b/src/assets/images/bench/1671087276259.jpg
Binary files differ
diff --git a/src/components.d.ts b/src/components.d.ts
index a188907..8b37b44 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -34,6 +34,7 @@
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
+    Pie: typeof import('./components/echarts/pie.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/echarts/index.vue b/src/components/echarts/index.vue
index 02c4413..1f6f6aa 100644
--- a/src/components/echarts/index.vue
+++ b/src/components/echarts/index.vue
@@ -33,17 +33,18 @@
           max: 400,
         },
       ],
-      title: [
-        {
-          top: '2%',
-          left: 'right',
-          text: props.title,
-          textStyle: {
-            color: '#000',
-            fontSize: 15,
-          },
+      color: ['#000'],
+      legend: {
+        data: [props.title],
+        itemHeight: 10, // 圆点大小
+        itemWidth: 0, // 线的长度
+        x: 'right', // 居右显示
+        y: -2,
+        textStyle: { // 图例文字的样式
+          color: '#000',
+          fontSize: 12,
         },
-      ],
+      },
       tooltip: {
         trigger: 'axis',
         textStyle: {
@@ -96,7 +97,9 @@
         containLabel: true,
       },
       series: [
+
         {
+          name: props.title,
           type: 'line',
           smooth: true,
           data: props.xAxisData,
@@ -104,38 +107,32 @@
           symbolSize: 2, // 拐点大小
           // 折线条的样式
           lineStyle: {
-            color: 'rgba(0,0,0,0)',
+            color: '#58abf0',
           },
           // 折线拐点的样式
           itemStyle: {
             normal: {
               // 静止时：
-              color: '#fff',
-              borderColor: '#fff', // 拐点的边框颜色
+              color: 'rgb(40 184 228)',
+              borderColor: 'rgb(40 184 228)', // 拐点的边框颜色
               borderWidth: 4,
             },
             emphasis: {
               // 鼠标经过时：
-              color: '#fff',
+              color: 'rgb(40 184 228)',
             },
           },
           areaStyle: {
-            color: {
-              type: 'linear',
-              x: 1,
-              y: 1,
-              colorStops: [
-                {
-                  offset: 0,
-                  color: '#00EAD1', // 0% 处的颜色
-                },
-                {
-                  offset: 1,
-                  color: '#0055CB', // 100% 处的颜色
-                },
-              ],
-              global: false, // 缺省为 false
-            },
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: '#60b4f1',
+              },
+              {
+                offset: 1,
+                color: '#fff',
+              },
+            ]),
           },
         },
       ],
diff --git a/src/components/echarts/pie.vue b/src/components/echarts/pie.vue
new file mode 100644
index 0000000..3ad8db6
--- /dev/null
+++ b/src/components/echarts/pie.vue
@@ -0,0 +1,100 @@
+<script lang="ts" setup>
+import { nextTick, reactive, ref } from 'vue'
+import * as echarts from 'echarts'
+const props = withDefaults(defineProps<Props>(), {
+  id: '',
+  data: () => [],
+  title: '',
+})
+// const props = withDefaults(defineProps<Props>(), {})
+const person: any = reactive({
+  markList: [],
+})
+interface Props {
+  id: string
+  data: string[]
+  title: string
+}
+const GetEchar = () => {
+  const myChart = ref<HTMLElement>()
+  const myCharts = ref<any>()
+  nextTick(() => {
+    const chartDom = document.getElementById(props.id)!
+    myCharts.value = echarts.init(chartDom)
+    const option = {
+      tooltip: {
+        trigger: 'item',
+      },
+      color: ['rgb(40, 184, 228)', '#ccc'],
+      legend: {
+        orient: 'vertical',
+        right: '0',
+        bottom: '50%',
+        itemGap: 20,
+      },
+      graphic: {
+        type: 'text',
+        left: 'center',
+        top: '45%',
+        style: {
+          text: props.title,
+          textAlign: 'center',
+          fill: '#333',
+          fontSize: 18,
+        },
+      },
+      series: [
+        {
+          name: '培训考核',
+          type: 'pie',
+          radius: ['50%', '70%'],
+          avoidLabelOverlap: false,
+          itemStyle: {
+            borderColor: '#fff',
+            borderWidth: 0,
+          },
+          emphasis: {
+            label: {
+              show: true,
+              fontSize: 20,
+              fontWeight: 'bold',
+            },
+          },
+          label: {
+            normal: {
+              show: false,
+              position: 'center',
+            },
+          },
+          labelLine: {
+            show: false,
+          },
+          data: props.data,
+        },
+      ],
+    }
+    myCharts.value.setOption(option)
+    // 让图表跟随屏幕自动的去适应
+    window.addEventListener('resize', () => {
+      myCharts.value.resize()
+    })
+  })
+}
+watch(
+  [() => props.data], ([newName], [oldName]) => {
+    GetEchar()
+  }, { immediate: true, deep: true })
+GetEchar()
+</script>
+
+<template>
+  <div :id="props.id" class="bars_w" />
+</template>
+
+<style lang="scss" scoped>
+.bars_w {
+  width: 100%;
+  height: 90%;
+  transform: translateX(-25%);
+}
+</style>

diff --git a/src/api/system/bench.ts b/src/api/system/bench.ts
index 24bde9e..705ca3a 100644
--- a/src/api/system/bench.ts
+++ b/src/api/system/bench.ts
@@ -14,3 +14,19 @@
     method: 'post',
   })
 }
+// 培训考核统计
+export function getTrainLogSStatistic(data: object) {
+  return request({
+    url: `${prefix}/meterTrainLogStatistic`,
+    method: 'post',
+    data,
+  })
+}
+// 我的证书记录
+export function getCertificateStatistic(data: object) {
+  return request({
+    url: `${prefix}/queryStaffCertificate`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/images/bench/1671087276259.jpg b/src/assets/images/bench/1671087276259.jpg
new file mode 100644
index 0000000..34b76f5
--- /dev/null
+++ b/src/assets/images/bench/1671087276259.jpg
Binary files differ
diff --git a/src/components.d.ts b/src/components.d.ts
index a188907..8b37b44 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -34,6 +34,7 @@
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
+    Pie: typeof import('./components/echarts/pie.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/echarts/index.vue b/src/components/echarts/index.vue
index 02c4413..1f6f6aa 100644
--- a/src/components/echarts/index.vue
+++ b/src/components/echarts/index.vue
@@ -33,17 +33,18 @@
           max: 400,
         },
       ],
-      title: [
-        {
-          top: '2%',
-          left: 'right',
-          text: props.title,
-          textStyle: {
-            color: '#000',
-            fontSize: 15,
-          },
+      color: ['#000'],
+      legend: {
+        data: [props.title],
+        itemHeight: 10, // 圆点大小
+        itemWidth: 0, // 线的长度
+        x: 'right', // 居右显示
+        y: -2,
+        textStyle: { // 图例文字的样式
+          color: '#000',
+          fontSize: 12,
         },
-      ],
+      },
       tooltip: {
         trigger: 'axis',
         textStyle: {
@@ -96,7 +97,9 @@
         containLabel: true,
       },
       series: [
+
         {
+          name: props.title,
           type: 'line',
           smooth: true,
           data: props.xAxisData,
@@ -104,38 +107,32 @@
           symbolSize: 2, // 拐点大小
           // 折线条的样式
           lineStyle: {
-            color: 'rgba(0,0,0,0)',
+            color: '#58abf0',
           },
           // 折线拐点的样式
           itemStyle: {
             normal: {
               // 静止时：
-              color: '#fff',
-              borderColor: '#fff', // 拐点的边框颜色
+              color: 'rgb(40 184 228)',
+              borderColor: 'rgb(40 184 228)', // 拐点的边框颜色
               borderWidth: 4,
             },
             emphasis: {
               // 鼠标经过时：
-              color: '#fff',
+              color: 'rgb(40 184 228)',
             },
           },
           areaStyle: {
-            color: {
-              type: 'linear',
-              x: 1,
-              y: 1,
-              colorStops: [
-                {
-                  offset: 0,
-                  color: '#00EAD1', // 0% 处的颜色
-                },
-                {
-                  offset: 1,
-                  color: '#0055CB', // 100% 处的颜色
-                },
-              ],
-              global: false, // 缺省为 false
-            },
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: '#60b4f1',
+              },
+              {
+                offset: 1,
+                color: '#fff',
+              },
+            ]),
           },
         },
       ],
diff --git a/src/components/echarts/pie.vue b/src/components/echarts/pie.vue
new file mode 100644
index 0000000..3ad8db6
--- /dev/null
+++ b/src/components/echarts/pie.vue
@@ -0,0 +1,100 @@
+<script lang="ts" setup>
+import { nextTick, reactive, ref } from 'vue'
+import * as echarts from 'echarts'
+const props = withDefaults(defineProps<Props>(), {
+  id: '',
+  data: () => [],
+  title: '',
+})
+// const props = withDefaults(defineProps<Props>(), {})
+const person: any = reactive({
+  markList: [],
+})
+interface Props {
+  id: string
+  data: string[]
+  title: string
+}
+const GetEchar = () => {
+  const myChart = ref<HTMLElement>()
+  const myCharts = ref<any>()
+  nextTick(() => {
+    const chartDom = document.getElementById(props.id)!
+    myCharts.value = echarts.init(chartDom)
+    const option = {
+      tooltip: {
+        trigger: 'item',
+      },
+      color: ['rgb(40, 184, 228)', '#ccc'],
+      legend: {
+        orient: 'vertical',
+        right: '0',
+        bottom: '50%',
+        itemGap: 20,
+      },
+      graphic: {
+        type: 'text',
+        left: 'center',
+        top: '45%',
+        style: {
+          text: props.title,
+          textAlign: 'center',
+          fill: '#333',
+          fontSize: 18,
+        },
+      },
+      series: [
+        {
+          name: '培训考核',
+          type: 'pie',
+          radius: ['50%', '70%'],
+          avoidLabelOverlap: false,
+          itemStyle: {
+            borderColor: '#fff',
+            borderWidth: 0,
+          },
+          emphasis: {
+            label: {
+              show: true,
+              fontSize: 20,
+              fontWeight: 'bold',
+            },
+          },
+          label: {
+            normal: {
+              show: false,
+              position: 'center',
+            },
+          },
+          labelLine: {
+            show: false,
+          },
+          data: props.data,
+        },
+      ],
+    }
+    myCharts.value.setOption(option)
+    // 让图表跟随屏幕自动的去适应
+    window.addEventListener('resize', () => {
+      myCharts.value.resize()
+    })
+  })
+}
+watch(
+  [() => props.data], ([newName], [oldName]) => {
+    GetEchar()
+  }, { immediate: true, deep: true })
+GetEchar()
+</script>
+
+<template>
+  <div :id="props.id" class="bars_w" />
+</template>
+
+<style lang="scss" scoped>
+.bars_w {
+  width: 100%;
+  height: 90%;
+  transform: translateX(-25%);
+}
+</style>
diff --git a/src/views/measure/bench/bench.vue b/src/views/measure/bench/bench.vue
index 7931f12..c8465cc 100644
--- a/src/views/measure/bench/bench.vue
+++ b/src/views/measure/bench/bench.vue
@@ -1,9 +1,10 @@
 <script lang="ts" setup name="bench">
 import { ref } from 'vue'
-import { getStaffSStatistic, getStatistic } from '@/api/system/bench'
+import { getCertificateStatistic, getStaffSStatistic, getStatistic, getTrainLogSStatistic } from '@/api/system/bench'
 import { getPlanList } from '@/api/system/plan'
 import { listPageApi } from '@/api/measure/file'
 import Echarts from '@/components/echarts/index.vue'
+import EchartsPie from '@/components/echarts/pie.vue'
 const buttomTypes = ref([
   { id: '1', text: '培训记录', url: '/train/trainLog' },
   { id: '2', text: '证书到期提醒', url: '/person/remind' },
@@ -15,19 +16,27 @@
 const tableData = ref([])
 const meterageTableData = ref([])
 const columns = ref([
-  { text: '培训名称', value: 'planName', width: '150' },
-  { text: '负责人', value: 'director', width: '150' },
-  { text: '培训时间', value: 'trainTime', width: '180' },
+  { text: '培训名称', value: 'planName', width: '120' },
+  { text: '负责人', value: 'director', width: '130' },
+  { text: '培训时间', value: 'trainTime' },
 ])
 const meterageColumns = ref([
-  { text: '文件名称', value: 'fileName', width: '150' },
-  { text: '类别', value: 'fileTypeName', width: '150' },
-  { text: '发布时间', value: 'publishTime', width: '180' },
+  { text: '文件名称', value: 'fileName', width: '120' },
+  { text: '类别', value: 'fileTypeName', width: '120' },
+  { text: '发布时间', value: 'publishTime' },
+])
+const CertificateColumns = ref([
+  { text: '证书名称', value: 'certificateName', width: '120' },
+  { text: '到期时间', value: 'validDate' },
 ])
 const StatisticyAxis = ref([])
 const StatisticXAxis = ref([])
 const StaffSStatisticyAxis = ref([])
 const StaffSStatisticxAxis = ref([])
+const TrainLogSList = ref([])
+const TrainLogTitle = ref('')
+const CertificateList = ref([])
+const CertificateObject = ref({})
 const getStatisticList = () => {
   const params = {
     createTime: '',
@@ -53,6 +62,22 @@
     StaffSStatisticyAxis.value = await res.data.map(item => item.date)
     StaffSStatisticxAxis.value = await res.data.map(item => Number(item.count))
   })
+  const param = {
+    account: localStorage.getItem('login_username'),
+  }
+  getTrainLogSStatistic(param).then((res) => {
+    TrainLogSList.value = [
+      { name: `合格     ${res.data.qualified}--${(res.data.qualifiedCount / res.data.trainCount) * 100}%`, value: res.data.qualified },
+      { name: `不合格   ${res.data.notQualified}-- ${((res.data.notQualified / res.data.trainCount) * 100)}%`, value: res.data.notQualified },
+    ]
+    TrainLogTitle.value = res.data.trainCount
+  })
+  getCertificateStatistic(param).then((res) => {
+    CertificateList.value = res.data
+    CertificateObject.value = res.data.sort((nex, max) => {
+      return nex.lastValidDate - max.lastValidDate
+    })[0]
+  })
 }
 const getmeterageList = () => {
   const params = {
@@ -81,18 +106,19 @@
         <div class="bench-left-top">
           <div class="bench-title">
             <h3>培训计划</h3>
-            <i>字体图标</i>
+            <span style="cursor: pointer;color: #ccc;" @click="$router.push('/train/plan')">更多 ></span>
           </div>
           <el-table :data="tableData" style="width: 100%;height: 80%; border-radius: 10px;">
-            <el-table-column v-for="item in columns" :key="item.value" :prop="item.value" :label="item.text" :width="item.width" />
+            <el-table-column v-for="item in columns" :key="item.value" :prop="item.value" align="center" :label="item.text" :width="item.width" />
           </el-table>
         </div>
         <div class="bench-left-buttom">
           <div class="bench-title">
             <h3>计量文件</h3>
+            <span style="cursor: pointer;color: #ccc;" @click="$router.push('/file/quality')">更多 ></span>
           </div>
           <el-table :data="meterageTableData" style="width: 100%;height: 80%; border-radius: 10px;">
-            <el-table-column v-for="item in meterageColumns" :key="item.value" :prop="item.value" :label="item.text" :width="item.width" />
+            <el-table-column v-for="item in meterageColumns" :key="item.value" :prop="item.value" align="center" :label="item.text" :width="item.width" />
           </el-table>
         </div>
       </div>
@@ -106,23 +132,19 @@
         <div class="bench-center-buttom">
           <div class="bench-title">
             <h3>我的证书</h3>
+            <span style="cursor: pointer;color: #ccc;" @click="$router.push('/person/certificateLog')">更多 ></span>
           </div>
           <div class="bench-center-content">
-            <table class="table" cellpadding="13">
-              <tr>
-                <th>证书名称</th>
-                <th>到期时间</th>
-              </tr>
-              <tr>
-                <td>证书名称</td>
-                <td>到期时间</td>
-              </tr>
-              <tr>
-                <td>证书名称</td>
-                <td>到期时间</td>
-              </tr>
-            </table>
-            <div>最近到期时间</div>
+            <el-table :data="CertificateList" style="width: 100%;height: 100%; border-radius: 10px;">
+              <el-table-column v-for="item in CertificateColumns" :key="item.value" :prop="item.value" align="center" :label="item.text" :width="item.width" />
+            </el-table>
+            <div class="validDate">
+              <div class="validDate-top" />
+              <div class="validDate-bottom">
+                最近到期时间 <br>
+                <span>{{ CertificateObject.validDate }}</span>
+              </div>
+            </div>
           </div>
         </div>
       </div>
@@ -136,6 +158,7 @@
           <div class="bench-title">
             <h3>我的培训考核</h3>
           </div>
+          <echarts-pie :id="Math.random()" :data="TrainLogSList" :title="TrainLogTitle" />
         </div>
         <div class="bench-right-buttom">
           <div class="bench-title">
@@ -164,12 +187,12 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    width: 38%;
+    width: 32%;
     height: 90vh;
 
     .bench-left-top {
       height: 48%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
       margin: 2%;
     }
@@ -177,7 +200,7 @@
     .bench-left-buttom {
       height: 48%;
       margin: 2%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
     }
   }
@@ -186,22 +209,51 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    width: 38%;
+    width: 35%;
     height: 90vh;
 
     .bench-center-top {
       height: 45%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
       margin: 2%;
+      padding: 10px;
     }
 
     .bench-center-buttom {
       height: 48%;
       margin: 2%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
 
+      .validDate {
+        width: 50%;
+        height: 100%;
+        padding: 20px 0;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        text-align: center;
+
+        .validDate-top {
+          width: 100px;
+          height: 100px;
+          margin-bottom: 30px;
+          background: url("../../../assets/images/bench/1671087276259.jpg") no-repeat center / cover;
+        }
+
+        .validDate-bottom {
+          font-size: 18px;
+          font-weight: 600;
+        }
+
+        .validDate-bottom span {
+          font-size: 14px;
+          font-weight: 400;
+          color: #999;
+        }
+      }
+
       .bench-center-content {
         height: 80%;
         display: flex;
@@ -215,12 +267,12 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    width: 24%;
+    width: 35%;
     height: 90vh;
 
     .bench-right-top {
       height: 30%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
       padding: 5%;
       margin: 2%;
@@ -244,16 +296,18 @@
 
     .bench-right-center {
       height: 34%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
       margin: 2%;
+      overflow: hidden;
     }
 
     .bench-right-buttom {
       height: 30%;
       margin: 2%;
-      border: 1px solid #000;
+      background-color: #fff;
       border-radius: 10px;
+      padding: 10px;
     }
   }
 }