diff --git a/src/router/index.js b/src/router/index.js
index 8d17874..f2dd714 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -194,6 +194,24 @@ export const privateRoutes = [
           icon: "personnel"
         }
       },
+      {
+        path: "/securityNjgl",
+        name: "securityNjgl",
+        component: () => import("@/views/Training/securityNjgl/index"),
+        meta: {
+          title: "保安员年检管理",
+          icon: "personnel"
+        }
+      },
+      {
+        path: "/securityNjsp",
+        name: "securityNjsp",
+        component: () => import("@/views/Training/securityNjsp/index"),
+        meta: {
+          title: "保安员年检送培",
+          icon: "personnel"
+        }
+      },
     ]
   },
   {
diff --git a/src/views/Training/securityNjgl/components/detailForm.vue b/src/views/Training/securityNjgl/components/detailForm.vue
new file mode 100644
index 0000000..ac592d1
--- /dev/null
+++ b/src/views/Training/securityNjgl/components/detailForm.vue
@@ -0,0 +1,243 @@
+<template>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span>详情</span>
+      <div><el-button size="small" @click="close">关闭</el-button></div>
+    </div>
+    <div class="cntinfo">
+      <!-- 标签 -->
+      <ul class="tag-box">
+        <li class="tag_item">驳回</li>
+        <li class="tag_item">通过</li>
+        <li class="tag_item">待审核</li>
+      </ul>
+      <!-- 内容描述 -->
+      <el-descriptions class="desc" :column="3" border label-width="200px">
+        <el-descriptions-item label="保安公司名称">{{ detail.companyName }}</el-descriptions-item>
+        <el-descriptions-item label="年审年份">{{ detail.reviewYear }}</el-descriptions-item>
+        <el-descriptions-item label="姓名">{{ detail.xm }}</el-descriptions-item>
+
+        <el-descriptions-item label="身份证号码">{{ detail.sfzh }}</el-descriptions-item>
+        <el-descriptions-item label="电话">{{ detail.phone }}</el-descriptions-item>
+        <el-descriptions-item label="性别">{{ detail.sexText }}</el-descriptions-item>
+
+        <el-descriptions-item label="民族">{{ detail.nationText }}</el-descriptions-item>
+        <el-descriptions-item label="籍贯">{{ detail.nativePlace }}</el-descriptions-item>
+        <el-descriptions-item label="文化程度">{{ detail.education }}</el-descriptions-item>
+
+        <el-descriptions-item label="证书编号">{{ detail.certificateNo }}</el-descriptions-item>
+        <el-descriptions-item label="上岗证号码">{{ detail.workCardNo }}</el-descriptions-item>
+        <el-descriptions-item label="服务行业">{{ detail.serviceIndustry }}</el-descriptions-item>
+
+        <el-descriptions-item label="服务行业名称">{{ detail.serviceIndustryName }}</el-descriptions-item>
+        <el-descriptions-item label="入职时间">{{ detail.entryDate }}</el-descriptions-item>
+        <el-descriptions-item label="政治面貌">{{ detail.politicalStatus }}</el-descriptions-item>
+
+        <el-descriptions-item label="无犯罪记录证明">
+          <div class="img-grid one">
+            <el-image
+              v-for="(src, idx) in noCrimeUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="noCrimeUrls"
+              preview-teleported
+              class="img"
+            />
+            <div v-if="noCrimeUrls.length === 0" class="img-placeholder"></div>
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item label="体检报告">
+          <div class="img-grid one">
+            <el-image
+              v-for="(src, idx) in medicalUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="medicalUrls"
+              preview-teleported
+              class="img"
+            />
+            <div v-if="medicalUrls.length === 0" class="img-placeholder"></div>
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item label="身份证正反面">
+          <div class="img-grid two">
+            <el-image
+              v-for="(src, idx) in idCardUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="idCardUrls"
+              preview-teleported
+              class="img"
+            />
+            <template v-if="idCardUrls.length === 0">
+              <div class="img-placeholder"></div>
+              <div class="img-placeholder"></div>
+            </template>
+          </div>
+        </el-descriptions-item>
+
+        <el-descriptions-item label="审核时间">{{ detail.auditTime }}</el-descriptions-item>
+        <el-descriptions-item label="发证机关">{{ detail.issuingAuthority }}</el-descriptions-item>
+        <el-descriptions-item label="发证日期">{{ detail.issueDate }}</el-descriptions-item>
+
+        <el-descriptions-item label="驳回原因" :span="3">{{ detail.rejectReason }}</el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, defineEmits, getCurrentInstance } from 'vue';
+const emit = defineEmits(["refresh"]);
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  dict: {
+    default: [[]], //二维数组
+    type: Array
+  }
+})
+const dialogForm = ref(false);
+const listQuery = ref({});
+
+// 初始化数据
+const init = (type, row,) => {
+  dialogForm.value = true;
+  const raw = row || {};
+  listQuery.value = {
+    ...raw,
+    companyName: raw.companyName || raw.dwmc || raw.gsmc || raw.bagsmc,
+    reviewYear: raw.reviewYear || raw.njnd || raw.njYear || raw.nf || raw.year,
+    phone: raw.phone || raw.lxdh || raw.dh || raw.sjhm || raw.xssbrdh,
+    sexText: raw.sexText || raw.xbText || raw.xb || raw.sex,
+    nationText: raw.nationText || raw.mzText || raw.mz,
+    nativePlace: raw.nativePlace || raw.jg || raw.jgText,
+    education: raw.education || raw.whcd || raw.whcdText,
+    certificateNo: raw.certificateNo || raw.zsbh || raw.zsbhm || raw.zjbh,
+    workCardNo: raw.workCardNo || raw.sgzh || raw.sgzNumber,
+    serviceIndustry: raw.serviceIndustry || raw.fwhy || raw.fwhyText || raw.hy,
+    serviceIndustryName: raw.serviceIndustryName || raw.fwhymc || raw.hyName,
+    entryDate: raw.entryDate || raw.rzsj || raw.rzrq,
+    politicalStatus: raw.politicalStatus || raw.zzmm || raw.zzmmText,
+    auditTime: raw.auditTime || raw.shsj || raw.njsj,
+    rejectReason: raw.rejectReason || raw.bhyy || raw.bhReason || raw.reason,
+    issuingAuthority: raw.issuingAuthority || raw.fzjg,
+    issueDate: raw.issueDate || raw.fzrq,
+    noCrimeProof: raw.noCrimeProof || raw.wffzjlzm || raw.wffzjlzmId,
+    medicalReport: raw.medicalReport || raw.tjbg || raw.tjbgId,
+    idCardImages: raw.idCardImages || raw.sfzzf || raw.sfzImgs || raw.sfzzm,
+  };
+};
+
+const close = () => {
+  dialogForm.value = false;
+  listQuery.value = {};
+};;
+
+const detail = computed(() => listQuery.value || {});
+
+const toIdList = (val, limit) => {
+  const v = val ?? [];
+  const arr = Array.isArray(v) ? v : [v];
+  const ids = arr
+    .map((el) => {
+      if (!el) return null;
+      if (typeof el === 'string' || typeof el === 'number') return String(el);
+      if (typeof el === 'object') return el.id ? String(el.id) : null;
+      return null;
+    })
+    .filter(Boolean);
+  return typeof limit === 'number' ? ids.slice(0, limit) : ids;
+};
+
+const toUrls = (val, limit) => {
+  return toIdList(val, limit).map((id) => `/bagl/mosty-base/minio/image/download/${id}`);
+};
+
+const noCrimeUrls = computed(() => toUrls(detail.value.noCrimeProof, 1));
+const medicalUrls = computed(() => toUrls(detail.value.medicalReport, 1));
+const idCardUrls = computed(() => toUrls(detail.value.idCardImages, 2));
+
+defineExpose({ init })
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+
+.mapBox {
+  width: calc(100% - 24rem);
+  height: 500px;
+  overflow: hidden;
+  margin: 0 12rem;
+}
+.cntinfo{
+  position: relative;
+  padding: 10px 20px;
+  box-sizing: border-box;
+  .tag-box{
+    position: absolute;
+    top: 20px;
+    right: 50px;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    .tag_item{
+      width: 70px;
+      height: 70px;
+      border-radius: 50%;
+      line-height: 65px;
+      text-align: center;
+      font-size: 16px;
+      margin-bottom: 20px;
+    }
+    .tag_item:nth-child(1){
+      border: 5px solid #FA3758;
+      color: #FA3758;
+      background: rgba(250,55,88,0.2);
+    }
+    .tag_item:nth-child(2){
+      color: #28EEBF;
+      background: rgba(40,238,191,0.2);
+      border: 5px solid #28EEBF;
+    }
+    .tag_item:nth-child(3){
+      background: rgba(0,114,255,0.2);
+       color: #0072FF;
+      border: 5px solid #0072FF;
+    }
+  } 
+}
+
+.desc {
+  width: 100%;
+}
+
+.img-grid {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-height: 70px;
+}
+
+.img-grid.one .img,
+.img-grid.one .img-placeholder {
+  width: 64px;
+  height: 64px;
+}
+
+.img-grid.two .img,
+.img-grid.two .img-placeholder {
+  width: 64px;
+  height: 64px;
+}
+
+.img-placeholder {
+  background: #d9d9d9;
+  border-radius: 2px;
+}
+::v-deep .el-descriptions__label.el-descriptions__cell.is-bordered-label{
+  background: #F6FAFF;
+}
+</style>
diff --git a/src/views/Training/securityNjgl/components/shForm.vue b/src/views/Training/securityNjgl/components/shForm.vue
new file mode 100644
index 0000000..1a2ebd4
--- /dev/null
+++ b/src/views/Training/securityNjgl/components/shForm.vue
@@ -0,0 +1,113 @@
+<template>
+  <div>
+    <el-dialog class="steps-dialog" title="审核" v-model="dialogForm" :close-on-click-modal="false" @close="dialogForm = false" width="420px">
+      <el-form :model="formData" ref="formRef" :rules="rules" label-width="120px">
+        <el-form-item label="是否通过" prop="auditStatus">
+          <el-radio-group v-model="formData.auditStatus">
+            <el-radio label="1">通过</el-radio>
+            <el-radio label="0">不通过</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="驳回原因" prop="auditRemark" v-if="formData.auditStatus === '0'">
+          <el-input v-model="formData.auditRemark" type="textarea" placeholder="请输入驳回原因" :autosize="{ minRows: 2, maxRows: 4 }" />
+        </el-form-item>
+        <div class="flex just-center">
+          <el-button @click="dialogForm = false">取消</el-button>
+          <el-button type="primary" @click="submitForm">提交</el-button>
+        </div>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, defineExpose } from 'vue';
+const dialogForm = ref(false);
+const formData = ref({})
+const rules = ref({
+  auditStatus: [{ required: true, message: '请选择是否通过', trigger: 'blur' }],
+  auditRemark: [{ required: true, message: '请输入驳回原因', trigger: 'blur' }],
+})
+const init = (row) => {
+  formData.value = row
+  dialogForm.value = true;
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style scoped lang="scss">
+.steps-body {
+  height: 260px;
+  padding: 6px 10px 10px;
+  box-sizing: border-box;
+}
+
+:deep(.steps-dialog .el-dialog__header) {
+  text-align: center;
+  padding: 20px 20px 10px;
+}
+
+:deep(.steps-dialog .el-dialog__title) {
+  font-size: 24px;
+  font-weight: 700;
+  color: #333;
+}
+
+:deep(.steps-dialog .el-dialog__body) {
+  padding: 0 20px 20px;
+}
+
+:deep(.steps-dialog .el-step__title) {
+  font-size: 18px;
+  font-weight: 600;
+  color: #333;
+  line-height: 22px;
+}
+
+:deep(.steps-dialog .el-step__description) {
+  font-size: 16px;
+  color: #9AA8B6;
+  line-height: 20px;
+  margin-top: 8px;
+}
+
+:deep(.steps-dialog .el-step__line) {
+  left: 8px;
+  background-color: transparent;
+  border-left: 1px dashed #dadada;
+}
+
+:deep(.steps-dialog .el-step.is-vertical .el-step__head) {
+  width: 24px;
+}
+
+:deep(.steps-dialog .el-step__icon) {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+}
+
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon),
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon.is-text) {
+  background: #2e6bff;
+  border: none;
+  box-shadow: 0 0 0 5px rgba(46, 107, 255, 0.15);
+}
+
+:deep(.steps-dialog .el-step.is-wait .el-step__icon),
+:deep(.steps-dialog .el-step.is-finish .el-step__icon) {
+  background: #fff;
+  border: 1px solid #dadada;
+  box-shadow: none;
+}
+
+:deep(.steps-dialog .el-step__icon-inner) {
+  display: none;
+}
+::v-deep .is-finish .el-step__icon{
+  background: #86b6f1;
+}
+</style>
diff --git a/src/views/Training/securityNjgl/components/steps.vue b/src/views/Training/securityNjgl/components/steps.vue
new file mode 100644
index 0000000..da5e4f7
--- /dev/null
+++ b/src/views/Training/securityNjgl/components/steps.vue
@@ -0,0 +1,105 @@
+<template>
+  <div>
+    <el-dialog class="steps-dialog" title="审核流程" v-model="dialogForm" width="420px">
+      <div class="steps-body">
+        <el-steps direction="vertical" :active="active" :space="90">
+          <el-step v-for="(item, idx) in steps" :key="item.title" :title="item.title" :description="idx === 0 ? item.time : ''" />
+        </el-steps>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, defineExpose } from 'vue';
+const dialogForm = ref(false);
+const pxgsData = ref()
+const active = ref(1)
+const steps = ref([
+  { title: '保安公司审核', time: '2026-01-07　21:00' },
+  { title: '培训公司审核', time: '2026-01-07　21:00' },
+  { title: '公安局审核', time: '2026-01-07　21:00' },
+])
+const init = (row) => {
+  pxgsData.value = row
+  dialogForm.value = true;
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style scoped lang="scss">
+.steps-body {
+  height: 260px;
+  padding: 6px 10px 10px;
+  box-sizing: border-box;
+}
+
+:deep(.steps-dialog .el-dialog__header) {
+  text-align: center;
+  padding: 20px 20px 10px;
+}
+
+:deep(.steps-dialog .el-dialog__title) {
+  font-size: 24px;
+  font-weight: 700;
+  color: #333;
+}
+
+:deep(.steps-dialog .el-dialog__body) {
+  padding: 0 20px 20px;
+}
+
+:deep(.steps-dialog .el-step__title) {
+  font-size: 18px;
+  font-weight: 600;
+  color: #333;
+  line-height: 22px;
+}
+
+:deep(.steps-dialog .el-step__description) {
+  font-size: 16px;
+  color: #9AA8B6;
+  line-height: 20px;
+  margin-top: 8px;
+}
+
+:deep(.steps-dialog .el-step__line) {
+  left: 8px;
+  background-color: transparent;
+  border-left: 1px dashed #dadada;
+}
+
+:deep(.steps-dialog .el-step.is-vertical .el-step__head) {
+  width: 24px;
+}
+
+:deep(.steps-dialog .el-step__icon) {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+}
+
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon),
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon.is-text) {
+  background: #2e6bff;
+  border: none;
+  box-shadow: 0 0 0 5px rgba(46, 107, 255, 0.15);
+}
+
+:deep(.steps-dialog .el-step.is-wait .el-step__icon),
+:deep(.steps-dialog .el-step.is-finish .el-step__icon) {
+  background: #fff;
+  border: 1px solid #dadada;
+  box-shadow: none;
+}
+
+:deep(.steps-dialog .el-step__icon-inner) {
+  display: none;
+}
+::v-deep .is-finish .el-step__icon{
+  background: #86b6f1;
+}
+</style>
diff --git a/src/views/Training/securityNjgl/index.vue b/src/views/Training/securityNjgl/index.vue
new file mode 100644
index 0000000..52fb29c
--- /dev/null
+++ b/src/views/Training/securityNjgl/index.vue
@@ -0,0 +1,266 @@
+<template>
+  <div>
+    <div class="titleBox">
+      <PageTitle title="保安员年检管理" />
+    </div>
+    <!-- 搜索 -->
+    <div ref="searchBox">
+      <Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
+    </div>
+    <!-- 表格 -->
+    <div class="tabBox">
+      <div style="margin-bottom: 12px;">
+        <el-button type="primary" @click="onBatchAudit">批量审核</el-button>
+      </div>
+      <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
+        @chooseData="chooseData">
+        <template #auditStatus="{ row }">
+          <el-tag v-if="String(row.auditStatus || '').includes('驳回')" type="danger">{{ row.auditStatus }}</el-tag>
+          <el-tag v-else-if="String(row.auditStatus || '').includes('待')" type="warning">{{ row.auditStatus }}</el-tag>
+          <el-tag v-else-if="String(row.auditStatus || '').includes('通过')" type="success">{{ row.auditStatus }}</el-tag>
+          <span v-else>{{ row.auditStatus }}</span>
+        </template>
+        <template #sendStatus="{ row }">
+          <el-tag v-if="String(row.sendStatus || '').includes('未')" type="info">{{ row.sendStatus }}</el-tag>
+          <el-tag v-else-if="String(row.sendStatus || '').includes('已')" type="success">{{ row.sendStatus }}</el-tag>
+          <span v-else>{{ row.sendStatus }}</span>
+        </template>
+        <!-- 操作 -->
+        <template #controls="{ row }">
+            <el-link type="primary" link @click="addEdit('shForm', row)">立即审核</el-link>
+          <el-link type="primary" link @click="addEdit('RefSteap', row)">审核流程</el-link>
+          <el-link type="primary" link @click="addEdit('sp', row)">送培</el-link>
+          <el-link type="primary" link @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </div>
+    <!-- 详情 -->
+    <DetailForm ref="detailDiloag" :dict="{D_BZ_SF}"/>
+    <!-- 审核流程 -->
+    <Steps ref="RefSteap" ></Steps>
+    <!-- 审核 -->
+    <ShForm ref="shForm" />
+  </div>
+</template>
+
+<script setup>
+import PageTitle from "@/components/aboutTable/PageTitle.vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import Search from "@/components/aboutTable/Search.vue";
+import DetailForm from "./components/detailForm.vue";
+import Steps from "./components/steps.vue";
+import ShForm from "./components/shForm.vue";
+import {getItem} from '@/utils/storage.js'
+import { cyryPage,njryPage} from "@/api/pxzx.js";
+import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
+import { ElMessage } from "element-plus";
+const { proxy } = getCurrentInstance();
+const { D_BZ_SF ,D_BAXX_DWLX} = proxy.$dict("D_BZ_SF","D_BAXX_DWLX");
+const detailDiloag = ref();
+const RefSteap = ref();
+const shForm = ref();
+const searchBox = ref(); //搜索框
+const selectedRows = ref([]);
+const searchConfiger = ref([
+  {
+    label: "姓名",
+    prop: "xm",
+    showType: "input"
+  },
+  {
+    label: "身份证号码",
+    prop: "sfzh",
+    showType: "input"
+  },
+  {
+    label: "电话",
+    prop: "lxdh",
+    showType: "input"
+  },
+  {
+    label: "审核状态",
+    prop: "shzt",
+    showType: "select",
+    placeholder: "不限",
+    clearable: true,
+    defaultVal: "",
+    options: [
+      { label: "驳回", value: "驳回" },
+      { label: "待审核", value: "待审核" },
+      { label: "通过", value: "通过" }
+    ]
+  },
+  {
+    label: "送培状态",
+    prop: "spzt",
+    showType: "select",
+    placeholder: "不限",
+    clearable: true,
+    defaultVal: "",
+    options: [
+      { label: "未送培", value: "未送培" },
+      { label: "已送培", value: "已送培" }
+    ]
+  }
+]);
+const idEntityCard=getItem('idEntityCard')
+const queryFrom = ref({});
+const pageData = reactive({
+  tableData: [
+    {
+        companyName: "保安公司名称",
+        reviewYear: "年审年份",
+        xm: "姓名",
+        sfzh: "身份证号码",
+        phone: "电话",
+        education: "文化程度",
+        certificateNo: "证书编号",
+        serviceIndustry: "服务行业",
+        entryDate: "入职时间",
+        workCardNo: "上岗证号码",
+        auditStatus: "审核状态",
+        auditTime: "审核时间",
+        sendStatus: "送培状态"
+    }
+  ],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "checkBox",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  controlsWidth: 280,
+  tableColumn: [
+    { label: "保安公司名称", prop: "companyName", width: 160, showOverflowTooltip: true },
+    { label: "年审年份", prop: "reviewYear", width: 100 },
+    { label: "姓名", prop: "xm", width: 100 },
+    { label: "身份证号码", prop: "sfzh", width: 170, showOverflowTooltip: true },
+    { label: "电话", prop: "phone", width: 120 },
+    { label: "文化程度", prop: "education", width: 110 },
+    { label: "证书编号", prop: "certificateNo", width: 140, showOverflowTooltip: true },
+    { label: "服务行业", prop: "serviceIndustry", width: 110 },
+    { label: "入职时间", prop: "entryDate", width: 120 },
+    { label: "上岗证号码", prop: "workCardNo", width: 140, showOverflowTooltip: true },
+    { label: "审核状态", prop: "auditStatus", width: 100, showSolt: true },
+    { label: "审核时间", prop: "auditTime", width: 140 },
+    { label: "送培状态", prop: "sendStatus", width: 100, showSolt: true }
+  ]
+});
+onMounted(() => {
+//   getInfo();
+  tabHeightFn();
+});
+// 搜索
+const onSearch = (val) => {
+  queryFrom.value = { ...val };
+  pageData.pageConfiger.pageCurrent = 1;
+  getList();
+};
+const gsId=ref('')
+const changeNo = (val) => {
+  pageData.pageConfiger.pageNum = val;
+  getList();
+};
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val;
+  getList();
+};
+const getInfo = () => {
+  let promes = { sfzh: idEntityCard }
+  cyryPage(promes).then(res => {
+    const data = res.records[0] || {};
+    if (data) {
+    gsId.value=data.code
+   }
+    getList()
+  }).finally(() => {
+    pageData.tableConfiger.loading = false;
+  })
+}
+// 获取列表
+const getList = () => {
+  pageData.tableConfiger.loading = true;
+  const promes = {
+    ...pageData.pageConfiger,
+    ...queryFrom.value,
+    dwbm: gsId.value
+  }
+  njryPage(promes).then((res) => {
+    pageData.tableData = (res.records || []).map((item) => {
+      return {
+        ...item,
+        companyName: item.companyName || item.dwmc || item.gsmc || item.dwmcName || item.bagsmc,
+        reviewYear: item.reviewYear || item.njnd || item.njYear || item.nf || item.year,
+        phone: item.phone || item.lxdh || item.dh || item.sjhm || item.xssbrdh,
+        education: item.education || item.whcd || item.whcdText,
+        certificateNo: item.certificateNo || item.zsbh || item.zsbhm || item.zjbh,
+        serviceIndustry: item.serviceIndustry || item.fwhy || item.fwhyText || item.hy,
+        entryDate: item.entryDate || item.rzsj || item.rzrq,
+        workCardNo: item.workCardNo || item.sgzh || item.sgzNumber,
+        auditStatus: item.auditStatus || item.shztText || item.shzt,
+        auditTime: item.auditTime || item.shsj || item.njsj,
+        sendStatus: item.sendStatus || item.spztText || item.spzt || (item.RefSteap ? "已送培" : "未送培")
+      };
+    });
+    pageData.total = res.total;
+  }).catch((err) => {
+    console.log(err);
+
+  }).finally(() => {
+    pageData.tableConfiger.loading = false;
+  });
+};
+
+const chooseData = (rows) => {
+  selectedRows.value = Array.isArray(rows) ? rows : [];
+};
+
+const onBatchAudit = () => {
+  if (!selectedRows.value.length) {
+    ElMessage.warning("请选择需要审核的数据");
+    return;
+  }
+  ElMessage.success("已选择 " + selectedRows.value.length + " 条");
+};
+
+
+// 详情
+const addEdit = (type, row) => {
+  nextTick(() => {
+    if(type == 'RefSteap'){
+      RefSteap.value.init(row);
+    }else if(type == 'shForm'){
+      shForm.value.init(row);
+    }
+    else{
+      detailDiloag.value.init(type, row);
+    }
+  })
+};
+
+
+// 表格高度计算
+const tabHeightFn = () => {
+  pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
+  window.onresize = function () {
+    tabHeightFn();
+  };
+};
+</script>
+
+<style>
+.el-loading-mask {
+  background: rgba(0, 0, 0, 0.5) !important;
+}
+</style>
diff --git a/src/views/Training/securityNjsp/components/detailForm.vue b/src/views/Training/securityNjsp/components/detailForm.vue
new file mode 100644
index 0000000..ac592d1
--- /dev/null
+++ b/src/views/Training/securityNjsp/components/detailForm.vue
@@ -0,0 +1,243 @@
+<template>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span>详情</span>
+      <div><el-button size="small" @click="close">关闭</el-button></div>
+    </div>
+    <div class="cntinfo">
+      <!-- 标签 -->
+      <ul class="tag-box">
+        <li class="tag_item">驳回</li>
+        <li class="tag_item">通过</li>
+        <li class="tag_item">待审核</li>
+      </ul>
+      <!-- 内容描述 -->
+      <el-descriptions class="desc" :column="3" border label-width="200px">
+        <el-descriptions-item label="保安公司名称">{{ detail.companyName }}</el-descriptions-item>
+        <el-descriptions-item label="年审年份">{{ detail.reviewYear }}</el-descriptions-item>
+        <el-descriptions-item label="姓名">{{ detail.xm }}</el-descriptions-item>
+
+        <el-descriptions-item label="身份证号码">{{ detail.sfzh }}</el-descriptions-item>
+        <el-descriptions-item label="电话">{{ detail.phone }}</el-descriptions-item>
+        <el-descriptions-item label="性别">{{ detail.sexText }}</el-descriptions-item>
+
+        <el-descriptions-item label="民族">{{ detail.nationText }}</el-descriptions-item>
+        <el-descriptions-item label="籍贯">{{ detail.nativePlace }}</el-descriptions-item>
+        <el-descriptions-item label="文化程度">{{ detail.education }}</el-descriptions-item>
+
+        <el-descriptions-item label="证书编号">{{ detail.certificateNo }}</el-descriptions-item>
+        <el-descriptions-item label="上岗证号码">{{ detail.workCardNo }}</el-descriptions-item>
+        <el-descriptions-item label="服务行业">{{ detail.serviceIndustry }}</el-descriptions-item>
+
+        <el-descriptions-item label="服务行业名称">{{ detail.serviceIndustryName }}</el-descriptions-item>
+        <el-descriptions-item label="入职时间">{{ detail.entryDate }}</el-descriptions-item>
+        <el-descriptions-item label="政治面貌">{{ detail.politicalStatus }}</el-descriptions-item>
+
+        <el-descriptions-item label="无犯罪记录证明">
+          <div class="img-grid one">
+            <el-image
+              v-for="(src, idx) in noCrimeUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="noCrimeUrls"
+              preview-teleported
+              class="img"
+            />
+            <div v-if="noCrimeUrls.length === 0" class="img-placeholder"></div>
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item label="体检报告">
+          <div class="img-grid one">
+            <el-image
+              v-for="(src, idx) in medicalUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="medicalUrls"
+              preview-teleported
+              class="img"
+            />
+            <div v-if="medicalUrls.length === 0" class="img-placeholder"></div>
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item label="身份证正反面">
+          <div class="img-grid two">
+            <el-image
+              v-for="(src, idx) in idCardUrls"
+              :key="idx"
+              :src="src"
+              fit="cover"
+              :preview-src-list="idCardUrls"
+              preview-teleported
+              class="img"
+            />
+            <template v-if="idCardUrls.length === 0">
+              <div class="img-placeholder"></div>
+              <div class="img-placeholder"></div>
+            </template>
+          </div>
+        </el-descriptions-item>
+
+        <el-descriptions-item label="审核时间">{{ detail.auditTime }}</el-descriptions-item>
+        <el-descriptions-item label="发证机关">{{ detail.issuingAuthority }}</el-descriptions-item>
+        <el-descriptions-item label="发证日期">{{ detail.issueDate }}</el-descriptions-item>
+
+        <el-descriptions-item label="驳回原因" :span="3">{{ detail.rejectReason }}</el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, defineEmits, getCurrentInstance } from 'vue';
+const emit = defineEmits(["refresh"]);
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  dict: {
+    default: [[]], //二维数组
+    type: Array
+  }
+})
+const dialogForm = ref(false);
+const listQuery = ref({});
+
+// 初始化数据
+const init = (type, row,) => {
+  dialogForm.value = true;
+  const raw = row || {};
+  listQuery.value = {
+    ...raw,
+    companyName: raw.companyName || raw.dwmc || raw.gsmc || raw.bagsmc,
+    reviewYear: raw.reviewYear || raw.njnd || raw.njYear || raw.nf || raw.year,
+    phone: raw.phone || raw.lxdh || raw.dh || raw.sjhm || raw.xssbrdh,
+    sexText: raw.sexText || raw.xbText || raw.xb || raw.sex,
+    nationText: raw.nationText || raw.mzText || raw.mz,
+    nativePlace: raw.nativePlace || raw.jg || raw.jgText,
+    education: raw.education || raw.whcd || raw.whcdText,
+    certificateNo: raw.certificateNo || raw.zsbh || raw.zsbhm || raw.zjbh,
+    workCardNo: raw.workCardNo || raw.sgzh || raw.sgzNumber,
+    serviceIndustry: raw.serviceIndustry || raw.fwhy || raw.fwhyText || raw.hy,
+    serviceIndustryName: raw.serviceIndustryName || raw.fwhymc || raw.hyName,
+    entryDate: raw.entryDate || raw.rzsj || raw.rzrq,
+    politicalStatus: raw.politicalStatus || raw.zzmm || raw.zzmmText,
+    auditTime: raw.auditTime || raw.shsj || raw.njsj,
+    rejectReason: raw.rejectReason || raw.bhyy || raw.bhReason || raw.reason,
+    issuingAuthority: raw.issuingAuthority || raw.fzjg,
+    issueDate: raw.issueDate || raw.fzrq,
+    noCrimeProof: raw.noCrimeProof || raw.wffzjlzm || raw.wffzjlzmId,
+    medicalReport: raw.medicalReport || raw.tjbg || raw.tjbgId,
+    idCardImages: raw.idCardImages || raw.sfzzf || raw.sfzImgs || raw.sfzzm,
+  };
+};
+
+const close = () => {
+  dialogForm.value = false;
+  listQuery.value = {};
+};;
+
+const detail = computed(() => listQuery.value || {});
+
+const toIdList = (val, limit) => {
+  const v = val ?? [];
+  const arr = Array.isArray(v) ? v : [v];
+  const ids = arr
+    .map((el) => {
+      if (!el) return null;
+      if (typeof el === 'string' || typeof el === 'number') return String(el);
+      if (typeof el === 'object') return el.id ? String(el.id) : null;
+      return null;
+    })
+    .filter(Boolean);
+  return typeof limit === 'number' ? ids.slice(0, limit) : ids;
+};
+
+const toUrls = (val, limit) => {
+  return toIdList(val, limit).map((id) => `/bagl/mosty-base/minio/image/download/${id}`);
+};
+
+const noCrimeUrls = computed(() => toUrls(detail.value.noCrimeProof, 1));
+const medicalUrls = computed(() => toUrls(detail.value.medicalReport, 1));
+const idCardUrls = computed(() => toUrls(detail.value.idCardImages, 2));
+
+defineExpose({ init })
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+
+.mapBox {
+  width: calc(100% - 24rem);
+  height: 500px;
+  overflow: hidden;
+  margin: 0 12rem;
+}
+.cntinfo{
+  position: relative;
+  padding: 10px 20px;
+  box-sizing: border-box;
+  .tag-box{
+    position: absolute;
+    top: 20px;
+    right: 50px;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    .tag_item{
+      width: 70px;
+      height: 70px;
+      border-radius: 50%;
+      line-height: 65px;
+      text-align: center;
+      font-size: 16px;
+      margin-bottom: 20px;
+    }
+    .tag_item:nth-child(1){
+      border: 5px solid #FA3758;
+      color: #FA3758;
+      background: rgba(250,55,88,0.2);
+    }
+    .tag_item:nth-child(2){
+      color: #28EEBF;
+      background: rgba(40,238,191,0.2);
+      border: 5px solid #28EEBF;
+    }
+    .tag_item:nth-child(3){
+      background: rgba(0,114,255,0.2);
+       color: #0072FF;
+      border: 5px solid #0072FF;
+    }
+  } 
+}
+
+.desc {
+  width: 100%;
+}
+
+.img-grid {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-height: 70px;
+}
+
+.img-grid.one .img,
+.img-grid.one .img-placeholder {
+  width: 64px;
+  height: 64px;
+}
+
+.img-grid.two .img,
+.img-grid.two .img-placeholder {
+  width: 64px;
+  height: 64px;
+}
+
+.img-placeholder {
+  background: #d9d9d9;
+  border-radius: 2px;
+}
+::v-deep .el-descriptions__label.el-descriptions__cell.is-bordered-label{
+  background: #F6FAFF;
+}
+</style>
diff --git a/src/views/Training/securityNjsp/components/steps.vue b/src/views/Training/securityNjsp/components/steps.vue
new file mode 100644
index 0000000..da5e4f7
--- /dev/null
+++ b/src/views/Training/securityNjsp/components/steps.vue
@@ -0,0 +1,105 @@
+<template>
+  <div>
+    <el-dialog class="steps-dialog" title="审核流程" v-model="dialogForm" width="420px">
+      <div class="steps-body">
+        <el-steps direction="vertical" :active="active" :space="90">
+          <el-step v-for="(item, idx) in steps" :key="item.title" :title="item.title" :description="idx === 0 ? item.time : ''" />
+        </el-steps>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, defineExpose } from 'vue';
+const dialogForm = ref(false);
+const pxgsData = ref()
+const active = ref(1)
+const steps = ref([
+  { title: '保安公司审核', time: '2026-01-07　21:00' },
+  { title: '培训公司审核', time: '2026-01-07　21:00' },
+  { title: '公安局审核', time: '2026-01-07　21:00' },
+])
+const init = (row) => {
+  pxgsData.value = row
+  dialogForm.value = true;
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style scoped lang="scss">
+.steps-body {
+  height: 260px;
+  padding: 6px 10px 10px;
+  box-sizing: border-box;
+}
+
+:deep(.steps-dialog .el-dialog__header) {
+  text-align: center;
+  padding: 20px 20px 10px;
+}
+
+:deep(.steps-dialog .el-dialog__title) {
+  font-size: 24px;
+  font-weight: 700;
+  color: #333;
+}
+
+:deep(.steps-dialog .el-dialog__body) {
+  padding: 0 20px 20px;
+}
+
+:deep(.steps-dialog .el-step__title) {
+  font-size: 18px;
+  font-weight: 600;
+  color: #333;
+  line-height: 22px;
+}
+
+:deep(.steps-dialog .el-step__description) {
+  font-size: 16px;
+  color: #9AA8B6;
+  line-height: 20px;
+  margin-top: 8px;
+}
+
+:deep(.steps-dialog .el-step__line) {
+  left: 8px;
+  background-color: transparent;
+  border-left: 1px dashed #dadada;
+}
+
+:deep(.steps-dialog .el-step.is-vertical .el-step__head) {
+  width: 24px;
+}
+
+:deep(.steps-dialog .el-step__icon) {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+}
+
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon),
+:deep(.steps-dialog .el-step__head.is-process .el-step__icon.is-text) {
+  background: #2e6bff;
+  border: none;
+  box-shadow: 0 0 0 5px rgba(46, 107, 255, 0.15);
+}
+
+:deep(.steps-dialog .el-step.is-wait .el-step__icon),
+:deep(.steps-dialog .el-step.is-finish .el-step__icon) {
+  background: #fff;
+  border: 1px solid #dadada;
+  box-shadow: none;
+}
+
+:deep(.steps-dialog .el-step__icon-inner) {
+  display: none;
+}
+::v-deep .is-finish .el-step__icon{
+  background: #86b6f1;
+}
+</style>
diff --git a/src/views/Training/securityNjsp/index.vue b/src/views/Training/securityNjsp/index.vue
new file mode 100644
index 0000000..6323447
--- /dev/null
+++ b/src/views/Training/securityNjsp/index.vue
@@ -0,0 +1,237 @@
+<template>
+  <div>
+    <div class="titleBox">
+      <PageTitle title="保安员年检送培">
+        <el-button type="primary" @click="onBatchAudit">新增</el-button>
+      </PageTitle>
+    </div>
+    <!-- 搜索 -->
+    <div ref="searchBox">
+      <Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
+    </div>
+    <!-- 表格 -->
+    <div class="tabBox">
+      <div style="margin-bottom: 12px;">
+        <el-button type="primary" @click="onBatchAudit">批量审核</el-button>
+      </div>
+      <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
+        @chooseData="chooseData">
+        <template #auditStatus="{ row }">
+          <el-tag v-if="String(row.auditStatus || '').includes('驳回')" type="danger">{{ row.auditStatus }}</el-tag>
+          <el-tag v-else-if="String(row.auditStatus || '').includes('待')" type="warning">{{ row.auditStatus }}</el-tag>
+          <el-tag v-else-if="String(row.auditStatus || '').includes('通过')" type="success">{{ row.auditStatus }}</el-tag>
+          <span v-else>{{ row.auditStatus }}</span>
+        </template>
+        <template #sendStatus="{ row }">
+          <el-tag v-if="String(row.sendStatus || '').includes('未')" type="info">{{ row.sendStatus }}</el-tag>
+          <el-tag v-else-if="String(row.sendStatus || '').includes('已')" type="success">{{ row.sendStatus }}</el-tag>
+          <span v-else>{{ row.sendStatus }}</span>
+        </template>
+        <!-- 操作 -->
+        <template #controls="{ row }">
+          <el-link type="primary" link @click="addEdit('RefSteap', row)">审核流程</el-link>
+          <el-link type="primary" link @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </div>
+    <!-- 详情 -->
+    <DetailForm ref="detailDiloag" :dict="{D_BZ_SF}"/>
+    <!-- 审核流程 -->
+    <Steps ref="RefSteap" ></Steps>
+  </div>
+</template>
+
+<script setup>
+import PageTitle from "@/components/aboutTable/PageTitle.vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import Search from "@/components/aboutTable/Search.vue";
+import DetailForm from "./components/detailForm.vue";
+import Steps from "./components/steps.vue";
+import {getItem} from '@/utils/storage.js'
+import { cyryPage,njryPage} from "@/api/pxzx.js";
+import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
+import { ElMessage } from "element-plus";
+const { proxy } = getCurrentInstance();
+const { D_BZ_SF ,D_BAXX_DWLX} = proxy.$dict("D_BZ_SF","D_BAXX_DWLX");
+const detailDiloag = ref();
+const RefSteap = ref();
+const shForm = ref();
+const searchBox = ref(); //搜索框
+const selectedRows = ref([]);
+const searchConfiger = ref([
+  {
+    label: "姓名",
+    prop: "xm",
+    showType: "input"
+  },
+  {
+    label: "身份证号码",
+    prop: "sfzh",
+    showType: "input"
+  },
+  {
+    label: "电话",
+    prop: "lxdh",
+    showType: "input"
+  },
+]);
+const idEntityCard=getItem('idEntityCard')
+const queryFrom = ref({});
+const pageData = reactive({
+  tableData: [
+    {
+        companyName: "保安公司名称",
+        reviewYear: "年审年份",
+        xm: "姓名",
+        sfzh: "身份证号码",
+        phone: "电话",
+        education: "文化程度",
+        certificateNo: "证书编号",
+        serviceIndustry: "服务行业",
+        entryDate: "入职时间",
+        workCardNo: "上岗证号码",
+        auditStatus: "审核状态",
+        auditTime: "审核时间",
+        sendStatus: "送培状态"
+    }
+  ],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "checkBox",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  controlsWidth: 180,
+  tableColumn: [
+    { label: "保安公司名称", prop: "companyName",showOverflowTooltip: true },
+    { label: "培训公司", prop: "pxgs", showOverflowTooltip: true },
+    { label: "年审年份", prop: "reviewYear"},
+    { label: "姓名", prop: "xm" },
+    { label: "身份证号码", prop: "sfzh",showOverflowTooltip: true },
+    { label: "电话", prop: "phone" },
+    { label: "文化程度", prop: "education" },
+    { label: "证书编号", prop: "certificateNo", showOverflowTooltip: true },
+    { label: "服务行业", prop: "serviceIndustry" },
+    { label: "入职时间", prop: "entryDate" },
+    { label: "上岗证号码", prop: "workCardNo", showOverflowTooltip: true },
+    { label: "送培状态", prop: "sendStatus", showSolt: true }
+  ]
+});
+onMounted(() => {
+//   getInfo();
+  tabHeightFn();
+});
+// 搜索
+const onSearch = (val) => {
+  queryFrom.value = { ...val };
+  pageData.pageConfiger.pageCurrent = 1;
+  getList();
+};
+const gsId=ref('')
+const changeNo = (val) => {
+  pageData.pageConfiger.pageNum = val;
+  getList();
+};
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val;
+  getList();
+};
+const getInfo = () => {
+  let promes = { sfzh: idEntityCard }
+  cyryPage(promes).then(res => {
+    const data = res.records[0] || {};
+    if (data) {
+    gsId.value=data.code
+   }
+    getList()
+  }).finally(() => {
+    pageData.tableConfiger.loading = false;
+  })
+}
+// 获取列表
+const getList = () => {
+  pageData.tableConfiger.loading = true;
+  const promes = {
+    ...pageData.pageConfiger,
+    ...queryFrom.value,
+    dwbm: gsId.value
+  }
+  njryPage(promes).then((res) => {
+    pageData.tableData = (res.records || []).map((item) => {
+      return {
+        ...item,
+        companyName: item.companyName || item.dwmc || item.gsmc || item.dwmcName || item.bagsmc,
+        reviewYear: item.reviewYear || item.njnd || item.njYear || item.nf || item.year,
+        phone: item.phone || item.lxdh || item.dh || item.sjhm || item.xssbrdh,
+        education: item.education || item.whcd || item.whcdText,
+        certificateNo: item.certificateNo || item.zsbh || item.zsbhm || item.zjbh,
+        serviceIndustry: item.serviceIndustry || item.fwhy || item.fwhyText || item.hy,
+        entryDate: item.entryDate || item.rzsj || item.rzrq,
+        workCardNo: item.workCardNo || item.sgzh || item.sgzNumber,
+        auditStatus: item.auditStatus || item.shztText || item.shzt,
+        auditTime: item.auditTime || item.shsj || item.njsj,
+        sendStatus: item.sendStatus || item.spztText || item.spzt || (item.RefSteap ? "已送培" : "未送培")
+      };
+    });
+    pageData.total = res.total;
+  }).catch((err) => {
+    console.log(err);
+
+  }).finally(() => {
+    pageData.tableConfiger.loading = false;
+  });
+};
+
+const chooseData = (rows) => {
+  selectedRows.value = Array.isArray(rows) ? rows : [];
+};
+
+const onBatchAudit = () => {
+  if (!selectedRows.value.length) {
+    ElMessage.warning("请选择需要审核的数据");
+    return;
+  }
+  ElMessage.success("已选择 " + selectedRows.value.length + " 条");
+};
+
+
+// 详情
+const addEdit = (type, row) => {
+  nextTick(() => {
+    if(type == 'RefSteap'){
+      RefSteap.value.init(row);
+    }else if(type == 'shForm'){
+      shForm.value.init(row);
+    }
+    else{
+      detailDiloag.value.init(type, row);
+    }
+  })
+};
+
+
+// 表格高度计算
+const tabHeightFn = () => {
+  pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
+  window.onresize = function () {
+    tabHeightFn();
+  };
+};
+</script>
+
+<style>
+.el-loading-mask {
+  background: rgba(0, 0, 0, 0.5) !important;
+}
+</style>