fix bug

src/views/transportCapacity/components/ship-ledger.vue

@@ -16,7 +16,14 @@
       <section-card title="证书附件" class="ship-ledger__section">
         <div class="ship-ledger__images">
           <div v-for="item in imageFields" :key="item.prop" class="ship-ledger__image-item">
-            <el-image v-if="shipDetail[item.prop]" :src="shipDetail[item.prop]" :preview-src-list="imageUrls" preview-teleported fit="cover" />
+            <el-image
+              v-if="shipDetail[item.prop]"
+              :src="shipDetail[item.prop]"
+              :preview-src-list="imageUrls"
+              :initial-index="item.previewIndex"
+              preview-teleported
+              fit="cover"
+            />
             <el-empty v-else :image-size="36" description="暂无附件" />
             <span>{{ item.label }}</span>
           </div>
@@ -68,7 +75,21 @@ export default {
   data() { return { detailLoading: false, tableLoading: false, shipDetail: {}, activeTab: 'insurance', records: [], page: { current: 1, size: 10, total: 0 } }; },
   computed: {
     tabs() { return tabConfigs; }, activeConfig() { return tabConfigs.find(item => item.name === this.activeTab) || tabConfigs[0]; }, activeColumns() { return this.activeConfig.columns; },
-    imageFields() { return [['船舶所有权证书', 'ownershipCertImage'], ['内河船舶安全与环保证书', 'safetyCertImage'], ['船舶国籍证书', 'nationalityCertImage'], ['最低安全配员证书', 'safeManningCertImage'], ['船舶营业运输证', 'businessTransportCertImage'], ['光船租赁登记证书', 'leaseContractImage']].map(([label, prop]) => ({ label, prop })); },
+    imageFields() {
+      let previewIndex = 0;
+      return [
+        ['船舶所有权证书', 'ownershipCertImage'],
+        ['内河船舶安全与环保证书', 'safetyCertImage'],
+        ['船舶国籍证书', 'nationalityCertImage'],
+        ['最低安全配员证书', 'safeManningCertImage'],
+        ['船舶营业运输证', 'businessTransportCertImage'],
+        ['光船租赁登记证书', 'leaseContractImage'],
+      ].map(([label, prop]) => {
+        const item = { label, prop, previewIndex };
+        if (this.shipDetail[prop]) previewIndex += 1;
+        return item;
+      });
+    },
     imageUrls() { return this.imageFields.map(item => this.shipDetail[item.prop]).filter(Boolean); },
     sections() { const s = this.shipDetail; return [
       { title: '船舶基本信息', items: [['船舶所属组织', 'organizationName'], ['船名', 'shipName'], ['安放龙骨日期/建造完工日期', 'constructionDate'], ['总长(m)', 'totalLength'], ['船宽(m)', 'shipWidth'], ['型深(m)', 'moldedDepth'], ['最大船高(m)', 'maxShipHeight'], ['空载吃水(t)', 'lightDraft'], ['满载吃水(t)', 'fullLoadDraft'], ['航区', 'navigationArea']] },