bug

jiangping

2023-11-07 64b432916af9c9218ab3f3eca614e26c542142ae

 minipro_standard/pages_adjust/components/multipleMaterial.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,317 @@
<template>
   <u-popup :show="show" :round="10" closeable @close="show = false">
      <view class="material-content bbox p30 rp">
         <view class="tc b f24 c2 mb20">选择物料</view>
         <v-Search @searchInput="searchInput" @submit="submit" :isShow="false" placeholder="搜索物料名称/编码" />
         <div class="content_total">共{{form.total}}条数据12</div>
         <view class="scroll-content">
            <!-- refresher-enabled="true"
            :refresher-triggered="refreshing"
            @refresherrefresh="onRefresh" -->
            <scroll-view
            scroll-y="true"
            @scrolltolower="loadMore">
               <view v-for="(item1, index) in list" :key="index" class="flex mb20" @click="jump(index)">
                  <view class="img36 mr20 pt10">
                     <u-checkbox-group style="display: block;" name="">
                        <u-checkbox :checked="item1.isActive"></u-checkbox>
                     </u-checkbox-group>
                  </view>
                  <view class="fx1">
                     <div class="page_content_title_top">
                        <span>{{ item1.materialName + ' | ' + item1.materialCode }}</span>
                     </div>
                     <div class="page_content_title_bottom">
                        <span class="green" v-if="item1.qualityType == 0">
                           åˆæ ¼
                           <text class="c1" decode>{{ splite }}</text>
                        </span>
                        <span class="orange" v-else-if="item1.qualityType == 1">
                           ä¸è‰¯
                           <text class="c1" decode>{{ splite }}</text>
                        </span>
                        <span class="red" v-else-if="item1.qualityType == 2">
                           æŠ¥åºŸ
                           <text class="c1" decode>{{ splite }}</text>
                        </span>
                        <span v-else>
                           -
                           <text class="c1" decode>{{ splite }}</text>
                        </span>
                        <span>
                           {{item1.procedureName ? item1.procedureName : '-'}}
                           <text class="c1" decode>{{ splite }}</text>
                        </span>
                        <span>{{item1.batch ? item1.batch : '-'}}</span>
                     </div>
                     <div class="mt20 plr25 ptb20 bg_f7 f26">
                        <div class="c2 mb10"><span class="c6">货位：</span>{{ item1.locationName }}</div>
                        <div class="c2"><span class="c6">数量：</span>{{ item1.num }}{{ item1.unitName }}</div>
                     </div>
                  </view>
               </view>
            </scroll-view>
            <!-- <u-list @scrolltoupper="scrolltoupper" @scrolltolower="scrolltolower">
               <u-list-item v-for="(item1, index) in list" :key="index">
						
               </u-list-item>
            </u-list> -->
         </view>
         <view style="height: 98rpx;"></view>
         <!-- <view class="">
            <u-safe-bottom></u-safe-bottom>
         </view> -->
         <view class="fixedBottom bottom cY">
            <view class="fx1 bbox plr30">
               <u-checkbox-group v-model="isAll" style="display: block;" @change="selectAll()">
                  <u-checkbox label="全选" name="all"></u-checkbox>
               </u-checkbox-group>
            </view>
            <view class="submit sbtn_green bbox tc" @click="submitAction">{{ `提交(${totalNum})`}}</view>
         </view>
      </view>
   </u-popup>
</template>

<script>
   import vSearch from '@/components/Search.vue'
   import { choiceStockListPage } from '@/util/api/agencyAPI'
	
   export default {
      name: "selectMaterial",
      components: {
         vSearch
      },
      data() {
         return {
            show: false,
            splite: '&nbsp;|&nbsp;',
            form: {
               capacity: 50,
               page: 0,
               total: 0,
               smodelLabel: '',
               categoryId: ''
            },
            list: [],
            loading: false,
            finished: false,
            refreshing: false,
            isAll: false,
            total: 0
         };
      },
      props: {
         warehouseId: {
            type: String,
            default: ''
         },
         warehouseQualityType: {
            type: String,
            default: ''
         },
         selected: {
            type: Array,
            default: []
         }
      },
      computed: {
         all() {
            for (let i = 0; i < this.list.length; i++) {
               if (!this.list[i].isActive) {
                  return false
               }
            }
            return true
         },
         totalNum() {
            let num = 0;
            this.list.forEach(item => {
               if (item.isActive) {
                  num += 1
               }
            })
            return num;
         }
      },
      methods: {
         open() {
            this.isAll = false
            this.show = true
            this.refreshing = false
            this.finished = false
            this.list = []
            this.form.page = 0
            this.form.total = 0
            this.loadData()
         },
         jump(index) {
            this.list.forEach((item, i) => {
               if (index === i) {
                  item.isActive = !item.isActive
               }
            })
         },
         // æœç´¢æäº¤
         submit() {
            this.form.page = 0
            this.finished = false
            this.list = []
            this.loadData()
         },
         // æœç´¢æ¡†
         searchInput(data) {
            this.form.page = 0
            this.finished = false
            this.list = []
            this.form.smodelLabel = data
            this.loadData()
         },
         loadData() {
            if (!this.finished) {
               this.loading = true;
               this.form.page = this.form.page += 1
               choiceStockListPage({
                  capacity: this.form.capacity,
                  page: this.form.page,
                  model: {
                     warehouseId: this.warehouseId,
                     warehouseQualityType: this.warehouseQualityType,
                     ids: this.selected.length > 0 ? this.selected.join(',') : '',
                     materialName: this.form.smodelLabel
                  }
               }).then(res => {
                  if (this.refreshing) {
                     this.list = []
                     this.refreshing = false;
                  }
                  this.loading = false;
                  if (res.code === 200 && res.data.records && res.data.records.length !== 0) {
                     this.form.total = res.data.total
                     res.data.records.forEach(element => {
                        element.isActive = false
                     })
                     this.list.push(...res.data.records)
                  } else {
                     this.finished = true;
                  }
               }).catch(err => {
                  this.loading = false;
                  this.finished = true;
                  if (this.refreshing) {
                     this.list = []
                     this.refreshing = false;
                  }
               })
            }
         },
         loadMore() {
            this.pages.page += 1
            this.loadData()
         },
         onRefresh() {
            if (this.refreshing) return
            this.refreshing = true;
            this.pages.page = 1
            this.loadData()
         },
         selectAll(e) {
            console.log(e)
            console.log(this.isAll)
            this.list.forEach(element => {
               element.isActive = e.length > 0 ? true : false
            })
         },
         submitAction () {
            this.show = false
            let arr = []
            this.list.forEach(element => {
               if (element.isActive) {
                  arr.push(element)
               }
            })
            this.$emit('value', arr)
         }
      }
   }
</script>

<style lang="scss" scoped>
   .material-content {
      display: flex;
      flex-direction: column;
      height: 1200rpx;
      box-sizing: border-box;

      .scroll-content {
         height: calc(1100rpx - env(safe-area-inset-bottom));
         overflow: scroll;
      }
   }

   .content_total {
      margin-top: 20rpx;
      margin-bottom: 20rpx;
      // padding: 24rpx 30rpx;
      // background: #F7F7F7;
      font-size: 24rpx;
      font-weight: 400;
      color: #666666;
   }

   .page_content_title_top {
      display: flex;
      align-items: center;
      justify-content: space-between;

      span {
         &:nth-child(1) {
            font-size: 30rpx;
            font-weight: 500;
            color: #222222;
         }

         &:nth-child(2) {
            flex-shrink: 0;
            font-size: 24rpx;
            font-weight: 400;
            color: #333333;

            // span {
            //    font-size: 24rpx;
            //    color: $nav-color;
            // }
         }
      }
   }

   .page_content_title_bottom {
      margin-top: 24rpx;

      span {
         font-size: 24rpx;
         font-weight: 400;
         color: #666666;
      }
   }

   .page_content_title {
      display: flex;
      flex-direction: column;
      margin-bottom: 10rpx;




   }

   .bottom {
      height: 98rpx;

      .submit {
         width: 272rpx;
         height: 98rpx;
         line-height: 98rpx;
      }
   }
</style>