Переглянути джерело

feat(shipOwnerManage): 更新船员信息上传功能

- 修改 Uploader 组件,增加登录账户 ID 参数
- 更新 shipOwnerDetail 页面,根据船员 ID 动态设置上传 URL 和参数
- 重构 getShipOwnerDetail 方法,优化船员信息获取逻辑
- 调整保存船员信息逻辑,支持根据船员 ID 更新数据
wzg 9 місяців тому
батько
коміт
fda980ed66

+ 5 - 2
src/components/Uploader.vue

@@ -61,7 +61,7 @@
       :action="actionUrl"
       list-type="picture-card"
       :show-file-list="false"
-      :data="params"
+      :data="{ ...params, loginAccountId }"
       :on-success="uploadSuccess"
       :on-change="onChange"
       :disabled="disabled"
@@ -139,7 +139,10 @@ function beforeUpload() {
 function previewPdf(url) {
   window.open(url);
 }
-onMounted(() => {});
+const loginAccountId = ref("");
+onMounted(() => {
+  loginAccountId.value = localStorage.getItem("loginAccountId");
+});
 </script>
 <style scoped>
 .upload-plus-icon {

+ 8 - 6
src/store/index.js

@@ -2,9 +2,10 @@ import { createStore } from "vuex";
 
 console.log(import.meta.env.VITE_PROJECT_ENV);
 let baseurl = import.meta.env.VITE_BASEURL;
-const idCardUrl = `${baseurl}/cos/uploadIdCard`;
-const addCertsUrl = `${baseurl}/cos/uploadShipCertNew`;
-const updateCertsUrl = `${baseurl}/cos/uploadShipCertUpdate`;
+const shipOwnerUpdateUrl = `${baseurl}/cos/uploadShipOwnerDocUpdate`;
+const shipOwnerCacheUrl = `${baseurl}/cos/uploadShipOwnerDocNew`;
+const shipCertUpdateUrl = `${baseurl}/cos/uploadShipCertUpdate`;
+const shipCertCacheUrl = `${baseurl}/cos/uploadShipCertNew`;
 
 const store = createStore({
   state: {
@@ -13,9 +14,10 @@ const store = createStore({
     secondTitle: "",
     currentMenuItem: "/voyage/voyageList",
     baseurl,
-    idCardUrl,
-    addCertsUrl,
-    updateCertsUrl,
+    shipOwnerUpdateUrl,
+    shipOwnerCacheUrl,
+    shipCertUpdateUrl,
+    shipCertCacheUrl,
     versions: [],
     keepAliveList: ["shipList", "shipOwnerList"],
   },

+ 52 - 38
src/views/shipOwnerManage/shipOwnerDetail.vue

@@ -54,9 +54,13 @@
         <el-col :span="8">
           <el-form-item label="身份证人像面">
             <Uploader
-              :action-url="uploadConfig.uploadUrl"
+              :action-url="
+                shipOwnerForm.shipOwnerId
+                  ? store.state.shipOwnerUpdateUrl
+                  : store.state.shipOwnerCacheUrl
+              "
               :file-list="idCardFrontFileList"
-              :params="{ type: 'idCardFront' }"
+              :params="{ type: 8, shipOwnerId: shipOwnerForm.shipOwnerId }"
               @on-upload-file-list="handleIdCardFrontUpload"
               @on-remove-file-list="handleIdCardFrontRemove"
               :limit="1"
@@ -68,9 +72,13 @@
         <el-col :span="8">
           <el-form-item label="身份证国徽面">
             <Uploader
-              :action-url="uploadConfig.uploadUrl"
+              :action-url="
+                shipOwnerForm.shipOwnerId
+                  ? store.state.shipOwnerUpdateUrl
+                  : store.state.shipOwnerCacheUrl
+              "
               :file-list="idCardBackFileList"
-              :params="{ type: 'idCardBack' }"
+              :params="{ type: 9, shipOwnerId: shipOwnerForm.shipOwnerId }"
               @on-upload-file-list="handleIdCardBackUpload"
               @on-remove-file-list="handleIdCardBackRemove"
               :limit="1"
@@ -182,9 +190,13 @@
         <el-col :span="8">
           <el-form-item label="证书照片" prop="certFile" required>
             <Uploader
-              :action-url="uploadConfig.uploadUrl"
+              :action-url="
+                shipOwnerForm.shipOwnerId
+                  ? store.state.shipOwnerUpdateUrl
+                  : store.state.shipOwnerCacheUrl
+              "
               :file-list="certFileList"
-              :params="{ type: 'certFile', docType: 1 }"
+              :params="{ type: 1, shipOwnerId: shipOwnerForm.shipOwnerId }"
               @on-upload-file-list="handleCertUpload"
               @on-remove-file-list="handleCertRemove"
               :limit="1"
@@ -200,9 +212,13 @@
   <div class="line-container-p24">
     <div class="mb20">健康证明</div>
     <Uploader
-      :action-url="uploadConfig.uploadUrl"
+      :action-url="
+        shipOwnerForm.shipOwnerId
+          ? store.state.shipOwnerUpdateUrl
+          : store.state.shipOwnerCacheUrl
+      "
       :file-list="healthFileList"
-      :params="{ type: 'healthFile', docType: 2 }"
+      :params="{ type: 2, shipOwnerId: shipOwnerForm.shipOwnerId }"
       @on-upload-file-list="handleHealthUpload"
       @on-remove-file-list="handleHealthRemove"
       :limit="2"
@@ -211,9 +227,13 @@
 
     <div class="mb20 mt30">服务簿</div>
     <Uploader
-      :action-url="uploadConfig.uploadUrl"
+      :action-url="
+        shipOwnerForm.shipOwnerId
+          ? store.state.shipOwnerUpdateUrl
+          : store.state.shipOwnerCacheUrl
+      "
       :file-list="serviceFileList"
-      :params="{ type: 'serviceFile', docType: 3 }"
+      :params="{ type: 3, shipOwnerId: shipOwnerForm.shipOwnerId }"
       @on-upload-file-list="handleServiceUpload"
       @on-remove-file-list="handleServiceRemove"
       :limit="2"
@@ -315,7 +335,6 @@ const certificateRules = {
   ],
   certFile: [{ validator: validateCertFile, trigger: "change" }],
 };
-
 // 初始化船员表单数据结构
 const shipOwnerForm = ref({
   shipOwnerId: 0, // 船员ID,匹配时返回,未匹配到为0,非0时下方内容无效
@@ -392,19 +411,12 @@ const serviceFileList = computed(() => {
   );
 });
 
-// 初始化数据
-onMounted(() => {
-  // 如果有ID参数,获取船员详情
-  if (route.query.id) {
-    api.getShipOwnerDetail({ id: route.query.id }).then((res) => {
-      if (res.data.code === 0) {
-        const data = res.data.data;
-        // 直接使用API返回的数据结构
-        Object.assign(shipOwnerForm.value, data);
-      }
-    });
-  }
-});
+async function getShipOwnerDetail() {
+  let { data } = await api.getShipOwnerDetail({
+    shipOwnerId: route.query.shipOwnerId,
+  });
+  console.log(data);
+}
 
 // 手机号失去焦点时检查是否已存在船员信息
 const handlePhoneBlur = () => {
@@ -412,16 +424,6 @@ const handlePhoneBlur = () => {
 
   // 如果已经有shipOwnerId,说明已经匹配到了船员,不需要再查询
   if (shipOwnerForm.value.shipOwnerId) return;
-
-  api
-    .getShipOwnerDetail({ phone: shipOwnerForm.value.userPhone })
-    .then((res) => {
-      if (res.data.code === 0 && res.data.data && res.data.data.shipOwnerId) {
-        // 匹配到船员信息,更新表单
-        Object.assign(shipOwnerForm.value, res.data.data);
-        ElMessage.info("已匹配到船员信息");
-      }
-    });
 };
 
 // 身份证人像面上传处理
@@ -546,6 +548,7 @@ const handleServiceRemove = ({ fileIndex }) => {
 
 // 保存船员信息
 const saveShipOwner = () => {
+  console.log("保存船员信息", shipOwnerForm.value);
   // 使用Element Plus表单验证
   shipOwnerFormRef.value.validate((valid1) => {
     if (!valid1) return;
@@ -564,13 +567,15 @@ const saveShipOwner = () => {
   });
 
   // 如果有ID,则更新,否则新增
-  const apiMethod = route.query.id ? api.updateShipOwner : api.addShipOwner;
-  const successMsg = route.query.id ? "更新成功" : "添加成功";
+  const apiMethod = route.query.shipOwnerId
+    ? api.updateShipOwner
+    : api.addShipOwner;
+  const successMsg = route.query.shipOwnerId ? "更新成功" : "添加成功";
 
   // 构建保存数据
   const saveData = { ...shipOwnerForm.value };
-  if (route.query.id) {
-    saveData.id = route.query.id;
+  if (route.query.shipOwnerId) {
+    saveData.id = route.query.shipOwnerId;
   }
 
   apiMethod(saveData)
@@ -587,6 +592,15 @@ const saveShipOwner = () => {
       ElMessage.error("保存失败");
     });
 };
+
+// 初始化数据
+onMounted(() => {
+  // 如果有ID参数,获取船员详情
+  if (route.query.shipOwnerId) {
+    shipOwnerForm.value.shipOwnerId = Number(route.query.shipOwnerId);
+    getShipOwnerDetail();
+  }
+});
 </script>
 <style scoped>
 :deep().el-upload-list__item-thumbnail {