From 2a0e9a7cabaf1ab350fcbe6340380c05efabaf86 Mon Sep 17 00:00:00 2001
From: Esacpe <1113279529@qq.com>
Date: Mon, 22 Sep 2025 18:09:44 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../trainingProject/components/addPxxm.vue    | 187 ++++++++++++++++++
 .../trainingProject/index.vue                 |  11 +-
 2 files changed, 195 insertions(+), 3 deletions(-)
 create mode 100644 src/views/securityManagement/trainingManagement/trainingProject/components/addPxxm.vue

diff --git a/src/views/securityManagement/trainingManagement/trainingProject/components/addPxxm.vue b/src/views/securityManagement/trainingManagement/trainingProject/components/addPxxm.vue
new file mode 100644
index 0000000..bf2abf5
--- /dev/null
+++ b/src/views/securityManagement/trainingManagement/trainingProject/components/addPxxm.vue
@@ -0,0 +1,187 @@
+<template>
+    <div class="dialog" v-if="showDialog">
+        <div class="head_box">
+            <span class="title">保安培训项目新增</span>
+            <div>
+                <el-button size="small" @click="save" type="primary"  :loading="loading">保存</el-button>
+                <el-button size="small" @click="close">关闭</el-button>
+            </div>
+        </div>
+
+        <div class="cntBox">
+            <el-form :model="formData" ref="FormRef" label-width="120px">
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="培训项目名称" prop="pxxm" style="width: 100%;">
+                            <el-input v-model="formData.pxxm" placeholder="请输入培训项目名称" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="培训地址" prop="pxdz" style="width: 100%;">
+                            <el-input v-model="formData.pxdz" placeholder="请输入培训地址" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="详细地址" prop="xxdz" style="width: 100%;">
+                            <el-input v-model="formData.xxdz" placeholder="请输入详细地址" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="培训开始时间" prop="pxksrq" style="width: 100%;">
+                            <el-date-picker v-model="formData.pxksrq" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请输入培训开始时间" style="width: 100%;" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="培训结束时间" prop="pxjsrq" style="width: 100%;">
+                            <el-date-picker v-model="formData.pxjsrq" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请输入培训结束时间" style="width: 100%;" />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-divider />
+                <!-- 人员 -->
+                <el-row class="peoRow" v-for="(item, index) in formData.courceList" :key="index">
+                    <el-col :span="12">
+                        <el-form-item label="培训日期" prop="pxrq" style="width: 100%;">
+                            <el-date-picker v-model="item.pxrq" type="date" value-format="YYYY-MM-DD" placeholder="请输入培训日期" style="width: 100%;" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="培训时间" prop="pxsj" style="width: 100%;">
+                            <el-time-picker v-model="item.pxsj" value-format="HH:mm:ss" placeholder="请输入培训时间" style="width: 100%;"  is-range range-separator="To"    start-placeholder="开始时间" end-placeholder="结束时间"/>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="课程名称" prop="pxkcxm" style="width: 100%;">
+                            <el-input v-model="item.pxkcxm" placeholder="请输入课程名称" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="组织单位" prop="pxzcdw" style="width: 100%;">
+                            <el-input v-model="item.pxzcdw" placeholder="请输入组织单位" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="授课教员" prop="pxfcy" style="width: 100%;">
+                            <el-input v-model="item.pxfcy" placeholder="请输入授课教员" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="培训内容" prop="pxnc" style="width: 100%;">
+                            <el-input v-model="item.pxnc" placeholder="请输入培训内容" style="width: 100%;"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <span class="deleteIncon" @click.stop="delItem(item,index)">
+                        <el-icon color="red" size="25px"><Delete /></el-icon>
+                    </span>
+                </el-row>
+                <div class="flex just-center mb20 mt10">
+                    <el-button type="primary" @click="addItem">新增课程</el-button>
+                </div>
+            </el-form>
+            <div class="table-title">培训保安人员 <el-icon size="20px" style="top: 4px;" color="green"><CirclePlusFilled /></el-icon> </div>
+            <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+                <!-- 操作 -->
+                <template #controls="{ row }">
+                <el-link type="warning" @click="addEdit('updata', row)">删除</el-link>
+                </template>
+            </MyTable>
+
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { qcckPost } from "@/api/qcckApi.js";
+import MyTable from '@/components/aboutTable/MyTable.vue';
+import { ref, computed, reactive, getCurrentInstance } from 'vue'
+const showDialog = ref(false)
+const formData = ref({
+    courceList: [{
+        pxkcxm: '', //课程名称
+        pxzcdw: '', //组织单位
+        pxfcy: '', //授课教员
+        pxnc: '', //培训内容
+    }] //课程
+})
+const pageData = reactive({
+  tableData: [{xm: '张三', sfzh: '123456789012345678', lxdh: '13800000000'}],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 10,
+    pageCurrent: 1
+  },
+  controlsWidth: 180,
+  tableColumn: [
+    { label: "姓名", prop: "xm" },
+    { label: "证件号码", prop: "sfzh" },
+    { label: "联系号码", prop: "lxdh" },
+    { label: "线上培训时长", prop: "sfzh" },
+    { label: "所属单位", prop: "lxdh" },
+  ]
+});
+
+const addItem = () => {
+    formData.value.courceList.push({
+        pxkcxm: '', //课程名称
+        pxzcdw: '', //组织单位
+        pxfcy: '', //授课教员
+        pxnc: '', //培训内容
+    })
+}
+
+const delItem = (item,index) => {
+    if(formData.value.courceList.length === 1) return proxy.$message.error('请至少添加一门课程');
+    formData.value.courceList.splice(index,1)
+}
+
+const init = () => {
+    showDialog.value = true
+}
+
+const close = () => {
+    showDialog.value = false
+}
+
+defineExpose({
+    init
+})
+</script>
+
+<style scoped lang="scss">
+@import "@/assets/css/layout.scss";
+.table-title{
+  line-height: 40px;
+  text-align: center;
+  background: #f5f5f5;
+  color: #333;
+  cursor: pointer;
+}
+.cntBox {
+    width: 100%;
+    height: calc(100% - 50px);
+    overflow: hidden;
+    overflow-y: auto;
+    padding: 2vw 13vw;
+    box-sizing: border-box;
+    .peoRow{
+        background: #f7f7f7;
+        padding: 10px;
+        box-sizing: border-box;
+        border-radius: 4px;
+        margin-bottom: 4px;
+        position: relative;
+        .deleteIncon{
+            position: absolute;
+            top: 8px;
+            left: 8px;
+
+        }
+    }
+}
+</style>
diff --git a/src/views/securityManagement/trainingManagement/trainingProject/index.vue b/src/views/securityManagement/trainingManagement/trainingProject/index.vue
index cbecea1..b3d59a7 100644
--- a/src/views/securityManagement/trainingManagement/trainingProject/index.vue
+++ b/src/views/securityManagement/trainingManagement/trainingProject/index.vue
@@ -29,6 +29,8 @@
 
     <view-project-details-dialog ref="viewProjectDetailsRef" v-model="isVisible" />
     <preject-details-dialog ref="prejectDetailsRef" v-model="dialogVisible" />
+    <!-- 新增 -->
+    <AddPxxm ref="addPxxmRef" v-model="dialogVisible" />
   </div>
 </template>
 
@@ -40,8 +42,9 @@ import Search from '@/components/aboutTable/Search.vue';
 import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
 import PageTitle from "@/components/aboutTable/PageTitle.vue";
 import ViewProjectDetailsDialog from "./components/viewProjectDetailsDialog.vue";
+import AddPxxm from './components/addPxxm.vue'
 import PrejectDetailsDialog from "./components/prejectDetailsDialog.vue";
-
+const addPxxmRef = ref()
 const prejectDetailsRef = ref(null);
 const viewProjectDetailsRef = ref(null)
 const queryFrom = ref({});
@@ -99,9 +102,11 @@ const tabHeightFn = () => {
 const addEdit = (type, row) => {
   if (type === 'view') {
     prejectDetailsRef.value.open(row, type);
-    return
+  }else if (type === 'add') {
+    addPxxmRef.value.init()
+  }else{
+    viewProjectDetailsRef.value.open(row, type);
   }
-  viewProjectDetailsRef.value.open(row, type);
 };
 
 const onSearch = (value) => {