From ca055e9792329ef0828b376c174b292d30ce8384 Mon Sep 17 00:00:00 2001
From: wangchengming <15110151257@163.com>
Date: Mon, 30 Jun 2025 11:20:53 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/styles/index.scss                  |  16 +-
 src/assets/styles/sidebar.scss                |   2 +-
 src/layout/components/AppMain.vue             |  10 +-
 src/router/index.js                           |  14 +
 src/views/labelManage/adminApproval/index.vue |  10 +-
 src/views/labelManage/escApproval/index.vue   |  10 +-
 src/views/qualification/dashboard/index.vue   |  10 +-
 src/views/qualification/escApproval/index.vue |  10 +-
 .../escTask/components/LableApply.vue         |   2 +-
 .../escTask/components/QualificationApply.vue |   2 +-
 src/views/qualification/escTask/index.vue     |   8 +-
 .../components/LableApplyForm.vue             |   8 +-
 .../components/QualificationApplyForm.vue     |   8 +-
 .../qualification/myQualifications/index.vue  |   6 +-
 .../qualification/trainApproval/index.vue     |  10 +-
 .../qualification/vehicleTrain/index.vue      |  10 +-
 src/views/safetyReview/dashboard/index.vue    | 507 ++++++++++++++++
 .../examinerApproval/approvalDetail.vue       | 544 ++++++++++++++++++
 .../safetyReview/examinerApproval/index.vue   | 384 +++++++++++++
 .../examinerEscTask/approvalDetail.vue        | 544 ++++++++++++++++++
 .../safetyReview/examinerEscTask/index.vue    | 384 +++++++++++++
 .../examinerTasks/addTaskForm.vue             | 483 ++++++++++++++++
 .../safetyReview/examinerTasks/index.vue      | 371 ++++++++++++
 23 files changed, 3273 insertions(+), 80 deletions(-)
 create mode 100644 src/views/safetyReview/dashboard/index.vue
 create mode 100644 src/views/safetyReview/examinerApproval/approvalDetail.vue
 create mode 100644 src/views/safetyReview/examinerApproval/index.vue
 create mode 100644 src/views/safetyReview/examinerEscTask/approvalDetail.vue
 create mode 100644 src/views/safetyReview/examinerEscTask/index.vue
 create mode 100644 src/views/safetyReview/examinerTasks/addTaskForm.vue
 create mode 100644 src/views/safetyReview/examinerTasks/index.vue

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c1c4ea6..4e727c3 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -131,9 +131,21 @@ aside {
 
 .app-container {
   // padding: 20px;
-  height: calc(100vh - 139px);
+  height: calc(100vh - 140px);
   width: 1200px;
   margin: 0 auto;
+  background: #ffffff;
+  padding: 20px 20px 0 20px;
+}
+
+
+.my-container {
+    height: calc(100vh - 140px);
+    width: 1200px;
+    margin: 0 auto;
+    overflow-y: auto;
+    background: #F8F8F8;
+    padding: 0;
 }
 
 .components-container {
@@ -187,4 +199,4 @@ aside {
     vertical-align: middle;
     margin-bottom: 10px;
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
index 66d5b11..588e0c9 100644
--- a/src/assets/styles/sidebar.scss
+++ b/src/assets/styles/sidebar.scss
@@ -138,7 +138,7 @@
         // padding: 0 !important;
 
         .svg-icon {
-          margin-left: 20px;
+          // margin-left: 20px;
         }
 
       }
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 81e93be..cab7600 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -130,6 +130,11 @@ function addIframe() {
 }
 
 // 全局table表格样式 开始
+.el-table {
+  --el-table-border-color: transparent !important;
+  --el-table-border: 1px solid #ebeef5 !important;
+}
+
 .el-table .el-table__header-wrapper th,
 .el-table .el-table__fixed-header-wrapper th {
   word-break: break-word;
@@ -142,6 +147,7 @@ function addIframe() {
   font-size: 18px;
   text-align: left;
   color: #505050;
+  // border-bottom: 1px solid ;
 }
 
 .el-table .el-table__cell {
@@ -153,6 +159,4 @@ function addIframe() {
   color: #505050;
 }
 
-// 全局table表格样式  结束
- 
-</style>
+// 全局table表格样式  结束</style>
diff --git a/src/router/index.js b/src/router/index.js
index 6329ba1..f4f108f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -228,6 +228,20 @@ export const dynamicRoutes = [
       }
     ]
   },
+  {
+    path: '/safetyReview/examinerTasks/addTaskForm',
+    component: Layout,
+    hidden: true,
+    permissions: ['safetyReview:examinerTasks:add'],
+    children: [
+      {
+        path: '',
+        component: () => import('@/views/safetyReview/examinerTasks/addTaskForm'),
+        name: 'addTaskForm',
+        meta: { title: '审核员任务', activeMenu: '/safetyReview/examinerTasks' }
+      }
+    ]
+  },
   {
     path: '/system/user-auth',
     component: Layout,
diff --git a/src/views/labelManage/adminApproval/index.vue b/src/views/labelManage/adminApproval/index.vue
index cb0c64f..64dc1f5 100644
--- a/src/views/labelManage/adminApproval/index.vue
+++ b/src/views/labelManage/adminApproval/index.vue
@@ -54,7 +54,7 @@
             </el-form>
  
             <div class="borderLine"></div>
-            <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+            <el-table :data="tableData" height="calc(100% - 176px)" style="width: 100%">
                 <el-table-column label="序号" width="60">
                     <template #default="scope">
                         {{ scope.$index + 1 }}
@@ -252,14 +252,6 @@ const handleApproval = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
-
 .myRow {
     margin-left: 0 !important;
     margin-right: 0 !important;
diff --git a/src/views/labelManage/escApproval/index.vue b/src/views/labelManage/escApproval/index.vue
index e99c0c1..701386e 100644
--- a/src/views/labelManage/escApproval/index.vue
+++ b/src/views/labelManage/escApproval/index.vue
@@ -53,7 +53,7 @@
             </el-form>
 
             <div class="borderLine"></div>
-            <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+            <el-table :data="tableData" height="calc(100% - 176px)" style="width: 100%">
                 <el-table-column label="序号" width="60">
                     <template #default="scope">
                         {{ scope.$index + 1 }}
@@ -251,14 +251,6 @@ const handleApproval = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
-
 .myRow {
     margin-left: 0 !important;
     margin-right: 0 !important;
diff --git a/src/views/qualification/dashboard/index.vue b/src/views/qualification/dashboard/index.vue
index 50790af..1c8d445 100644
--- a/src/views/qualification/dashboard/index.vue
+++ b/src/views/qualification/dashboard/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="app-page-container">
         <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
-        <div class="app-container clearBoth">
+        <div class="my-container clearBoth">
             <div class="searchPanel">
                 <el-form :model="queryParams" ref="queryRef" :inline="true">
                     <el-row class="myRow">
@@ -389,14 +389,6 @@ const initVehicleTrainBar = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    overflow-y: auto;
-    background: #F8F8F8;
-}
-
 .searchPanel {
     background: #FFFFFF;
     padding: 20px 20px 0 20px;
diff --git a/src/views/qualification/escApproval/index.vue b/src/views/qualification/escApproval/index.vue
index def8253..2c7667e 100644
--- a/src/views/qualification/escApproval/index.vue
+++ b/src/views/qualification/escApproval/index.vue
@@ -53,7 +53,7 @@
                 </el-button>
             </div>
             <div class="borderLine"></div>
-            <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+            <el-table :data="tableData" height="calc(100% - 220px)" style="width: 100%">
                 <el-table-column label="序号" width="60">
                     <template #default="scope">
                         {{ scope.$index + 1 }}
@@ -256,14 +256,6 @@ const handleApproval = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
-
 .myRow {
     margin-left: 0 !important;
     margin-right: 0 !important;
diff --git a/src/views/qualification/escTask/components/LableApply.vue b/src/views/qualification/escTask/components/LableApply.vue
index 071c787..60d8fba 100644
--- a/src/views/qualification/escTask/components/LableApply.vue
+++ b/src/views/qualification/escTask/components/LableApply.vue
@@ -32,7 +32,7 @@
         </el-button>
     </div>
     <div class="borderLine"></div>
-    <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+    <el-table :data="tableData" height="calc(100% - 226px)" style="width: 100%">
         <el-table-column label="序号" width="60">
             <template #default="scope">
                 {{ scope.$index + 1 }}
diff --git a/src/views/qualification/escTask/components/QualificationApply.vue b/src/views/qualification/escTask/components/QualificationApply.vue
index 34b5c25..c37b434 100644
--- a/src/views/qualification/escTask/components/QualificationApply.vue
+++ b/src/views/qualification/escTask/components/QualificationApply.vue
@@ -35,7 +35,7 @@
         </el-button>
     </div>
     <div class="borderLine"></div>
-    <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+    <el-table :data="tableData" height="calc(100% - 226px)" style="width: 100%">
         <el-table-column label="序号" width="60">
             <template #default="scope">
                 {{ scope.$index + 1 }}
diff --git a/src/views/qualification/escTask/index.vue b/src/views/qualification/escTask/index.vue
index 90e2fbb..da11e71 100644
--- a/src/views/qualification/escTask/index.vue
+++ b/src/views/qualification/escTask/index.vue
@@ -56,13 +56,7 @@ onBeforeMount(() => {
 .clearBoth {
     clear: both;
 }
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
+
 // .page-container {
 //     padding: 20px;
 //     background: #ffffff;
diff --git a/src/views/qualification/myQualifications/components/LableApplyForm.vue b/src/views/qualification/myQualifications/components/LableApplyForm.vue
index e44eed7..c75ebef 100644
--- a/src/views/qualification/myQualifications/components/LableApplyForm.vue
+++ b/src/views/qualification/myQualifications/components/LableApplyForm.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="rootContainer">
+    <div class="qualification-rootContainer">
         <div class="borderLine"></div>
         <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top">
             <div class="headerTitle">基本信息</div>
@@ -96,7 +96,7 @@
         </el-form>
     </div>
 
-    <div class="submitTool">
+    <div class="qualification-submitTool">
         <el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
         <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
     </div>
@@ -197,7 +197,7 @@ const handleSubmit = () => {
 }
 </script>
 <style lang='scss'>
-.rootContainer {
+.qualification-rootContainer {
     width: 100%;
     height: calc(100vh - 320px);
     overflow-y: auto;
@@ -233,7 +233,7 @@ const handleSubmit = () => {
     overflow: hidden;
 }
 
-.submitTool {
+.qualification-submitTool {
     width: 100%;
     height: 76px;
     position: absolute;
diff --git a/src/views/qualification/myQualifications/components/QualificationApplyForm.vue b/src/views/qualification/myQualifications/components/QualificationApplyForm.vue
index 19f79e6..7a83479 100644
--- a/src/views/qualification/myQualifications/components/QualificationApplyForm.vue
+++ b/src/views/qualification/myQualifications/components/QualificationApplyForm.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="rootContainer">
+    <div class="qualification-rootContainer">
         <div class="borderLine"></div>
         <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top">
             <div class="headerTitle">基本信息</div>
@@ -164,7 +164,7 @@
         </el-form>
     </div>
 
-    <div class="submitTool">
+    <div class="qualification-submitTool">
         <el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
         <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
     </div>
@@ -216,7 +216,7 @@ const handleSubmit = () => {
 }
 </script>
 <style lang='scss'>
-.rootContainer {
+.qualification-rootContainer {
     width: 100%;
     height: calc(100vh - 320px);
     overflow-y: auto;
@@ -238,7 +238,7 @@ const handleSubmit = () => {
     overflow: hidden;
 }
 
-.submitTool {
+.qualification-submitTool {
     width: 100%;
     height: 76px;
     position: absolute;
diff --git a/src/views/qualification/myQualifications/index.vue b/src/views/qualification/myQualifications/index.vue
index 0e9e77e..fa51fdd 100644
--- a/src/views/qualification/myQualifications/index.vue
+++ b/src/views/qualification/myQualifications/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="app-page-container">
         <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
-        <div class="app-container clearBoth">
+        <div class="my-container clearBoth">
             <el-splitter>
                 <el-splitter-panel size="280">
                     <div class="demo-panell">
@@ -72,7 +72,7 @@
                             </el-button>
                         </el-button-group>
 
-                        <div class="right-container">
+                        <div class="qualification-right-container">
                             <qualification-train v-if="activeIndex == 0" />
                             <vehicle-train v-if="activeIndex == 1" />
                             <qualification-apply v-if="activeIndex == 2" />
@@ -254,7 +254,7 @@ const resizable = ref(false)
     border: 1px solid #1f1f1f;
 }
 
-.right-container {
+.qualification-right-container {
     position: relative;
     margin-top: 25px;
 }
diff --git a/src/views/qualification/trainApproval/index.vue b/src/views/qualification/trainApproval/index.vue
index 4fd01f4..d4f4dd1 100644
--- a/src/views/qualification/trainApproval/index.vue
+++ b/src/views/qualification/trainApproval/index.vue
@@ -53,7 +53,7 @@
                 </el-button>
             </div>
             <div class="borderLine"></div>
-            <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+            <el-table :data="tableData" height="calc(100% - 220px)" style="width: 100%">
                 <el-table-column label="序号" width="60">
                     <template #default="scope">
                         {{ scope.$index + 1 }}
@@ -256,14 +256,6 @@ const handleApproval = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
-
 .myRow {
     margin-left: 0 !important;
     margin-right: 0 !important;
diff --git a/src/views/qualification/vehicleTrain/index.vue b/src/views/qualification/vehicleTrain/index.vue
index 222fc48..d6ef057 100644
--- a/src/views/qualification/vehicleTrain/index.vue
+++ b/src/views/qualification/vehicleTrain/index.vue
@@ -38,7 +38,7 @@
                 </el-button>
             </div>
             <div class="borderLine"></div>
-            <el-table :data="tableData" height="calc(100% - 244px)" style="width: 100%">
+            <el-table :data="tableData" height="calc(100% - 170px)" style="width: 100%">
                 <el-table-column label="序号" width="60">
                     <template #default="scope">
                         {{ scope.$index + 1 }}
@@ -228,14 +228,6 @@ const handleOpenApplyForm = () => {
     clear: both;
 }
 
-.app-container {
-    height: calc(100vh - 140px);
-    width: 1200px;
-    margin: 0 auto;
-    background: #ffffff;
-    padding: 20px 20px 0 20px;
-}
-
 .myRow {
     margin-left: 0 !important;
     margin-right: 0 !important;
diff --git a/src/views/safetyReview/dashboard/index.vue b/src/views/safetyReview/dashboard/index.vue
new file mode 100644
index 0000000..1c8d445
--- /dev/null
+++ b/src/views/safetyReview/dashboard/index.vue
@@ -0,0 +1,507 @@
+<template>
+    <div class="app-page-container">
+        <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+        <div class="my-container clearBoth">
+            <div class="searchPanel">
+                <el-form :model="queryParams" ref="queryRef" :inline="true">
+                    <el-row class="myRow">
+                        <el-col :span="20">
+                            <el-form-item label="部门" prop="deptId">
+                                <el-select v-model="queryParams.deptId" placeholder="请选择部门" clearable
+                                    style="width: 160px">
+                                    <el-option label="Zone one" value="shanghai" />
+                                    <el-option label="Zone two" value="beijing" />
+                                </el-select>
+                            </el-form-item>
+                            <el-form-item label="属地" prop="deptId">
+                                <el-select v-model="queryParams.deptId" placeholder="请选择属地" clearable
+                                    style="width: 160px">
+                                    <el-option label="Zone one" value="shanghai" />
+                                    <el-option label="Zone two" value="beijing" />
+                                </el-select>
+                            </el-form-item>
+                            <el-form-item label="资质" prop="deptId">
+                                <el-select v-model="queryParams.deptId" placeholder="请选择资质" clearable
+                                    style="width: 160px">
+                                    <el-option label="Zone one" value="shanghai" />
+                                    <el-option label="Zone two" value="beijing" />
+                                </el-select>
+                            </el-form-item>
+                            <el-form-item label="年度" prop="userName">
+                                <el-date-picker v-model="queryParams.year" type="year" placeholder="请选择"
+                                    style="width: 140px" />
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="4" style="text-align: right;">
+                            <el-button type="primary" class="seachBtn" @click="handleQuery">查询</el-button>
+                            <el-button class="resetBtn" @click="resetQuery">重置</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </div>
+            <el-row class="chartsRow">
+                <el-col :span="12" class="leftChart">
+                    <el-card>
+                        <template #header>
+                            <div class="card-header">
+                                <span>当前角色饼图</span>
+                            </div>
+                        </template>
+                        <div id="qualificationPer" ref="qualificationPer"></div>
+                    </el-card>
+                </el-col>
+                <el-col :span="12" class="rightChart">
+                    <el-card>
+                        <template #header>
+                            <div class="card-header">
+                                <span>培训需求</span>
+                            </div>
+                        </template>
+                        <div id="qualificationBar" ref="qualificationBar"></div>
+                    </el-card>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="24">
+                    <el-card>
+                        <template #header>
+                            <div class="card-header">
+                                <span>车型培训情况</span>
+                            </div>
+                        </template>
+                        <div id="vehicleTrainBar" ref="vehicleTrainBar"></div>
+                    </el-card>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import Breadcrumb from '@/components/Breadcrumb'
+import * as echarts from 'echarts'
+const router = useRouter()
+const qualificationPer = ref(null)
+const qualificationBar = ref(null)
+const vehicleTrainBar = ref(null)
+const queryParams = ref({
+    userName: undefined,
+    deptId: undefined,
+    qualification: undefined
+})
+/** 搜索按钮操作 */
+const handleQuery = () => { }
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+    handleQuery()
+}
+onMounted(() => {
+    initQualificationPer();
+    initQualificationBar();
+    initVehicleTrainBar();
+});
+const dataCake = [
+    { value: 2562, name: 'SH', percentage: '15.86%' },
+    { value: 6000, name: 'ES', percentage: '37.15%' },
+    { value: 2589, name: 'ESC', percentage: '16.03%' },
+    { value: 4000, name: 'CESC', percentage: '24.77%' },
+    { value: 1000, name: 'LLP', percentage: '6.19%' }
+]
+const initQualificationPer = () => {
+    const _myChart = echarts.init(qualificationPer.value)
+    _myChart.setOption({
+        tooltip: {
+            trigger: 'item',
+            formatter: "{b} : {c} 人  ({d}%)"   //鼠标放上去 展示内容
+        },
+        legend: {
+            orient: 'vertical',
+            left: '54%',  //图例距离左的距离
+            top: '18%',
+            itemGap: 20,
+            textStyle: { // 全局文本样式
+                fontSize: 16,     // 字号
+                color: '#000000',    // 颜色
+                fontWeight: '400' // 加粗
+            },
+            formatter: function (name) {
+                let target, percentage;
+                for (let i = 0; i < dataCake.length; i++) {
+                    if (dataCake[i].name === name) {
+                        target = dataCake[i].value
+                        percentage = dataCake[i].percentage
+                    }
+                }
+                let arr = [name + ' ', " " + target + "人 ", " " + percentage]
+                return arr.join(" ")
+            },
+        },
+        color: ['#767C81', '#BABDC0', '#019167', '#32D3A4', '#FFA800'],//五个数据，五个颜色 
+        series: [
+            {
+                name: '-',
+                type: 'pie',
+                radius: ['60%', '70%'],
+                avoidLabelOverlap: false,
+                padAngle: 5,
+                itemStyle: {
+                    borderRadius: 10
+                },
+                center: ['30%', '45%'], //性设置图的上下左右的位置
+                data: dataCake,
+                // 设置值域的标签
+                label: {
+                    show: false,
+                    position: 'center'
+                },
+                emphasis: {
+                    label: {
+                        show: true,
+                        fontSize: 24,
+                        fontWeight: '700',
+                        formatter: "{b}\n{c} 人"   //鼠标放上去 展示内容
+                    },
+                    itemStyle: {
+                        shadowBlur: 10,
+                        shadowOffsetX: 0,
+                        shadowColor: 'rgba(0, 0, 0, 0.5)'
+                    }
+                }
+            }
+        ]
+    })
+    window.addEventListener("resize", () => {
+        _myChart.resize()
+    })
+}
+
+const initQualificationBar = () => {
+    const _myChart = echarts.init(qualificationBar.value)
+    _myChart.setOption({
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: { type: 'shadow' }
+        },
+        grid: {
+            left: '3%',
+            right: '7%',  // 右侧留更多空间显示长数值
+            top: '0',
+            bottom: '0',
+            containLabel: true
+        },
+        yAxis: {  // 注意：yAxis现在用于显示类别
+            type: 'category',
+            data: ['SH', 'ES', 'ESC', 'CESC', 'LLP'],
+            axisLabel: {
+                fontSize: 16,
+                color: '#898989'
+            },
+            axisLine: {
+                lineStyle: {
+                    color: '#F1F1F1'
+                }
+            },
+            axisTick: {
+                show: false,  // 关闭刻度线显示
+                alignWithLabel: true
+            }
+        },
+        xAxis: {  // 注意：xAxis现在用于显示数值
+            type: 'value',
+            axisLabel: {
+                fontSize: 12,
+                color: '#999',
+                formatter: '{value}',
+                show: false
+            },
+            splitLine: {
+                lineStyle: {
+                    type: 'dashed',
+                    color: '#eee',
+                },
+                show: false
+            },
+        },
+        series: [{
+            name: '数值',
+            type: 'bar',
+            barWidth: '16',
+            data: [
+                { value: 97, name: 'SH' },
+                { value: 212, name: 'ES' },
+                { value: 427, name: 'ESC' },
+                { value: 935, name: 'CESC' },
+                { value: 486, name: 'LLP' }
+            ],
+            itemStyle: {
+                color: function (params) {
+                    const colorList = ['#5470C6', '#91CC75', '#FAC858', '#EE6666', '#73C0DE'];
+                    return colorList[params.dataIndex];
+                },
+                borderRadius: [0, 4, 4, 0] // 右侧圆角（横向条形图的右侧）
+            },
+            label: {
+                show: true,
+                position: 'right',  // 数值显示在条形右侧
+                formatter: '{c}',
+                fontSize: 14,
+                fontWeight: 'bold',
+                color: '#333'
+            },
+            emphasis: {
+                itemStyle: {
+                    shadowBlur: 10,
+                    shadowColor: 'rgba(0, 0, 0, 0.3)'
+                },
+                label: {
+                    show: true,
+                    fontSize: 16,
+                    color: '#000'
+                }
+            }
+        }]
+    })
+    window.addEventListener("resize", () => {
+        _myChart.resize()
+    })
+}
+
+const initVehicleTrainBar = () => {
+    const _myChart = echarts.init(vehicleTrainBar.value)
+    _myChart.setOption({
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: {
+                type: 'shadow'
+            }
+        },
+        grid: {
+            left: '4%',
+            right: '4%',
+            top: '2%',
+            bottom: '0%',  // 为x轴标签留出更多空间
+            containLabel: true
+        },
+        xAxis: {
+            type: 'category',
+            data: [
+                'BR 205 Plugin Hybrid',
+                'BR 222 Plugin Hybrid',
+                'V213 222 Plugin Hybrid',
+                'V266 Plugin Hybrid',
+                'BR 205 Plugin Hybrid',
+                'V213 222 Plugin Hybrid',
+                'V266 Plugin Hybrid',
+                'V223 Plugin Hybrid',
+                'V223 Plugin Hybrid',
+                'V223 Plugin Hybrid'
+            ],
+            axisLabel: {
+                interval: 0,  // 强制显示所有标签
+                rotate: 45,   // 标签旋转45度防止重叠
+                fontSize: 16,  // 缩小字体
+                color: '#898989'
+            },
+            axisLine: {
+                show: false
+            },
+            axisTick: {
+                show: false
+            },
+            splitLine: {
+                lineStyle: {
+                    type: 'dashed',
+                    color: '#eee',
+                },
+                show: false
+            },
+        },
+        yAxis: {
+            type: 'value',
+            axisLabel: {
+                fontSize: 16,
+                color: '#898989'
+            },
+            axisLine: {
+                show: false
+            },
+            axisTick: {
+                show: false
+            },
+            splitLine: {
+                lineStyle: {
+                    type: 'solid',
+                    color: '#F1F1F1',
+                },
+                show: true
+            },
+        },
+        series: [{
+            name: '数值',
+            type: 'bar',
+            barWidth: '16',
+            data: [205, 222, 222, 266, 205, 222, 266, 223, 223, 223],
+            itemStyle: {
+                // color: '#767C81',
+
+                // 间隔变色函数
+                color: function (params) {
+                    const colorList = [
+                        '#767C81', '#767C8150'
+                    ];
+                    return colorList[params.dataIndex % colorList.length];
+                },
+                borderRadius: [0, 0, 0, 0]  // 顶部圆角
+            },
+            label: {
+                show: false,
+                position: 'top',  // 数值显示在柱子上方
+                formatter: '{c}',
+                color: '#333'
+            }
+        }]
+    })
+    window.addEventListener("resize", () => {
+        _myChart.resize()
+    })
+}
+
+</script>
+<style lang='scss'>
+.app-main {
+    min-height: 100vh !important;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-page-container {
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    padding-bottom: 0px;
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.searchPanel {
+    background: #FFFFFF;
+    padding: 20px 20px 0 20px;
+    border-radius: 6px 6px 6px 6px;
+    margin-bottom: 20px;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.chartsRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    margin-bottom: 20px;
+}
+
+
+.qualificationApplyBtn {
+    // width: 84px !important;
+    height: 32px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.qualificationApplyBtn:hover {
+    background: #4276d1;
+}
+
+.el-form--inline .el-form-item {
+    display: inline-flex;
+    margin-right: 26px;
+    vertical-align: middle;
+}
+
+.el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+    min-width: 34px;
+}
+
+.el-input__inner {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-card {
+    border: none;
+    border-radius: 6px;
+}
+
+.el-card.is-always-shadow,
+.el-card.is-hover-shadow:focus,
+.el-card.is-hover-shadow:hover {
+    box-shadow: none;
+}
+
+.el-card__header {
+    font-family: Microsoft YaHei;
+    font-weight: 600;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+    border-bottom: none;
+    box-sizing: border-box;
+    padding: 20px 20px 10px 20px;
+}
+
+.el-card__body {
+    padding: 20px !important;
+}
+
+.leftChart {
+    width: calc(50% - 10px);
+    padding-right: 10px;
+}
+
+.rightChart {
+    width: calc(50% - 10px);
+    padding-left: 10px;
+}
+
+#qualificationPer {
+    width: 100%;
+    height: 293px;
+}
+
+#qualificationBar {
+    width: 100%;
+    height: 293px;
+}
+
+#vehicleTrainBar {
+    width: 100%;
+    height: 400px;
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerApproval/approvalDetail.vue b/src/views/safetyReview/examinerApproval/approvalDetail.vue
new file mode 100644
index 0000000..5fc2f56
--- /dev/null
+++ b/src/views/safetyReview/examinerApproval/approvalDetail.vue
@@ -0,0 +1,544 @@
+<template>
+    <div class="app-page-container">
+        <el-breadcrumb class="app-breadcrumb" separator=">">
+            <transition-group name="breadcrumb">
+                <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
+                    <span v-if="index == levelList.length - 1" class="link-redirect">{{
+                        item.title }}</span>
+                    <span v-else class="no-redirect">{{ item.title }}</span>
+                </el-breadcrumb-item>
+            </transition-group>
+        </el-breadcrumb>
+        <div class="rootContainer clearBoth">
+            <el-card>
+                <template #header>
+                    <div class="card-header">
+                        <span>申请标签：ESC</span>
+                    </div>
+                </template>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="left">
+                    <!-- <div class="headerTitle">基本信息</div> -->
+                    <div class="applyFormContainer">
+                        <el-row class="myRow" :gutter="20">
+                            <el-col :span="20">
+                                <el-row class="myRow" :gutter="20">
+                                    <el-col :span="8">
+                                        <el-form-item label="当前标签:" prop="targetQualification">
+                                            ES
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="部门:" prop="departmentName">
+                                            XXXX部门
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="科室:" prop="officeName">
+                                            XXX科室
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工工号:" prop="employeeNumber">
+                                            NO.43242342
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工姓名(中文):" prop="employeeChineseName">
+                                            管思成
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工姓名(英文):" prop="employeeEnglishName">
+                                            GuangSiCheng
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="属地:" prop="localityName">
+                                            XXX属地
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="属地ESC:" prop="localityName">
+                                            赵文杰
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="创建时间:" prop="employeeEnglishName">
+                                            2024-12-24 14:23
+                                        </el-form-item>
+                                    </el-col>
+                                </el-row>
+                            </el-col>
+                            <el-col :span="4">
+                                <el-form-item label="审批状态" label-position="top" class="myFormItemLable">
+                                    待审批
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
+                    <div class="headerTitle">申请信息</div>
+                    <div class="applyFormContainer">
+                        <el-table :data="approvalData" style="width: 100%; margin-bottom: 20px;">
+                            <el-table-column prop="name" label="资质名称" />
+                            <el-table-column prop="certificate" label="资质证书" align="center">
+                                <template #default="scope">
+                                    <el-image v-if="scope.row.certificate"
+                                        style="width: 70px; height: 44px;line-height: 50px;"
+                                        :src="scope.row.certificate" fit="fill" />
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="expired" label="是否过期">
+                                <template #default="scope">
+                                    <el-text v-if="scope.row.expired == false && scope.row.certificate" type="success"
+                                        class="successText">正常</el-text>
+                                    <el-text v-if="scope.row.expired == true && scope.row.certificate" type="danger"
+                                        class="dangerText">过期</el-text>
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="startTime" label="有效开始日期">
+                                <template #default="scope">
+                                    <span v-if="scope.row.startTime && scope.row.certificate"> {{ scope.row.startTime
+                                        }}</span>
+                                    <span v-else>-</span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="expireTime" label="到期日期">
+                                <template #default="scope">
+                                    <span v-if="scope.row.expireTime && scope.row.certificate"> {{ scope.row.expireTime
+                                        }}</span>
+                                    <span v-else>-</span>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                </el-form>
+                <div class="headerTitle">审批记录</div>
+                <div class="applyFormContainer">
+                    <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;">
+                        <el-table-column label="序号" width="160">
+                            <template #default="scope">
+                                {{ scope.$index + 1 }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column prop="name" label="节点名称" width="260" />
+                        <el-table-column prop="approvalResult" label="审批意见" min-width="100" align="left" />
+                        <el-table-column prop="approvalTime" label="审批时间" width="150">
+                            <template #default="scope">
+                                <span v-if="scope.row.approvalTime && scope.row.approvalTime"> {{ scope.row.approvalTime
+                                    }}</span>
+                                <span v-else>-</span>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
+                    <div class="headerTitle">审批信息</div>
+                    <div class="applyFormContainer">
+                        <el-row class="myRow" :gutter="20">
+                            <el-col :span="6">
+                                <el-form-item label="审批结果" prop="urgency">
+                                    <el-radio-group v-model="ruleForm.urgency">
+                                        <el-radio value="2">驳回</el-radio>
+                                        <el-radio value="1">通过</el-radio>
+                                    </el-radio-group>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="18">
+                                <el-form-item label="审批意见" prop="urgency">
+                                    <el-input v-model="textarea" style="width: 100%" :rows="5" type="textarea"
+                                        placeholder="请输入" />
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+            </el-card>
+        </div>
+
+        <div class="submitTool">
+            <el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
+            <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
+        </div>
+    </div>
+
+</template>
+<script setup>
+import { reactive } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const levelList = ref([
+    { title: '标签管理', path: '/labelManage' },
+    { title: '标签审核员审批', path: '/labelManage/adminApproval' },
+    { title: '审批', path: '/labelManage/adminApproval/approvalDetail' }
+])
+const { proxy } = getCurrentInstance()
+const data = reactive({
+    ruleForm: {},
+    rules: {
+        targetQualification: [{ required: true, message: "目标资质不能为空", trigger: "change" }],
+        employeeNumber: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
+        employeeChineseName: [{ required: true, message: "员工姓名(中文)不能为空", trigger: "blur" }],
+        employeeEnglishName: [{ required: true, message: "员工姓名(英文)", trigger: "blur" }],
+        departmentName: [{ required: true, message: "部门不能为空", trigger: "change" }],
+        officeName: [{ required: true, message: "科室不能为空", trigger: "change" }],
+        localityName: [{ required: true, message: "属地不能为空", trigger: "change" }],
+        localityManager: [{ required: true, message: "属地ESC不能为空", trigger: "blur" }],
+    },
+})
+const tableData = [
+    {
+        name: '提交申请',
+        approvalResult: '-',
+        approvalTime: '2016-05-03'
+    },
+    {
+        name: 'ESC审批',
+        approvalResult: '同意',
+        approvalTime: '2016-05-08'
+    },
+]
+
+const approvalData = [
+    {
+        name: '电工证',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'SH',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ES',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'CESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: '急救证',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'LLP',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: true,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+]
+const { ruleForm, rules } = toRefs(data)
+const handleCancel = () => {
+    proxy.resetForm("ruleFormRef")
+    router.push({
+        path: '/labelManage/adminApproval'
+    })
+}
+const handleSubmit = () => {
+    proxy.$refs["ruleFormRef"].validate(valid => {
+        if (valid) {
+            router.push({
+                path: '/labelManage/adminApproval'
+            })
+            //   if (form.value.roleId != undefined) {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     updateRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("修改成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   } else {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     addRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("新增成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   }
+        }
+    })
+}
+</script>
+<style lang='scss'>
+.app-main {
+    height: 100vh;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-breadcrumb.el-breadcrumb {
+    width: 1200px;
+    margin: 0 auto;
+    height: 44px;
+    line-height: 44px;
+    font-size: 18px;
+    background: #f8f8f8;
+
+    .el-breadcrumb__item {
+        .el-breadcrumb__separator {
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            font-size: 18px;
+            color: #000000 !important;
+            margin: 0 9px;
+        }
+    }
+
+    .no-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #000000;
+        cursor: text;
+    }
+
+    .link-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #0090FF;
+        cursor: text;
+        text-decoration: underline;
+        text-underline-offset: 4px;
+    }
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.rootContainer {
+    width: 1200px;
+    margin: 0 auto;
+    height: calc(100vh - 216px);
+    overflow-y: auto;
+    overflow-x: hidden;
+    background: #ffffff;
+}
+
+.el-card {
+    border: none;
+}
+
+.el-card__header {
+    min-height: 50px;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 20px;
+    text-align: left;
+    color: #000000;
+    border-bottom: 1px solid #DCDCDC;
+    box-sizing: border-box;
+    padding: 10px 20px 17px 20px;
+}
+
+.el-card__body {
+    padding: 0px 20px 0 20px !important;
+}
+
+.el-card.is-always-shadow {
+    box-shadow: none;
+}
+
+.headerTitle {
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+    background: #e9e9e9;
+    padding: 6px 14px;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.applyFormContainer {
+    padding-top: 20px;
+    overflow: hidden;
+}
+
+.submitTool {
+    width: 100%;
+    height: 76px;
+    position: absolute;
+    top: calc(100% - 76px);
+    background: #ffffff;
+    box-shadow: 1px 2px 10px 0 #93939333;
+    text-align: center;
+    line-height: 76px;
+}
+
+.cancelApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #ea9f0e;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.cancelApplyBtn:hover {
+    background: #ea9f0e;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn:hover {
+    background: #4276d1;
+    color: #FFFFFF;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.el-form-item--default {
+    margin-bottom: 20px !important;
+}
+
+.el-form-item--label-left .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #787878;
+    padding: 0 10px 0 0;
+}
+
+.myFormItemLable {
+    padding-top: 22px;
+}
+
+.myFormItemLable .el-form-item__label {
+    font-family: Microsoft YaHei !important;
+    font-weight: 400 !important;
+    font-size: 16px !important;
+    text-align: left !important;
+    color: #787878 !important;
+    padding: 0 10px 0 60px;
+}
+
+.myFormItemLable .el-form-item__content {
+    font-family: Arial !important;
+    font-weight: 400 !important;
+    font-size: 18px !important;
+    text-align: left !important;
+    color: #000000 !important;
+    padding-left: 60px;
+}
+
+.el-form-item--label-left .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #666666;
+}
+
+.el-form-item--label-top .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-textarea__inner {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+}
+
+.el-input__inner {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item__error {
+    font-size: 16px;
+}
+
+.el-radio__inner {
+    width: 16px !important;
+    height: 16px !important;
+}
+
+.el-radio__label {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerApproval/index.vue b/src/views/safetyReview/examinerApproval/index.vue
new file mode 100644
index 0000000..b2837ce
--- /dev/null
+++ b/src/views/safetyReview/examinerApproval/index.vue
@@ -0,0 +1,384 @@
+<template>
+    <div class="app-page-container">
+        <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+        <div class="app-container clearBoth">
+            <el-form :model="queryParams" ref="queryRef" :inline="true" >
+                <el-row class="myRow">
+                    <el-col :span="20">
+                        <el-form-item label="申请日期" prop="userName">
+                            <el-date-picker v-model="rangeTime" type="daterange" range-separator="~" :clearable="false"
+                                style="width: 250px" start-placeholder="开始日期" end-placeholder="结束日期" />
+                        </el-form-item>
+                        <el-form-item label="批准状态" prop="deptId">
+                            <el-select v-model="queryParams.deptId" placeholder="请选择" clearable style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="员工姓名" prop="userName">
+                            <el-input v-model="queryParams.userName" placeholder="请输入员工姓名" clearable
+                                style="width: 160px" @keyup.enter="handleQuery" />
+                        </el-form-item>
+                        <el-form-item style="margin-right: 10px;">
+                            <el-button v-if="!unfoldFlag" type="text" class="foladText" @click="handleFlod">展开
+                                <svg-icon icon-class="unfold" />
+                            </el-button>
+                            <el-button v-else type="text" class="foladText" @click="handleFlod">折叠
+                                <svg-icon icon-class="packUp" />
+                            </el-button>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="4" style="text-align: right;">
+                        <el-button type="primary" class="seachBtn" @click="handleQuery">查询</el-button>
+                        <el-button class="resetBtn" @click="resetQuery">重置</el-button>
+                    </el-col>
+                </el-row>
+                <el-row class="myRow" v-show="unfoldFlag">
+                    <el-col :span="20">
+                        <el-form-item label="部门" prop="qualification">
+                            <el-select v-model="queryParams.qualification" placeholder="请选择部门" clearable
+                                style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="申请标签" prop="qualification">
+                            <el-select v-model="queryParams.qualification" placeholder="请选择" clearable
+                                style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+ 
+            <div class="borderLine"></div>
+            <el-table :data="tableData" height="calc(100% - 126px)" style="width: 100%">
+                <el-table-column label="序号" width="60">
+                    <template #default="scope">
+                        {{ scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="localityName" label="属地" />
+                <el-table-column prop="departmentName" label="部门" />
+                <el-table-column prop="officeName" label="科室" />
+                <el-table-column prop="jobNumber" label="工号" />
+                <el-table-column prop="name" label="员工姓名" />
+                <el-table-column prop="curQualification" label="当前标签" />
+                <el-table-column prop="objectiveQualification" label="申请标签" />
+                <el-table-column prop="status" label="状态" width="120">
+                    <template #default="scope">
+                        <el-text v-if="scope.row.status == 0" type="info" class="infoinfoText">待审核</el-text>
+                        <el-text v-if="scope.row.status == 1" type="success" class="successText">通过</el-text>
+                        <el-text v-if="scope.row.status == 2" type="danger" class="dangerText">驳回</el-text>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" width="150">
+                    <template #default="scope">
+                        <el-button type="primary" text class="replayTextBtn" v-if="scope.row.status != 0"
+                            @click="handleView">查看</el-button>
+                        <el-button type="primary" v-if="scope.row.status == 0" text class="replayTextBtn"
+                            @click="handleApproval">审批</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
+                v-model:limit="queryParams.pageSize" @pagination="getList" />
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import Breadcrumb from '@/components/Breadcrumb' 
+const router = useRouter()
+const total = ref(16)
+const unfoldFlag = ref(false)
+const rangeTime = ref([])
+const queryParams = ref({
+    pageNum: 1,
+    pageSize: 10,
+    userName: undefined,
+    deptId: undefined,
+    qualification: undefined
+})
+const tableData = [
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 1
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 2
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+]
+const handleFlod = () => {
+    unfoldFlag.value = !unfoldFlag.value
+}
+/** 搜索按钮操作 */
+const handleQuery = () => {
+    queryParams.value.pageNum = 1
+    getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+    dateRange.value = []
+    proxy.resetForm("queryRef")
+    queryParams.value.deptId = undefined
+    proxy.$refs.deptTreeRef.setCurrentKey(null)
+    handleQuery()
+}
+const getList = () => {
+
+} 
+const handleView = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+const handleApproval = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+</script>
+<style lang='scss'>
+.app-main {
+    min-height: 100vh !important;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-page-container {
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    padding-bottom: 0px;
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+ 
+.qualificationApplyBtn {
+    // width: 84px !important;
+    height: 32px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.qualificationApplyBtn:hover {
+    background: #4276d1;
+}
+
+.custom-icon {
+    margin-right: 10px;
+}
+
+.infoinfoText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #DD9200;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.replayTextBtn {
+    padding: 0 !important;
+    color: #0090ff !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.verticalLine {
+    border-left: 1px solid #0090ff !important;
+}
+
+.deleteTextBtn {
+    padding: 0 !important;
+    color: #E13434 !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.el-form--inline .el-form-item {
+    display: inline-flex;
+    margin-right: 26px;
+    vertical-align: middle;
+}
+
+.el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+    min-width: 34px;
+}
+
+.el-input__inner {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-date-editor .el-range-input {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: right;
+    color: #000000;
+    width: 46%;
+}
+
+.el-date-editor .el-range__icon svg {
+    width: 18px;
+    height: 16px;
+}
+
+.el-date-editor .el-range__icon {
+    font-size: 16px;
+    // margin-left: 12px;
+    margin-right: 12px;
+}
+
+.el-range-editor.el-input__wrapper {
+    padding: 0 0 0 7px;
+}
+
+.foladText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #0090FF 100%;
+    padding: 10px 0 !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerEscTask/approvalDetail.vue b/src/views/safetyReview/examinerEscTask/approvalDetail.vue
new file mode 100644
index 0000000..5fc2f56
--- /dev/null
+++ b/src/views/safetyReview/examinerEscTask/approvalDetail.vue
@@ -0,0 +1,544 @@
+<template>
+    <div class="app-page-container">
+        <el-breadcrumb class="app-breadcrumb" separator=">">
+            <transition-group name="breadcrumb">
+                <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
+                    <span v-if="index == levelList.length - 1" class="link-redirect">{{
+                        item.title }}</span>
+                    <span v-else class="no-redirect">{{ item.title }}</span>
+                </el-breadcrumb-item>
+            </transition-group>
+        </el-breadcrumb>
+        <div class="rootContainer clearBoth">
+            <el-card>
+                <template #header>
+                    <div class="card-header">
+                        <span>申请标签：ESC</span>
+                    </div>
+                </template>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="left">
+                    <!-- <div class="headerTitle">基本信息</div> -->
+                    <div class="applyFormContainer">
+                        <el-row class="myRow" :gutter="20">
+                            <el-col :span="20">
+                                <el-row class="myRow" :gutter="20">
+                                    <el-col :span="8">
+                                        <el-form-item label="当前标签:" prop="targetQualification">
+                                            ES
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="部门:" prop="departmentName">
+                                            XXXX部门
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="科室:" prop="officeName">
+                                            XXX科室
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工工号:" prop="employeeNumber">
+                                            NO.43242342
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工姓名(中文):" prop="employeeChineseName">
+                                            管思成
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="员工姓名(英文):" prop="employeeEnglishName">
+                                            GuangSiCheng
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="属地:" prop="localityName">
+                                            XXX属地
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="属地ESC:" prop="localityName">
+                                            赵文杰
+                                        </el-form-item>
+                                    </el-col>
+                                    <el-col :span="8">
+                                        <el-form-item label="创建时间:" prop="employeeEnglishName">
+                                            2024-12-24 14:23
+                                        </el-form-item>
+                                    </el-col>
+                                </el-row>
+                            </el-col>
+                            <el-col :span="4">
+                                <el-form-item label="审批状态" label-position="top" class="myFormItemLable">
+                                    待审批
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
+                    <div class="headerTitle">申请信息</div>
+                    <div class="applyFormContainer">
+                        <el-table :data="approvalData" style="width: 100%; margin-bottom: 20px;">
+                            <el-table-column prop="name" label="资质名称" />
+                            <el-table-column prop="certificate" label="资质证书" align="center">
+                                <template #default="scope">
+                                    <el-image v-if="scope.row.certificate"
+                                        style="width: 70px; height: 44px;line-height: 50px;"
+                                        :src="scope.row.certificate" fit="fill" />
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="expired" label="是否过期">
+                                <template #default="scope">
+                                    <el-text v-if="scope.row.expired == false && scope.row.certificate" type="success"
+                                        class="successText">正常</el-text>
+                                    <el-text v-if="scope.row.expired == true && scope.row.certificate" type="danger"
+                                        class="dangerText">过期</el-text>
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="startTime" label="有效开始日期">
+                                <template #default="scope">
+                                    <span v-if="scope.row.startTime && scope.row.certificate"> {{ scope.row.startTime
+                                        }}</span>
+                                    <span v-else>-</span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column prop="expireTime" label="到期日期">
+                                <template #default="scope">
+                                    <span v-if="scope.row.expireTime && scope.row.certificate"> {{ scope.row.expireTime
+                                        }}</span>
+                                    <span v-else>-</span>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                </el-form>
+                <div class="headerTitle">审批记录</div>
+                <div class="applyFormContainer">
+                    <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;">
+                        <el-table-column label="序号" width="160">
+                            <template #default="scope">
+                                {{ scope.$index + 1 }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column prop="name" label="节点名称" width="260" />
+                        <el-table-column prop="approvalResult" label="审批意见" min-width="100" align="left" />
+                        <el-table-column prop="approvalTime" label="审批时间" width="150">
+                            <template #default="scope">
+                                <span v-if="scope.row.approvalTime && scope.row.approvalTime"> {{ scope.row.approvalTime
+                                    }}</span>
+                                <span v-else>-</span>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
+                    <div class="headerTitle">审批信息</div>
+                    <div class="applyFormContainer">
+                        <el-row class="myRow" :gutter="20">
+                            <el-col :span="6">
+                                <el-form-item label="审批结果" prop="urgency">
+                                    <el-radio-group v-model="ruleForm.urgency">
+                                        <el-radio value="2">驳回</el-radio>
+                                        <el-radio value="1">通过</el-radio>
+                                    </el-radio-group>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="18">
+                                <el-form-item label="审批意见" prop="urgency">
+                                    <el-input v-model="textarea" style="width: 100%" :rows="5" type="textarea"
+                                        placeholder="请输入" />
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+            </el-card>
+        </div>
+
+        <div class="submitTool">
+            <el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
+            <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
+        </div>
+    </div>
+
+</template>
+<script setup>
+import { reactive } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const levelList = ref([
+    { title: '标签管理', path: '/labelManage' },
+    { title: '标签审核员审批', path: '/labelManage/adminApproval' },
+    { title: '审批', path: '/labelManage/adminApproval/approvalDetail' }
+])
+const { proxy } = getCurrentInstance()
+const data = reactive({
+    ruleForm: {},
+    rules: {
+        targetQualification: [{ required: true, message: "目标资质不能为空", trigger: "change" }],
+        employeeNumber: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
+        employeeChineseName: [{ required: true, message: "员工姓名(中文)不能为空", trigger: "blur" }],
+        employeeEnglishName: [{ required: true, message: "员工姓名(英文)", trigger: "blur" }],
+        departmentName: [{ required: true, message: "部门不能为空", trigger: "change" }],
+        officeName: [{ required: true, message: "科室不能为空", trigger: "change" }],
+        localityName: [{ required: true, message: "属地不能为空", trigger: "change" }],
+        localityManager: [{ required: true, message: "属地ESC不能为空", trigger: "blur" }],
+    },
+})
+const tableData = [
+    {
+        name: '提交申请',
+        approvalResult: '-',
+        approvalTime: '2016-05-03'
+    },
+    {
+        name: 'ESC审批',
+        approvalResult: '同意',
+        approvalTime: '2016-05-08'
+    },
+]
+
+const approvalData = [
+    {
+        name: '电工证',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'SH',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ES',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'CESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: '急救证',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'LLP',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: true,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+]
+const { ruleForm, rules } = toRefs(data)
+const handleCancel = () => {
+    proxy.resetForm("ruleFormRef")
+    router.push({
+        path: '/labelManage/adminApproval'
+    })
+}
+const handleSubmit = () => {
+    proxy.$refs["ruleFormRef"].validate(valid => {
+        if (valid) {
+            router.push({
+                path: '/labelManage/adminApproval'
+            })
+            //   if (form.value.roleId != undefined) {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     updateRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("修改成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   } else {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     addRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("新增成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   }
+        }
+    })
+}
+</script>
+<style lang='scss'>
+.app-main {
+    height: 100vh;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-breadcrumb.el-breadcrumb {
+    width: 1200px;
+    margin: 0 auto;
+    height: 44px;
+    line-height: 44px;
+    font-size: 18px;
+    background: #f8f8f8;
+
+    .el-breadcrumb__item {
+        .el-breadcrumb__separator {
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            font-size: 18px;
+            color: #000000 !important;
+            margin: 0 9px;
+        }
+    }
+
+    .no-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #000000;
+        cursor: text;
+    }
+
+    .link-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #0090FF;
+        cursor: text;
+        text-decoration: underline;
+        text-underline-offset: 4px;
+    }
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.rootContainer {
+    width: 1200px;
+    margin: 0 auto;
+    height: calc(100vh - 216px);
+    overflow-y: auto;
+    overflow-x: hidden;
+    background: #ffffff;
+}
+
+.el-card {
+    border: none;
+}
+
+.el-card__header {
+    min-height: 50px;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 20px;
+    text-align: left;
+    color: #000000;
+    border-bottom: 1px solid #DCDCDC;
+    box-sizing: border-box;
+    padding: 10px 20px 17px 20px;
+}
+
+.el-card__body {
+    padding: 0px 20px 0 20px !important;
+}
+
+.el-card.is-always-shadow {
+    box-shadow: none;
+}
+
+.headerTitle {
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+    background: #e9e9e9;
+    padding: 6px 14px;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.applyFormContainer {
+    padding-top: 20px;
+    overflow: hidden;
+}
+
+.submitTool {
+    width: 100%;
+    height: 76px;
+    position: absolute;
+    top: calc(100% - 76px);
+    background: #ffffff;
+    box-shadow: 1px 2px 10px 0 #93939333;
+    text-align: center;
+    line-height: 76px;
+}
+
+.cancelApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #ea9f0e;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.cancelApplyBtn:hover {
+    background: #ea9f0e;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn:hover {
+    background: #4276d1;
+    color: #FFFFFF;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.el-form-item--default {
+    margin-bottom: 20px !important;
+}
+
+.el-form-item--label-left .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #787878;
+    padding: 0 10px 0 0;
+}
+
+.myFormItemLable {
+    padding-top: 22px;
+}
+
+.myFormItemLable .el-form-item__label {
+    font-family: Microsoft YaHei !important;
+    font-weight: 400 !important;
+    font-size: 16px !important;
+    text-align: left !important;
+    color: #787878 !important;
+    padding: 0 10px 0 60px;
+}
+
+.myFormItemLable .el-form-item__content {
+    font-family: Arial !important;
+    font-weight: 400 !important;
+    font-size: 18px !important;
+    text-align: left !important;
+    color: #000000 !important;
+    padding-left: 60px;
+}
+
+.el-form-item--label-left .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #666666;
+}
+
+.el-form-item--label-top .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-textarea__inner {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+}
+
+.el-input__inner {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item__error {
+    font-size: 16px;
+}
+
+.el-radio__inner {
+    width: 16px !important;
+    height: 16px !important;
+}
+
+.el-radio__label {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerEscTask/index.vue b/src/views/safetyReview/examinerEscTask/index.vue
new file mode 100644
index 0000000..b2837ce
--- /dev/null
+++ b/src/views/safetyReview/examinerEscTask/index.vue
@@ -0,0 +1,384 @@
+<template>
+    <div class="app-page-container">
+        <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+        <div class="app-container clearBoth">
+            <el-form :model="queryParams" ref="queryRef" :inline="true" >
+                <el-row class="myRow">
+                    <el-col :span="20">
+                        <el-form-item label="申请日期" prop="userName">
+                            <el-date-picker v-model="rangeTime" type="daterange" range-separator="~" :clearable="false"
+                                style="width: 250px" start-placeholder="开始日期" end-placeholder="结束日期" />
+                        </el-form-item>
+                        <el-form-item label="批准状态" prop="deptId">
+                            <el-select v-model="queryParams.deptId" placeholder="请选择" clearable style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="员工姓名" prop="userName">
+                            <el-input v-model="queryParams.userName" placeholder="请输入员工姓名" clearable
+                                style="width: 160px" @keyup.enter="handleQuery" />
+                        </el-form-item>
+                        <el-form-item style="margin-right: 10px;">
+                            <el-button v-if="!unfoldFlag" type="text" class="foladText" @click="handleFlod">展开
+                                <svg-icon icon-class="unfold" />
+                            </el-button>
+                            <el-button v-else type="text" class="foladText" @click="handleFlod">折叠
+                                <svg-icon icon-class="packUp" />
+                            </el-button>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="4" style="text-align: right;">
+                        <el-button type="primary" class="seachBtn" @click="handleQuery">查询</el-button>
+                        <el-button class="resetBtn" @click="resetQuery">重置</el-button>
+                    </el-col>
+                </el-row>
+                <el-row class="myRow" v-show="unfoldFlag">
+                    <el-col :span="20">
+                        <el-form-item label="部门" prop="qualification">
+                            <el-select v-model="queryParams.qualification" placeholder="请选择部门" clearable
+                                style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="申请标签" prop="qualification">
+                            <el-select v-model="queryParams.qualification" placeholder="请选择" clearable
+                                style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+ 
+            <div class="borderLine"></div>
+            <el-table :data="tableData" height="calc(100% - 126px)" style="width: 100%">
+                <el-table-column label="序号" width="60">
+                    <template #default="scope">
+                        {{ scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="localityName" label="属地" />
+                <el-table-column prop="departmentName" label="部门" />
+                <el-table-column prop="officeName" label="科室" />
+                <el-table-column prop="jobNumber" label="工号" />
+                <el-table-column prop="name" label="员工姓名" />
+                <el-table-column prop="curQualification" label="当前标签" />
+                <el-table-column prop="objectiveQualification" label="申请标签" />
+                <el-table-column prop="status" label="状态" width="120">
+                    <template #default="scope">
+                        <el-text v-if="scope.row.status == 0" type="info" class="infoinfoText">待审核</el-text>
+                        <el-text v-if="scope.row.status == 1" type="success" class="successText">通过</el-text>
+                        <el-text v-if="scope.row.status == 2" type="danger" class="dangerText">驳回</el-text>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" width="150">
+                    <template #default="scope">
+                        <el-button type="primary" text class="replayTextBtn" v-if="scope.row.status != 0"
+                            @click="handleView">查看</el-button>
+                        <el-button type="primary" v-if="scope.row.status == 0" text class="replayTextBtn"
+                            @click="handleApproval">审批</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
+                v-model:limit="queryParams.pageSize" @pagination="getList" />
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import Breadcrumb from '@/components/Breadcrumb' 
+const router = useRouter()
+const total = ref(16)
+const unfoldFlag = ref(false)
+const rangeTime = ref([])
+const queryParams = ref({
+    pageNum: 1,
+    pageSize: 10,
+    userName: undefined,
+    deptId: undefined,
+    qualification: undefined
+})
+const tableData = [
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 1
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 2
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+]
+const handleFlod = () => {
+    unfoldFlag.value = !unfoldFlag.value
+}
+/** 搜索按钮操作 */
+const handleQuery = () => {
+    queryParams.value.pageNum = 1
+    getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+    dateRange.value = []
+    proxy.resetForm("queryRef")
+    queryParams.value.deptId = undefined
+    proxy.$refs.deptTreeRef.setCurrentKey(null)
+    handleQuery()
+}
+const getList = () => {
+
+} 
+const handleView = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+const handleApproval = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+</script>
+<style lang='scss'>
+.app-main {
+    min-height: 100vh !important;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-page-container {
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    padding-bottom: 0px;
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+ 
+.qualificationApplyBtn {
+    // width: 84px !important;
+    height: 32px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.qualificationApplyBtn:hover {
+    background: #4276d1;
+}
+
+.custom-icon {
+    margin-right: 10px;
+}
+
+.infoinfoText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #DD9200;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.replayTextBtn {
+    padding: 0 !important;
+    color: #0090ff !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.verticalLine {
+    border-left: 1px solid #0090ff !important;
+}
+
+.deleteTextBtn {
+    padding: 0 !important;
+    color: #E13434 !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.el-form--inline .el-form-item {
+    display: inline-flex;
+    margin-right: 26px;
+    vertical-align: middle;
+}
+
+.el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+    min-width: 34px;
+}
+
+.el-input__inner {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-date-editor .el-range-input {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: right;
+    color: #000000;
+    width: 46%;
+}
+
+.el-date-editor .el-range__icon svg {
+    width: 18px;
+    height: 16px;
+}
+
+.el-date-editor .el-range__icon {
+    font-size: 16px;
+    // margin-left: 12px;
+    margin-right: 12px;
+}
+
+.el-range-editor.el-input__wrapper {
+    padding: 0 0 0 7px;
+}
+
+.foladText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #0090FF 100%;
+    padding: 10px 0 !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerTasks/addTaskForm.vue b/src/views/safetyReview/examinerTasks/addTaskForm.vue
new file mode 100644
index 0000000..0d51849
--- /dev/null
+++ b/src/views/safetyReview/examinerTasks/addTaskForm.vue
@@ -0,0 +1,483 @@
+<template>
+    <div class="app-page-container">
+        <el-breadcrumb class="app-breadcrumb" separator=">">
+            <transition-group name="breadcrumb">
+                <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
+                    <span v-if="index == levelList.length - 1" class="link-redirect">{{
+                        item.title }}</span>
+                    <span v-else class="no-redirect">{{ item.title }}</span>
+                </el-breadcrumb-item>
+            </transition-group>
+        </el-breadcrumb>
+        <div class="rootContainer clearBoth">
+            <el-card>
+                <template #header>
+                    <div class="card-header">
+                        <span>新增</span>
+                    </div>
+                </template>
+                <el-form ref="ruleFormRef" :model="ruleForm" label-position="left">
+                    <div class="headerTitle">基本信息</div>
+                    <div class="applyFormContainer">
+                        <el-row class="myRow" :gutter="20">
+                            <el-col :span="6">
+                                <el-form-item label="年度" prop="userName">
+                                    <el-date-picker v-model="queryParams.year" type="year" placeholder="请选择" />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="6">
+                                <el-form-item label="部门" prop="deptId">
+                                    <el-select v-model="queryParams.deptId" placeholder="请选择" clearable >
+                                        <el-option label="Zone one" value="shanghai" />
+                                        <el-option label="Zone two" value="beijing" />
+                                    </el-select>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="6">
+                                <el-form-item label="属地" prop="deptId">
+                                    <el-select v-model="queryParams.deptId" placeholder="请选择" clearable >
+                                        <el-option label="Zone one" value="shanghai" />
+                                        <el-option label="Zone two" value="beijing" />
+                                    </el-select>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                            <el-col :span="6">
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+
+                <div class="headerTitle">问题追踪</div>
+                <div class="applyFormContainer">
+                    <el-table :data="approvalData" style="width: 100%; margin-bottom: 20px;">
+                        <el-table-column prop="name" label="资质名称" />
+                        <el-table-column prop="certificate" label="资质证书" align="center">
+                            <template #default="scope">
+                                <el-image v-if="scope.row.certificate"
+                                    style="width: 70px; height: 44px;line-height: 50px;" :src="scope.row.certificate"
+                                    fit="fill" />
+                            </template>
+                        </el-table-column>
+                        <el-table-column prop="expired" label="是否过期">
+                            <template #default="scope">
+                                <el-text v-if="scope.row.expired == false && scope.row.certificate" type="success"
+                                    class="successText">正常</el-text>
+                                <el-text v-if="scope.row.expired == true && scope.row.certificate" type="danger"
+                                    class="dangerText">过期</el-text>
+                            </template>
+                        </el-table-column>
+                        <el-table-column prop="startTime" label="有效开始日期">
+                            <template #default="scope">
+                                <span v-if="scope.row.startTime && scope.row.certificate"> {{ scope.row.startTime
+                                    }}</span>
+                                <span v-else>-</span>
+                            </template>
+                        </el-table-column>
+                        <el-table-column prop="expireTime" label="到期日期">
+                            <template #default="scope">
+                                <span v-if="scope.row.expireTime && scope.row.certificate"> {{ scope.row.expireTime
+                                    }}</span>
+                                <span v-else>-</span>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+
+            </el-card>
+        </div>
+
+        <div class="submitTool">
+            <el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
+            <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
+        </div>
+    </div>
+
+</template>
+<script setup>
+import { reactive } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const levelList = ref([
+    { title: '高压安全审查', path: '/safetyReview' },
+    { title: '审核员任务', path: '/safetyReview/examinerTasks' },
+    { title: '新增', path: '/safetyReview/examinerTasks/addTaskForm' }
+])
+const { proxy } = getCurrentInstance()
+const data = reactive({
+    ruleForm: {},
+    rules: {
+        targetQualification: [{ required: true, message: "目标资质不能为空", trigger: "change" }],
+        employeeNumber: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
+        employeeChineseName: [{ required: true, message: "员工姓名(中文)不能为空", trigger: "blur" }],
+        employeeEnglishName: [{ required: true, message: "员工姓名(英文)", trigger: "blur" }],
+        departmentName: [{ required: true, message: "部门不能为空", trigger: "change" }],
+        officeName: [{ required: true, message: "科室不能为空", trigger: "change" }],
+        localityName: [{ required: true, message: "属地不能为空", trigger: "change" }],
+        localityManager: [{ required: true, message: "属地ESC不能为空", trigger: "blur" }],
+    },
+})
+const tableData = [
+    {
+        name: '提交申请',
+        approvalResult: '-',
+        approvalTime: '2016-05-03'
+    },
+    {
+        name: 'ESC审批',
+        approvalResult: '同意',
+        approvalTime: '2016-05-08'
+    },
+]
+
+const approvalData = [
+    {
+        name: '电工证',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'SH',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ES',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: false,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'ESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'CESC',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: '急救证',
+        certificate: null,
+        expired: null,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+    {
+        name: 'LLP',
+        certificate: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+        expired: true,
+        startTime: '2016-05-03',
+        expireTime: '2019-05-03',
+    },
+]
+const { ruleForm, rules } = toRefs(data)
+const handleCancel = () => {
+    proxy.resetForm("ruleFormRef")
+    router.push({
+        path: '/safetyReview/examinerTasks'
+    })
+}
+const handleSubmit = () => {
+    proxy.$refs["ruleFormRef"].validate(valid => {
+        if (valid) {
+            router.push({
+                path: '/safetyReview/examinerTasks'
+            })
+            //   if (form.value.roleId != undefined) {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     updateRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("修改成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   } else {
+            //     form.value.menuIds = getMenuAllCheckedKeys()
+            //     addRole(form.value).then(response => {
+            //       proxy.$modal.msgSuccess("新增成功")
+            //       open.value = false
+            //       getList()
+            //     })
+            //   }
+        }
+    })
+}
+</script>
+<style lang='scss'>
+.app-main {
+    height: 100vh;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-breadcrumb.el-breadcrumb {
+    width: 1200px;
+    margin: 0 auto;
+    height: 44px;
+    line-height: 44px;
+    font-size: 18px;
+    background: #f8f8f8;
+
+    .el-breadcrumb__item {
+        .el-breadcrumb__separator {
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            font-size: 18px;
+            color: #000000 !important;
+            margin: 0 9px;
+        }
+    }
+
+    .no-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #000000;
+        cursor: text;
+    }
+
+    .link-redirect {
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        font-size: 18px;
+        color: #0090FF;
+        cursor: text;
+        text-decoration: underline;
+        text-underline-offset: 4px;
+    }
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.rootContainer {
+    width: 1200px;
+    margin: 0 auto;
+    height: calc(100vh - 216px);
+    overflow-y: auto;
+    overflow-x: hidden;
+    background: #ffffff;
+}
+
+.el-card {
+    border: none;
+}
+
+.el-card__header {
+    min-height: 50px;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 20px;
+    text-align: left;
+    color: #000000;
+    border-bottom: 1px solid #DCDCDC;
+    box-sizing: border-box;
+    padding: 10px 20px 17px 20px;
+}
+
+.el-card__body {
+    padding: 20px 20px 0 20px !important;
+}
+
+.el-card.is-always-shadow {
+    box-shadow: none;
+}
+
+.headerTitle {
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+    background: #e9e9e9;
+    padding: 6px 14px;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.applyFormContainer {
+    padding-top: 20px;
+    overflow: hidden;
+}
+
+.submitTool {
+    width: 100%;
+    height: 76px;
+    position: absolute;
+    top: calc(100% - 76px);
+    background: #ffffff;
+    box-shadow: 1px 2px 10px 0 #93939333;
+    text-align: center;
+    line-height: 76px;
+}
+
+.cancelApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #ea9f0e;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.cancelApplyBtn:hover {
+    background: #ea9f0e;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 700;
+    font-size: 16px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.submitApplyBtn:hover {
+    background: #4276d1;
+    color: #FFFFFF;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.el-form-item--default {
+    margin-bottom: 20px !important;
+}
+
+.el-form-item--label-left .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #787878;
+    padding: 0 10px 0 0;
+}
+
+.myFormItemLable {
+    padding-top: 22px;
+}
+
+.myFormItemLable .el-form-item__label {
+    font-family: Microsoft YaHei !important;
+    font-weight: 400 !important;
+    font-size: 16px !important;
+    text-align: left !important;
+    color: #787878 !important;
+    padding: 0 10px 0 60px;
+}
+
+.myFormItemLable .el-form-item__content {
+    font-family: Arial !important;
+    font-weight: 400 !important;
+    font-size: 18px !important;
+    text-align: left !important;
+    color: #000000 !important;
+    padding-left: 60px;
+}
+
+.el-form-item--label-left .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #666666;
+}
+
+.el-form-item--label-top .el-form-item__content {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item--label-top .el-textarea__inner {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+}
+
+.el-input__inner {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-form-item__error {
+    font-size: 16px;
+}
+
+.el-radio__inner {
+    width: 16px !important;
+    height: 16px !important;
+}
+
+.el-radio__label {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/safetyReview/examinerTasks/index.vue b/src/views/safetyReview/examinerTasks/index.vue
new file mode 100644
index 0000000..1f4a1a6
--- /dev/null
+++ b/src/views/safetyReview/examinerTasks/index.vue
@@ -0,0 +1,371 @@
+<template>
+    <div class="app-page-container">
+        <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+        <div class="app-container clearBoth">
+            <el-form :model="queryParams" ref="queryRef" :inline="true">
+                <el-row class="myRow">
+                    <el-col :span="20">
+                        <el-form-item label="部门" prop="deptId">
+                            <el-select v-model="queryParams.deptId" placeholder="请选择" clearable style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="属地" prop="deptId">
+                            <el-select v-model="queryParams.deptId" placeholder="请选择" clearable style="width: 160px">
+                                <el-option label="Zone one" value="shanghai" />
+                                <el-option label="Zone two" value="beijing" />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="年度" prop="userName">
+                            <el-date-picker v-model="queryParams.year" type="year" placeholder="请选择"
+                                style="width: 140px" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="4" style="text-align: right;">
+                        <el-button type="primary" class="seachBtn" @click="handleQuery">查询</el-button>
+                        <el-button class="resetBtn" @click="resetQuery">重置</el-button>
+                    </el-col>
+                </el-row>
+            </el-form>
+            <div class="optionBtn">
+                <el-button type="primary" class="qualificationApplyBtn" @click="handleOpenAddForm">
+                    <img :src="exprotIcon" class="custom-icon" />
+                    新增
+                </el-button>
+            </div>
+            <div class="borderLine"></div>
+            <el-table :data="tableData" height="calc(100% - 126px)" style="width: 100%">
+                <el-table-column label="序号" width="60">
+                    <template #default="scope">
+                        {{ scope.$index + 1 }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="year" label="年度" width="100" />
+                <el-table-column prop="localityName" label="属地" min-width="130" />
+                <el-table-column prop="departmentName" label="部门" min-width="150" />
+                <el-table-column prop="jobNumber" label="工号" min-width="130" />
+                <el-table-column prop="name" label="ESC" min-width="100" />
+                <el-table-column prop="curQualification" label="开口项数量" min-width="130" />
+                <el-table-column prop="startTime" label="审查时间" min-width="130">
+                    <template #default="scope">
+                        <span v-if="scope.row.startTime && scope.row.certificate"> {{ scope.row.startTime }}</span>
+                        <span v-else>-</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="expireTime" label="下次审查时间" min-width="150">
+                    <template #default="scope">
+                        <span v-if="scope.row.expireTime && scope.row.certificate"> {{ scope.row.expireTime }}</span>
+                        <span v-else>-</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right" width="130">
+                    <template #default="scope">
+                        <el-button type="primary" text class="replayTextBtn">编辑</el-button>
+                        <el-divider direction="vertical" class="verticalLine" />
+                        <el-button type="primary" text class="deleteTextBtn">删除</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
+                v-model:limit="queryParams.pageSize" @pagination="getList" />
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import Breadcrumb from '@/components/Breadcrumb'
+const router = useRouter()
+const total = ref(16)
+const queryParams = ref({
+    pageNum: 1,
+    pageSize: 10,
+    userName: undefined,
+    deptId: undefined,
+    qualification: undefined
+})
+const tableData = [
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 1
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 2
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+    {
+        localityName: 'XXX属地',
+        departmentName: 'XXX部门',
+        officeName: 'XXX科室',
+        jobNumber: '3523213',
+        name: '赵丽娟',
+        curQualification: '-',
+        objectiveQualification: 'SH',
+        status: 0
+    },
+]
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+    queryParams.value.pageNum = 1
+    getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+    dateRange.value = []
+    proxy.resetForm("queryRef")
+    queryParams.value.deptId = undefined
+    proxy.$refs.deptTreeRef.setCurrentKey(null)
+    handleQuery()
+}
+const getList = () => {
+
+}
+const handleOpenAddForm = () => {
+    router.push('/safetyReview/examinerTasks/addTaskForm')
+}
+const handleView = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+const handleApproval = () => {
+    router.push('/labelManage/adminApproval/approvalDetail')
+}
+</script>
+<style lang='scss'>
+.app-main {
+    min-height: 100vh !important;
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    background-color: #F8F8F8;
+}
+
+.app-page-container {
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    padding-bottom: 0px;
+}
+
+.clearBoth {
+    clear: both;
+}
+
+.myRow {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.optionBtn {
+    padding-bottom: 12px;
+}
+
+.qualificationApplyBtn {
+    // width: 84px !important;
+    height: 32px;
+    border-radius: 4px 4px 4px 4px;
+    background: #4276d1;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: center;
+    color: #FFFFFF;
+}
+
+.qualificationApplyBtn:hover {
+    background: #4276d1;
+}
+
+.custom-icon {
+    margin-right: 10px;
+}
+
+.infoinfoText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #DD9200;
+}
+
+.successText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #00B32A;
+}
+
+.dangerText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #E13434;
+}
+
+.replayTextBtn {
+    padding: 0 !important;
+    color: #0090ff !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.verticalLine {
+    border-left: 1px solid #0090ff !important;
+}
+
+.deleteTextBtn {
+    padding: 0 !important;
+    color: #E13434 !important;
+    font-weight: 400;
+    font-family: Microsoft YaHei;
+    font-size: 18px;
+    line-height: 50px;
+}
+
+.el-form--inline .el-form-item {
+    display: inline-flex;
+    margin-right: 26px;
+    vertical-align: middle;
+}
+
+.el-form-item__label {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    color: #000000;
+    min-width: 34px;
+}
+
+.el-input__inner {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-select__wrapper {
+    font-weight: 400;
+    font-size: 18px;
+    text-align: left;
+    color: #000000;
+}
+
+.el-date-editor .el-range-input {
+    font-family: Arial;
+    font-weight: 400;
+    font-size: 18px;
+    text-align: right;
+    color: #000000;
+    width: 46%;
+}
+
+.el-date-editor .el-range__icon svg {
+    width: 18px;
+    height: 16px;
+}
+
+.el-date-editor .el-range__icon {
+    font-size: 16px;
+    // margin-left: 12px;
+    margin-right: 12px;
+}
+
+.el-range-editor.el-input__wrapper {
+    padding: 0 0 0 7px;
+}
+
+.foladText {
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    font-size: 16px;
+    text-align: left;
+    color: #0090FF 100%;
+    padding: 10px 0 !important;
+}
+</style>
\ No newline at end of file