Merge remote-tracking branch 'origin/dev' into dev

liuleilei

2023-09-11 faf1d3cc35a3a5f83558946c8056537a4d77fa1f

 minipro_standard/pages_adjust/pages/outboundDetails/outboundDetails.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,402 @@
<template>
   <view class="content1">
      <view class="order-message">
         <view class="content_list_item_top">
            <view class="content_list_item_top_left">
               <!--          <text>出库单号：</text>-->
               <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 style="margin-top: 0 " 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 v-if="data.updateName" class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">操作人：</view>
               <view class="content_list_item_content_item_nr">
                  {{ data.updateName + ' - ' + data.updateMobile }}
               </view>
            </view>
            <view v-if="data.updateTime" class="content_list_item_content_item">
               <view class="content_list_item_content_item_label">操作时间：</view>
               <view class="content_list_item_content_item_nr">
                  {{ data.updateTime }}
               </view>
            </view>
         </view>
      </view>
      <!-- è½¬åº“物料 -->
      <view class="title">
         <text class="title-prefix"></text>
         <text>{{ data.status == 1 ? '已出库物料' : '待出库物料' }}</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">
                  <view class="content_list_item_content_item_label">批次号：</view>
                  <view class="content_list_item_content_item_nr">
                     {{ item.batch }}
                  </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">
                     {{ item.num + item.unitName }}
                  </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">
                     {{ item.procedureName || '-' }}
                  </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">
                     <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">
                  <view class="content_list_item_content_item_label">出库货位：</view>
                  <view class="content_list_item_content_item_nr">
                     {{ item.locationName }}
                  </view>
               </view>
            </view>
            <!--        <view style="margin-top:10rpx; background: #cccccc; height:0.5rpx"></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-action" @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,
            data: {
               code: "",
               createName: "",
               planDate: "",
               dealDate: "",
               status: 0,
               originType: 0,
               originCode: "",
               updateName: "",
               updateMobile: "",
               updateTime: "",
               warehouseName: "",
               warehouseCode: "",
               outPlandate: "",
               inPlandate: "",
               woutboundDetailsWait: [],
               woutboundDetailsOut: []
            },
            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
               },
            ],
            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) {
            //  <!-- 1、车间领料；2、车间备料；3、其他；4、完工入库 -->
            for (const item of this.types) {
               if (parseInt(item.id) === 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>
   .content1 {
      padding: 30rpx;
      background: white;

      .order-message {
         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 {
               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;
               }
            }
         }
      }

      .title {
         font-size: 30rpx;
         display: flex;
         align-items: center;
         margin-top: 30rpx;

         .title-prefix {
            display: inline-block;
            background-color: #4275FC;
            height: 30rpx;
            width: 8rpx;
            border-radius: 1rpx;
            margin-right: 12rpx;
         }
      }

      .material-content {
         margin-top: 30rpx;

         .item-style {
            width: initial;
            border-bottom: 1rpx solid #ececec;
            margin-top: 30rpx;

            &: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;
               justify-content: space-between;
               padding: 1rpx 1rpx 30rpx 1rpx;

               .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: 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>