更新 添加汽车卸货记录-样式

miniprogram/pages/voyages/uploadCarLoadRecord/uploadCarLoadRecord.js

@@ -37,6 +37,23 @@ Page({
       downloadUrl
     })
   },
+  preview(e) {
+    wx.previewImage({
+      urls: [e.currentTarget.dataset.src],
+    })
+  },
+  reupload(e) {
+    wx.showModal({
+      content: "是否重新上传?",
+      confirmText: "确定",
+      cancelText: "取消",
+      success: res => {
+        if (res.confirm) {
+          this.uploadBill(e)
+        }
+      }
+    })
+  },
   async submit() {
     let {
       weighTime,

miniprogram/pages/voyages/uploadCarLoadRecord/uploadCarLoadRecord.wxml

@@ -1,37 +1,53 @@
-<view class="box">
-  <view class="df jcsb line">
-    <view>称重时间</view>
-    <view>
-      <picker mode="date" model:value="{{weighTime}}" style="width: 40vw;">
-        <view style="border: 1rpx solid grey;">
-          {{weighTime ||"请选择"}}
-        </view>
-      </picker>
+<view class="type2">
+  <view class="line">
+    <view class="line-full-item jcsb">
+      <view class="df aic">
+        <view class="line-full-title">称重时间:</view>
+        <picker mode="date" model:value="{{weighTime}}">
+          <view>
+            {{weighTime||"请选择称重时间"}}
+          </view>
+        </picker>
+      </view>
+      <image class="arrow" src="../../../images/newUI/right-arrow.png"></image>
     </view>
   </view>
-  <view class="df jcsb line">
-    <view>车号</view>
-    <view><input model:value="{{carNum}}" type="text" placeholder="必填" /></view>
+  <view class="line">
+    <view class="line-full-item">
+      <view class="line-full-title">车号:</view>
+      <input class="d-input" model:value="{{carNum}}" type="text" placeholder="请输入车牌号" />
+    </view>
   </view>
-  <view class="df jcsb line">
-    <view>收货单位</view>
-    <view><input model:value="{{receivingUnit}}" type="text" /></view>
+  <view class="line">
+    <view class="line-full-item">
+      <view class="line-full-title">收货单位:</view>
+      <input class="d-input" model:value="{{receivingUnit}}" placeholder="请输入收货单位" type="text" />
+    </view>
   </view>
-  <view class="df jcsb line">
-    <view>毛重</view>
-    <view><input model:value="{{grossWeight}}" type="digit" placeholder="必填" /></view>
+  <view class="line">
+    <view class="line-full-item">
+      <view class="line-full-title">毛重:</view>
+      <input class="e-input" model:value="{{grossWeight||''}}" type="digit" />
+      <view class="unit">吨</view>
+    </view>
   </view>
-  <view class="df jcsb line">
-    <view>皮重</view>
-    <view><input model:value="{{tare}}" type="digit" /></view>
+  <view class="line">
+    <view class="line-full-item">
+      <view class="line-full-title">皮重:</view>
+      <input class="e-input" model:value="{{tare||''}}" type="digit" />
+      <view class="unit">吨</view>
+    </view>
   </view>
-  <view class="df jcsb line">
-    <view>净重</view>
-    <view><input model:value="{{netWeight}}" type="digit" placeholder="必填" /></view>
+  <view class="line">
+    <view class="line-full-item">
+      <view class="line-full-title">净重:</view>
+      <input class="e-input" model:value="{{netWeight||''}}" type="digit" />
+      <view class="unit">吨</view>
+    </view>
   </view>
   <view>
-    <image wx:if="{{viewUrl}}" class="upload-image" src="{{viewUrl}}"></image>
-    <view wx:else class="next" style="width: 200rpx;height: 60rpx;line-height: 60rpx;font-size: 26rpx;" bindtap="uploadBill" data-type="{{4}}">上传汽运单</view>
-    <view class="next" bindtap="submit">提交</view>
+    <image wx:if="{{viewUrl}}" class="upload-image" bindtap="preview" bindlongtap="reupload" data-type="{{4}}" data-src="{{viewUrl}}" src="{{viewUrl}}"></image>
+    <view wx:else class="update" bindtap="uploadBill" data-type="{{4}}" style="margin-top: 275rpx;">上传汽运单</view>
+    <view class="update submit" bindtap="submit">提交</view>
   </view>
 </view>

miniprogram/pages/voyages/uploadCarLoadRecord/uploadCarLoadRecord.wxss

@@ -1,64 +1,95 @@
-/* pages/voyages/uploadDischarge/uploadDischarge.wxss */
-/* pages/shipOwnerManage/addShipOnwer/addShipOnwer.wxss */
-.box {
-  width: 80vw;
-  border: 2rpx solid grey;
-  border-radius: 10rpx;
-  text-align: center;
-  margin: 0 auto;
-  padding: 5vw 0;
+.line {
+  margin-bottom: 20rpx;
 }
 
-.ship-owner-phone {
-  width: 400rpx;
-  height: 60rpx;
-  border: 1rpx solid grey;
-  margin: 0 auto;
-  border-radius: 6rpx;
-  padding-left: 20rpx;
+.line-full-item {
+  display: flex;
+  align-items: center;
 }
 
-.line {
-  width: 80%;
-  margin: 30rpx auto;
-  font-size: 28rpx;
+.line-full-title {
+  width: 240rpx;
+  font-size: 30rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #BDC2C8;
 }
 
-.line view {
-  line-height: 48rpx;
+.line-text {
+  flex: 1;
+  font-size: 30rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #6C6C6C;
+}
 
+.type2 {
+  padding: 0 30rpx;
 }
 
-.line input {
-  border: 1px solid grey;
-  height: 48rpx;
+.type2 .line-full-item {
+  padding: 32rpx 0;
+  border-bottom: 1rpx solid #EBEBEB;
 }
 
-.upload {
-  width: 68vw;
-  height: 32vw;
-  border: 1px solid grey;
-  margin: 3vw auto;
+.type2 .line {
+  margin-bottom: 0;
+  font-size: 30rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #6C6C6C;
 }
 
-page {
-  padding-top: 5vw;
+.type2 .line-full-title {
+  width: 260rpx;
+  color: #20252E;
 }
 
-.upload-image {
-  width: 68vw;
-  height: 32vw;
-  border: 1px solid grey;
-  margin: 3vw auto;
+.arrow {
+  width: 20rpx;
+  height: 20rpx;
+  margin-right: 30rpx;
 }
 
-.next {
-  width: 300rpx;
-  height: 80rpx;
-  line-height: 80rpx;
-  color: #fff;
-  background: #0094FE;
-  border-radius: 10rpx;
-  margin: 0 auto;
-  margin-top: 8vw;
+.d-input {
+  width: 30vw;
+}
+
+.e-input {
+  width: 20vw;
+}
+
+.update {
+  width: 590rpx;
+  height: 96rpx;
+  background: linear-gradient(270deg, #0089FD 0%, #43A9FF 100%);
+  border-radius: 20rpx;
+  text-align: center;
+  line-height: 96rpx;
+  font-size: 34rpx;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #FFFFFF;
+  margin: 32rpx auto;
+}
+
+.type2 .unit {
+  color: #333;
+}
+
+picker {
+  width: 45vw;
+}
+
+.submit {
+  border: 2rpx solid #028AFD;
+  background: #FFFFFF;
+  color: #0089FD;
+}
+
+.upload-image {
+  display: block;
+  margin: 40rpx auto;
+  height: 240rpx;
+  width: 90%;
 }