feat（通知单内容维护和管理）：维护变更记录

src/api/notificationContent/list.js

@@ -8,3 +8,11 @@ export function list(query) {
         params: query
     })
 }
+// 获取顶部信息-根据通知单管理id
+export function getTopDetailInfo(id) {
+    return request({
+        url: '/control/sysNotificationContent/getTopDetailInfo/'+id,
+        method: 'get'
+
+    })
+}

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

@@ -264,8 +264,6 @@
   </div>
 </template>
 <script setup>
-import DeleteDialog from '@/components/DeleteDialog/index.vue';
-import SelectRole from "@/components/SelectRole/index.vue"
 import {
   brandData,
   getALLManufacturerList,

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

@@ -3,22 +3,21 @@
     <!-- 头部信息 -->
     <div class="top">
       <div style="display: flex;align-items: center;width: 70%;justify-content: space-between">
-        <el-button type="primary" @click="handleClick">返回</el-button>
-        <span>通知单编号:20241201-001</span>
-        <span>认证机构：CCAP</span>
-        <span>事业部：奇瑞</span>
-        <span>车型代码：T18</span>
-        <span>车型系列：CJ1B</span>
-        <span>生产地址：中国安徽省芜湖市经济技术开发区长春路8号</span>
+        <el-button type="primary" @click="goBack">返回</el-button>
+        <span>通知单编号:{{topDetailInfo.notificationNumber}}</span>
+        <span>认证机构:{{topDetailInfo.certificationBody}}</span>
+        <span>事业部:{{topDetailInfo.businessUnitName}}</span>
+        <span>车型代码:{{topDetailInfo.vehicleModelCode}}</span>
+        <span>车型系列:{{getLabelByKey(topDetailInfo.vehicleSeries)}}</span>
+        <span>生产地址:{{topDetailInfo.productionAddress}}</span>
       </div>
 
-      <div>
+      <div style="width: 20%;display: flex;align-items: center;justify-content: space-evenly">
         <span>
-          认证负责人：xxx、xxx、xxx、xxx
-        </span>
-        <span class="status-progress" style="margin-left: 10px">
-          ● 收集中
+          认证负责人：<span :style="item.certification_status === '0'?'':'color:#19be6b'" v-for="(item,i) in topDetailInfo.renzhengStatusList">{{item.nick_name}}<span v-if="i !== topDetailInfo.renzhengStatusList.length - 1">、</span></span>
+
         </span>
+        <span> <dict-tag :options="notification_status" :value="topDetailInfo.notificationStatus" /></span>
       </div>
     </div>
 
@@ -78,7 +77,7 @@
       <!-- 为该表单项添加 right-align 类 -->
       <el-form-item class="button-container right-align" style="position: relative;">
         <div >
-          <el-button type="primary" class="btn-C" @click="handleQuery">添加</el-button>
+          <el-button type="primary" class="btn-C" @click="addWeiHu">添加</el-button>
           <el-button @click="resetQuery" class="btn-A">完成维护</el-button>
         </div>
       </el-form-item>
@@ -114,12 +113,172 @@
         </template>
       </el-table-column>
     </el-table>
+
+    <!--  抽屉-->
+    <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="drawer-form" :rules="rules" :model="drawerQueryParams" label-width="100px" ref="drawerQueryRef"  >
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="车型公告号:" prop="certificationBody">
+                <el-select
+                    v-model="drawerQueryParams.certificationBody"
+                    placeholder="请选择"
+                    clearable
+                >
+                  <el-option
+                      v-for="dict in 4"
+                      :label="dict"
+                      :value="dict"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+          </el-row>
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="动力类型:" prop="businessDivisionId">
+                <el-select
+                    v-model="drawerQueryParams.businessDivisionId"
+                    placeholder="请选择"
+                    clearable
+
+                >
+                  <el-option
+                      v-for="dict in 4"
+                      :label="dict"
+                      :value="dict"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="变更类型:" prop="vehicleModelCode">
+                <el-select
+
+                    v-model="drawerQueryParams.vehicleModelCode"
+                    placeholder="请选择"
+                >
+                  <el-option
+                      v-for="dict in 4"
+                      :label="dict"
+                      :value="dict"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="车辆类型:" prop="vehicleSeries">
+                <el-select
+                    v-model="drawerQueryParams.vehicleSeries"
+                    placeholder="请选择"
+                    clearable
+                >
+                  <el-option
+
+                      v-for="dict in 4"
+                      :label="dict"
+                      :value="dict"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="项目负责人:" prop="manufacturerId">
+                <el-input placeholder="请输入" v-model="drawerQueryParams.manufacturerId" />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row >
+            <el-col :offset="1" :span="22">
+              <el-form-item label="RTX/TEL:" prop="manufacturerId">
+                <el-input placeholder="请输入" v-model="drawerQueryParams.manufacturerId" />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row >
+            <el-col  :offset="1" :span="22">
+              <el-form-item label="认证负责人:" prop="certificationResponsiblePerson">
+                <el-select
+                    v-model="drawerQueryParams.certificationResponsiblePerson"
+                    placeholder="请选择认证负责人"
+                    clearable
+                >
+                  <el-option
+                      v-for="dict in 4"
+                      :label="dict"
+                      :value="dict"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-row >
+              <el-col :offset="1" :span="22">
+                <el-form-item label="完成日期:" prop="manufacturerId">
+                  <el-date-picker
+                      v-model="drawerQueryParams.selectedDate"
+                      type="date"
+                      style="width: 436px"
+                      placeholder="选择日期"
+                      format="YYYY-MM-DD"
+                      value-format="YYYY-MM-DD"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+
+
+
+          </el-row>
+        </el-form>
+
+      </template>
+      <template #footer>
+        <div style="flex: auto">
+          <el-button class="btn-B" @click="cancelClick">取消</el-button>
+          <el-button class="btn-A" type="primary" @click="confirmClick(drawerQueryRef)">保存</el-button>
+        </div>
+      </template>
+    </el-drawer>
   </div>
 </template>
 <script setup>
+import {
+  getTopDetailInfo
+} from "@/api/notificationContent/list.js"
 import { useRoute } from 'vue-router';
-
+const drawerTitle = ref('')
+const drawer  = ref(false)
 const tableList = ref([])
+const topDetailInfo = ref({})
+const { proxy } = getCurrentInstance();
+const drawerQueryParams = ref({
+
+})
+const { notification_status } = proxy.useDict('notification_status')
+
+// 从全局字典中获取事业部 icar 才能选择的车型系列数据
+const { vehicle_model_series_icar } = proxy.useDict('vehicle_model_series_icar')
+// 从全局字典中获取除事业部 icar 外可选择的车型系列数据
+const { vehicle_model_series } = proxy.useDict('vehicle_model_series')
 // 获取当前路由实例
 const route = useRoute();
 // 从路由参数中获取 id
@@ -128,6 +287,41 @@ const queryParams = ref({
   pageNum: 1,
   pageSize: 10
 })
+
+
+function addWeiHu(){
+  drawerTitle.value = '新增'
+  drawer.value = true
+}
+
+function goBack(){
+  router.go(-1);
+}
+
+function getTopInfo(){
+  getTopDetailInfo(id).then(res=>{
+    console.log(res)
+    topDetailInfo.value = res.data
+  })
+}
+
+const getLabelByKey = (key) => {
+  // 先在 vehicle_model_series_icar 中查找
+  console.log(vehicle_model_series_icar._object.vehicle_model_series_icar)
+  const itemInIcar = vehicle_model_series_icar._object.vehicle_model_series_icar.find(item => item.value === key);
+  if (itemInIcar) {
+    return itemInIcar.label;
+  }
+  // 若 vehicle_model_series_icar 中未找到，再在 vehicle_model_series 中查找
+  const itemInSeries = vehicle_model_series._object.vehicle_model_series.find(item => item.value === key);
+  if (itemInSeries) {
+    return itemInSeries.label;
+  }
+  // 若两个字典都未找到，返回空字符串
+  return '';
+};
+getTopInfo()
+
 </script>
 
 <style scoped lang="scss">