| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <u-popup :show="show" mode="bottom" :closeable="true" :round="10" @open="open" @close="close"> |
| | | <view class="title"> |
| | | <text>éæ©ç©æ</text> |
| | | </view> |
| | | <view class="content"> |
| | | <view class="content_search"> |
| | | <u-search :showAction="false" placeholder="æç´¢ç©æåç§°" v-model="form.name" @search="searchInput"></u-search> |
| | | </view> |
| | | <div class="content_total">å
±{{total}}æ¡æ°æ®</div> |
| | | <scroll-view scroll-y class="content_list" @scrolltolower="loadmore"> |
| | | <div class="content_list_item" v-for="(item, index) in list" :key="index" @click="getVal(item)"> |
| | | <div class="content_list_item_name"> |
| | | <span>{{item.mmodelUnionName}}</span> |
| | | </div> |
| | | </div> |
| | | </scroll-view> |
| | | </view> |
| | | </u-popup> |
| | | </template> |
| | | |
| | | <script> |
| | | import { materialDistributeExt } from '@/util/api/ExWarehouse' |
| | | |
| | | export default { |
| | | props: { |
| | | show: Boolean |
| | | }, |
| | | data() { |
| | | return { |
| | | keyword: '', |
| | | total: 0, |
| | | list: [], |
| | | loading: false, |
| | | finished: false, |
| | | refreshing: false, |
| | | form: { |
| | | capacity: 50, |
| | | page: 0, |
| | | total: 0, |
| | | name: '' |
| | | } |
| | | }; |
| | | }, |
| | | methods: { |
| | | searchInput() { |
| | | this.form.page = 0 |
| | | this.finished = false |
| | | this.list = [] |
| | | this.loadmore() |
| | | }, |
| | | getVal(item) { |
| | | this.$emit('value', item) |
| | | }, |
| | | open() { |
| | | this.form.page = 0 |
| | | this.finished = false |
| | | this.list = [] |
| | | this.loadmore() |
| | | }, |
| | | loadmore() { |
| | | if (!this.finished) { |
| | | this.loading = true; |
| | | this.form.page = this.form.page += 1 |
| | | materialDistributeExt({ |
| | | capacity: this.form.capacity, |
| | | page: this.form.page, |
| | | model: { |
| | | mmodelUnionName: this.form.name, |
| | | status: 1 |
| | | } |
| | | }).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 |
| | | 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; |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | close() { |
| | | this.$emit('close') |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .title { |
| | | width: 100%; |
| | | height: 85rpx; |
| | | line-height: 85rpx; |
| | | text-align: center; |
| | | text { |
| | | font-size: 30rpx; |
| | | font-family: PingFangSC-Medium, PingFang SC; |
| | | font-weight: 500; |
| | | color: #222222; |
| | | } |
| | | } |
| | | .content { |
| | | width: 100%; |
| | | .content_search { |
| | | width: 100%; |
| | | padding: 0 30rpx 30rpx 30rpx; |
| | | background: white; |
| | | position: sticky; |
| | | top: 85rpx; |
| | | z-index: 9; |
| | | box-sizing: border-box; |
| | | } |
| | | .content_total { |
| | | padding: 24rpx 30rpx; |
| | | background: #F7F7F7; |
| | | font-size: 24rpx; |
| | | font-weight: 400; |
| | | color: #666666; |
| | | } |
| | | .content_list { |
| | | width: 100%; |
| | | height: 800rpx; |
| | | display: flex; |
| | | flex-direction: column; |
| | | .content_list_item { |
| | | padding: 30rpx; |
| | | display: flex; |
| | | border-bottom: 1rpx solid #ececec; |
| | | .serious { |
| | | color: $nav-stateColor4 !important; |
| | | } |
| | | .success { |
| | | color: $nav-stateColor2 !important; |
| | | } |
| | | .warning { |
| | | color: $nav-stateColor5 !important; |
| | | } |
| | | .content_list_item_status { |
| | | font-size: 28rpx; |
| | | margin-right: 10rpx; |
| | | } |
| | | .content_list_item_name { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | span { |
| | | font-size: 30rpx; |
| | | font-family: PingFangSC-Regular, PingFang SC; |
| | | font-weight: 400; |
| | | color: #222222; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |