Commit 07615af2 authored by xiangzj's avatar xiangzj

要货模块

parent e51fec4a
......@@ -19,26 +19,44 @@
</view>
</scroll-view>
<view class="conditon-block" :style="conditionTop" :class="{'conditon-block-auto':ishowDetail}">
<!-- <view class="conditon-block" :style="conditionTop" :class="{'conditon-block-auto':ishowDetail}">
<view class="filter-title">
<button type="default" class="filter-btn filter-btn-active"><text
class="filter-btn__text filter-btn-active__text">一周内</text></button>
<button type="default" @click="handleFilter(item)"
:class="{'filter-btn-active':item === filterActiveIndex}" class="filter-btn" v-for="item in 3"
:key='item'>
<text class="filter-btn__text"
:class="{'filter-btn-active__text':item === filterActiveIndex}">{{item}}月内</text></button>
<text class="filter-btn__text" :class="{'filter-btn-active__text':item === filterActiveIndex}">{{item}}月内</text>
</button>
<image @click="handleShowDetail" class="icon-arrow" :class="{'icon-arrow-rotate':ishowDetail}"
src="@/static/image/arrow_up@3x.png" mode="aspectFit"></image>
</view>
<view class="filter-content">
<button type="default" @click="handleFilter(item+3)" class="filter-btn"
:class="{'filter-btn-active':item+3 === filterActiveIndex}" v-for="item in 9" :key='item'><text
class="filter-btn__text"
:class="{'filter-btn-active__text':item+3 === filterActiveIndex}">{{item+3}}月内</text></button>
:class="{'filter-btn-active':item+3 === filterActiveIndex}" v-for="item in 9" :key='item'>
<text class="filter-btn__text" :class="{'filter-btn-active__text':item+3 === filterActiveIndex}">{{item+3}}月内</text>
</button>
</view>
</view> -->
<view class="conditon-block" :style="conditionTop" :class="{'conditon-block-auto':ishowDetail}">
<view class="filter-title">
<button type="default" class="filter-btn" :class="{'filter-btn-active':0 === filterActiveIndex}" @tap="handleFilter('week')">
<text class="filter-btn__text" :class="{'filter-btn-active__text':0 === filterActiveIndex}">一周内</text>
</button>
<button type="default" @tap="handleFilter(item)" class="filter-btn"
:class="{'filter-btn-active':item === filterActiveIndex}" v-for="item in 3" :key='item'>
<text class="filter-btn__text" :class="{'filter-btn-active__text':item === filterActiveIndex}">{{item}}月内</text>
</button>
<image @tap="handleShowDetail" class="icon-arrow" :class="{'icon-arrow-rotate':ishowDetail}"
src="@/static/image/arrow_up@3x.png" mode="aspectFit">
</image>
</view>
<view class="filter-content">
<button type="default" @tap="handleFilter(item+3)" class="filter-btn" :class="{'filter-btn-active':item+3 === filterActiveIndex}" v-for="item in 9" :key='item'>
<text class="filter-btn__text" :class="{'filter-btn-active__text':item+3 === filterActiveIndex}">{{item+3}}月内</text>
</button>
</view>
</view>
<view class="empty"></view>
<swiper ref="swiper1" class="tab-box" :current="tabIndex" :duration="300" @change="onswiperchange"
@transition="onswiperscroll" @animationfinish="animationfinish" @onAnimationEnd="animationfinish">
......@@ -305,7 +323,12 @@
this.ishowDetail = !this.ishowDetail
},
handleFilter(item) {
this.filterActiveIndex = item
if (item === 'week') {
this.filterActiveIndex = 0
} else {
this.filterActiveIndex = item
}
this.pageList[this.tabIndex].refreshData()
}
}
}
......@@ -387,7 +410,7 @@
transition-duration: 0.2s;
transition-property: left;
}
.conditon-block {
position: fixed;
left: 0;
......@@ -411,9 +434,8 @@
}
.icon-arrow {
width: 28rpx;
height: 16rpx;
margin-left: 16rpx;
width: 32rpx;
height: 20rpx;
margin-top: 24rpx;
transition-property: transform;
transition-duration: 0.15s;
......@@ -426,37 +448,37 @@
.filter-btn {
flex: 1;
min-width: 148rpx;
max-width: 148rpx;
width: 148rpx;
height: 68rpx;
line-height: unset;
background: #f8f8f8;
border-radius: 16rpx;
color: #8e8e8e;
font-size: 24rpx;
line-height: 64rpx;
background-color: #f8f8f8;
border-radius: 8px;
margin-right: 20rpx;
margin-bottom: 20rpx;
margin-left: 0;
border: 2rpx solid #f8f8f8;
border: 2rpx solid transparent;
overflow: hidden;
padding: 0;
}
.filter-btn__text {
display: inline-block;
width: 148rpx;
height: 68rpx;
border-radius: 8px;
line-height: 68rpx;
color: #8e8e8e;
text-align: center;
font-size: 24rpx;
}
.filter-btn-active {
background: #f61d30;
color: #fff;
border: 2rpx solid #f61d30;
box-shadow: 0px 4rpx 12rpx 0px rgba(255, 29, 50, 0.56);
}
.filter-btn-active__text {
color: #fff;
background: #f61d30;
}
.filter-content {
......@@ -464,6 +486,10 @@
flex-wrap: wrap;
}
uni-button:after {
border: 0
}
.empty {
height: 124rpx;
}
......
......@@ -10,9 +10,9 @@
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
<picker class="picker-block" @change="bindPickerChange($event,'deliveryPlan')" :value="index"
range-key='name' mode="selector" :range="deliveryPlanArr">
<text class="uni-input">{{orderItem.deliveryPlanName}}</text>
</picker>
</view>
</view>
......@@ -22,44 +22,24 @@
</view>
<view class="text-block">
<text class="middle-date">制票类型</text>
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
</picker>
</view>
</view>
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image>
</view>
<text class="middle-date-des">{{orderItem.ticketTypeVal}}</text>
</view>
<view class="text-block">
<text class="middle-date">开票客户</text>
<text class="middle-date-des">8510050100067259284</text>
<text class="middle-date-des">{{orderItem.custName}}</text>
</view>
<view class="text-block" @click="selectClient">
<text class="middle-date">订单客户</text>
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
</picker>
</view>
</view>
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image>
</view>
<view class="text-block">
<text class="middle-date" @tap="selectClient">订单客户</text>
<text class="middle-date-des">{{orderItem.orderCustName}}</text>
</view>
<view class="text-block">
<text class="middle-date">渠道类型</text>
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
<picker class="picker-block" @change="bindPickerChange($event,'channelType')" :value="orderItem.channelTypeName"
range-key='name' mode="selector" :range="channelTypeArr">
<text class="uni-input">{{orderItem.channelTypeName}}</text>
</picker>
</view>
</view>
......@@ -68,33 +48,22 @@
</view>
<view class="text-block text-block-last">
<text class="middle-date">配额年度</text>
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
</picker>
</view>
</view>
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image>
</view>
<text class="middle-date-des">{{orderItem.annual}}</text>
</view>
</view>
<view class="middle view">
<view class="text-block">
<!-- <view class="text-block">
<text class="middle-date">品牌</text>
<text class="middle-date-des">品牌XX</text>
</view>
</view> -->
<view class="text-block">
<text class="middle-date">产品</text>
<text class="middle-date-des">产品XX</text>
<text class="middle-date-des">{{orderItem.productDesc}}</text>
</view>
<view class="text-block">
<text class="middle-date">未发货件数</text>
<text class="middle-date-des">500,000.00</text>
<text class="middle-date-des">{{orderItem.availableQty}}</text>
</view>
<view class="text-block">
<text class="middle-date">传统当月计划量</text>
......@@ -110,11 +79,11 @@
</view>
<view class="text-block text-block-last">
<text class="middle-date">本次要货件数</text>
<input class="middle-date-des" type="text" v-model="quantity" placeholder="请输入" />
<input class="middle-date-des" type="text" v-model="orderItem.quantity" placeholder="请输入" />
</view>
</view>
<view class="middle view">
<!-- <view class="middle view">
<view class="text-block">
<text class="middle-date">卖场简称</text>
<input class="middle-date-des" type="text" v-model="quantity" placeholder="请输入" />
......@@ -128,16 +97,16 @@
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array">
<text class="uni-input">{{array[index]}}</text>
<picker class="picker-block" @change="bindPickerChange($event,'marketPlace')" :value="orderItem.marketPlaceName"
range-key='name' mode="selector" :range="marketPlaceArr">
<text class="uni-input">{{orderItem.marketPlaceName}}</text>
</picker>
</view>
</view>
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image>
</view>
</view>
</view>
</view> -->
<view class="bottom">
<button class="btn" type="default" @tap="nextStep">
<text class="btn-text">下一步</text>
......@@ -152,14 +121,31 @@
import {
mapState
} from 'vuex'
import {
querySysDictionaryDetailsByCode,
getProdDeliveryPlan
} from '@/servers/purchaseList.js'
export default {
data() {
return {
array: ['2021', '2020', '2019', '2018'],
orderItem: {
ticketTypeVal: '',
deliveryPlanCode: '',
deliveryPlanName: ' ',
channelTypeCode: '',
channelTypeName: ' ',
marketPlaceCode: '',
marketPlaceName: ' ',
quantity: ''
},
index: 0,
quantity: '',
scrollTop: 0
scrollTop: 0,
deliveryPlanArr : [],
ticketTypeArr : [],
channelTypeArr : [],
marketPlaceArr : [],
}
},
computed: {
......@@ -171,7 +157,7 @@
...mapState(['sysinfo'])
},
onShow() {
// uni.showToast({
// uni.showToast({customer
// title: '要货功能开发中...',
// icon: 'none',
// duration: 1200,
......@@ -184,21 +170,96 @@
// });
},
onLoad(option) {
this.orderItem = {
...this.orderItem,
...JSON.parse(option.order)
}
},
created() {
// 发货计划类型:A0002
// 制票类型:A0022
// 渠道类型:A0054
// 卖场区域:A0052
this.getSelectDictDataOrigin('A0002')
this.getSelectDictDataOrigin('A0022')
this.getSelectDictDataOrigin('A0054')
this.getSelectDictDataOrigin('A0052')
// this.getProdDeliveryPlan()
},
methods: {
async getProdDeliveryPlan(){
const params = {
'channel': "",
'customer': this.orderItem.customer,
'planType': "0",
'productCode': this.orderItem.productCode,
'saleCenter': this.orderItem.zzfld000001
}
const res = await getProdDeliveryPlan(params)
console.log(res,'res')
},
selectClient() {
uni.navigateTo({
url: `/pages/select-client/select-client`
});
},
bindPickerChange(e) {
bindPickerChange(e,type) {
console.log('picker发送选择改变,携带值为', e.detail.value)
this.index = e.detail.value
const index = e.detail.value || 0
switch (type) {
case 'deliveryPlan':
this.orderItem.deliveryPlanCode = this.deliveryPlanArr[index].value
this.orderItem.deliveryPlanName = this.deliveryPlanArr[index].name
break;
case 'channelType':
this.orderItem.channelTypeCode = this.channelTypeArr[index].value
this.orderItem.channelTypeName = this.channelTypeArr[index].name
break;
case 'marketPlace':
this.orderItem.marketPlaceCode = this.marketPlaceArr[index].value
this.orderItem.marketPlaceName = this.marketPlaceArr[index].name
break;
}
},
nextStep() {
uni.navigateTo({
url: '/pages/purchase-receive/purchase-receive'
url: `/pages/purchase-receive/purchase-receive?order=${JSON.stringify(this.orderItem)}`
})
},
getSelectDictDataOrigin(dictcode) {
querySysDictionaryDetailsByCode({'code': dictcode})
.then(res => {
if(res.data.Rows.length>0){
switch (dictcode){
case 'A0002':
this.deliveryPlanArr = res.data.Rows
break;
case 'A0022':
this.ticketTypeArr = res.data.Rows
this.getTicketType(this.ticketTypeArr)
break;
case 'A0054':
this.channelTypeArr = res.data.Rows
break;
case 'A0052':
this.marketPlaceArr = res.data.Rows
break;
default:
break;
}
}
})
.catch(() => {})
},
getTicketType(arr) {
arr.forEach(ele => {
if(ele.value === this.orderItem.infType){
this.orderItem.ticketTypeVal = ele.name
}
});
}
}
}
</script>
......
......@@ -14,31 +14,31 @@
<view class="scroll-item">
<view class="item-block item-block-code">
<text class="item-block-label">年度</text>
<text class="item-block-value">2022</text>
<text class="item-block-value">{{item.annual}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">发票类型</text>
<text class="item-block-value">100</text>
<text class="item-block-value">{{item.invType}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">产品</text>
<text class="item-block-value">2022</text>
<text class="item-block-value">{{item.productDesc}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">开票总量</text>
<text class="item-block-value">100</text>
<text class="item-block-value">{{item.invoiceQty}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">已发数量</text>
<text class="item-block-value">2022</text>
<text class="item-block-value">{{item.deliveryQty}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">剩余数量</text>
<text class="item-block-value">100</text>
<text class="item-block-value">{{item.availableQty}}</text>
</view>
<view class="bottom">
<view class="bottom-btn">
<button class="btn btn-l" type="default" @tap="purchaseBtn">
<button class="btn btn-l" type="default" @tap="purchaseBtn(item)">
<text class="btn-text btn-text-l">立即要货</text>
</button>
</view>
......@@ -115,10 +115,9 @@
this.getSalesPlanTypes(true);
},
methods: {
purchaseBtn() {
console.log('00')
purchaseBtn(item) {
uni.navigateTo({
url: '/pages/purchase-main/purchase-main'
url: `/pages/purchase-main/purchase-main?order=${JSON.stringify(item)}`
})
},
async getSalesPlan(isRefresh) {
......@@ -149,8 +148,7 @@
this.page.PAGESIZE = pagesize * 1
this.loadParams.total = total * 1
this.loadParams.totalPage = Math.ceil(total * 1 / this.page.PAGESIZE * 1)
const dataMap = data && data.map((item) => {
const dataMap = data && data.Rows.length>0 && data.Rows.map((item) => {
item.checked = false
return item
})
......
<template>
<view class="lists">
<view class="status_bar" :style="navHeight"></view>
<view class="header-bg">
<image class="header-bg-img" src="@/static/image/nav_bg@3x.png" mode="scaleToFill"></image>
</view>
<view class="main" :style="mainHeight">
<view class="middle view planout-block-item">
<view class="text-block text-block-last">
<text class="middle-date">收货方名称</text>
<view class="middle-date-des uni-list picker-year">
<view class="uni-list-cell">
<view class="uni-list-cell-db">
<input class="middle-date-des" type="text" v-model="searchName" placeholder="请填写" />
</view>
</view>
</view>
</view>
</view>
<view class="planout-block">
<button class="btn" type="default" @tap="search">
<text class="btn-text">查询</text>
</button>
</view>
<list ref="list" class="scroll-area view" loadmoreoffset='100' @loadmore="scrolltolower"
:show-scrollbar='false'>
<refresh @refresh="refresh" :display="refreshing ? 'show' : 'hide'">
</refresh>
<cell v-for="(item,index) in lists" :key="item.guid" @click="handleChecked(item)">
<view class="scroll-item">
<view class="item-block item-block-code">
<text class="item-block-label">收货方单位编号:{{item.partner}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">收货方单位名称:{{item.partner_name}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">联系人:{{item.c_o_name}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">联系电话:{{item.tel_number}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">收货地址:{{item.street}}</text>
</view>
</view>
</cell>
<cell>
<view class="loading-more" v-if='lists.length>2'>
<text class="loading-more-text">{{loadingText}}</text>
</view>
</cell>
<view class="planout-block-item__last"> </view>
</list>
</view>
</view>
</template>
<script>
import {
mapState
} from 'vuex'
import {
getReceipt
} from '@/servers/purchaseList.js'
import timeFormat from '@/uview-ui/libs/function/timeFormat.js'
export default {
data() {
return {
scrollTop: 0,
isOpened: 'none',
loadingText: '加载中...',
refreshing: false,
page: {
"PAGE": "1",
"PAGESIZE": "10",
},
loadParams: {
total: 0,
totalPage: 1,
isDone: false,
isRefresh: false
},
typesIndex: 0,
lists: [],
searchName: '',
orderItem: {},
selectShuntAdressAccountInfo: {}
}
},
computed: {
...mapState(['sysinfo', 'userInfo']),
navHeight() {
return {
'height': `${this.sysinfo.safeArea.top + 44}px`
}
},
mainHeight() {
return {
'height': `${this.sysinfo.safeArea.height - 44 }px`,
}
},
scrollHeight() {
return {
'height': `${this.sysinfo.safeArea.height - 44 - 156 }px`
}
},
},
onLoad(option) {
console.log('select-saleplan', option)
this.orderItem = {
...JSON.parse(option.order)
}
},
created() {
this.reset()
this.getSalesPlanTypes(true);
},
methods: {
handleChecked(item) {
this.selectShuntAdressAccountInfo = item
uni.$emit('selectShuntAdressAccountInfo', {
selectShuntAdressAccountInfo: item
})
uni.navigateBack()
},
search() {
this.reset()
this.getSalesPlan(true, this.searchName);
},
async getSalesPlan(isRefresh, customerCode = this.orderItem.shuntingCustomer) {
if (this.loadParams.isDone) {
return
}
const params = {
'partner': customerCode,
'role': "WLY001"
}
uni.showLoading({
title: '加载中'
});
setTimeout(function() {
uni.hideLoading();
}, 2000);
const res = await getReceipt(params)
uni.hideLoading();
if (isRefresh) {
this.lists = res.data
this.loadParams.isDone = false
} else {
this.lists = this.lists.concat(res.data)
}
setTimeout(() => {
this.refreshing = false;
}, 300)
},
refresh(e) {
this.refreshing = true;
this.reset()
this.getSalesPlan(true)
// #ifdef APP-NVUE
try {
// console.log('-------', this.$refs.list)
this.$refs.list.resetLoadmore();
} catch (e) {
console.log('onrefresh', e)
}
// #endif
},
scrolltolower() {
console.log('onReachBottom');
if (this.page.PAGE < this.loadParams.totalPage) {
this.page.PAGE++
this.getSalesPlan()
} else {
this.loadParams.isDone = true
this.loadingText = '-- 到底了 --'
}
},
reset() {
this.loadParams = {
total: 0,
totalPage: 1,
isDone: false,
isRefresh: false
}
this.page.PAGE = 1
this.lists = []
this.loadingText = '加载中'
},
async getSalesPlanTypes() {
this.getSalesPlan()
},
bindPickerTypesChange(e) {
console.log('bindPickerTypesChange', e.detail.value)
this.typesIndex = e.detail.value
this.getSalesPlan()
},
bindPickerYearChange(e) {
console.log('bindPickerYearChange', e.detail.value)
this.getSalesPlan()
},
handleClick(e, content, index) {
console.log('click当前索引:', e, content, index);
},
nextStep() {
this.$emit('click', 'orderUpload')
},
preStep() {
uni.switchTab({
url: `/pages/go-order/go-order`
})
},
}
}
</script>
<style lang="scss" scoped>
.view {
flex-direction: column;
}
.header-bg {
height: 284rpx;
opacity: 0.72;
margin-top: -88rpx;
}
.header-bg-img {
width: 750rpx;
}
.lists {
position: relative;
flex-direction: column;
background: #f0f4f5;
flex: 1;
}
.main {
position: relative;
flex-direction: column;
margin-top: -164rpx;
padding: 0 16rpx;
}
.scroll-area {
overflow-y: scroll;
}
.middle {
background-color: #fff;
border-radius: 16rpx;
padding: 32rpx 64rpx 40rpx 48rpx;
}
.planout-block {
display: flex;
justify-content: space-between;
margin-bottom: 48rpx;
padding: 0 24rpx;
}
.text-block {
overflow: hidden;
height: 96rpx;
margin-bottom: 14rpx;
border-bottom: 1px solid #f4f5f6;
}
.text-block-last {
margin-bottom: 0;
border-bottom: 0;
}
.middle-date {
flex: 2;
font-size: 28rpx;
line-height: 96rpx;
color: #333;
margin-bottom: 8rpx;
}
.middle-date-des {
flex: 3;
font-size: 28rpx;
line-height: 96rpx;
height: 96rpx;
overflow: hidden;
text-overflow: ellipsis;
color: #888;
}
.picker-year {
position: relative;
border-radius: 4px;
align-items: center;
line-height: normal;
}
.uni-list-cell {
flex: 1;
}
.uni-list-cell-db {
flex: 1;
}
.picker-block {
flex: 1;
}
.uni-input-text {
font-size: 14px;
color: #888;
}
.icon-arrow {
position: absolute;
right: 0;
top: 16px;
width: 12rpx;
height: 20rpx;
z-index: 10;
}
.planout-block-lists {
display: flex;
flex-direction: column;
}
.planout-block-item {
margin-bottom: 32rpx;
}
.scroll-item {
flex: 1;
display: flex;
flex-direction: column;
margin-bottom: 32rpx;
background-color: #fff;
border-radius: 16rpx;
padding: 32rpx 64rpx 40rpx 48rpx;
}
.planout-block-item__last {
height: 40px;
}
.item-block {
overflow: hidden;
}
.item-block-label {
font-size: 24rpx;
color: #333;
}
.item-block__label {
flex: 1;
text-align: left;
font-size: 32rpx;
color: #333;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
}
.item-block-code {
padding-bottom: 16rpx;
}
.item-block-name {
padding-top: 24rpx;
padding-bottom: 32rpx;
}
.item-block-label-des {
flex: 1;
text-align: left;
font-size: 28rpx;
color: #333;
}
.detal-item-label {
color: #999;
font-size: 24rpx;
}
.detal-item-value {
color: #333;
font-size: 28rpx;
}
.btn {
flex: 1;
height: 92rpx;
background: $wly-primary-color;
border-radius: 46rpx;
}
.btn-text {
color: #fff;
font-size: 34rpx;
}
.loading-more {
flex: 1;
align-items: center;
justify-content: center;
padding-top: 14px;
padding-bottom: 14px;
text-align: center;
}
.loading-more-text {
font-size: 12px;
color: #999;
}
</style>
<template>
<view class="lists">
<view class="status_bar" :style="navHeight"></view>
<view class="header-bg">
<image class="header-bg-img" src="@/static/image/nav_bg@3x.png" mode="scaleToFill"></image>
</view>
<view class="main" :style="mainHeight">
<list ref="list" class="scroll-area view" loadmoreoffset='100' @loadmore="scrolltolower"
:show-scrollbar='false'>
<refresh @refresh="refresh" :display="refreshing ? 'show' : 'hide'">
</refresh>
<cell v-for="(item,index) in lists" :key="item.plan_number" @click="handleChecked(item)">
<view class="scroll-item">
<view class="item-block item-block-code">
<text class="item-block-label">分流经销商名称:{{item.shuntingCustomerName}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">分流经销商编号:{{item.shuntingCustomer}}</text>
</view>
<view class="item-block item-block-code">
<text class="item-block-label">渠道:{{item.channels}}</text>
</view>
</view>
</cell>
<cell>
<view class="loading-more" v-if='lists.length>2'>
<text class="loading-more-text">{{loadingText}}</text>
</view>
</cell>
<view class="planout-block-item__last"> </view>
</list>
</view>
</view>
</template>
<script>
import {
mapState
} from 'vuex'
import {
findByCustomer
} from '@/servers/purchaseList.js'
import timeFormat from '@/uview-ui/libs/function/timeFormat.js'
export default {
data() {
return {
scrollTop: 0,
isOpened: 'none',
loadingText: '加载中...',
refreshing: false,
page: {
"PAGE": "1",
"PAGESIZE": "10",
},
loadParams: {
total: 0,
totalPage: 1,
isDone: false,
isRefresh: false
},
selectedSalePlan: {},
selectedSalePlanTypes: [],
typesIndex: 0,
lists: [],
orderItem: {}
}
},
computed: {
...mapState(['sysinfo', 'userInfo']),
navHeight() {
return {
'height': `${this.sysinfo.safeArea.top + 44}px`
}
},
mainHeight() {
return {
'height': `${this.sysinfo.safeArea.height - 44 }px`,
}
},
scrollHeight() {
return {
'height': `${this.sysinfo.safeArea.height - 44 - 156 }px`
}
},
},
onLoad(option) {
console.log('select-saleplan', option)
this.orderItem = {
...JSON.parse(option.order)
}
},
// onPullDownRefresh() {
// console.log('refresh');
// this.reset()
// this.getSalesPlan(true)
// setTimeout(function() {
// uni.stopPullDownRefresh();
// }, 600);
// },
created() {
this.reset()
this.getSalesPlanTypes(true);
},
methods: {
handleChecked(item) {
this.selectShuntAccountInfo = item
uni.$emit('selectShuntAccountInfo', {
selectShuntAccountInfo: item
})
uni.navigateBack()
},
async getSalesPlan(isRefresh) {
if (this.loadParams.isDone) {
return
}
const params = {
// 'customerCode': this.orderItem.orderCust,
'customerCode': '4000005000',
'type': '2',
}
uni.showLoading({
title: '加载中'
});
setTimeout(function() {
uni.hideLoading();
}, 2000);
const res = await findByCustomer(params)
uni.hideLoading();
if (isRefresh) {
this.lists = res.data.setShuntingDetailList
this.loadParams.isDone = false
} else {
this.lists = this.lists.concat(res.data.setShuntingDetailList)
}
setTimeout(() => {
this.refreshing = false;
}, 300)
},
refresh(e) {
this.refreshing = true;
this.reset()
this.getSalesPlan(true)
// #ifdef APP-NVUE
try {
// console.log('-------', this.$refs.list)
this.$refs.list.resetLoadmore();
} catch (e) {
console.log('onrefresh', e)
}
// #endif
},
scrolltolower() {
console.log('onReachBottom');
if (this.page.PAGE < this.loadParams.totalPage) {
this.page.PAGE++
this.getSalesPlan()
} else {
this.loadParams.isDone = true
this.loadingText = '-- 到底了 --'
}
},
reset() {
this.loadParams = {
total: 0,
totalPage: 1,
isDone: false,
isRefresh: false
}
this.page.PAGE = 1
this.lists = []
this.loadingText = '加载中'
},
async getSalesPlanTypes() {
this.getSalesPlan()
},
bindPickerTypesChange(e) {
console.log('bindPickerTypesChange', e.detail.value)
this.typesIndex = e.detail.value
this.getSalesPlan()
},
bindPickerYearChange(e) {
console.log('bindPickerYearChange', e.detail.value)
this.getSalesPlan()
},
handleClick(e, content, index) {
console.log('click当前索引:', e, content, index);
},
nextStep() {
this.$emit('click', 'orderUpload')
},
preStep() {
uni.switchTab({
url: `/pages/go-order/go-order`
})
},
}
}
</script>
<style lang="scss" scoped>
.view {
flex-direction: column;
}
.header-bg {
height: 284rpx;
opacity: 0.72;
margin-top: -88rpx;
}
.header-bg-img {
width: 750rpx;
}
.lists {
position: relative;
flex-direction: column;
background: #f0f4f5;
flex: 1;
}
.main {
position: relative;
flex-direction: column;
margin-top: -164rpx;
padding: 0 16rpx;
}
.scroll-area {
overflow-y: scroll;
}
.middle {
background-color: #fff;
border-radius: 16rpx;
padding: 32rpx 64rpx 40rpx 48rpx;
}
.planout-block {
display: flex;
justify-content: space-between;
margin-bottom: 48rpx;
padding: 0 24rpx;
}
.text-block {
overflow: hidden;
height: 96rpx;
margin-bottom: 14rpx;
border-bottom: 1px solid #f4f5f6;
}
.text-block-last {
margin-bottom: 0;
border-bottom: 0;
}
.middle-date {
flex: 2;
font-size: 28rpx;
line-height: 96rpx;
color: #333;
margin-bottom: 8rpx;
}
.middle-date-des {
flex: 3;
font-size: 28rpx;
line-height: 96rpx;
height: 96rpx;
overflow: hidden;
text-overflow: ellipsis;
color: #888;
}
.picker-year {
position: relative;
border-radius: 4px;
align-items: center;
line-height: normal;
}
.uni-list-cell {
flex: 1;
}
.uni-list-cell-db {
flex: 1;
}
.picker-block {
flex: 1;
}
.uni-input-text {
font-size: 14px;
color: #888;
}
.icon-arrow {
position: absolute;
right: 0;
top: 16px;
width: 12rpx;
height: 20rpx;
z-index: 10;
}
.planout-block-lists {
display: flex;
flex-direction: column;
}
.planout-block-item {
margin-bottom: 32rpx;
}
.scroll-item {
flex: 1;
display: flex;
flex-direction: column;
margin-bottom: 32rpx;
background-color: #fff;
border-radius: 16rpx;
padding: 32rpx 64rpx 40rpx 48rpx;
}
.planout-block-item__last {
height: 40px;
}
.item-block {
overflow: hidden;
}
.item-block-label {
font-size: 24rpx;
color: #333;
}
.item-block__label {
flex: 1;
text-align: left;
font-size: 32rpx;
color: #333;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
}
.item-block-code {
padding-bottom: 16rpx;
}
.item-block-name {
padding-top: 24rpx;
padding-bottom: 32rpx;
}
.item-block-label-des {
flex: 1;
text-align: left;
font-size: 28rpx;
color: #333;
}
.detal-item-label {
color: #999;
font-size: 24rpx;
}
.detal-item-value {
color: #333;
font-size: 28rpx;
}
.btn {
flex: 1;
height: 92rpx;
background: $wly-primary-color;
border-radius: 46rpx;
}
.btn-text {
color: #fff;
font-size: 34rpx;
}
.loading-more {
flex: 1;
align-items: center;
justify-content: center;
padding-top: 14px;
padding-bottom: 14px;
text-align: center;
}
.loading-more-text {
font-size: 12px;
color: #999;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment