feat: 完成服务页面可提交材料相关数据

pages.json

@@ -93,7 +93,7 @@
 			"path" : "pages/order/update-progress",
 			"style" :
 			{
-				"navigationBarTitleText" : "更新进度"
+				"navigationBarTitleText" : "更新施工进度"
 			}
 		}
 	],

pages/order/arrived-on-site.vue

@@ -20,7 +20,7 @@
             </view>
           </view>
 
-          <view @click="upload()" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
+          <view v-if="images.length < 10" @click="upload()" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
                 hover-start-time="0" hover-stay-time="50">
             <me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
             <view class="up flex-c">点击上传</view>

pages/order/complete-service.vue

@@ -15,12 +15,12 @@
             <view @click="helpers.previewImage(imgUrl)" class="img-ctr" :style="{marginRight: (index+1) % 4 === 0 ? '0' : '55rpx'}">
               <image class="img" mode="aspectFit" :src="imgUrl"></image>
             </view>
-            <view class="del" @click="delImg(index)">
+            <view class="del" @click="delImg('complete_images', index)">
               <me-icon class="icon" type="icon-close-circle-fill" color="var(--importantColor)" size="40rpx"></me-icon>
             </view>
           </view>
 
-          <view @click="upload('complete')" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
+          <view v-if="submitData.complete_images.length < 10" @click="upload('complete')" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
                 hover-start-time="0" hover-stay-time="50">
             <me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
             <view class="up flex-c">点击上传</view>
@@ -28,6 +28,46 @@
         </view>
       </view>
     </view>
+    <view class="form-group">
+      <view class="group-name flex-l line-after">
+        <me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
+        <text class="text">提交材料信息</text>
+      </view>
+      <view :class="[submitData.is_material_used === 1 ? 'line-after' : '', 'item', 'input', 'flex-sb']" @click="selectIsMaterialUsed">
+        <view class="title flex-l">是否使用材料</view>
+        <view class="select-ctr flex-r select">{{submitData.is_material_used === 1 ? '已使用' : '未使用'}}<me-icon class="icon" type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon></view>
+      </view>
+      <template v-if="submitData.is_material_used === 1">
+        <view class="item input flex-sb line-after">
+          <view class="title flex-l">材料成本</view>
+          <view class="input-ctr">
+            <input type="digit" v-model="submitData.material_cost" class="uni-input" placeholder-class="placeholder-class" placeholder="请输入金额"/>
+          </view>
+        </view>
+        <view class="item upload">
+          <view class="info flex-l">
+            <view class="title flex-l">材料凭证</view>
+            <view class="desc flex-l">请上传凭证图片（最多 10 张）</view>
+          </view>
+          <view class="imgs-ctr">
+            <view class="img-item" v-for="(imgUrl, index) in submitData.material_images" :key="index">
+              <view @click="helpers.previewImage(imgUrl)" class="img-ctr" :style="{marginRight: (index+1) % 4 === 0 ? '0' : '55rpx'}">
+                <image class="img" mode="aspectFit" :src="imgUrl"></image>
+              </view>
+              <view class="del" @click="delImg('material_images', index)">
+                <me-icon class="icon" type="icon-close-circle-fill" color="var(--importantColor)" size="40rpx"></me-icon>
+              </view>
+            </view>
+
+            <view v-if="submitData.material_images.length < 10" @click="upload('material_images')" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
+                  hover-start-time="0" hover-stay-time="50">
+              <me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
+              <view class="up flex-c">点击上传</view>
+            </view>
+          </view>
+        </view>
+      </template>
+    </view>
     <view class="form-group" v-if="data.order_info.receive_type === 1">
       <view class="group-name flex-l line-after">
         <me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
@@ -39,8 +79,8 @@
       </view>
       <view class="item input flex-sb line-after" @click="selectFinalPaymentMethod()">
         <view class="title flex-l">收款方式</view>
-        <view v-if="submitData.final_payment_method === null" class="select-ctr flex-r">请选择收款方式</view>
+        <view v-if="submitData.final_payment_method === null" class="select-ctr flex-r">请选择收款方式<me-icon class="icon" type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon></view>
-        <view v-else class="select-ctr flex-r select">{{submitData.final_payment_method === 1 ? '线下尾款' : '线上尾款'}}</view>
+        <view v-else class="select-ctr flex-r select">{{submitData.final_payment_method === 1 ? '线下尾款' : '线上尾款'}}<me-icon class="icon" type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon></view>
       </view>
       <!--      线下收款需选择尾款收款方-->
       <view v-if="submitData.final_payment_method === 1" class="item input flex-sb line-after" @click="selectOfflineTotalType()">
@@ -96,6 +136,18 @@ import api from "../../api/api";
 import {throttle} from "../../utils/throttle";
 import enums from "../../utils/enums";
 
+const selectIsMaterialUsed = () => {
+  uni.showActionSheet({
+    itemList: ['未使用', '已使用'],
+    success: function (res) {
+      submitData.is_material_used = res.tapIndex;
+    },
+    fail: function (res) {
+      console.log(res.errMsg);
+    }
+  });
+}
+
 /**
  * 上传完成图片
  * @param type 上传类型:complete=完成图片,collectPayment=收款图片
@@ -139,6 +191,10 @@ const upload = (type) => {
               submitData.complete_images.push(fullUrl)
             }
 
+            if (type === 'material_images') {
+              submitData.material_images.push(fullUrl)
+            }
+
             if (type === 'collectPayment') {
               submitData.payment_image = fullUrl
             }
@@ -159,8 +215,8 @@ const upload = (type) => {
 }
 
 //删除完成图片
-const delImg = (idx) => {
+const delImg = (type, idx) => {
-  submitData.complete_images.splice(idx, 1)
+  submitData[type].splice(idx, 1)
   helpers.showToast('图片已删除')
 }
 
@@ -188,6 +244,7 @@ const submit = throttle(() => {
 
         let data = helpers.deepObj(submitData)
         data.complete_images = (submitData.complete_images).join(',')
+        data.material_images = (submitData.material_images).join(',')
         data.order_dispatch_id = id.value
 
         api.completeService(data).then(() => {
@@ -231,6 +288,9 @@ const submitData = reactive({
   amount: '',//收款金额
   payment_image: '',//收款图片
   receive_type: null,//收款类型：1=定金,2=全款
+  is_material_used: 0,//是否使用材料：0=未使用,1=已使用
+  material_cost: null,//材料成本
+  material_images: [],//材料凭证
 })
 
 const selectFinalPaymentMethod = () => {
@@ -268,6 +328,19 @@ const validate = () => {
     return true
   }
 
+  // 使用材料
+  if (submitData.is_material_used === 1) {
+    if (submitData.material_cost === null) {
+      helpers.showToast('请输入材料成本')
+      return false
+    }
+
+    if (submitData.material_images.length === 0) {
+      helpers.showToast('请上传材料凭证图片')
+      return false
+    }
+  }
+
   if (submitData.final_payment_method === null) {
     helpers.showToast('请选择收款方式')
     return false

pages/order/report-order-exception.vue

@@ -4,8 +4,10 @@
       <picker @change="bindPickerChange" range-key="title" :range="typeList">
         <view class="item input flex-sb line-after">
           <view class="title flex-l">异常原因</view>
-          <view v-if="submitData.abnormal_id === 0" class="select-ctr flex-r">请选择异常原因</view>
+          <view v-if="submitData.abnormal_id === 0" class="select-ctr flex-r">请选择异常原因
-          <view v-else class="select-ctr flex-r select">{{ abnormalTitle }}</view>
+            <me-icon type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon>
+          </view>
+          <view v-else class="select-ctr flex-r select">{{ abnormalTitle }}<me-icon type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon></view>
         </view>
       </picker>
 
@@ -32,6 +34,7 @@ import {ref, reactive, computed} from 'vue'
 import {onLoad} from '@dcloudio/uni-app'
 import api from "../../api/api";
 import {throttle} from "../../utils/throttle";
+import MeIcon from "../../components/me-icon/me-icon.vue";
 
 const bindPickerChange = (e) => {
   typeListIndex.value = e.detail.value;

pages/order/update-progress.vue

@@ -1,12 +1,10 @@
 <template>
   <view class="ctr">
     <view class="form-group">
-      <picker @change="bindPickerChange" :range="typeList">
+      <view class="item input flex-sb line-after" @click="selectIsFinishToday">
-        <view class="item input flex-sb line-after">
         <view class="title flex-l">今日完成</view>
-          <view class="select-ctr flex-r select">{{ submitData.is_finish_today == 0 ? '今日不能完工' : '今日能完工'}}</view>
+        <view class="select-ctr flex-r select">{{ submitData.is_finish_today === 0 ? '今日不能完工' : '今日能完工'}}<me-icon class="icon" type="icon-arrow-right" color="var(--contentBgColor)" size="56rpx"></me-icon></view>
       </view>
-      </picker>
       <view :class="[submitData.is_finish_today == 0 ? 'line-after' : '', 'item', 'time']">
         <view class="item-row flex-sb">
           <view class="title flex-l">完工时间</view>
@@ -39,9 +37,18 @@ import {ref, reactive, computed} from 'vue'
 import {onLoad} from '@dcloudio/uni-app'
 import api from "../../api/api";
 import {throttle} from "../../utils/throttle";
+import MeIcon from "../../components/me-icon/me-icon.vue";
 
-const bindPickerChange = (e) => {
+const selectIsFinishToday = () => {
-  submitData.is_finish_today = e.detail.value
+  uni.showActionSheet({
+    itemList: ['今日不能完工', '今日能完工'],
+    success: function (res) {
+      submitData.is_finish_today = res.tapIndex
+    },
+    fail: function (res) {
+      console.log(res.errMsg);
+    }
+  });
 }
 
 //提交
@@ -101,11 +108,6 @@ onLoad((params) => {
   init()
 })
 
-const typeList = ref([
-    "今日不能完工",
-    "今日能完工",
-])
-
 //提交数据
 const submitData = reactive({
   is_finish_today: 1,
@@ -120,7 +122,7 @@ const validate = () => {
     return false
   }
 
-  if (submitData.is_finish_today == 0 && submitData.work_progress === '') {
+  if (submitData.is_finish_today === 0 && submitData.work_progress === '') {
     helpers.showToast('请输入当前施工进度')
     return false
   }

static/css/form.scss

@@ -132,7 +132,7 @@
     min-height: 100rpx;
     position: relative;
     .title {
-      width: 200rpx;
+      width: 260rpx;
       height: 100rpx;
       font-size: 30rpx;
       font-weight: 500;
@@ -157,6 +157,7 @@
       line-height: 48rpx;
       padding: 16rpx 0;
       box-sizing: border-box;
+      margin-right: -20rpx;
     }
     .select {
       color: var(--titleColor);