loulijun2021
2023-10-18 349332ae95d97beb3e4aca5c30d131c8997c3de6
pages/mjgl/mjwx.vue
@@ -1,8 +1,515 @@
<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" :style="{maxHeight: '600rpx',overflow: 'scroll'}">
            <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="56"></u-icon>
                     </view>
                  </view>
                  <view class=" marginLeft20 marginRight20 flex_column"
                     style="max-height: 420rpx;overflow:scroll;">
                     <u-radio-group v-model="radioValue" class="flex_column">
                        <view class="marginBottom20" style="position: relative"
                           @click="groupChange(item.docu_code)" v-for="item in topContent"
                           :key="item.docu_code">
                           <view style="display: flex;float: left;">
                              <view class="titleFont">
                                 <view>维修申请单:</view>
                                 <view>模具编码:</view>
                                 <view>模具名称:</view>
                                 <view>规格型号:</view>
                                 <view>申请人员:</view>
                                 <view>申请时间:</view>
                                 <view>故障来源:</view>
                                 <view>故障描述:</view>
                              </view>
                              <view class="contentFont">
                                 <view>{{item.docu_code}}</view>
                                 <view>{{item.code}}</view>
                                 <view>{{item.name}}</view>
                                 <view>{{item.spec?item.spec:'/'}}</view>
                                 <view>{{item.request_person}}</view>
                                 <view>{{item.request_date}}</view>
                                 <view>{{item.source}}</view>
                                 <view style="width:400rpx;word-wrap:break-word">
                                    {{item.failure_descript}}
                                 </view>
                              </view>
                           </view>
                           <u-radio size='40' style='position: absolute;top: 45%;right: 0;'
                              :key="item.docu_code" :name="item.docu_code"
                              @change="groupChange(item.docu_code)" activeColor="red"></u-radio>
                        </view>
                     </u-radio-group>
                  </view>
               </view>
               <u-gap height="20" bgColor="#eff0f1"></u-gap>
               <view class="head" 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 class='inputClass contentFont' style="margin: 0 20rpx; width: 95%;">
                     <u--textarea placeholder="请输入" confirm-type="send" border="surround" height='100'
                        v-model="descMessage">
                     </u--textarea>
                  </view>
                  <view style="display: flex;">
                     <view v-for="(pic,index) in fileList" :key="pic.name">
                        <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="pic.uri" @click="imgPreview(pic)" class="upLoadImg"></image>
                        </view>
                     </view>
                     <image v-if="fileList.length<3" src="../../static/img/uploadImg.png" style="width: 100rpx;height: 100rpx;border: 1rpx solid #eff0f1;border-radius: 20rpx;
                     margin: 20rpx;padding: 30rpx;
                     " @click="selectPics">
                  </view>
               </view>
               <u-gap height="20" bgColor="#eff0f1"></u-gap>
               <view class="head" 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="marginRight20" style="width: 200rpx;display: flex;">
                        <u-button type="primary" :plain="isStop!=='Y'" text="是" @click="isStopClick('Y')">
                        </u-button>
                        <u-button type="warning" :plain="isStop!=='N'" text="否" @click="isStopClick('N')">
                        </u-button>
                     </view>
                  </view>
               </view>
               <u-gap height="20" bgColor="#eff0f1"></u-gap>
               <view v-show="isStop==='N'" class="head" style="padding-bottom: 10rpx;padding-bottom: 20rpx;">
                  <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 class='inputClass contentFont' style="margin: 0 20rpx; width: 95%;">
                     <u--textarea placeholder="请输入" confirm-type="send" border="surround" height='100'
                        v-model="descMessage2">
                     </u--textarea>
                  </view>
               </view>
               <u-gap height="20" bgColor="#eff0f1"></u-gap>
               <!-- margin-bottom: 110rpx; -->
               <view v-show="isStop==='N'" class="head" 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 class='inputClass contentFont' style="margin: 0 20rpx; width: 95%;">
                     <u--textarea placeholder="请输入" confirm-type="send" border="surround" height='100'
                        v-model="descMessage3">
                     </u--textarea>
                  </view>
                  <view style="display: flex;">
                     <view v-for="(pic,index) in fileList2" :key="pic.name">
                        <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="pic.uri" @click="imgPreview2(pic)" class="upLoadImg"></image>
                        </view>
                     </view>
                     <image v-if="fileList2.length<3" src="../../static/img/uploadImg.png" style="width: 100rpx;height: 100rpx;border: 1rpx solid #eff0f1;border-radius: 20rpx;
                     margin: 20rpx;padding: 30rpx;
                     " @click="selectPics2">
                  </view>
               </view>
            </view>
         </view>
         <view class="footer" style="min-height:62rpx;">
            <u-button size="large" :loading="isDisabledSubmitButton" loadingText="正在提交,请稍等..." type="primary"
               @click="submit"
               :disabled="isStop==='Y'?descMessage.toString().length===0:descMessage.toString().length===0||descMessage2.toString().length===0"
               text="确认提交">
            </u-button>
         </view>
      </view>
      <!-- <scan-code></scan-code> -->
   </view>
</template>
<script>
   // import {
   //    RepairScanDeviceQrCodeDataList,
   // } from '../../config/api.js'
   // import {
   //    data
   // } from '../../uni_modules/uview-ui/libs/mixin/mixin.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)
         //    // _this.getCheckScanDeviceQrCodeData(content)
         //    let r = _this.topContent.find(i => i.docu_code === content)
         //    if (r === undefined) {
         //       uni.$u.toast('所扫的二维码不在列表中!')
         //    } else {
         //       _this.topContent.forEach((item, index) => {
         //          if (item.docu_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,
            topContent: [], //扫描保养工位所带出来的内容
            centerContent: [], //
            scanContent: '', //扫描扫出来的值
            radioValue: '', //单选框的值
            descMessage: '', //故障描述
            imgPreviewSrcs: [], //图片预览src   故障描述
            fileList: [], //图片数组         故障描述
            isStop: 'Y',
            descMessage2: '', //维修内容
            descMessage3: '', //更换备件
            fileList2: [], //更换备件图片
            imgPreviewSrcs2: [],
         }
      },
      created() {
      },
      mounted() {
         this.init()
         // this.getRepairScanDeviceQrCodeDataList()
      },
      methods: {
         // 选择图片
         selectPics() {
            var that = this;
            uni.chooseImage({
               count: 3,
               success: (res) => {
                  const files = res.tempFiles;
                  for (let i = 0; i < files.length; i++) {
                     let obj = new Object();
                     obj.name = 'files1;' + i + new Date().getTime();
                     obj.uri = files[i].path;
                     that.fileList.push(obj);
                     if (obj.src == null || obj.src == '' || obj.src == undefined) {
                        that.imgPreviewSrcs.push(obj.uri)
                     } else {
                        that.imgPreviewSrcs.push(obj.src)
                     }
                  }
               }
            })
         },
         selectPics2() {
            var that = this;
            uni.chooseImage({
               count: 3,
               success: (res) => {
                  const files = res.tempFiles;
                  for (let i = 0; i < files.length; i++) {
                     let obj = new Object();
                     obj.name = 'files2;' + i + new Date().getTime();
                     obj.uri = files[i].path;
                     that.fileList2.push(obj);
                     if (obj.src == null || obj.src == '' || obj.src == undefined) {
                        that.imgPreviewSrcs2.push(obj.uri)
                     } else {
                        that.imgPreviewSrcs2.push(obj.src)
                     }
                  }
               }
            })
         },
         // 预览图片
         imgPreview(img) {
            uni.previewImage({
               current: this.fileList.findIndex(i => i.name === img.name),
               indicator: "number",
               loop: true,
               urls: this.imgPreviewSrcs
            })
         },
         imgPreview2(img) {
            uni.previewImage({
               current: this.fileList2.findIndex(i => i.name === img.name),
               indicator: "number",
               loop: true,
               urls: this.imgPreviewSrcs2
            })
         },
         // 删除图片
         deletePic(img) {
            this.fileList = this.fileList.filter(i => i.name !== img.name)
            this.fileList2 = this.fileList2.filter(i => i.name !== img.name)
            this.imgPreviewSrcs = this.imgPreviewSrcs.filter(i => i !== img.uri)
            this.imgPreviewSrcs2 = this.imgPreviewSrcs2.filter(i => i !== img.uri)
         },
         init() {
            uni.stopPullDownRefresh();
         },
         // 单选按钮选中值改变
         groupChange(val) {
            this.radioValue = val
            this.descMessage = ''
            this.imgPreviewSrcs = []
            this.fileList = []
            this.isStop = 'Y'
            this.descMessage2 = ''
            this.descMessage3 = ''
            this.fileList2 = []
            this.imgPreviewSrcs2 = []
            this.$forceUpdate()
         },
         // 停机维修
         isStopClick(val) {
            this.isStop = val
            if (val === 'Y') {
               this.descMessage2 = ''
               this.descMessage3 = ''
               this.fileList2 = []
               this.imgPreviewSrcs2 = []
            }
         },
         // 扫码工位  的扫码框点击
         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.docu_code === that.scanContent)
                  if (r === undefined) {
                     uni.$u.toast('所扫的二维码不在列表中!')
                  } else {
                     that.topContent.forEach((item, index) => {
                        if (item.docu_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 getRepairScanDeviceQrCodeDataList(val) {
            const res = await RepairScanDeviceQrCodeDataList()
            if (res.code === '200') {
               this.topContent = res.data
               this.radioValue = this.topContent.length > 0 ? this.topContent[0].docu_code : ''
            }
         },
         // 确认提交按钮
         async submit() {
            const header = {
               // 'Content-Type': 'multipart/form-data',
               'Content-Type': 'application/x-www-form-urlencoded',
               'rediskey': uni.getStorageSync('rediskey'),
               'admin': uni.getStorageSync('usercode'),
               'username': encodeURIComponent(uni.getStorageSync('username')),
               'navTabId': uni.getStorageSync('usercode'),
               'userid': uni.getStorageSync('userid'),
               'guid': uni.getStorageSync('guid'),
               'usertype': 'APP'
            }
            const result = this.topContent.find(item => item.docu_code === this.radioValue)
            const formData = {
               username: uni.getStorageSync('username'),
               docu_code: result.docu_code,
               eqpcode: result.eqpcode,
               wkshpcode: result.wksp_code,
               faultdescr: this.descMessage,
               is_stoprepair: this.isStop,
               // files1: this.fileList,
               repaircontent: this.descMessage2,
               replaceparts: this.descMessage3
            }
            // console.log(formData)
            // console.log([...this.fileList, ...this.fileList2].length)
            this.isDisabledSubmitButton = true
            uni.uploadFile({
               url: this.$baseUrl + '/AppDeviceManage/RepairScanDeviceSave',
               files: [...this.fileList, ...this.fileList2].length === 0 ? [{
                  "uri": "/"
               }] : [...this.fileList, ...this.fileList2],
               header: header,
               formData: formData,
               success: (res) => {
                  console.log(res)
                  let result = JSON.parse(res.data)
                  if (res.statusCode == 200 && result.code == '200') {
                     uni.$u.toast('提交成功!')
                     this.topContent = this.topContent.filter(i => i.docu_code !== this.radioValue)
                     this.radioValue = this.topContent.length === 0 ? '' : this.topContent[0]
                        .docu_code
                     this.descMessage = ''
                     this.imgPreviewSrcs = []
                     this.fileList = []
                     this.isStop = 'Y'
                     this.descMessage2 = ''
                     this.descMessage3 = ''
                     this.fileList2 = []
                     this.imgPreviewSrcs2 = []
                  } else {
                     uni.$u.toast(result.Message)
                  }
                  this.isDisabledSubmitButton = false
               },
               fail(res) {
                  uni.$u.toast('提交失败!')
                  this.isDisabledSubmitButton = false
               },
            })
         },
      }
   }
</script>
<style>
<style lang="scss" scoped>
   @import url('@/style/global.css');
   .u-radio {
      justify-content: flex-end;
   }
   ::v-deep .uicon-arrow-left>span {
      display: block;
   }
   ::v-deep .uicon-camera-fill {
      font-size: 60rpx !important;
   }
   .uploader {
      /deep/.u-add-tips {
         display: none;
      }
   }
   ::v-deep .uni-progress-bar {
      background-color: transparent !important;
   }
   .upLoadImg {
      width: 160rpx;
      height: 160rpx;
      border-radius: 20rpx;
   }
</style>