Commit c2efb3ce authored by xiangzj's avatar xiangzj

要货

parent 99dd3159
<template> <template>
<view class="lists"> <view class="purchase-page">
<view class="status_bar" :style="navHeight"> <view class="status_bar" :style="navHeight"></view>
</view> <view class="tabs">
<scroll-view class="scroll-area view" :scroll-top="scrollTop" show-scrollbar='false' scroll-y="true"> <uni-cell v-for="(item, index) in dataList" :key="item.id" class="tab-box">
<view class="main"> <uni-list ref="list" class="listview" :enableBackToTop="true" :scroll-y="true" @scrolltolower="loadMore()">
<view class="middle view"> <!-- <uni-refresh class="refresh" @refresh="onrefresh" @pullingdown="onpullingdown"
<view class="text-block"> :display="refreshing ? 'show' : 'hide'">
<text class="middle-date">发货计划类型</text> <div class="refresh-view">
<view class="middle-date-des uni-list picker-year"> <image class="refresh-icon" :src="refreshIcon" :style="{width: (refreshing || pulling) ? 0: '32px'}"
<view class="uni-list-cell"> :class="{'refresh-icon-active': refreshFlag}"></image>
<view class="uni-list-cell-db"> <uni-load-more v-if="refreshing" class="loading-icon" status="loading"
<picker class="picker-block" @change="bindPickerChange" :value="index" :contentText="loadingMoreText"></uni-load-more>
:range="array"> <text class="loading-text">{{refreshText}}</text>
<text class="uni-input">{{array[index]}}</text> </div>
</picker> </uni-refresh> -->
</view> <view class="block-detal-item">
</view> <text class="detal-item-label">品牌</text>
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image> <text class="detal-item-value">尖庄2101</text>
</view>
<uni-cell v-if="isLoading || dataList.length > 4">
<view class="loading-more">
<text class="loading-more-text">{{loadingText}}</text>
</view> </view>
</uni-cell>
</view> </uni-list>
<view class="text-block"> <no-data class="no-data" v-if="isNoData" @retry="loadMore"></no-data>
<text class="middle-date">制票类型</text> </uni-cell>
<view class="middle-date-des uni-list picker-year"> </view>
<view class="uni-list-cell"> </view>
<view class="uni-list-cell-db"> </template>
<picker class="picker-block" @change="bindPickerChange" :value="index"
:range="array"> <script>
<text class="uni-input">{{array[index]}}</text> import { mapState } from 'vuex'
</picker> import uniList from '@/components/uni-list.vue';
</view> import uniCell from '@/components/uni-cell.vue';
</view> import uniRefresh from '@/components/uni-refresh.vue';
<image class="icon-arrow" src="@/static/image/arrow_r@3x.png" mode=""></image> import uniLoadMore from '@/components/uni-load-more.vue';
</view> import noData from '@/components/nodata.nvue';
</view> export default {
<view class="text-block"> components: {
<text class="middle-date">开票客户</text> uniList,
<text class="middle-date-des">8510050100067259284</text> uniCell,
</view> uniRefresh,
<view class="text-block" @click="selectClient"> uniLoadMore,
<text class="middle-date">订单客户</text> noData,
<view class="middle-date-des uni-list picker-year"> },
<view class="uni-list-cell"> data() {
<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>
<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>
</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>
</view>
</view>
<view class="middle view">
<view class="text-block">
<text class="middle-date">品牌</text>
<text class="middle-date-des">品牌XX</text>
</view>
<view class="text-block">
<text class="middle-date">产品</text>
<text class="middle-date-des">产品XX</text>
</view>
<view class="text-block">
<text class="middle-date">未发货件数</text>
<text class="middle-date-des">500,000.00</text>
</view>
<view class="text-block">
<text class="middle-date">传统当月计划量</text>
<text class="middle-date-des">500,000.00</text>
</view>
<view class="text-block">
<text class="middle-date">传统当月剩余量</text>
<text class="middle-date-des">500,000.00</text>
</view>
<view class="text-block">
<text class="middle-date">传统当年剩余量</text>
<text class="middle-date-des">8510050100067259284</text>
</view>
<view class="text-block text-block-last">
<text class="middle-date">本次要货件数</text>
<input class="middle-date-des" type="text" v-model="quantity" placeholder="请输入" />
</view>
</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="请输入" />
</view>
<view class="text-block">
<text class="middle-date">卖场全称</text>
<input class="middle-date-des" type="text" v-model="quantity" placeholder="请输入" />
</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>
</view>
</view>
<view class="bottom">
<button class="btn" type="default" @tap="nextStep">
<text class="btn-text">下一步</text>
</button>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
import {
mapState
} from 'vuex'
export default {
data() {
return { return {
array: ['2021', '2020', '2019', '2018'], dataList: ['1','2','3','1','2','3','1','2'],
index: 0, navigateFlag: false,
quantity: '', pulling: false,
scrollTop: 0 refreshing: false,
} refreshFlag: false,
}, refreshText: "",
isLoading: false,
loadingText: '加载中...',
isNoData: false,
pulling: false,
angle: 0,
loadingMoreText: {
contentdown: '',
contentrefresh: '',
contentnomore: ''
},
refreshIcon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAB5QTFRFcHBw3Nzct7e39vb2ycnJioqK7e3tpqam29vb////D8oK7wAAAAp0Uk5T////////////ALLMLM8AAABxSURBVHja7JVBDoAgDASrjqj//7CJBi90iyYeOHTPMwmFZrHjYyyFYYUy1bwUZqtJIYVxhf1a6u0R7iUvWsCcrEtwJHp8MwMdvh2amHduiZD3rpWId9+BgPd7Cc2LIkPyqvlQvKxKBJ//Qwq/CacAAwDUv0a0YuKhzgAAAABJRU5ErkJggg==",
condition: {
USER_BP: '50000215',
ROLE: 'WLY001',
PROCESS_TYPE: [{
"SIGN": "I",
"OPTION": "EQ",
LOW: '',
HIGH: ''
}],
POSTING_DATE: [{
"SIGN": "I",
"OPTION": "BT",
LOW: '',
HIGH: ''
}]
},
page: {
"PAGE": "1",
"PAGESIZE": "10",
},
loadParams: {
total: 0,
totalPage: 1,
isDone: false,
isRefresh: false
},
}
},
computed: { computed: {
...mapState(['sysinfo']),
navHeight() { navHeight() {
return { return {
'height': `${this.sysinfo.safeArea.top + 44}px` 'height': `${this.sysinfo.safeArea.top + 44}px`
} }
}, },
...mapState(['sysinfo']) },
}, onReady() {
onShow() {
uni.showToast({ },
title: '要货功能开发中...', }
icon: 'none', </script>
duration: 1200,
mask: true, <style lang="scss" scoped>
complete: () => { .purchase-page {
uni.switchTab({ flex-direction: column;
url: '/pages/usercenter/usercenter' flex: 1;
}) }
}
}); /* #ifndef APP-PLUS */
page {
}, width: 100%;
methods: { min-height: 100%;
selectClient() { display: flex;
uni.navigateTo({ background: $background-color-1;
url: `/pages/select-client/select-client` }
});
}, .status_bar {
bindPickerChange(e) { height: var(--status-bar-height);
console.log('picker发送选择改变,携带值为', e.detail.value) }
this.index = e.detail.value
}, /* #endif */
nextStep() {
uni.navigateTo({ .tabs {
url: '/pages/purchase-receive/purchase-receive' flex: 1;
}) flex-direction: column;
}, padding: 0 7px;
}
}
</script>
<style lang="scss" scoped>
.view {
flex-direction: column;
}
/* #ifndef APP-PLUS */
page {
width: 100%; width: 100%;
min-height: 100%; height: 100%;
display: flex;
background: #fff;
}
.status_bar {
height: var(--status-bar-height);
background: #fff;
}
/* #endif */
.lists {
flex: 1;
flex-direction: column;
background: #f0f4f5;
overflow-y: scroll;
}
.scroll-area {
flex: 1;
}
.main {
margin: 0 16rpx;
flex-direction: column;
border-radius: 16rpx;
margin-top: 16rpx;
}
.middle {
background-color: #fff;
border-radius: 16rpx;
padding: 32rpx 64rpx 0 48rpx;
margin-bottom: 16rpx;
}
.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: #999;
margin-bottom: 8rpx;
}
.middle-date-des {
flex: 3;
font-size: 28rpx;
height: 96rpx;
line-height: 96rpx;
color: $text-base-color;
}
.picker-year {
position: relative;
align-items: center;
padding-left: 14rpx;
}
.uni-list-cell {
flex: 1;
} }
.listview{
.uni-list-cell-db {
flex: 1; flex: 1;
background: #ffffff;
margin-top: 12px;
} }
.tab-box {
.picker-block {
flex: 1; flex: 1;
} width: 100%;
height: 100%;
.uni-input { }
font-size: 14px;
color: $text-base-color; </style>
} \ No newline at end of file
.icon-arrow {
position: absolute;
right: 22rpx;
top: 40rpx;
width: 7px;
height: 10px;
z-index: 10;
}
.bottom {
margin-top: 68rpx;
padding: 0 16rpx;
justify-content: space-between;
}
.btn {
flex: 1;
height: 92rpx;
margin: 0 auto 48rpx;
background: $wly-primary-color;
border-radius: 46rpx;
}
.btn-text {
color: #fff;
font-size: 34rpx;
}
.btn-text-l {
color: $wly-primary-color;
}
</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