通知单管理-打开人员列表

src/api/notificationManagement/list.js

@@ -52,3 +52,10 @@ export function list(data) {
         params:data
     })
 }
+// 根据人员ids获取人员信息
+export function getPersonnelInfoByIdsInfoByIds(ids) {
+    return request({
+        url: '/control/notificationManagement/getPersonnelInfoByIdsInfoByIds/'+ids,
+        method: 'get'
+    })
+}

src/views/controlPlan/controlPlanNotice/noticeAcceptance/index.vue

+<template>
+  <div class="app-container">
+    通知单承接
+  </div>
+</template>
+<script setup>
+
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/controlPlan/controlPlanNotice/notificationContent/index.vue

+<template>
+  <div class="app-container">
+    通知单内容维护
+  </div>
+</template>
+<script setup>
+
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/controlPlan/controlPlanNotice/notificationManagement/index.vue

@@ -128,27 +128,41 @@
       <el-table-column label="生产地址" align="center" prop="productionAddress" width="150" />
       <el-table-column label="车型公告号" align="center" prop="vehicleAnnouncementNumber" >
         <template #default="scope">
-          <span>{{}}</span>
+          <span>{{scope.row.vehicleAnnouncementNumber || '涉及0个'}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="变更类型" align="center" prop="changeType" >
+        <template #default="scope">
+          <span>{{scope.row.vehicleAnnouncementNumber || '--'}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="认证负责人" align="center" prop="certificationResponsiblePerson" >
+        <template #default="scope">
+          <span class="renzheng">共{{scope.row.certificationResponsiblePerson.split(',').length}}人<el-icon style="font-size: 16px;margin-left: 5px"><EditPen  @click="addPerson(scope.row)"/></el-icon></span>
+        </template>
+      </el-table-column>
+      <el-table-column label="批准日期" align="center" prop="approvalDate"  >
+        <template #default="scope">
+          <span>{{scope.row.approvalDate || '--'}}</span>
         </template>
       </el-table-column>
-      <el-table-column label="变更类型" align="center" prop="changeType"  />
-      <el-table-column label="认证负责人" align="center" prop="certificationResponsiblePerson"  />
-      <el-table-column label="批准日期" align="center" prop="approvalDate"  />
       <el-table-column label="通知单状态" align="center" prop="notificationStatus"  >
         <template #default="scope">
           <dict-tag :options="notification_status" :value="scope.row.notificationStatus" />
         </template>
       </el-table-column>
       <el-table-column label="创建人" align="center" prop="createUserName"  />
-      <el-table-column label="批准人" align="center" prop="ApprovalUserName"  />
+      <el-table-column label="批准人" align="center" prop="approvalUserName"  />
 
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template #default="scope">
-            <el-button type="text" style="color: rgb(0,0,255)"  @click="handleMaintain(scope.row)">维护项目</el-button>
-            <el-button type="text" style="color: rgb(255,153,0)" v-if="scope.row.id === adminId" @click="copeAdd(scope.row)">复制新增</el-button>
+            <el-button type="text" style="color: rgb(0,0,255)"  @click="handleMaintain(scope.row)">查看详情</el-button>
+            <el-button type="text" style="color: rgb(255,54,54)" @click="copeAdd(scope.row)">删除</el-button>
+            <el-button type="text" style="color: rgb(255,153,0)"  @click="copeAdd(scope.row)">撤回</el-button>
         </template>
       </el-table-column>
     </el-table>
+
     <pagination
         v-show="total>0"
         :total="total"
@@ -327,13 +341,36 @@
         @submit="handleSelectionSubmit"
         @close="() => selectRole = false"
     />
+
+    <el-dialog
+        class="custom-dialog"
+        v-model="dialogVisible"
+        :title="dialogTitle"
+        width="700"
+      :before-close="beforeClose"
+    >
+      <div>
+        <el-button type="primary" class="btn-C">添加人员</el-button>
+        <el-table style="margin-top: 20px" :data="personTableList">
+          <el-table-column type="index" width="55" align="center" label="序号"/>
+          <el-table-column label="人员" align="center" prop="userName" />
+          <el-table-column label="部门" align="center" prop="deptName" />
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-button type="text" style="color: rgb(255,54,54)" @click="copeAdd(scope.row)">移除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script setup>
 import SelectRole from "@/components/SelectRole/index.vue"
-import {getUnitList,brandData,getALLManufacturerList,getAllModelCode,getALLUserList,insert,list} from "@/api/notificationManagement/list.js"
+import {getUnitList,brandData,getALLManufacturerList,getAllModelCode,getALLUserList,insert,list,getPersonnelInfoByIdsInfoByIds} from "@/api/notificationManagement/list.js"
 import { ref } from "vue";
 import { ElMessage } from 'element-plus'
+const personTableList = ref([])
 const { proxy } = getCurrentInstance();
 const { certification_body
 } = proxy.useDict('certification_body')
@@ -345,6 +382,8 @@ const { vehicle_model_series_icar } = proxy.useDict('vehicle_model_series_icar')
 const tableList =ref([])
 //车型代码
 const modelCodeList = ref([])
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
 //人员选择数据
 const userList = ref([])
 const selectRole = ref(false) //组件控制，默认关闭
@@ -408,6 +447,7 @@ function confirmClick(formRef) {
         if(res.code === 200){
          ElMessage.success("新增成功")
           cancelClick()
+          getList()
         }
       })
     } else {
@@ -426,13 +466,30 @@ function getDictList(v){
 
 //车型系列-除了事业部icar选这个
   let a  = toRaw(toRaw(vehicle_model_series_icar)._object).vehicle_model_series_icar
-  console.log("a",a)
   // let b = toValue(vehicle_model_series)
   if(a.find(item => item.value === v)) {
     return true
   }else return  false
 }
 
+//添加人员关闭对话框
+const beforeClose = (done) => {
+  // 这里可以添加关闭前的确认逻辑，例如询问用户是否确认关闭
+  // 如果确认关闭，调用 done() 函数
+  done();
+};
+
+function addPerson(row){
+  console.log(row)
+  dialogTitle.value = '维护需求人（'+row.notificationNumber+' -'+row.businessUnitName+'-'+row.vehicleModelCode+')';
+  dialogVisible.value = true
+
+  getPersonnelInfoByIdsInfoByIds(row.certificationResponsiblePerson).then(res=>{
+    console.log(res)
+    personTableList.value = res.data
+  })
+}
+
 //获取品牌列表
 function  getBrandDataList(){
   brandData().then(res=>{
@@ -522,6 +579,13 @@ getBrandDataList()
 
 
 <style scoped lang="scss">
+.renzheng{
+  color: #1890ff;
+  text-decoration: underline #1890ff;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+}
 :deep(.el-form--inline .el-form-item) {
   margin-right: 5px;
 }
@@ -544,4 +608,23 @@ getBrandDataList()
 :deep(.el-pagination.is-background .el-pager li.is-active){
   background-color: #0154FB;
 }
+:deep(.el-dialog__title){
+  font-size: 14px;
+  font-weight: bold;
+  color: #545559;
+
+}
+:deep(.custom-dialog) {
+  display: flex;
+  flex-direction: column;
+  margin: 0 auto !important; /* 水平居中 */
+  max-height: calc(100vh - 30px); /* 限制最大高度 */
+  top: 30%; /* 顶部偏移 30% */
+  transform: translateY(-50%); /* 向上偏移自身高度的 50%，实现垂直居中 */
+
+  .el-dialog__body {
+    flex: 1;
+    overflow: auto;
+  }
+}
 </style>