更新 新增船舶

src/components/ShipInfo.vue

@@ -3,10 +3,10 @@
     <div class="container-title">船舶信息</div>
     <div
       class="pl50 pt30 bgf df jcsb pr20"
-      v-if="route.name == 'shipOwnerDetail'"
+      v-if="route.name == 'shipOwnerDetail' || route.name == 'shipDetail'"
       style="max-width: 1200px"
     >
-      <el-button-group class="mr20">
+      <el-button-group class="mr20" v-if="route.name == 'shipOwnerDetail'">
         <el-button
           v-for="(item, index) in shipInfos"
           :key="item.code"
@@ -38,6 +38,7 @@
             取消更新
           </el-button>
           <el-button
+            v-if="route.name == 'shipOwnerDetail'"
             @click="deleteShip(currentIndex)"
             type="primary"
             class="mr20"
@@ -45,16 +46,24 @@
             删除当前船舶
           </el-button>
         </div>
-        <el-button
-          v-if="shipInfos.length == 0 || shipInfos[currentIndex].code"
-          @click="addShip()"
-          type="primary"
-        >
-          新增船舶
-        </el-button>
-        <el-button v-else @click="cancelAdd()" type="primary">
-          取消新增船舶
-        </el-button>
+        <div class="df" v-if="route.name == 'shipOwnerDetail'">
+          <el-button
+            v-if="shipInfos.length == 0 || shipInfos[currentIndex].code"
+            @click="addShip()"
+            type="primary"
+          >
+            新增船舶
+          </el-button>
+          <div v-else>
+            <el-button
+              v-if="shipInfos.length > 1"
+              @click="cancelAdd()"
+              type="primary"
+            >
+              取消新增船舶
+            </el-button>
+          </div>
+        </div>
       </div>
     </div>
 
@@ -402,7 +411,6 @@ async function submit() {
 let shipInfoDisabled = ref(true);
 let cacheInfo = ref({});
 function showUpdate() {
-  shipInfoDisabled.value = false;
   cacheInfo.value = _.cloneDeep(props.shipInfos[currentIndex.value]);
 }
 async function confirmUpdate() {
@@ -426,9 +434,14 @@ function cancelUpdate() {
   props.shipInfos[currentIndex.value] = _.cloneDeep(cacheInfo.value);
   shipInfoDisabled.value = true;
 }
+
+function changeDisable(b) {
+  shipInfoDisabled.value = b;
+}
 defineExpose({
   initCerts,
   getShipCerts,
+  changeDisable,
 });
 onMounted(() => {});
 </script>

src/views/shipOwnerManage/shipOwnerDetail.vue

@@ -11,7 +11,7 @@
 
   <div class="container-title">船东信息</div>
   <div class="line-container-p24">
-    <div class="df jcfe">
+    <div class="df jcfe" v-if="shipOwnerDetail.code">
       <el-button
         v-if="unchangeableShipOwner"
         type="primary"
@@ -109,6 +109,7 @@
   </div>
   <div v-if="shipOwnerDetail.shipInfo.length != 0">
     <ShipInfo
+      ref="shipInfoRef"
       :shipInfos="shipOwnerDetail.shipInfo"
       :shipOwnerId="route.query.shipOwnerId"
     ></ShipInfo>
@@ -233,6 +234,7 @@ let initShipInfo = {
     },
   ],
 };
+let shipInfoRef = ref(null);
 async function addShipOwner() {
   if (!checkShipOwner()) return;
   let postData = shipOwnerDetail.value;
@@ -247,6 +249,7 @@ async function addShipOwner() {
         data.result.shipInfo = [initShipInfo];
         shipOwnerDetail.value = data.result;
         unchangeableShipOwner.value = true;
+        addShip();
       })
       .catch(() => {
         router.push("/shipOwnerManage/shipOwnerList");
@@ -291,6 +294,9 @@ async function getShipOwnerDetail(shipOwnerId) {
 }
 function addShip() {
   shipOwnerDetail.value.shipInfo = [initShipInfo];
+  setTimeout(() => {
+    shipInfoRef.value.changeDisable(false);
+  }, 100);
 }
 
 let isUpdate = ref(false);