移库页面绘制

yyb

5 天以前 5359fd3a4cd761bfec6ea9f92a459a8b88b815f1

 pages/wareHouse/moveWareHouse/index.vue

@@ -3,546 +3,241 @@
      <view class="movewarehouse-index-bg" />
      <u-navbar title="移库" :background="background" :border-bottom="false" :title-bold="true" title-color="#000"
         back-icon-color="#000" />
      <view class="movewarehouse-index-search">
         <!--<u-search v-model="keywords" shape="square" bg-color="rgba(250,252,255,0.36)" :show-action="false" placeholder="请输入库位号" @clear="search" @custom="search" @search="search">
         </u-search>-->
         <view class="movewarehouse-index-search-view">
            <view class="movewarehouse-index-search-view-item">
               <text class="item-one">至库位号</text>
               <text class="item-one-content">{{ tolocationNo }}</text>
      <view class="packing-registration-param">
         <view class="packing-registration-param-view">
            <view class="packing-registration-param-item param-extra">
               <view class="packing-registration-param-item-left">
                  <text class="item-one">库位</text>
               </view>
               <view class="packing-registration-param-item-right">
                  <text class="item-one item-two">{{registerInfo.storageLocation}}</text>
               </view>
            </view>
            <view class="movewarehouse-index-search-view-item" @click="seachLocationNo()">
               <text class="item-two">请选择</text>
               <u-icon name="arrow-right" color="#2979ff" size="28"></u-icon>
            <view class="packing-registration-param-item param-extra">
               <view class="packing-registration-param-item-left">
                  <text class="item-one">{{`移库记录(${registerInfo.num}条)：`}}</text>
               </view>
            </view>
         </view>
      </view>
      <view class="wrap">
         <scroll-view class="movewarehouse-index-scroll-list" scroll-y="true">
            <u-cell-group class="movewarehouse-index-scroll-list-group" :border="false">
               <view class="content" v-for="(item, index) in list" :key="item.id" :index="index">
                  <view class="content-header">
                     <view class="header-item">
                        <view class="content-header-icon-one"></view>
                        <view class="content-header-title">{{ item.partNo }}</view>
      <view class="popup-container" v-if="show">
         <view class="popup-content">
            <view class="packing-registration-param">
               <view class="packing-registration-param-view">
                  <view class="packing-registration-param-item param-extra">
                     <view class="packing-registration-param-item-left">
                        <text class="item-one">批号</text>
                     </view>
                     <view class="header-item">
                        <view class="content-header-icon-two"></view>
                        <view class="content-header-title">{{ item.partBatchNo }}</view>
                     </view>
                     <view class="header-item-toolbar" @click="deleteHandle(item)">
                        <view class="header-item-toolbar-del-icon">

                        </view>
                        <view class="header-item-toolbar-del-text">
                           删除
                        </view>
                     <view class="packing-registration-param-item-right">
                        <text class="item-one item-two">{{ 111 }}</text>
                     </view>
                  </view>
                  <!--<view class="row-img" @click="deleteHandle(item)">
                     <u-image width="18px" height="18px" src="@/static/custom/delete.png"></u-image>
                  </view>-->
                  <view class="content-body">
                     <view class="row-list">
                        <view class="_label">
                           零件名称：
                        </view>
                        <view class="_content">
                           {{ item.partName }}
                        </view>
                  <view class="packing-registration-param-item param-extra">
                     <view class="packing-registration-param-item-left">
                        <text class="item-one">零件描述</text>
                     </view>
                     <view class="row-list">
                        <view class="_label">
                           从库位号：
                        </view>
                        <view class="_content">
                           {{ item.locationNo }}
                        </view>
                     <view class="packing-registration-param-item-right">
                        <text class="item-one item-two">{{ 111 }}</text>
                     </view>
                     <view class="row-list">
                        <view class="_label">
                           至库位号：
                        </view>
                        <view class="_content">
                           {{ item.arriveLocationNo }}
                        </view>
                  </view>
                  <view class="packing-registration-param-item param-extra">
                     <view class="packing-registration-param-item-left">
                        <text class="item-one">WDR</text>
                     </view>
                     <view class="row-list">
                        <view class="_label">
                           可用库存：
                        </view>
                        <view class="_content">
                           <text class="_content-text">{{ item.availableStockQuantity }}</text>
                           ({{ item.unit }})
                        </view>
                     <view class="packing-registration-param-item-right">
                        <text class="item-one item-two">{{ 111 }}</text>
                     </view>
                     <view class="row-list">
                        <view class="_label">
                           移库库存：
                        </view>
                        <view class="_content _input">
                           <u-input placeholder="请输入移库数量" v-model="item.moveQty" type="digit"></u-input>
                           <view class="edit_icon"></view>
                        </view>
                  </view>
                  <view class="packing-registration-param-item param-extra">
                     <view class="packing-registration-param-item-left">
                        <text class="item-one">现有数量</text>
                     </view>
                     <view class="packing-registration-param-item-right">
                        <text class="item-one item-two">{{ 111 }}</text>
                     </view>
                  </view>
                  <view class="packing-registration-param-item param-extra">
                     <view class="packing-registration-param-item-left">
                        <text class="item-one">当前库位</text>
                     </view>
                     <view class="packing-registration-param-item-right">
                        <text class="item-one item-two">{{ 111 }}</text>
                     </view>
                  </view>
               </view>
            </u-cell-group>
         </scroll-view>
         <scan></scan>
         <view class="new-form-footer" v-if="list.length > 0">
            <u-button class="btn" type="primary" @click="submit">提交</u-button>
               <view class="person-btn-view">
                  <u-button type="primary" shape="square" text="取消" style="height: 80rpx; line-height: 80rpx"
                     size="medium" @click="closePopup()">取消</u-button>
                  <u-button type="primary" shape="square" text="确定" style="height: 80rpx; line-height: 80rpx"
                     size="medium" @click="confirmPopup()">确定</u-button>
               </view>
            </view>
         </view>
      </view>
   </view>
</template>
<script>
import scan from "@/components/scan/scan.vue";
import content_bg from '@/static/custom/moveWareHouse/locNoBg.png'
export default {
   components: {
      scan
   },
   data() {
      return {
         background: {
            backgroundImage: `url(${content_bg})`,
            backgroundAttachment: 'fixed',
            backgroundSize: '100% auto',
            backgroundRepeat: 'no-repeat',
   import scan from "@/components/scan/scan.vue";
   import content_bg from "@/static/custom/moveWareHouse/locNoBg.png";
   export default {
      components: {
         scan,
      },

      data() {
         return {
            background: {
               backgroundImage: `url(${content_bg})`,
               backgroundAttachment: "fixed",
               backgroundSize: "100% auto",
               backgroundRepeat: "no-repeat",
            },
            registerInfo: {
               storageLocation: "LG001",
               num: 0,
            },
            show: true, // 控制弹窗显示隐藏的变量
         };
      },
      onLoad() {},
      onShow() {
         let that = this;

         uni.$off("scan"); // 每次进来先 移除全局自定义事件监听器
         uni.$on("scan", function(data) {
            console.log("onscan");
            //扫码成功后的回调，你可以写自己的逻辑代码在这里
            console.log("扫码结果：", data.code);
         });
      },
      onNavigationBarButtonTap(e) {
         uni.scanCode({
            success: (res) => {
               try {
                  const result = JSON.parse(res.result);
               } catch (e) {}
            },
         });
      },
      methods: {
         confirmPopup() {
            // 处理确认逻辑
            this.show = false;
         },
         list: [],
         tolocationNo: "",
         keywords: ''
      };
   },
   onLoad() {
      // this.loadList("221206000739N");
      // let data = '{"part_no":"88.118.1/A0047954","lot_batch_no":"221112000082N","qty_arrived":0.5,"wdr":"221112000082N"}'
      // let data = '221206000739N'
      // let sn = ''
      // if (data.indexOf('{') >= 0) {
      //    //大标签二位码
      //    sn = JSON.parse(data).lot_batch_no
      // } else {
      //    //小标签条码
      //    sn = data
      // }
      // console.log(sn);
   },
   onShow() {

      let that = this

      uni.$off('scan') // 每次进来先 移除全局自定义事件监听器
      uni.$on('scan', function (data) {
         console.log('onscan');
         //扫码成功后的回调，你可以写自己的逻辑代码在这里
         console.log('扫码结果：', data.code);

         if (data.code != "" && (that.tolocationNo == "")) {
            uni.showToast({
               title: '请选择至库位号',
               icon: 'none'
            })
            return
         }

         let sn = ''
         if (data.code.indexOf('{') >= 0) {
            //大标签二位码
            let snNoIndex = data.code.indexOf('sn_no')
            if (snNoIndex > -1) {
               sn = JSON.parse(data.code).sn_no
            } else {
               sn = JSON.parse(data.code).lot_batch_no
            }
         } else {
            //小标签条码
            sn = data.code
         }

         //判断数组中是否存在  SN 是否已经存在
         let initList = that.list.filter(item => item
            .partBatchNo == sn)
         if (initList.length > 0) {
            uni.showToast({
               title: "SN:" + sn + ",已存在,请选择另一个SN号",
               icon: "none"
            });
            return
         }

         that.loadList(sn);
      })
   },
   onNavigationBarButtonTap(e) {
      uni.scanCode({
         success: res => {
            try {
               const result = JSON.parse(res.result)

            } catch (e) { }
         }
      });
   },
   methods: {
      //至库位
      seachLocationNo() {
         uni.navigateTo({
            url: '/pages/wareHouse/moveWareHouse/locNoList'
         })
         closePopup() {
            this.show = false; // 关闭弹窗
         },
      },
      loadList(sanCode) {
         uni.showLoading({
            mask: true,
            title: "加载中",
         });
         let that = this

         if (sanCode != "") {
            let data = {
               sn: sanCode
            }

            //判断数组中是否存在 至库位号 SN 
            let initList = that.list.filter(item => item.arriveLocationNo == that.tolocationNo).filter(item => item
               .partBatchNo == sanCode)
            if (initList.length > 0) {
               uni.showToast({
                  title: "库位号:" + that.tolocationNo + ",SN:" + sanCode + ",已经扫过码",
                  icon: "none"
               });
               return
            }

            // 查询移库信息
            that.$u.api.pigxWareHouse.list(data).then(res => {
               let reList = []
               reList = res.data

               if (reList.length == 0) {
                  uni.showToast({
                     title: "库位号:" + that.tolocationNo + ",SN:" + sanCode + ",未扫到移库信息",
                     icon: "none"
                  });
               } else {
                  for (let i = 0; i < reList.length; i++) {
                     if (reList[i].locationNo !== that.tolocationNo) {
                        let item = {
                           id: reList[i].id,
                           partNo: reList[i].partNo,
                           partName: reList[i].partName,
                           partBatchNo: reList[i].partBatchNo,
                           ifsBatchNo: reList[i].ifsBatchNo,
                           unit: reList[i].unit,
                           locationNo: reList[i].locationNo,
                           availableStockQuantity: reList[i].availableStockQuantity,
                           arriveLocationNo: that.tolocationNo,
                           moveQty: 0
                        }
                        that.list.push(item)
                     }
                  }
               }

               uni.hideLoading();
            })
         }
      },
      //至库位号设置
      setNo(no) {
         this.tolocationNo = no
      },
      deleteHandle(obj) {
         let that = this
         uni.showModal({
            title: '提示',
            content: '此操作将删除该移库信息, 是否继续?',
            success: function (res) {
               if (res.confirm) {
                  that.list.map((item, index) => {
                     if (obj.id == item.id) {
                        that.list.splice(index, 1)
                     }
                  });
               }
            }
         });
      },
      submit() {
         let that = this

         that.list.map((item) => {


            if (item.moveQty <= 0) {
               uni.showToast({
                  title: '请移库数量必须大于0',
                  icon: "none"
               });
               return
            }

            if (item.moveQty > item.availableStockQuantity) {
               uni.showToast({
                  title: '移库数量不能大于可用库存数量',
                  icon: "none"
               });
               return
            }
         });


         let subList = []
         that.list.map((item) => {

            let sub = {
               stockId: item.id,
               arriveLocationNo: item.arriveLocationNo,
               moveQty: item.moveQty
            }

            subList.push(sub)

         });

         that.$u.api.pigxWareHouse.addList(subList).then(res => {

            if (res.code == 0) {
               uni.showModal({
                  title: '提示',
                  content: '提交成功',
                  showCancel: false,
                  success: function () {
                     that.list = []
                     that.tolocationNo = ""
                  }
               })
            } else {
               uni.showModal({
                  title: '提示',
                  content: '提交失败',
                  showCancel: false,
                  success: function () {

                  }
               })
            }

         })


      },
   }
};
   };
</script>
<style lang="scss" scoped>
.movewarehouse-index-bg {
   background-color: #F6F9FF;
   background-image: url('~@/static/custom/moveWareHouse/locNoBg.png');
   // background: linear-gradient(180deg,rgba(206,227,254,1),rgba(206,227,254,1) 20%,rgba(206,227,254,0.5) 40%,rgba(206,227,254,0.25) 60%,rgba(206,227,254,0.08) 80%,rgba(206,227,254,0));
   padding: 0 20rpx;
   background-attachment: fixed;
   background-size: 100% auto;
   background-repeat: no-repeat;
   position: fixed;
   top: 0;
   bottom: 0;
   width: 100%;
   z-index: -1;
}

.movewarehouse-index-search {
   padding: 40rpx 30rpx 20rpx 30rpx;
}

.movewarehouse-index-search-view {
   height: 66rpx;
   border: 1px solid #ADC8E4;
   border-radius: 8rpx;
   background: rgba(250, 252, 255, 0.36);
   line-height: 66rpx;
   padding-left: 33rpx;
   padding-right: 10rpx;
   display: flex;
   justify-content: space-between;

   .movewarehouse-index-search-view-item {
      .item-one {
         font-size: 30rpx;
         color: #283E65;
      }

      .item-one-content {
         margin-left: 10rpx;
         color: #909399;
         font-size: 26rpx;
      }

      .item-two {
         font-size: 30rpx;
         color: #A6B4CC;
      }
   }
}

.wrap .movewarehouse-index-scroll-list {
   height: calc(100vh - var(--window-top) - var(--window-bottom) - 378rpx);
   width: 100%;
}

.movewarehouse-index-scroll-list-group {
   ::v-deep .u-cell-item-box {
      background-color: rgba(250, 252, 255, 0.36) !important;
      padding: 0rpx 30rpx;
   .person-btn-view {
      display: flex;
      justify-content: space-between;
      margin-top: 300rpx;
   }

   .content {
      font-size: 12px;
      background-color: #FFFFFF;
      box-sizing: border-box;
      border-radius: 10rpx;
      margin: 0rpx 0rpx 16rpx;
      height: 432rpx;
      padding: 10rpx 20rpx;
      box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(127, 127, 127, 0.1) !important;
      position: relative;
   .popup-container {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      display: flex;
      justify-content: center;
      align-items: center;
   }

      .content-header {
         .header-item {
            height: 50rpx;
            display: flex;
            align-items: center;
   .popup-content {
      width: 600rpx;
      height: 600rpx;
      background-color: #fff;
      border-radius: 8px;
      z-index: 10;
      /* 确保内容在蒙版之上 */
   }

            .content-header-icon-one {
               background-image: url('~@/static/custom/moveWareHouse/label-icon-1.png');
               background-size: 100% auto;
               background-repeat: no-repeat;
               height: 28rpx;
               width: 28rpx;
            }
   .movewarehouse-index-bg {
      background-color: #f6f9ff;
      background-image: url("~@/static/custom/moveWareHouse/locNoBg.png");
      // background: linear-gradient(180deg,rgba(206,227,254,1),rgba(206,227,254,1) 20%,rgba(206,227,254,0.5) 40%,rgba(206,227,254,0.25) 60%,rgba(206,227,254,0.08) 80%,rgba(206,227,254,0));
      padding: 0 20rpx;
      background-attachment: fixed;
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: fixed;
      top: 0;
      bottom: 0;
      width: 100%;
      z-index: -1;
   }

            .content-header-icon-two {
               background-image: url('~@/static/custom/moveWareHouse/header_icon.png');
               background-size: 100% auto;
               background-repeat: no-repeat;
               height: 28rpx;
               width: 28rpx;
            }
   .packing-registration-param {
      padding: 40rpx 30rpx 10rpx 30rpx;

            .content-header-title {
               margin-left: 11rpx;
               font-size: 26rpx;
               font-weight: bold;
               color: #333333;
            }
         }
      .packing-registration-param-title {
         display: flex;
         flex-direction: row;
         align-items: center;
         margin-bottom: 30rpx;

         .header-item-toolbar {
            position: absolute;
            background-image: url('~@/static/custom/moveWareHouse/del-icon.png');
            background-size: 100% auto;
            background-repeat: no-repeat;
            height: 60rpx;
            width: 140rpx;
            right: 0;
            top: 0;
            display: flex;
            justify-content: flex-end;
            padding-top: 10rpx;
            padding-right: 18rpx;

            .header-item-toolbar-del-icon {
               background-image: url('~@/static/custom/moveWareHouse/icon_dele.png');
               background-size: 100% auto;
               background-repeat: no-repeat;
               height: 25rpx;
               width: 22rpx;
               margin-top: 5rpx;
            }

            .header-item-toolbar-del-text {
               margin-left: 7rpx;
               height: 23rpx;
               font-size: 24rpx;
               color: #FFFFFF;
            }
         .title-label {
            margin-left: 14rpx;
            font-size: 34rpx;
            font-weight: bold;
            color: #283e65;
         }
      }

      .content-body {
         height: 300rpx;
         background: #F5F9FF;
      .packing-registration-param-view {
         height: 177rpx;
         background-color: #fff;
         border-radius: 10rpx;
         padding: 25rpx 23rpx;
         padding: 0rpx 23rpx;
         margin-bottom: 30rpx;

         .row-list {
            height: 50rpx;
            display: flex;
            flex-direction: row;
            padding: 0px;
            align-items: center;
            justify-content: space-between;
         }

         .row-list ._label {
            display: flex;
            color: #666666;
            font-size: 26rpx;
            align-items: center;
            width: 170rpx;
         }

         .row-list ._content {
            text-align: right;
            color: #909399;
            font-size: 24rpx;

            ._content-text {
               color: #214ded;
            }
         }

         .row-list ._input {
         .packing-registration-param-item {
            height: 90rpx;
            border: 1px solid #adc8e4;
            line-height: 90rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px solid #4FA0FF;
            height: 56rpx;
            border: none;

            .edit_icon {
               background-image: url('~@/static/custom/finishProductIn/icon_edit.png');
               background-size: 100% auto;
               background-repeat: no-repeat;
               height: 26rpx;
               width: 26rpx;
            .packing-registration-param-item-left {
               .item-one {
                  font-size: 30rpx;
                  color: #666666;
               }
            }

            ::v-deep .uni-input-input {
               color: #D35651;
            .packing-registration-param-item-right {
               display: flex;
               justify-content: space-between;

               .item-one {
                  font-size: 30rpx;
                  color: #333333;
                  margin-right: 6rpx;
               }

               .item-two {
                  font-size: 30rpx;
                  color: #a6b4cc;
                  margin-right: 6rpx;
               }

               .item-three {
                  font-size: 30rpx;
                  color: #214ded;
                  margin-right: 6rpx;
               }
            }
         }

         .param-extra {
            border-bottom: 1px solid #ededed;
         }
      }
   }
}

.new-form-footer {
   display: flex;
   margin-top: 10rpx;
   margin-bottom: 10rpx;
   margin-left: 20rpx;
   margin-right: 20rpx;
   padding-bottom: 14rpx;

   .btn {
      flex: 1;
      margin: 10rpx;
      background: #214DED;
      box-shadow: 0rpx 6rpx 8rpx 0rpx rgba(4, 49, 212, 0.3);
      font-weight: bold;
      color: #FEFEFE;
      font-family: PingFang SC;
   }
}
</style>
</style>