feat(通知单承接)：创建控制计划新增搭建

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

@@ -69,7 +69,10 @@
 
 
        <el-table-column label="操作" show-overflow-tooltip align="center" prop="remark">
-         <el-button  type="text"  style="color: rgb(0,0,255)"  @click="handleView(scope.row)">新增控制计划</el-button>
+         <template #default="scope">
+           <el-button  type="text"  style="color: rgb(0,0,255)"  @click="addControlPlan(scope.row)">新增控制计划</el-button>
+
+         </template>
 
        </el-table-column>
      </el-table>
@@ -158,6 +161,219 @@
      </el-table>
    </div>
 
+
+   <!--  抽屉-->
+   <el-drawer @close="drawerColse" v-model="drawer">
+     <template #header>
+       <div style="font-weight: bold;font-size: 14px">
+         {{drawerTitle}}
+       </div>
+     </template>
+     <template #default>
+       <el-form
+           class="formDiv"
+           ref="ruleFormRef"
+           style="max-width: 600px"
+           :model="ruleForm"
+           :rules="rules"
+           label-width="120px"
+           label-position="right"
+       >
+        <el-row>
+          <el-col :span="22" :offset="1">
+            <el-form-item label="生产地址：" prop="name">
+              <span>{{topDetailInfo.productionAddress}}</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+         <el-row>
+           <el-col :span="22" :offset="1">
+             <el-form-item label="版本号：" prop="name">
+              <span>{{controlPlantableList[0].versionNo}}</span>
+             </el-form-item>
+           </el-col>
+         </el-row>
+
+         <el-row>
+           <el-col :span="22" :offset="1">
+             <el-form-item label="本次新增车型公告号："  prop="name">
+               <span>{{getNewAddNumber()}}</span>
+             </el-form-item>
+           </el-col>
+         </el-row>
+
+         <el-row>
+           <el-col :span="22" :offset="1">
+             <el-form-item label="生产情况：" prop="name">
+               <span>{{controlPlantableList[0].versionNo === 'A0'?'试生产':'生产'}}</span>
+             </el-form-item>
+           </el-col>
+         </el-row>
+
+         <el-row>
+           <el-col :span="22" :offset="1">
+             <el-form-item label-width="auto" :rules="[
+                 {
+                   required: true,
+                   message: '请选择编制截至日期',
+                   trigger: 'change'
+                 }
+             ]" label="编制截至日期：" prop="deadline">
+               <el-date-picker
+                   v-model="ruleForm.deadline"
+                   type="date"
+                   placeholder="请选择日期"
+                   format="YYYY-MM-DD"
+                   value-format="YYYY-MM-DD"
+                   style="width: 100%"
+               />
+             </el-form-item>
+           </el-col>
+         </el-row>
+
+
+
+         <el-row>
+           <el-col :span="22" >
+             <div class="tab-components">
+               <span class="components-span">01.关键零部件清单</span>
+             </div>
+           </el-col>
+         </el-row>
+
+         <el-row >
+           <el-col  :offset="1" :span="17">
+             <el-form-item label="编制负责人：" prop="approvalPerson">
+               <el-select
+                   disabled
+                   placement="bottom"
+                   v-model="ruleForm.approvalPerson"
+                   placeholder="请选择批准人"
+                   clearable
+               >
+                 <el-option
+                     v-for="dict in allUserList"
+                     :label="dict.nickName"
+                     :value="dict.userId"
+                 />
+               </el-select>
+             </el-form-item>
+           </el-col>
+
+           <el-col :offset="1" :span="5">
+             <el-button type="primary" icon="User" @click="singleOpenDialog" class="btn-C" plain>选择用户</el-button>
+           </el-col>
+         </el-row>
+
+         <el-row>
+           <el-col :span="22" >
+             <div class="tab-components">
+               <span class="components-span">02.关键工序、装配、检验清单</span>
+             </div>
+           </el-col>
+         </el-row>
+         <el-row >
+           <el-col  :offset="1" :span="17">
+             <el-form-item label="编制负责人：" prop="approvalPerson">
+               <el-select
+                   disabled
+                   placement="bottom"
+                   v-model="ruleForm.approvalPerson"
+                   placeholder="请选择批准人"
+                   clearable
+               >
+                 <el-option
+                     v-for="dict in allUserList"
+                     :label="dict.nickName"
+                     :value="dict.userId"
+                 />
+               </el-select>
+             </el-form-item>
+           </el-col>
+
+           <el-col :offset="1" :span="5">
+             <el-button type="primary" icon="User" @click="singleOpenDialog" class="btn-C" plain>选择用户</el-button>
+           </el-col>
+         </el-row>
+
+         <el-row>
+           <el-col :span="22" >
+             <div class="tab-components">
+               <span class="components-span">03.COP试验和检查表</span>
+             </div>
+           </el-col>
+         </el-row>
+         <el-row >
+           <el-col  :offset="1" :span="17">
+             <el-form-item label-width="auto"  label="制造编制负责人：" prop="approvalPerson">
+               <el-select
+                   disabled
+                   placement="bottom"
+                   v-model="ruleForm.approvalPerson"
+                   placeholder="请选择批准人"
+                   clearable
+               >
+                 <el-option
+                     v-for="dict in allUserList"
+                     :label="dict.nickName"
+                     :value="dict.userId"
+                 />
+               </el-select>
+             </el-form-item>
+           </el-col>
+
+           <el-col :offset="1" :span="5">
+             <el-button type="primary" icon="User" @click="singleOpenDialog" class="btn-C" plain>选择用户</el-button>
+           </el-col>
+         </el-row>
+         <el-row >
+           <el-col :offset="1" :span="17">
+             <el-form-item label-width="auto" label="质管编制负责人：" prop="approvalPerson">
+               <el-select
+                   disabled
+                   placement="bottom"
+                   v-model="ruleForm.approvalPerson"
+                   placeholder="请选择批准人"
+                   clearable
+               >
+                 <el-option
+                     v-for="dict in allUserList"
+                     :label="dict.nickName"
+                     :value="dict.userId"
+                 />
+               </el-select>
+             </el-form-item>
+           </el-col>
+
+           <el-col :offset="1" :span="5">
+             <el-button type="primary" icon="User" @click="singleOpenDialog" class="btn-C" plain>选择用户</el-button>
+           </el-col>
+         </el-row>
+       </el-form>
+
+     </template>
+     <template #footer>
+       <div style="flex: auto">
+         <el-button class="btn-B" @click="drawer = false">取消</el-button>
+         <el-button class="btn-A" @click="confirmClick">确定发起</el-button>
+       </div>
+     </template>
+   </el-drawer>
+
+
+
+   <select-role
+       v-if="userList.length > 0"
+       v-model="selectRole"
+       :dept-list="userList"
+       name-key="nickName"
+       dept-key="dept"
+       name-list-key="nickName"
+       name-id-key="userId"
+       :selection-mode="selectType"
+       @submit="handleSelectionSubmit"
+       @close="() => selectRole = false"
+   />
  </div>
 
 </template>
@@ -167,9 +383,19 @@ import {getLastVersionNumber} from "@/api/noticeAcceptance/list.js";
 import {useRoute, useRouter} from "vue-router";
 import cn from "@/locales/baseData/marketRegulations/cn.json";
 import en from "@/locales/baseData/marketRegulations/en.json";
+import {ref} from "vue";
+import {getALLUserList} from "@/api/notificationManagement/list.js";
+import SelectRole from "@/components/SelectRole/index.vue";
 const { proxy } = getCurrentInstance();
 const controlPlantableList =ref([])
+const ruleFormRef =ref()
+const ruleForm = ref({})
 const topDetailInfo = ref({})
+const drawerTitle = ref('')
+const allUserList = ref([])
+const userList =ref([])
+const selectType = ref('multiple')
+const selectRole = ref(false)
 const { power_type } = proxy.useDict('power_type')
 const { control_plan_status } = proxy.useDict('control_plan_status')
 const { car_type } = proxy.useDict('car_type')
@@ -190,7 +416,7 @@ const { vehicle_model_series_icar } = proxy.useDict('vehicle_model_series_icar')
 // 从全局字典中获取除事业部 icar 外可选择的车型系列数据
 const { vehicle_model_series } = proxy.useDict('vehicle_model_series')
 
-
+const drawer =ref(false)
 
 const getLabelByKey = (key) => {
   // 先在 vehicle_model_series_icar 中查找
@@ -207,6 +433,57 @@ const getLabelByKey = (key) => {
   return '';
 };
 
+function addControlPlan(row){
+  drawerTitle.value = '新增控制计划（'+row.certificationBody+'-'+row.businessUnitName+'-'+row.vehicleModelCode+'-'+getLabelByKey(topDetailInfo.value.vehicleSeries)+"）"
+  drawer.value = true
+}
+
+function handleSelectionSubmit(selectedItems){
+  console.log(selectedItems)
+}
+
+function getNewAddNumber(){
+  // let list = bottomTableList.value.map(item=>{
+  //   if(item.changeType === '新增'){
+  //     return item.vehicleAnnouncementNumber
+  //   }
+  // })
+  let list = []
+  bottomTableList.value.forEach(item=>{
+    if(item.changeType === '新增'){
+      list.push(item.vehicleAnnouncementNumber)
+    }
+  })
+  if(list.length === 0){
+    return '--'
+  }else return `${list.join(",")}共${list.length}个`
+}
+
+//获取所有人员
+function getALLUserDeptList(){
+  getALLUserList().then(res=>{
+    userList.value = res.data
+    let list = res.data
+    // 提取所有用户的昵称和id
+    for(let i in list){
+      let list2 = list[i].nickName
+      for(let i2 in list2){
+        allUserList.value.push(list2[i2])
+      }
+    }
+  })
+}
+function confirmClick(){
+  ruleFormRef.value.validate((valid) => {
+    if (valid) {
+      console.log('submit!');
+    } else {
+      console.log('error submit!!');
+      return false;
+    }
+  });
+}
+
 //获取头部信息
 function getTopInfo(){
   getTopDetailInfo(id).then(res=>{
@@ -231,7 +508,6 @@ function resetQuery(){
 function  getVersionInfo(id){
   getLastVersionNumber(id).then(res=>{
     Object.assign(controlPlantableList.value[0], res.data);
-    console.log(controlPlantableList.value)
 
   })
 
@@ -246,11 +522,13 @@ function getList(){
     total.value = res.total
   })
 }
+getALLUserDeptList()
 getList()
 getTopInfo(id)
 getVersionInfo(id)
 </script>
 <style scoped lang="scss">
+
 .top{
   width:100%;
   display: flex;
@@ -283,5 +561,22 @@ getVersionInfo(id)
   width: 4px;
   background-color: rgb(8,105,250);
 }
-
+.formDiv{
+  span{
+    font-size: 15px;
+    color: #5a5e66;
+  }
+}
+.tab-components{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 10px 0;
+  .components-span{
+    border-left: 5px solid #409eff;
+    padding-left: 5px;
+    font-weight: 800;
+    color: #409eff;
+  }
+}
 </style>

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

@@ -262,7 +262,7 @@
       <el-table-column label="操作" align="center" width="200">
         <template #default="scope">
           <el-button type="text"  style="color: rgb(0,0,255)"  @click="controlPlan(scope.row)">触发控制计划</el-button>
-          <el-button v-if="scope.row.changeType.includes('新增')" type="text"  style="color: rgb(0,0,255)"  @click="handleView(scope.row)">触发封面</el-button>
+          <el-button v-if="scope.row.changeType.includes('新增')" type="text"  style="color: rgb(0,0,255)"  @click="triggerCover(scope.row)">触发封面</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -339,6 +339,18 @@ function resetQuery(){
   getList()
 }
 
+function triggerCover(row){
+  // 使用查询参数传递 id
+  router.push({
+    path: '/control/controlPlanNotice/cover',
+    query: {
+      id: row.id,
+      notificationStatus:row.notificationStatus
+    }
+  });
+}
+
+
 function controlPlan(row){
   // 使用查询参数传递 id
   router.push({

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

@@ -967,8 +967,6 @@ function getALLUserDeptList(){
       }
     }
   })
-
-
 }
 getList()
 getALLUserDeptList()