#
whycq
2022-07-26 3e7daebe18087c0511302081583f6af85c1deb95
pages/basics/bad.vue
@@ -1,5 +1,6 @@
<template>
   <view>
   <!-- 检索窗口 -->
      <view class="square-2">
         <view class="square-title">
            <view class="title-sign"><view class="sign"></view></view>
@@ -7,17 +8,46 @@
         </view>
         <view class="square-content">
            <view class="content-input">
               <input>
               <uni-icons type="closeempty" size="20" color="#dadada"></uni-icons>
               <input v-model="barcode" placeholder="扫码 / 输入" @input="addMat" :focus="barcodeFocus">
               <uni-icons type="closeempty" size="20" color="#dadada" @click="clearInput('barcode')"></uni-icons>
            </view>
         </view>
      </view>
   <!-- 商品列表 -->
      <view class="square-1">
         <view class="square-title">
            <view class="title-sign"><view class="sign"></view></view>
            <view class="title-text"><text>商品列表</text></view>
         </view>
      </view>
      <view class="square-none"  v-show="matList.length === 0">
         <view class="v-show">暂无更多数据...</view>
      </view>
      <checkbox-group>
         <view v-for="(item,index) in matList" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" >
            <view class="data-list-left">
               <view class="matnr">No:{{listLen-index}}</view>
               <view class="matnr">{{item}}</view>
            </view>
            <view class="data-list-right">
               <uni-icons type="trash" size="20" color="#a5a5a5" @click="remove(item,index)"></uni-icons>
            </view>
         </view>
      </checkbox-group>
   <!-- 提示信息弹窗 -->
      <view>
         <uni-popup ref="message" type="message">
            <uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
         </uni-popup>
      </view>
   <!-- 底部按钮 -->
      <view class="footer flex justify-around">
         <view>
            <button class="cu-btn lg" @click="">重置</button>
            <button class="cu-btn lg" @click="reset">重置</button>
         </view>
         <view>
            <button class="cu-btn lg pakin-btn bg-blue" @click="">确认</button>
            <button class="cu-btn lg pakin-btn bg-blue" @click="confirm()">确认</button>
         </view>
      </view>
   </view>
@@ -27,16 +57,173 @@
   export default {
      data() {
         return {
            commonUrl:null,
            barcode:null,
            matnr:null,
            matList:[],
            listLen:0, // 商品列表长度 默认0
            barcodeFocus:true,
            msgType:null,
            messageText:null
         }
      },
      mounted(){
         const UIP = uni.getStorageSync('UIP');
         this.baseIP = UIP;
         const UPORT = uni.getStorageSync('UPORT');
         this.basePORT = UPORT
         const PROJ = uni.getStorageSync('UPROJ');
         this.baseUrl = PROJ
         this.getUrl()
      },
      onLoad() {
         // #ifdef APP
         setInterval(()=>{
            uni.hideKeyboard()
         },20)
         // #endif
      },
      methods: {
         name() {
         }
         // 获取url
         getUrl() {
            this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePORT + "/" +this.baseUrl
         },
         // 扫码重置
         barcodeFocuss() {
            let that = this;
            that.barcodeFocus = false;
            setTimeout(()=>{
               that.barcode = '';
               that.barcodeFocus = true;
            }, 100);
         },
         // 添加商品列表
         addMat() {
            let item = null
            item = this.barcode
            if(this.matList.length > 0) {
               //   遍历matList
               for (var i = 0;i < this.matList.length; i++) {
                  if (this.matList[i] == item) {
                     this.msgType = "warn"
                     this.messageText = this.barcode + ",已添加!"
                     this.$refs.message.open()
                     this.resetAdd()
                     return;
                  } else {
                     this.matList.unshift(item)
                     this.resetAdd()
                     return;
                  }
               }
            } else {
               this.matList.push(item)
               this.resetAdd()
            }
         },
         // 商品添加重置
         resetAdd() {
            this.listLen = this.matList.length
            this.barcodeFocuss()
         },
         // 清空搜索框
         clearInput(type) {
            switch (type) {
               case 'barcode':
                  this.barcodeFocuss()
                  break;
            }
         },
         // 重置
         reset() {
            this.barcodeFocuss()
            this.matList = []
         },
         // 确认列表
         confirm() {
            let that = this
            console.log(that.commonUrl + '/mobile/matnr/danger/report/auth')
            // return
            uni.request({
               url: that.commonUrl + '/mobile/matnr/danger/report/auth',
               data:JSON.stringify(that.matList),
               header: {
                  // 'token':uni.getStorageSync('token'),
               },
               method:"POST",
               success(result) {
                  var res = result.data
                  console.log(res)
                  if (res.code === 200) {
                     that.msgType = "success"
                     that.messageText = '上报成功!'
                     that.$refs.message.open()
                     that.reset()
                  } else if(res.code === 403) {
                     uni.showToast({title: res.msg, icon: "none", position: 'top'})
                     that.returnIndex();
                  } else {
                     uni.showToast({title: res.msg, icon: "none",position: 'top'})
                  }
               }
            })
         },
         remove(item,index) {
            this.matnr = ''
            this.matList.splice(index,1)
            this.listLen = this.matList.length
         },
         // 403跳转登录页
         returnIndex() {
            setTimeout(() => {
               uni.reLaunch({
                  url: '../login/login'
               });
            }, 1000);
         },
      },
   }
</script>
<style>
   .data-list {
      border-bottom: 1px solid #d8d8d8;
      height: 130rpx;
      margin: 15rpx;
      border-radius: 20rpx;
   }
   .data-list:first-child {
      margin-top: 20rpx;
   }
   .data-list:last-child {
      margin-bottom: 200rpx;
   }
   .bg-false {
      background-color: #FFFFFF;
   }
   .bg-true {
      background-color: #ebebeb;
   }
   .data-list-left {
      display: inline-block;
      float: left;
      margin-left: 6%;
      height: 130rpx;
      /* line-height: 100rpx; */
      color: #676767;
   }
   .matnr {
      font-size: 14px;
      font-weight: 700;
      /* padding-top: 15rpx; */
      padding-top: 15rpx;
   }
   .data-list-right {
      display: inline-block;
      float: right;
      height: 130rpx;
      line-height: 130rpx;
      margin-right: 10%;
   }
</style>