1、我的接收列表页接收单位联调。2、我的接收处置详情页面搭建

.env.development

@@ -5,4 +5,4 @@ VITE_APP_TITLE = xxxxxxx
 VITE_APP_ENV = 'development'
 
 # 中华人民共和国海事局/开发环境
-VITE_APP_BASE_API = 'http://u68b4f5c.natappfree.cc/api'
+VITE_APP_BASE_API = 'http://172.33.7.60:8080/api'

src/api/leasingCompany/index.ts

@@ -1,9 +0,0 @@
-import request from "@/utils/request";
-
-// 根据名称模糊搜索租赁公司列表
-export function energyUnitPrice() {
-    return request({
-        url: `/business/energyUnitPrice/energyTopThreeList`,
-        method: 'get',
-    })
-}

src/api/notificationInfoManage/myPublish.ts

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+// 根据发布id获取发布下所有通报事项的接收单位列表
+export function fetchNotificationMattersList(data) {
+    return request({
+        url: `/business/lonmMiddle/getNotificationMattersList`,
+        method: 'post',
+        data
+    })
+}

src/components/notificationDetailsParts/waterSafetyInformation.vue

@@ -84,10 +84,6 @@
                   show-word-limit
                   :disabled="!isEditable"
                 />
-                <div class="example-text mt-1 text-primary">
-                  通报标准1:具体行为列举<br>
-                  具体的业务描述XXXXXX
-                </div>
               </el-form-item>
             </el-col>
           </el-row>
@@ -237,9 +233,9 @@
                   <!-- 无文件时显示空状态 -->
                   <div v-else class="file-empty">暂无附件</div>
                 </div>
-                <div class="upload-tip text-danger">
+                <!-- <div class="upload-tip text-danger">
                   提示：目前支持的文件格式：*.gif, *.jpeg, *.jpg, *.png, *.rar, *.zip, *.doc, *.ppt, *.xls, *.pdf, *.docx *.xlsx, *.bmp, *.xml,*.ofd,*.wps。文件大小支持：100M以内。
-                </div>
+                </div> -->
               </div>
             </el-col>
           </el-row>
@@ -291,10 +287,6 @@
                 </el-upload>
                 <!-- 无文件时显示空状态 -->
                 <div v-else class="file-empty mt-2">暂无附件</div>
-
-                <div class="upload-tip text-danger text-sm">
-                  提示：目前支持的文件格式：*.gif, *.jpeg, *.jpg, *.png, *.rar, *.zip, *.doc, *.ppt, *.xls, *.pdf, *.docx *.xlsx, *.bmp, *.xml,*.ofd,*.wps。文件大小支持：100M以内。
-                </div>
               </el-form-item>
             </el-col>
           </el-row>

src/router/index.ts

@@ -140,7 +140,7 @@ export const constantRoutes: RouteRecordRaw[] = [
 			{
 				path: 'myReceptionDisposalDetail',
 				component: () => import('@/views/notificationInfoManage/myReceptionDisposal/components/detail.vue'),
-				name: 'myReceptionDisposal',
+				name: 'myReceptionDisposalDetail',
 				meta: { title: '查看我的接收处置', icon: 'user' },
 			},
 			{

src/views/notificationInfoManage/myPublish/config/content.config.ts

@@ -10,7 +10,7 @@ const contentConfig = {
 		{ type: 'normal', label: '船舶名称', prop: 'vesselName', width: 140 },
 		{ type: 'normal', label: '通报事项类别', prop: 'notificationMattersType', width: 120 },
 		{ type: 'normal', label: '通报事项', prop: 'notificationMatters' },
-		{ type: 'custom', label: '接收单位', prop: 'names', slotName: 'names', width: 220 },
+		{ type: 'custom', label: '接收单位', slotName: 'names', width: 220 },
 		{ type: 'normal', label: '通报状整体状态', prop: 'releaseStatusStr', width: 220 },
 		{ type: 'normal', label: '是否需要反馈', prop: 'wfirStr', width: 220 },
 		{ type: 'normal', label: '发布日期', prop: 'releasedDate', width: 140 },

src/views/notificationInfoManage/myPublish/index.vue

@@ -8,7 +8,40 @@
 							<el-button type="primary" @click="handleAdd()">导出</el-button>
 					</template>
 					<template #names="scope">
-						{{ scope.row.names }}
+						<el-popover placement="bottom" :width="800" trigger="click">
+							<template #reference>
+								<div @click="onClickNames(scope.row.releasedId)" class="pointer">{{ scope.row.names }}</div>
+							</template>
+							<div>
+								<div class="flex-ac mb10">
+									<div class="flex-cc">
+										<div class="square green_bgc" />
+										<div class="green">接收单位正常期限提醒</div>
+									</div>
+									<div class="flex-cc">
+										<div class="square yellow_bgc" />
+										<div class="yellow">接收单位退回和补正超期提醒</div>
+									</div>
+									<div class="flex-cc">
+										<div class="square red_bgc" />
+										<div class="red">接收单位处理/处置完成超期提醒</div>
+									</div>
+								</div>
+								<el-table :data="[]">
+									<el-table-column prop="receivingUnitStr" label="接收单位" />
+									<el-table-column prop="userPhone" label="联络人电话" />
+									<el-table-column prop="notificationStatus" label="通报状态" />
+									<el-table-column prop="takeMeasures" label="采取措施" />
+									<el-table-column prop="overdueStatus" label="超期状态" />
+									<el-table-column prop="acceptanceDate" label="受理日期" />
+									<el-table-column fixed="right" label="操作">
+										<template #default>
+											<el-button link type="primary" size="small">查看</el-button>
+										</template>
+									</el-table-column>
+								</el-table>
+							</div>
+						</el-popover>
 					</template>
 					<template #operate="scope">
 							<el-button type="primary" link @click="handleDetails(scope.row.rentalCompanyId)">
@@ -34,6 +67,7 @@ import searchConfig from './config/search.config';
 import pageSearch from '@/components/components/pageSearch.vue';
 import useSystemStore from '@/store/main';
 import { outTypeList } from '@/libs/commonMeth';
+import { fetchNotificationMattersList } from '@/api/notificationInfoManage/myPublish';
 // 通报整体状态
 const allNotificationStatus = outTypeList('bj_notify_os');
 // 通报事项类别
@@ -55,6 +89,23 @@ const tableData = ref([]);
 const tableListRef = ref();
 const router = useRouter();
 
+const getNotificationMattersList = async(id) => {
+	console.log(searchTableRef.value.searchForm);
+	const params = {
+		releasedId: id,
+		notificationStatus: searchTableRef.value.searchForm.notificationStatus,
+		takeMeasures: searchTableRef.value.searchForm.takeMeasures,
+		overdueStatus: searchTableRef.value.searchForm.overdueStatus,
+		releasedDate: searchTableRef.value.searchForm.releasedDate,
+	}
+	const response = await fetchNotificationMattersList(params)
+	console.log(response);
+}
+
+const onClickNames = (id) => {
+	getNotificationMattersList(id)
+}
+
 const handleEdit = async (id: string) => {
 	router.push({
     name: 'addPublish',
@@ -137,4 +188,22 @@ searchItem();
 .dialog-tip {
 	text-align: center;
 }
+
+.square {
+	width: 12px;
+	height: 12px;
+	margin-right: 10px;
+}
+
+.red_bgc {
+	background-color: #c00000;
+}
+
+.yellow_bgc {
+	background-color: #f2941e;
+}
+
+.green_bgc {
+	background-color: #46a70c;
+}
 </style>

src/views/notificationInfoManage/myReceptionDisposal/components/detail.vue

@@ -12,11 +12,14 @@
 		<WaterSafetyInformation ref="noticeChildRef" />
 		<!-- 接收单位处置意见 -->
 		<ReceivingUnitOpinion />
+		<div class="flex">
+			<div>水上交通安全相关通报文书：</div>
+			<div>《水上交通安全信息通报函》</div>
+		</div>
 		<!-- 底部按钮区 -->
 		<div class="form-actions">
 			<slot name="btn">
-				<el-button type="primary" @click="handleSubmit">保存</el-button>
-				<el-button type="primary" @click="handleSubmit">发布</el-button>
+				<el-button type="primary" @click="handleSubmit">附件材料一键下载</el-button>
 				<el-button type="primary" @click="router.back">返回</el-button>
 			</slot>
 		</div>
@@ -31,7 +34,6 @@ import QuestionInformation from '@/components/notificationDetailsParts/questionI
 import WaterSafetyInformation from '@/components/notificationDetailsParts/waterSafetyInformation.vue';
 import ReceivingUnitOpinion from './receivingUnitOpinion.vue';
 
-// --- 路由与Store ---
 const route = useRoute();
 const router = useRouter();
 

src/views/notificationInfoManage/myReceptionDisposal/components/receivingUnitDealOpinion.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="ship-info-form">
+    <el-collapse class="el-collapse" v-model="activeNames">
+      <el-collapse-item name="1">
+        <template #title="{ isActive }">
+          <div class="collapse-title">
+            接收单位处理意见
+          </div>
+        </template>
+        <div class="content">
+          <div>处置措施类型：处置</div>
+          <div>采取措施：其他</div>
+          <div>其他措施说明：船东已整改</div>
+          <div>信息处理人员：陈</div>
+          <div>信息处理时间：2025-10-1</div>
+          <div>信息处理接收单位：柳州船舶检验中心</div>
+          <div>附件查看：xxx.doc</div>
+          <div>接收流转单位：单位1</div>
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+  </div>
+</template>
+
+<script setup lang="ts">
+  const activeNames = ref(['1']);
+</script>
+
+<style scoped>
+.ship-info-form {
+  background: #fff;
+  border-radius: 8px;
+  padding: 20px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
+}
+:deep .el-collapse-item__header {
+  color: #5070ae;
+  size: 24px;
+  background: linear-gradient(135deg, #d2e8ff, #fcfeff);
+	box-shadow: 0 8px 20px #fcfeff;
+	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+  padding-left: 20px;
+}
+
+:deep .el-collapse-item__wrap {
+  padding: 20px;
+}
+
+.content {
+  font-size: 14px;
+}
+
+</style>

src/views/notificationInfoManage/myReceptionDisposal/components/receivingUnitOpinion.vue

@@ -8,7 +8,7 @@
           </div>
         </template>
         <div class="content">
-          <div>处置措施类型：接收处置</div>
+          <div>处置措施类型：接收</div>
           <div>信息处置人员：陈海东</div>
           <div>信息处置时间：2025-04-02</div>
           <div>信息处置接收单位：柳州船舶检验中心</div>

src/views/notificationInfoManage/myReceptionDisposal/index.vue

@@ -54,16 +54,9 @@ import usePageModal from '@/components/components/hooks/usePageDetails';
 const { modalRef, handleNewDataClick, handleEditDataClick, handleCheckDataClick, handlePageDetail } =
 	usePageModal();
 
-const handleEdit = async (id: string) => {
-	router.push({
-    name: 'addPublish',
-    query: { type: 'edit' }
-  });
-};
-
 const handleDetails = async (id: string) => {
 	router.push({
-    name: 'addPublish',
+    name: 'myReceptionDisposalDetail',
     query: { type: 'detail' }
   });
 };