优化

MrShi

2025-10-09 4fabfe4dbd2eb28d07a4350597d314958cc1c281

 bicycle/pages/problemReporting/problemReporting.vue

@@ -25,11 +25,19 @@
            <view class="form_item_label">现场情况</view>
            <view class="form_item_uplaod">
               <view class="form_item_uplaod_list">
                  <image class="uploadImg" @click="uploadImg" src="@/static/icon/ic_upload@2x.png" mode="widthFix"></image>
                  <view class="uploadImg">
                     <image @click="uploadImg" src="@/static/icon/ic_upload@2x.png" mode="widthFix"></image>
                  </view>
						
                  <view class="form_item_uplaod_list_item" v-for="(item, index) in from.files" :key="index">
                     <image class="img" :src="item.url" mode="widthFix"></image>
                     <view class="images">
                        <image class="img" :src="item.url" mode="widthFix"></image>
                     </view>
                     <image class="close" @click="dele(index)" src="@/static/icon/ic_clean@2x1.png" mode="widthFix"></image>
                  </view>
                  <view class="form_item_uplaod_list_item1"></view>
                  <view class="form_item_uplaod_list_item1"></view>
                  <view class="form_item_uplaod_list_item1"></view>
               </view>
               <textarea v-model="from.info" placeholder="请详细描述现场情况，不少于10个字"></textarea>
            </view>
@@ -72,7 +80,6 @@
      </u-popup>
   </view>
</template>

<script>
   import { mapState } from 'vuex'
   export default {
@@ -93,9 +100,11 @@
               files: [],
               info: '',
               contacts: '',
               phone: ''
               phone: '',
               typeId: ''
            },
            problemList: []
            problemList: [],
            isEnd: true
         };
      },
      computed: {
@@ -117,36 +126,46 @@
            this.$u.api.onlineBike()
               .then(res => {
                  if (res.code === 200) {
                     this.binkeId = res.data
                     this.binkeId = res.data.bikeCode
                     this.from.typeId = res.data.paramId
                  }
               })
         },
         // 提交
         submit() {
            if (this.from.problemId == '') {
               uni.showToast({ title: '车辆问题不能为空', icon: 'none', duration: 2000 });
               return
            }
            this.$u.api.saveRepair({
               addr: this.from.address,
               bikeCode: this.from.code,
               binkeId: this.binkeId,
               content: this.from.info,
               fileUrlList: this.from.files.map(item => item.imgaddr),
               latitude: this.from.latitude,
               linkname: this.from.contacts,
               linkphone: this.from.phone,
               longitude: this.from.longitude,
               param: this.from.problemName,
               paramId: this.from.problemId
            }).then(res => {
               if (res.code === 200) {
                  uni.showToast({ title: '上报成功', icon: 'success', duration: 2000 });
                  setTimeout(() => {
                     uni.navigateBack({ delta: 1 });
                  }, 2000)
            if (this.isEnd) {
               if (this.from.problemId == '') {
                  uni.showToast({ title: '车辆问题不能为空', icon: 'none', duration: 2000 });
                  return
               }
            })
               if (this.from.info.length < 10) {
                  uni.showToast({ title: '最少字数不能低于10个字', icon: 'none', duration: 2000 });
                  return
               } 
               this.isEnd = false
               this.$u.api.saveRepair({
                  addr: this.from.address,
                  bikeCode: this.from.code,
                  binkeId: this.binkeId,
                  content: this.from.info,
                  fileUrlList: this.from.files.map(item => item.imgaddr),
                  latitude: this.from.latitude,
                  linkname: this.from.contacts,
                  linkphone: this.from.phone,
                  longitude: this.from.longitude,
                  param: this.from.problemName,
                  paramId: this.from.problemId,
                  typeId: this.from.typeId
               }).then(res => {
                  if (res.code === 200) {
                     uni.showToast({ title: '上报成功', icon: 'success', duration: 2000 });
                     this.isEnd = true
                     // setTimeout(() => {
                        uni.navigateBack({ delta: 1 });
                     // }, 2000)
                  }
               })
            }
         },
         // 拨打电话
         calling(mobile) {
@@ -432,6 +451,7 @@
               image {
                  width: 40rpx;
                  height: 40rpx;
                  flex-shrink: 0;
               }
            }
         }
@@ -489,7 +509,7 @@
            .form_item_nr {
               width: 100%;
               display: flex;
               align-items: center;
               align-items: flex-start;
               justify-content: space-between;
               margin-top: 16rpx;

@@ -499,9 +519,9 @@
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #666666;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  white-space: nowrap;
                  // overflow: hidden;
                  // text-overflow: ellipsis;
                  // white-space: nowrap;
               }

               image {
@@ -520,30 +540,54 @@
               .form_item_uplaod_list {
                  display: flex;
                  align-items: center;
                  flex-wrap: wrap;
                  justify-content: space-between;

                  .uploadImg {
                     width: 150rpx;
                     height: 150rpx;
                     margin-right: 16rpx;
                     width: 22%;
                     height: 150rpx !important;
                     display: flex;
                     align-items: center;
                     justify-content: center;
                     // margin-right: 16rpx;
                     margin-bottom: 30rpx;
                     image {
                        width: 100%;
                        height: 100%;
                     }
                  }
						
                  .form_item_uplaod_list_item1 {
                     width: 22%;
                     height: 0;
                  }

                  .form_item_uplaod_list_item {
                     width: 150rpx;
                     width: 22%;
                     height: 150rpx;
                     border-radius: 16rpx;
                     display: flex;
                     align-items: center;
                     justify-content: center;
                     position: relative;
                     margin-right: 16rpx;

                     // margin-right: 25rpx;
                     margin-bottom: 30rpx;
							
                     &:last-child {
                        margin-right: 0 !important;
                     }

                     .img {
                        width: 100%;
                        height: 100%;
							
                     .images {
                        width: 150rpx;
                        height: 150rpx;
                        border-radius: 16rpx;
                        overflow: hidden;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        overflow: hidden;
                        .img {
                           height: 100%;
                        }
                     }

                     .close {