Agency_WxApp/miniprogram/pages/voyages/detail/detail.wxml

<map enable-zoom="{{false}}" enable-scroll="{{false}}" markers="{{markers}}" include-points="{{points}}" latitude="{{latitude}}" longitude="{{longitude}}" style="width: 100%;height: 400rpx;" name="map"></map>
<view class="df aic jcfe p10 fs24">
  <view wx:if="{{canComplete}}" bindtap="completeVoyage" class="voyage-btn back-blue">完成航次</view>
  <view wx:if="{{canCancel}}" bindtap="cancelVoyage" class="voyage-btn back-red">取消航次</view>
</view>
<view class="df aic jcsb p20" style="border-bottom: 1px solid #999;border-top: 1px solid #999;">
  <view class="tabsview" bindtap="changeTab" data-tab="{{1}}" style="color:{{tab==1?'#0d8fcc':''}};border-bottom:{{tab==1?'2rpx solid #0d8fcc':''}}">航次信息</view>
  <view class="tabsview" bindtap="changeTab" data-tab="{{2}}" style="color:{{tab==2?'#0d8fcc':''}};border-bottom:{{tab==2?'2rpx solid #0d8fcc':''}}">运输记录</view>
  <view class="tabsview" bindtap="changeTab" data-tab="{{3}}" style="color:{{tab==3?'#0d8fcc':''}};border-bottom:{{tab==3?'2rpx solid #0d8fcc':''}}">卸货信息</view>
  <view class="tabsview" bindtap="changeTab" data-tab="{{4}}" style="color:{{tab==4?'#0d8fcc':''}};border-bottom:{{tab==4?'2rpx solid #0d8fcc':''}}">单据信息</view>
  <view class="tabsview" bindtap="changeTab" data-tab="{{5}}" style="color:{{tab==5?'#0d8fcc':''}};border-bottom:{{tab==5?'2rpx solid #0d8fcc':''}}">航次照片</view>
</view>
<scroll-view scroll-y="true" style="height:calc(100vh - 570rpx);font-size: 28rpx;color:#222;padding-bottom: 50rpx;" lower-threshold="50">
  <view wx:if="{{tab==1}}">
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">航次名称:</view>
        <view class="line-full-text">{{voyageName}}</view>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">货主:</view>
        <view class="line-text">{{cargoOwnerName}}</view>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">船舶名称:</view>
        <view class="line-text">{{shipName}}</view>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">MMSI:</view>
        <view class="line-text">{{shipMmsi}}</view>
      </view>
    </view>
    <view class="line">
      <view class="line-item">
        <view class="line-title">装货港:</view>
        <view class="line-text">{{loadPort}}</view>
      </view>
    </view>
    <view class="line" wx:for="{{dischargePorts}}" wx:key="item">
      <view class="line-item">
        <view class="line-title">卸货港 #{{index+1}}:</view>
        <view class="line-text">{{item}}</view>
      </view>
    </view>
    <view class="df aic jcsb line" wx:if="{{dischargePorts.length}}">
      <view></view>
      <view class="next" bindtap="showAddDischargePortModal">添加卸货港</view>
    </view>
    <view wx:if="{{dischargeModal}}" class="mask" catchtouchmove="doNothing">
      <view style="padding: 20rpx 0;">
        <view class="df aic jcsb line">
          <view>卸货港</view>
          <view>
            <NewPicker placeholder="选择装货港" bind:selectItem="selectDischargePort" url="/port/getCol"></NewPicker>
          </view>
        </view>
        <view class="df aic jcsa">
          <view class="next mt30" bindtap="addDischargePort">添加卸货港</view>
          <view class="next mt30" bindtap="cancelAddDischargePort">取消</view>
        </view>
      </view>
    </view>
    <view class="line">
      <view class="line-item">
        <view class="line-title">货种:</view>
        <view class="line-text">{{cargo}}</view>
      </view>
      <view class="line-item">
        <view class="line-title">货量:</view>
        <view class="line-text" style="width: 40vw;">{{tons}} 吨</view>
        <view class="line-text">{{pieces}} 件</view>
      </view>
    </view>
  </view>
  <view class="type2" wx:if="{{tab==2}}">
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">到达装货港时间:</view>
        <picker disabled="{{tab2disabled}}" mode="date" model:value="{{arrivalLoadPortTime}}" style="width: 40vw;">
          <view>
            {{arrivalLoadPortTime ||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">实际货量:</view>
        <input disabled="{{tab2disabled}}" model:value="{{actualLoadTons}}" type="text" style="width: 20vw;" />{{' 吨'}}
        <input disabled="{{tab2disabled}}" model:value="{{actualLoadPieces}}" type="text" style="width: 10vw;" />{{' 件'}}
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">装货开始时间:</view>
        <picker disabled="{{tab2disabled}}" mode="date" model:value="{{loadStartTime}}" style="width: 40vw;">
          <view>
            {{loadStartTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">装货结束时间:</view>
        <picker disabled="{{tab2disabled}}" mode="date" model:value="{{loadEndTime}}" style="width: 40vw;">
          <view>
            {{loadEndTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="df aic jcsa p20" style="border-top: 1px solid #999;">
      <view wx:for="{{voyageDetails}}" class="tabsview" bindtap="changeDischargeTab" data-index="{{index}}" style="color:{{currentDischargeIndex==index?'#0d8fcc':''}};border-bottom:{{currentDischargeIndex==index?'2rpx solid #0d8fcc':''}}">{{item.portName}}</view>
    </view>
    <view class="line" style="padding: 20rpx 0 10rpx 0;border-top: 1px solid grey;margin-top: 10rpx;">
      {{voyageDetails[currentDischargeIndex].portName}} # {{currentDischargeIndex+1}}
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">开航时间:</view>
        <picker bindchange="bindDischargePortChange" data-index="{{currentDischargeIndex}}" data-param="setSailTime" disabled="{{tab2disabled}}" mode="date" value="{{voyageDetails[currentDischargeIndex].setSailTime}}" style="width: 40vw;">
          <view>
            {{voyageDetails[currentDischargeIndex].setSailTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">预计到港时间:</view>
        <picker bindchange="bindDischargePortChange" data-index="{{currentDischargeIndex}}" data-param="expectedArrivalTime" disabled="{{tab2disabled}}" mode="date" value="{{voyageDetails[currentDischargeIndex].expectedArrivalTime}}" style="width: 40vw;">
          <view>
            {{voyageDetails[currentDischargeIndex].expectedArrivalTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">实际到港时间:</view>
        <picker bindchange="bindDischargePortChange" data-index="{{currentDischargeIndex}}" data-param="actualArrivalTime" disabled="{{tab2disabled}}" mode="date" value="{{voyageDetails[currentDischargeIndex].actualArrivalTime}}" style="width: 40vw;">
          <view>
            {{voyageDetails[currentDischargeIndex].actualArrivalTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">卸货开始时间:</view>
        <picker bindchange="bindDischargePortChange" data-index="{{currentDischargeIndex}}" data-param="dischargeStartTime" disabled="{{tab2disabled}}" mode="date" value="{{voyageDetails[currentDischargeIndex].dischargeStartTime}}" style="width: 40vw;">
          <view>
            {{voyageDetails[currentDischargeIndex].dischargeStartTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">卸货结束时间:</view>
        <picker bindchange="bindDischargePortChange" data-index="{{currentDischargeIndex}}" data-param="dischargeEndTime" disabled="{{tab2disabled}}" mode="date" value="{{voyageDetails[currentDischargeIndex].dischargeEndTime}}" style="width: 40vw;">
          <view>
            {{voyageDetails[currentDischargeIndex].dischargeEndTime||"请选择"}}
          </view>
        </picker>
      </view>
    </view>
    <view class="line">
      <view class="line-full-item">
        <view class="line-full-title">实际卸货量:</view>
        <input disabled="{{tab2disabled}}" bindblur="bindDischargePortChange" value="{{voyageDetails[currentDischargeIndex].actualDischargeTons}}" data-index="{{currentDischargeIndex}}" data-param="actualDischargeTons" type="text" style="width: 20vw;" />{{' 吨'}}
        <input disabled="{{tab2disabled}}" bindblur="bindDischargePortChange" value="{{voyageDetails[currentDischargeIndex].actualDischargePieces}}" data-index="{{currentDischargeIndex}}" data-param="actualDischargePieces" type="text" style="width: 10vw;" />{{' 件'}}
      </view>
    </view>
    <view class="next" bindtap="updateVoyage">更新航次</view>
  </view>
  <view class="p30" wx:if="{{tab==4}}">
    <view>保险单</view>
    <view wx:for="{{policys}}" wx:key="index" style="text-align: center;">
      <image data-src="{{item.viewUrl}}" bindtap="previewImage" src="{{item.viewUrl}}" style="width: 60%;height: 240rpx;" mode="aspectFit"></image>
      <view wx:if="{{policys.length&&policys.length!=1}}" class="mt10 mb10" style="border-bottom: 2rpx solid #eee;"></view>
    </view>
    <view class="next" bindtap="uploadBill" data-type="{{3}}">上传保险单</view>
    <view class="mt30 mb30" style="border-bottom: 2rpx solid #ccc;"></view>
    <view>运单</view>
    <view wx:for="{{waybills}}" wx:key="index" style="text-align: center;">
      <image data-src="{{item.viewUrl}}" bindtap="previewImage" src="{{item.viewUrl}}" style="width: 60%;height: 240rpx;" mode="aspectFit"></image>
      <view wx:if="{{waybills.length&&waybills.length!=1}}" class="mt10 mb10" style="border-bottom: 2rpx solid #eee;"></view>
    </view>
    <view class="next" bindtap="uploadBillCanvas" data-type="{{1}}">上传运单</view>
  </view>
  <view class="p30" wx:if="{{tab==3}}">
    <scroll-view scroll-x="{{true}}" style="white-space: nowrap;">
      <view class="{{['port-btns',currentPortId == item.portId?'current-port-btn':'','mr20']}}" wx:for="{{voyageDetails}}" bindtap="changePort" data-id="{{item.portId}}">{{item.portName}}</view>
    </scroll-view>
    <view class="df aic jcsb pb20" style="border-bottom: 2rpx solid #ddd;">
      <view bindtap="changeInfoType" data-type="ship" style="color:{{infoType=='ship'?'#0d8fcc':''}};border-bottom:{{infoType=='ship'?'2rpx solid #0d8fcc':''}}">船舶卸货记录</view>
      <view bindtap="changeInfoType" data-type="truck" style="color:{{infoType=='truck'?'#0d8fcc':''}};border-bottom:{{infoType=='truck'?'2rpx solid #0d8fcc':''}}">汽车装货记录</view>
    </view>
    <view class="ship-discharge-list" wx:if="{{infoType=='ship'}}">
      <view class="df aic jcsb mb20 mt10 fs22">
        <view>卸货时间</view>
        <view>卸货吨位</view>
        <view>卸货件数</view>
        <view>磅单</view>
      </view>
      <view wx:for="{{shipDischargeList}}" wx:key="index" class="df aic jcsb mb20 fs22">
        <view>{{item.dischargeTime}}</view>
        <view>{{item.dischargeTons||''}}</view>
        <view>{{item.dischargePieces||''}}</view>
        <view wx:if="{{item.files&&item.files.length}}" bindtap="previewImage" data-src="{{item.files[0].viewUrl}}" data-files="{{item.files}}">查看</view>
        <view wx:else>暂无</view>
      </view>
      <view bindtap="scrollShip" class="bottom-text">{{shipDischargeTotal==0?'暂无数据':(shipDischargeTotal>pageSize*shipDischargeCurrentPage?'点击或滑动加载更多...':'已加载完毕')}}</view>
      <view class="next" bindtap="goTo" data-url="/pages/voyages/uploadDischarge/uploadDischarge">上传磅单</view>
    </view>
    <view class="truck-load-list" wx:if="{{infoType=='truck'}}">
      <view class="df aic jcsb mb20 mt10 fs22">
        <view>车号</view>
        <view>毛重</view>
        <view>皮重</view>
        <view>净重</view>
        <view>称重时间</view>
        <view>单据</view>
      </view>
      <view wx:for="{{truckLoadList}}" wx:key="index" class="df aic jcsb mb20 fs22">
        <view>{{item.carNum}}</view>
        <view>{{item.grossWeight}}</view>
        <view>{{item.tare}}</view>
        <view>{{item.netWeight}}</view>
        <view>{{item.weighTime}}</view>
        <view wx:if="{{item.file}}" bindtap="previewImage" data-src="{{item.file.viewUrl}}">查看</view>
        <view wx:else>暂无</view>
      </view>
      <view bindtap="scrollTruck" class="bottom-text">{{truckLoadTotal==0?'暂无数据':(truckLoadTotal>pageSize*truckLoadCurrentPage?'点击或滑动加载更多...':'已加载完毕')}}</view>
      <view class="next" bindtap="goTo" data-url="/pages/voyages/uploadCarLoadRecord/uploadCarLoadRecord">上传运单</view>
    </view>
  </view>
  <view wx:if="{{tab==5}}">
    <view wx:for="{{medias}}" wx:key="index" style="margin-bottom:50rpx;">
      <view style="color: #0c81b8;padding-bottom: 10rpx;margin-bottom: 20rpx; border-bottom: 4rpx dashed rgb(197, 194, 194);">{{item.createTime}}</view>
      <image data-src="{{item.viewUrl}}" bindtap="previewImage" src="{{item.viewUrl}}" style="width: 90%;display: block;margin: 0 auto;" mode="aspectFit"></image>
    </view>
  </view>
</scroll-view>