1.维修验证 100%

loulijun2021

2023-10-19 27cfdbb72202e0d48769814a9fa2d27de1819ade

 pages/mjgl/wxyz.vue

@@ -1,8 +1,634 @@
<template>
   <view>
      <page-nav title="维修验证"></page-nav>


      <view v-show="topContent.length===0">
         <div class="sacnBody">
            <div class="boxImg"></div>
            <div class="scanText">暂无维修可验证</div>
         </div>
      </view>


      <view v-show="topContent.length!==0">
         <view class="mainContent">
            <view>
               <u-gap height="10" bgColor="#eff0f1"></u-gap>
               <view class="head">
                  <view class="head_block">
                     <view class="head_left">
                        <view class="head_bar"></view>
                        <view class="head_title">
                           模具维修信息
                        </view>
                     </view>

                     <view class="marginRight20">
                        <u-icon name="scan" @click="topScanClick" color="red" size="24"></u-icon>
                     </view>

                  </view>


                  <view :style="{maxHeight:'1200rpx',overflow: 'scroll'}">
                     <view class="marginTop20 marginLeft20 marginRight20 flex_column">
                        <!-- style="padding-bottom:70rpx;"> -->
                        <u-radio-group v-model="radioValue" class="flex_column">
                           <view class="marginBottom20 flex_column" style="width: 100%;"
                              @click="groupChange(item.mouldcode)" v-for="item in topContent"
                              :key="item.mouldcode">
                              <view class="flex_between marginBottom20">
                                 <view style="display: flex;">
                                    <view class="flex_column titleFont">
                                       <view>维修单号：</view>
                                       <view>模具编码：</view>
                                       <view>模具名称：</view>
                                       <view>规格型号：</view>
                                       <view>维修人员：</view>
                                       <view>维修时间：</view>
                                       <view>停机维修：</view>
                                       <view>故障描述：</view>
                                    </view>
                                    <view class="flex_column contentFont">
                                       <view>{{item.repair_code}}</view>
                                       <view>{{item.mouldcode}}</view>
                                       <view>{{item.mouldname}}</view>
                                       <view>{{item.mouldspec?item.mouldspec:'/'}}</view>
                                       <view>{{item.repair_name}}</view>
                                       <view>{{item.repair_date}}</view>
                                       <view>{{item.is_shutdown==='Y'?'是':'否'}}</view>
                                       <view style="width:400rpx;word-wrap:break-word">
                                          {{item.failure_descript}}
                                       </view>
                                    </view>
                                 </view>
                                 <u-radio size='22' :key="item.mouldcode" :name="item.mouldcode"
                                    @change="groupChange(item.mouldcode)" activeColor="red"></u-radio>
                              </view>


                              <view v-show="!item.arrowType" class="repairDetail">
                                 维修详情
                              </view>
                              <view class="head" v-show="!item.arrowType" style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          故障描述
                                       </view>
                                    </view>
                                 </view>
                                 <view style="margin: 0 20rpx; width: 95%;" class="contentFont">
                                    {{descMessage}}
                                 </view>
                                 <view style="display: flex;" v-show="fileList.length!==0">
                                    <view v-for="(pic,index) in fileList" :key="index">
                                       <view style="margin: 20rpx 0rpx 20rpx 20rpx;position: relative;">
                                          <!--                               <u-icon name="close" color="#fff" size="26"
                                          style="position: absolute;z-index: 10;right: 0;background-color: black;border-radius:50%;"
                                          @click="deletePic(pic)"></u-icon>
 -->

                                          <image :src="baseUrl+ pic.img1url" @click="imgPreview(pic)"
                                             class="upLoadImg">
                                          </image>
                                       </view>
                                    </view>

                                 </view>
                              </view>


                              <u-gap height="5" v-show="!item.arrowType" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap>
                              <view class="head" v-show="!item.arrowType" style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          停机维修
                                       </view>
                                    </view>

                                    <view class="" style="width: 120rpx;display: flex;">
                                       <u-button type="primary" shape='circle' size="small"
                                          :text="descMessage2.toString().length>0?'否':'是'">
                                       </u-button>
                                    </view>
                                 </view>
                              </view>

                              <u-gap height="5" v-show="!item.arrowType&&descMessage2" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap>

                              <view class="head" v-show="!item.arrowType&&descMessage2"
                                 style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          维修内容
                                       </view>
                                    </view>
                                 </view>
                                 <view style="margin: 0 20rpx; width: 95%;" class="contentFont">
                                    {{descMessage2}}
                                 </view>
                              </view>

                              <u-gap height="5" v-show="!item.arrowType&&descMessage3" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap>

                              <view class="head" v-show="!item.arrowType&&descMessage3"
                                 style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          更换备件
                                       </view>
                                    </view>
                                 </view>


                                 <view style="margin: 0 20rpx; width: 95%;" class="contentFont">
                                    {{descMessage3}}
                                 </view>
                                 <view style="display: flex;" v-show="fileList2.length!==0">
                                    <view v-for="(pic,index) in fileList2" :key="index">
                                       <view style="margin: 20rpx 0rpx 20rpx 20rpx;position: relative;">
                                          <!--                         <u-icon name="close" color="#fff" size="26"
                                          style="position: absolute;z-index: 10;right: 0;background-color: black;border-radius:50%;"
                                          @click="deletePic(pic)"></u-icon>
 -->
                                          <image :src="baseUrl+ pic.img2url" @click="imgPreview2(pic)"
                                             class="upLoadImg">
                                          </image>
                                       </view>
                                    </view>

                                 </view>
                              </view>


                              <u-gap height="5" v-show="!item.arrowType" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap>
                              <view class="head" v-show="!item.arrowType" style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          验证结果
                                       </view>
                                    </view>


                                    <view class=" " style="width:250rpx;display: flex;"
                                       :key="Math.random()+item.repair_code">
                                       <u-button :plain="item.resultValue!=='OK'" text="正常" shape='circle'
                                          size="small" style="margin-right:5rpx;"
                                          @click="resultValueClick(item.mouldcode,'OK')"
                                          :key="Math.random()+item.repair_code+'OK'" type="primary">
                                       </u-button>
                                       <u-button type="warning" :plain="item.resultValue!=='NG'"
                                          shape='circle' size="small"
                                          :key="Math.random()+item.repair_code+'NG'" text="异常"
                                          @click="resultValueClick(item.mouldcode,'NG')">
                                       </u-button>
                                    </view>
                                 </view>
                              </view>

                              <u-gap height="5" v-show="!item.arrowType" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap>
                              <view class="head" v-show="!item.arrowType" style="padding-bottom: 10rpx;">
                                 <view class="head_block" style="margin-bottom: 10rpx;margin-top:20rpx;">
                                    <view class="head_left">
                                       <view class="head_bar"></view>
                                       <view class="head_title">
                                          剩余寿命(次)
                                       </view>
                                    </view>


                                    <view class=" " style="width:250rpx;display: flex;">

                                       <view class='inputClass marginTop10'>
                                          <u--input placeholder="请输入数字"
                                             :disabled='item.resultValue!=="OK"' border="surround"
                                             type='number' v-model="surp_life"></u--input>
                                       </view>

                                    </view>
                                 </view>
                              </view>
                              <!-- <u-gap height="16" v-show="!item.arrowType" bgColor="#eff0f1"
                                 style='width: 106%;margin-left: -3%;'></u-gap> -->

                              <view style="display: flex;justify-content: center;margin : 10rpx; 0">
                                 <view class="arrowClass"
                                    @click="item.arrowType?arrowDownClick(item):arrowUpClick(item)">
                                    <u-icon :name="item.arrowType?'arrow-down':'arrow-up'" color="#c8c8c8"
                                       size="24"></u-icon>
                                 </view>
                              </view>


                              <u-gap height="16" bgColor="#eff0f1" style="width: 106%;margin-left: -3%;">
                              </u-gap>
                           </view>
                        </u-radio-group>
                     </view>
                  </view>
               </view>

            </view>
         </view>

         <view class="footer" style="min-height:62rpx;">
            <u-button size="large" :loading="isDisabledSubmitButton" loadingText="正在提交,请稍等..." type="primary"
               @click="submit" text="确认提交">
               <!-- :disabled="topContent.length>0? topContent.find(i=>i.repair_code===radioValue).resultValue==='':true" -->

            </u-button>
         </view>



      </view>


      <!-- <scan-code></scan-code> -->
   </view>
</template>

<script>
   import {
      RepairVerificationScanMouldData,
      RepairVerificationScanMouldDataSub,
      RepairVerificationScanMouldSave
   } from '../../config/api.js'

   // import scanCode from '@/components/scan-code/scan-code.vue'
   export default {
      // components: {
      //    scanCode
      // },
      onLoad(option) {


         // const _this = this
         // uni.$off('scancodedate') // 每次进来先 移除全局自定义事件监听器
         // uni.$on('scancodedate', function(content) {
         //    console.log("扫描到的内容为:", content)


         //    let r = _this.topContent.find(i => i.repair_code === content)

         //    if (r === undefined) {
         //       uni.$u.toast('所扫的二维码不在列表中！')
         //       // return
         //    } else {
         //       _this.topContent.forEach((item, index) => {
         //          if (item.repair_code === content) {
         //             _this.topContent.splice(index, 1)
         //          }
         //       })
         //       _this.topContent.unshift(r)
         //       _this.radioValue = content
         //    }
         // })
      },
      onPullDownRefresh() {
         setTimeout(() => {
            this.init(() => {
               uni.stopPullDownRefresh();
            })
         }, 1000);
      },
      data() {
         return {
            topRightMessageCount: 0,
            isDisabledSubmitButton: false,
            baseUrl: 'http://121.196.36.24:8021/',
            topContent: [], //扫描保养工位所带出来的内容
            radioValue: '', //单选框的值
            scanContent: '', //扫描扫出来的值

            detailContent: [], //显示详情内容

            descMessage: '', // 
            descMessage2: '', // 
            descMessage3: '', // 
            imgPreviewSrcs: [], //图片预览src   故障描述
            fileList: [], //图片数组         故障描述
            fileList2: [], //更换备件图片
            imgPreviewSrcs2: [],

            surp_life: ''


         }
      },
      created() {


      },
      mounted() {
         this.init()
         this.getRepairVerificationScanMouldData()

      },
      methods: {

         // 预览图片
         imgPreview(img) {
            console.log(img)
            uni.previewImage({
               current: this.fileList.findIndex(i => i.img1url === img.img1url),
               indicator: "number",
               loop: true,
               urls: this.imgPreviewSrcs
            })
         },
         imgPreview2(img) {
            uni.previewImage({
               current: this.fileList2.findIndex(i => i.img2url === img.img2url),
               indicator: "number",
               loop: true,
               urls: this.imgPreviewSrcs2
            })
         },
         init() {
            uni.stopPullDownRefresh();
         },
         // 单选按钮选中值改变
         groupChange(mouldcode) {
            this.radioValue = mouldcode

            console.log(JSON.stringify(this.topContent))
            this.topContent.forEach(item => {
               if (item.mouldcode !== mouldcode) {
                  item.resultValue = ''
               }
            })
            this.$forceUpdate()

         },

         // 扫码框点击
         topScanClick() {
            let that = this;
            uni.scanCode({
               onlyFromCamera: true,
               // scanType: ['barCode', 'qrCode'],
               scanType: ['qrCode'],
               success: function(res) {
                  console.log('条码类型：' + res.scanType);
                  console.log('条码内容：' + res.result);
                  that.scanContent = res.result;



                  let r = that.topContent.find(i => i.repair_code === that.scanContent)

                  if (r === undefined) {
                     uni.$u.toast('所扫的二维码不在列表中！')
                  } else {
                     that.topContent.forEach((item, index) => {
                        if (item.repair_code === that.scanContent) {
                           that.topContent.splice(index, 1)
                        }
                     })
                     that.topContent.unshift(r)
                     that.radioValue = that.scanContent
                  }

               },
               complete: function(res) {

               },
               fail: function(res) {
                  console.log('条码类型：' + res.scanType);
                  console.log('条码内容：' + res.result);
               }

            });
         },

         // 获取维修列表    
         async getRepairVerificationScanMouldData(val) {
            const res = await RepairVerificationScanMouldData({
               mouldcode: ''
            })
            if (res.code === '200') {
               this.topContent = res.data
               this.topContent.forEach(i => {
                  i.arrowType = true
                  i.resultValue = ''
               })
               if (this.topContent.length > 0) {
                  this.getRepairVerificationScanMouldDataSub(this.topContent[0].repair_code, this.topContent[0]
                     .mouldcode)
               }
               this.radioValue = this.topContent.length > 0 ? this.topContent[0].mouldcode : ''
               // console.log(this.topContent, 1)
               this.$forceUpdate()

            }
         },
         // 获取维修列表详情
         async getRepairVerificationScanMouldDataSub(repair_code, mouldcode) {
            const res = await RepairVerificationScanMouldDataSub({
               repair_code,
               mouldcode
            })
            this.detailContent = res.data

            this.descMessage = this.detailContent.failure_descript
            this.fileList = this.detailContent.failure_descriptimg ? this.detailContent.failure_descriptimg.filter(
               i => i.img1url !== '') : []

            this.imgPreviewSrcs = []
            this.fileList.forEach(i => {
               this.imgPreviewSrcs.push(this.baseUrl + i.img1url)
            })

            this.descMessage2 = this.detailContent.repair_content ? this.detailContent.repair_content : ''
            this.descMessage3 = this.detailContent.repair_part ? this.detailContent.repair_part : ''
            this.fileList2 = this.detailContent.repair_partimage ? this.detailContent.repair_partimage.filter(i =>
               i.img2url !== '') : []
            this.imgPreviewSrcs2 = []
            this.fileList2.forEach(i => {
               this.imgPreviewSrcs2.push(this.baseUrl + i.img2url)
            })

            this.surp_life = ''
            this.$forceUpdate()
         },
         // 向下的箭头点击
         arrowDownClick(val) {
            this.topContent.forEach(item => {
               item.arrowType = true
               if (item.mouldcode === val.mouldcode) {
                  item.arrowType = false
                  item.resultValue = item.resultValue ? item.resultValue : ''
                  this.descMessage = ''
                  this.descMessage2 = ''
                  this.descMessage3 = ''
                  this.fileList = []
                  this.fileList2 = []
                  this.imgPreviewSrcs = []
                  this.imgPreviewSrcs2 = []
                  this.getRepairVerificationScanMouldDataSub(item.repair_code, item.mouldcode)
               }
            })
            this.$forceUpdate()
         },
         //向上从箭头点击
         arrowUpClick(val) {
            this.topContent.forEach(item => {
               item.arrowType = true
            })
            this.$forceUpdate()
         },
         // 验证结果点击
         resultValueClick(mouldcode, val) {

            this.surp_life = ''

            this.topContent.forEach(item => {
               if (item.mouldcode === mouldcode) {
                  item.resultValue = val
               }
            })

            this.$forceUpdate()
         },
         // 确认提交按钮
         async submit() {
            const result = this.topContent.find(item => item.mouldcode === this.radioValue)
            const data = {
               repairwo: result.repair_code,
               mouldcode: this.radioValue,
               result: result.resultValue,
               surp_life: this.surp_life
            }

            console.log(JSON.stringify(data));
            this.isDisabledSubmitButton = true
            const res = await RepairVerificationScanMouldSave(data)
            if (res.code === '200') {
               uni.$u.toast('提交成功！')
               this.topContent = this.topContent.filter(i => i.mouldcode !== this
                  .radioValue)
               this.radioValue = this.topContent.length === 0 ? '' : this.topContent[0]
                  .mouldcode

            } else {
               uni.$u.toast(res.message)
            }
            this.isDisabledSubmitButton = false
            this.$forceUpdate()





            // const header = {
            //    'Content-Type': 'application/x-www-form-urlencoded',
            //    'Token': uni.getStorageSync('Token'),
            // }

            // const result = this.topContent.find(item => item.mouldcode === this.radioValue)
            // let formData = {
            //    username: uni.getStorageSync('username'),
            //    repairwo: result.repair_code,
            //    eqpcode: result.eqpcode,
            //    wkshpcode: result.wksp_code,
            //    result: result.resultValue,
            // }

            // this.isDisabledSubmitButton = true
            // uni.uploadFile({
            //    url: this.$baseUrl + '/AppDeviceManage/RepairVerificationScanDeviceSave',
            //    files: [{
            //       "uri": "/"
            //    }],
            //    header: header,
            //    formData: formData,
            //    success: (res) => {
            //       let result = JSON.parse(res.data)
            //       if (res.statusCode == 200 && result.code == '200') {
            //          uni.$u.toast('提交成功！')
            //          this.topContent = this.topContent.filter(i => i.repair_code !== this
            //             .radioValue)
            //          this.radioValue = this.topContent.length === 0 ? '' : this.topContent[0]
            //             .repair_code
            //       } else {
            //          uni.$u.toast(result.Message)
            //       }
            //       this.isDisabledSubmitButton = false
            //       this.$forceUpdate()
            //    },
            //    fail(res) {
            //       uni.$u.toast('提交失败！')
            //       this.isDisabledSubmitButton = false
            //    },
            // })





         },
      }
   }
</script>

<style>
<style lang="scss" scoped>
   @import url('@/style/global.css');

   ::v-deep .uicon-arrow-left>span {
      display: block;
   }

   ::v-deep .uicon-camera-fill {
      font-size: 60rpx !important;
   }


   ::v-deep .uni-progress-bar {
      background-color: transparent !important;
   }

   .upLoadImg {
      width: 160rpx;
      height: 160rpx;
      border-radius: 20rpx;
   }

   .repairDetail {
      margin-top: 20rpx;
      background-color: #eff0f1;
      height: 80rpx;
      font-size: 36rpx;
      width: 106%;
      margin-left: -3%;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 10rpx;
   }

   .arrowClass {
      display: flex;
      justify-content: center;
      // background-color: #efefef;
      width: 100rpx;
      // border-radius: 10rpx;
      height: 56rpx;
   }
</style>