liuleilei
2023-09-11 faf1d3cc35a3a5f83558946c8056537a4d77fa1f
minipro_standard/pages_adjust/pages/warehousingDetails1/warehousingDetails1.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,407 @@
<template>
   <view class="content">
      <view class="order-message">
         <view class="content_list_item_top">
            <view class="content_list_item_top_left">
               <text>{{ data.code }}</text>
            </view>
            <view class="content_list_item_top_right">
               <text class="warning" v-if="data.status === 0">待入库</text>
               <text class="green" v-else-if="data.status === 1">已入库</text>
               <text class="info" v-else-if="data.status === 2">已取消</text>
            </view>
         </view>
         <view class="content_list_item_content">
            <view class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">单据类型:</view>
               <view class="content_list_item_content_item_nr" v-if="data.billType">
                  {{ seeText(data.billType) }}
               </view>
            </view>
            <view class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">入库仓库:</view>
               <view class="content_list_item_content_item_nr">
                  {{ data.warehouseCode + ' | ' + data.warehouseName }}
               </view>
            </view>
            <view class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">计划入库:</view>
               <view class="content_list_item_content_item_nr">
                  {{ data.planDate }}
               </view>
            </view>
            <view class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">来源类型:</view>
               <view class="content_list_item_content_item_nr" v-if="data.originType">
                  {{ tyepToStr(data.originType) }}
               </view>
            </view>
            <view class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">来源单号:</view>
               <view class="content_list_item_content_item_nr">
                  {{ data.originCode ? data.originCode : '-' }}
               </view>
            </view>
         </view>
      </view>
      <!-- è½¬åº“物料 -->
      <view class="title">
         <text class="title-prefix"></text>
         <text>入出库物料</text>
      </view>
      <view class="material-content">
         <view class="item-style" v-for="(item, index) in materailArray" :key="index">
            <view class="item-title-style">
               <text style="font-weight: 500;">{{ item.materialName + ' | ' + item.materialCode}}</text>
            </view>
            <view class="item-content-style">
               <view class="content_list_item_content_item">
                  <text class="content_list_item_content_item_label">批次号:</text>
                  <text class="content_list_item_content_item_nr">{{ item.batch || '-' }}</text>
               </view>
               <view class="content_list_item_content_item">
                  <text class="content_list_item_content_item_label">数量:</text>
                  <text class="content_list_item_content_item_nr">{{ item.doneNum + item.unitName }}</text>
               </view>
               <view class="content_list_item_content_item">
                  <text class="content_list_item_content_item_label">工序:</text>
                  <text class="content_list_item_content_item_nr">{{ item.procedureName || '-' }}</text>
               </view>
               <view class="content_list_item_content_item">
                  <view class="content_list_item_content_item_label">质量:</view>
                  <view class="content_list_item_content_item_nr">
                     <text v-if="item.qualityType == 0" class="green">合格</text>
                     <text v-else-if="item.qualityType == 1" class="yellow">不良</text>
                     <text v-else-if="item.qualityType == 2" class="red">报废</text>
                     <text v-else>-</text>
                  </view>
               </view>
               <view class="content_list_item_content_item">
                  <text class="content_list_item_content_item_label">入库货位:</text>
                  <text
                     class="content_list_item_content_item_nr">{{ item.locationName ? item.locationName : '-' }}</text>
               </view>
            </view>
         </view>
      </view>
      <view v-if="data.status === 0" style="height:94rpx"></view>
      <view v-if="data.status === 0" class="bottom-button">
         <button class="button button-cancel" @click="submit">去入库</button>
         <!-- <button class="button button-cancel" @click="cancel">取消</button> -->
      </view>
   </view>
</template>
<script>
   import {
      orderTyepToStr
   } from '@/util/constData.js'
   import {
      getBoundDetail,
      cancelBound
   } from '@/util/api/materialStorage'
   export default {
      data() {
         return {
            id: null,
            types: [{
                  name: '全部',
                  id: '',
                  isActive: true
               },
               {
                  name: '采购订单',
                  id: '0',
                  isActive: false
               },
               {
                  name: '生产工单',
                  id: '1',
                  isActive: false
               },
               {
                  name: '销售订单',
                  id: '2',
                  isActive: false
               },
               {
                  name: '转库单',
                  id: '3',
                  isActive: false
               },
               {
                  name: '盘点单',
                  id: '4',
                  isActive: false
               },
            ],
            data: {
               code: "",
               createName: "",
               planDate: "",
               dealDate: "",
               status: 0,
               originType: 0,
               originCode: "",
               updateName: "",
               updateMobile: "",
               updateTime: "",
               warehouseName: "",
               warehouseCode: "",
               outPlandate: "",
               inPlandate: "",
               woutboundDetailsWait: [],
               woutboundDetailsOut: []
            },
            materailArray: []
         };
      },
      onLoad(option) {
         this.id = option.id
         getBoundDetail({
            id: option.id
         })
         .then(res => {
            this.data = res.data
            if (this.data.status === 1) {
               this.materailArray.push(...this.data.woutboundDetailsOut)
            } else {
               this.materailArray.push(...this.data.woutboundDetailsWait)
            }
         })
      },
      methods: {
         seeText(id) {
            return orderTyepToStr(id)
         },
         tyepToStr(type) {
            for (const item of this.types) {
               if (parseInt(item.id) === this.type) {
                  return item.name
               }
            }
            return '-'
         },
         submit() {
         },
         cancel() {
            cancelBound({
               id: this.id
            })
            .then(res => {
               uni.showToast({
                  title: '取消成功',
                  icon: 'success',
                  duration: 2000
               });
               uni.navigateBack({
                  delta: 1
               });
            })
            .catch(err => {
               uni.showToast({
                  title: err.message,
                  icon: 'error',
                  duration: 2000
               });
            })
         }
      }
   }
</script>
<style lang="scss" scoped>
   .content {
      background: white;
      .order-message {
         padding: 30rpx;
         display: flex;
         flex-direction: column;
         // border-bottom: 1rpx solid #ececec;
         .content_list_item_top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            .content_list_item_top_left {
               display: flex;
               // align-items: center;
               text {
                  font-size: 32rpx;
                  font-weight: 500;
                  color: #333333;
               }
            }
            .content_list_item_top_right {
               font-size: 26rpx;
               font-weight: 400;
               .created {
                  color: $nav-stateColor1 !important;
               }
               .warning {
                  color: $nav-stateColor5 !important;
               }
               .green {
                  color: $nav-stateColor6 !important;
               }
               .info {
                  color: $nav-stateColor3 !important;
               }
            }
         }
         .content_list_item_content {
            padding: 24rpx 30rpx;
            background: #f7f7f7;
            border-radius: 16rpx;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin-top: 32rpx;
            .content_list_item_content_item:first-child {
               margin-top: 0;
            }
            .content_list_item_content_item {
               width: 100%;
               display: flex;
               align-items: center;
               margin-top: 24rpx;
               .content_list_item_content_item_label {
                  font-size: 24rpx;
                  font-weight: 400;
                  color: #666666;
                  flex-shrink: 0;
               }
               .content_list_item_content_item_nr {
                  font-size: 24rpx;
                  font-weight: 400;
                  color: #222222;
                  margin-right: 10rpx;
               }
            }
         }
      }
      .title {
         background-color: #f7f7f7;
         padding: 30rpx;
         font-size: 30rpx;
         display: flex;
         align-items: center;
         .title-prefix {
            display: inline-block;
            background-color: #4275FC;
            height: 30rpx;
            width: 8rpx;
            border-radius: 1rpx;
            margin-right: 12rpx;
         }
      }
      .material-content {
         padding: 30rpx;
         .item-style {
            width: initial;
            border-bottom: 1rpx solid #ececec;
            margin-top: 30rpx;
            &:first-child {
               margin-top: 0 !important;
            }
            &:last-child {
               border: none;
            }
            .item-title-style {
               margin-bottom: 12rpx;
               font-size: 30rpx;
            }
            .item-content-style {
               // padding: 24rpx 30rpx;
               // background-color: #f7f7f7;
               // border-radius: 16rpx;
               display: flex;
               flex-wrap: wrap;
               padding-bottom: 30rpx;
               justify-content: space-between;
               &:last-child {
                  padding-bottom: 0;
               }
               .content_list_item_content_item {
                  width: 100%;
                  display: flex;
                  margin-top: 24rpx;
                  .content_list_item_content_item_label {
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #666666;
                     flex-shrink: 0;
                  }
                  .content_list_item_content_item_nr {
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #222222;
                     margin-right: 10rpx;
                  }
               }
            }
         }
      }
      .bottom-button {
         padding: 1rpx;
         background-color: #f7f7f7;
         position: fixed;
         width: 100%;
         bottom: 0;
         height: 188rpx;
         display: flex;
         justify-content: space-between;
         .button-action {
            background: #fff;
            color: $nav-color;
         }
         .button-cancel {
            background: $nav-color;
            color: #FFFFFF;
         }
         .button {
            margin: 32rpx 32rpx 68rpx 32rpx;
            height: 88rpx;
            /*width: 668rpx;*/
            // width: 334rpx;
            border: none;
            border-radius: 8rpx;
            box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.08);
            display: flex;
            align-items: center;
            justify-content: center;
         }
      }
   }
</style>