|
|
@@ -7,36 +7,36 @@
|
|
|
>
|
|
|
<view class="header-top" :style="{ paddingTop: top + 'px', lineHeight: CustomBar + 30 + 'px' }"></view>
|
|
|
<view class="header-sit">
|
|
|
- <text class="iconfont icon-fanhui"></text>
|
|
|
+ <text class="iconfont icon-fanhui" @click.stop="navBack"></text>
|
|
|
<text class="header-sit-text">收款列表</text>
|
|
|
<text class="iconfont icon-iconfonticonfontsousuo1" @click.stop="rDrawer"></text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view
|
|
|
class="tui-header-box"
|
|
|
- :style="{ height: CustomBar + 30 + 'px', backgroundImage: 'url(' + statistic_bg1 + ')' }"
|
|
|
+ :style="{ height: CustomBar -34 + 'px', backgroundImage: 'url(' + statistic_bg1 + ')' }"
|
|
|
></view>
|
|
|
- <view class="user-section" :style="{ top: CustomBar + 30 + 'px', left: 0 + 'px' }">
|
|
|
+ <view class="user-section" :style="{ top: CustomBar + 16 + 'px', left: 0 + 'px' }">
|
|
|
<view class="header-content">
|
|
|
<view class="header-tabs day clearfix">
|
|
|
- <view class="main day">
|
|
|
+ <view class="main one">
|
|
|
<view
|
|
|
- class="main-item day"
|
|
|
+ class="main-item one"
|
|
|
v-for="(item, index) in listTabs"
|
|
|
:key="index"
|
|
|
:class="{ active: currents == index }"
|
|
|
- @click="tabClick(index)"
|
|
|
+ @click="tabClick(1,index)"
|
|
|
>
|
|
|
<view class="text">{{ item.name }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="main day">
|
|
|
<view
|
|
|
- class="main-item day"
|
|
|
+ class="main-item tab"
|
|
|
v-for="(item, index) in listTabsType"
|
|
|
:key="index"
|
|
|
- :class="{ active: currents == index }"
|
|
|
- @click="tabClick(index)"
|
|
|
+ :class="{ tabActive: tabCurrents == index }"
|
|
|
+ @click="tabClick(2,index)"
|
|
|
>
|
|
|
<view class="text">{{ item.name }}</view>
|
|
|
</view>
|
|
|
@@ -90,58 +90,32 @@
|
|
|
<!--右抽屉-->
|
|
|
<tui-drawer mode="right" :visible="rightDrawer" @close="closeDrawer">
|
|
|
<view class="d-container clearfix" :style="{ paddingTop: CustomBar + 10 + 'px' }">
|
|
|
- <view class="d-time">
|
|
|
- <text class="iconfont icon-month"></text>
|
|
|
- <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
|
|
|
- <input
|
|
|
- class="input"
|
|
|
- type="text"
|
|
|
- disabled="false"
|
|
|
- v-model="listQuery.date"
|
|
|
- value=""
|
|
|
- placeholder="选择提交订单时间"
|
|
|
- />
|
|
|
- </picker>
|
|
|
- </view>
|
|
|
- <view class="d-input">
|
|
|
- <input class="input" type="text" value="" v-model="listQuery.orderNum" placeholder="输入订单编号" />
|
|
|
- </view>
|
|
|
- <view class="d-input">
|
|
|
- <input
|
|
|
- class="input"
|
|
|
- type="text"
|
|
|
- value=""
|
|
|
- v-model="listQuery.phone"
|
|
|
- placeholder="输入收货人姓名/手机号"
|
|
|
- />
|
|
|
- </view>
|
|
|
- <view class="d-input">
|
|
|
- <picker @change="bindPickerChange(1, $event)" :value="index" :range="Array" range-key="name">
|
|
|
- <input
|
|
|
- class="input"
|
|
|
- type="text"
|
|
|
- disabled="false"
|
|
|
- v-model="listQuery.classification"
|
|
|
- value=""
|
|
|
- placeholder="订单分类"
|
|
|
- />
|
|
|
- <text class="iconfont icon-xiangxiajiantoujiantou"></text>
|
|
|
- </picker>
|
|
|
+ <view class="drawer-main">
|
|
|
+ <view class="drawer-main-name">日期</view>
|
|
|
+ <view class="drawer-main-time">
|
|
|
+ <view class="drawer-main-time-input">
|
|
|
+ <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindStartDateChange">
|
|
|
+ <text class="input-text">{{ queryData.startAddTime }}</text>
|
|
|
+ </picker>
|
|
|
+ <text class="iconfont icon-riqi"></text>
|
|
|
+ </view>
|
|
|
+ <view class="line">-</view>
|
|
|
+ <view class="drawer-main-time-input">
|
|
|
+ <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindEndDateChange">
|
|
|
+ <text class="input-text">{{ queryData.endAddTime }}</text>
|
|
|
+ </picker>
|
|
|
+ <text class="iconfont icon-riqi"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="drawer-main-name">收款短信(全匹配)</view>
|
|
|
+ <view class="drawer-main-textarea">
|
|
|
+ <textarea class="textarea" placeholder="请输入收款备注..." v-model="params.remarks" />
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="d-input">
|
|
|
- <picker @change="bindPickerChange(2, $event)" :value="index" :range="Array1" range-key="name">
|
|
|
- <input
|
|
|
- class="input"
|
|
|
- type="text"
|
|
|
- disabled="false"
|
|
|
- v-model="listQuery.source"
|
|
|
- value=""
|
|
|
- placeholder="订单来源"
|
|
|
- />
|
|
|
- <text class="iconfont icon-xiangxiajiantou"></text>
|
|
|
- </picker>
|
|
|
+ <view class="drawer-input btn" :style="{ paddingBottom: isIphoneX ? '68rpx' : '34rpx' }">
|
|
|
+ <view class="drawer-btn clear" @click="closeDrawer">取消</view>
|
|
|
+ <view class="drawer-btn comfrim" @click="handSearchConfirm">确定</view>
|
|
|
</view>
|
|
|
- <view class="d-input btn"> <view class="d-btn" @click="handSearchList">搜索</view> </view>
|
|
|
</view>
|
|
|
</tui-drawer>
|
|
|
<!-- 弹窗 -->
|
|
|
@@ -166,23 +140,6 @@ import modalLayer from '@/components/modal-layer'
|
|
|
import empty from '@/components/empty'
|
|
|
import wxLogin from '@/services/wxLogin.js'
|
|
|
import { mapState, mapMutations } from 'vuex'
|
|
|
-function getDate(type) {
|
|
|
- const date = new Date()
|
|
|
-
|
|
|
- let year = date.getFullYear()
|
|
|
- let month = date.getMonth() + 1
|
|
|
- let day = date.getDate()
|
|
|
-
|
|
|
- if (type === 'start') {
|
|
|
- year = year - 60
|
|
|
- } else if (type === 'end') {
|
|
|
- year = year + 2
|
|
|
- }
|
|
|
- month = month > 9 ? month : '0' + month
|
|
|
- day = day > 9 ? day : '0' + day
|
|
|
-
|
|
|
- return `${year}-${month}-${day}`
|
|
|
-}
|
|
|
const defaultListQuery = {
|
|
|
pageNum: 1, //页数
|
|
|
pageSize: 10, //条数
|
|
|
@@ -199,7 +156,10 @@ export default {
|
|
|
empty
|
|
|
},
|
|
|
data() {
|
|
|
+ const currentDate = this.getDate({ format: true })
|
|
|
return {
|
|
|
+ CustomBar: this.CustomBar, // 顶部导航栏高度
|
|
|
+ isIphoneX: this.$store.state.isIphoneX,
|
|
|
Array: [{ name: '正常订单' }, { name: '秒杀订单' }],
|
|
|
Array1: [{ name: '小程序订单' }, { name: 'APP订单' }],
|
|
|
listTabs: [
|
|
|
@@ -214,9 +174,11 @@ export default {
|
|
|
{ name: '待审核', type: 3 },
|
|
|
{ name: '审核通过', type: 4 }
|
|
|
],
|
|
|
- date: getDate({
|
|
|
- format: true
|
|
|
- }),
|
|
|
+ queryData:{
|
|
|
+ startAddTime:'',
|
|
|
+ endAddTime:'',
|
|
|
+ },
|
|
|
+ date: currentDate,
|
|
|
listCount: {
|
|
|
toBeClosed: 0,
|
|
|
toBeDelivered: 0,
|
|
|
@@ -224,9 +186,8 @@ export default {
|
|
|
toBeReceived: 0,
|
|
|
toBeSuccess: 0
|
|
|
},
|
|
|
- startDate: getDate('start'),
|
|
|
- endDate: getDate('end'),
|
|
|
currents: 0,
|
|
|
+ tabCurrents:0,
|
|
|
statistic_bg: statistic_bg2,
|
|
|
statistic_bg1: statistic_bg1,
|
|
|
CustomBar: this.CustomBar, // 顶部导航栏高度
|
|
|
@@ -272,16 +233,46 @@ export default {
|
|
|
} else {
|
|
|
return '未支付'
|
|
|
}
|
|
|
- },
|
|
|
+ },
|
|
|
NumFormat: function(text) {
|
|
|
//处理金额
|
|
|
return Number(text).toFixed(2)
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapState(['hasLogin', 'userInfo'])
|
|
|
+ ...mapState(['hasLogin', 'userInfo']),
|
|
|
+ startDate() {
|
|
|
+ return this.getDate('start')
|
|
|
+ },
|
|
|
+ endDate() {
|
|
|
+ return this.getDate('end')
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
+ getDate(type) {
|
|
|
+ const date = new Date()
|
|
|
+ let year = date.getFullYear()
|
|
|
+ let month = date.getMonth() + 1
|
|
|
+ let day = date.getDate()
|
|
|
+ if (type === 'start') {
|
|
|
+ year = year - 1
|
|
|
+ } else if (type === 'end') {
|
|
|
+ year = year + 1
|
|
|
+ }
|
|
|
+ month = month > 9 ? month : '0' + month
|
|
|
+ day = day > 9 ? day : '0' + day
|
|
|
+ return `${year}-${month}-${day}`
|
|
|
+ },
|
|
|
+ bindStartDateChange(event){
|
|
|
+ //开始时间
|
|
|
+ console.log('开始时间==>',event.detail.value)
|
|
|
+ this.queryData.startAddTime = event.detail.value
|
|
|
+ },
|
|
|
+ bindEndDateChange(event){
|
|
|
+ //结束时间
|
|
|
+ console.log('结束时间==>',event.detail.value)
|
|
|
+ this.queryData.endAddTime = event.detail.value
|
|
|
+ },
|
|
|
getOrderListCount() {
|
|
|
//查询数量
|
|
|
this.OrderService.OrderListCount()
|
|
|
@@ -590,9 +581,17 @@ export default {
|
|
|
price = Number(n).toFixed(2)
|
|
|
return price
|
|
|
},
|
|
|
- tabClick(index) {
|
|
|
- this.currents = index
|
|
|
- this.getOrderDatainit(this.currents)
|
|
|
+ tabClick(type,index) {
|
|
|
+ switch(type){
|
|
|
+ case 1:
|
|
|
+ this.currents = index
|
|
|
+ this.getOrderDatainit(this.currents)
|
|
|
+ break
|
|
|
+ case 2:
|
|
|
+ this.tabCurrents = index
|
|
|
+ this.getOrderDatainit(this.currents)
|
|
|
+ }
|
|
|
+
|
|
|
},
|
|
|
bindDateChange: function(e) {
|
|
|
//选择筛选时间
|
|
|
@@ -615,6 +614,11 @@ export default {
|
|
|
this.getOrderDatainit(this.currents)
|
|
|
this.leftDrawer = false
|
|
|
this.rightDrawer = false
|
|
|
+ },
|
|
|
+ navBack() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
onPageScroll(e) {
|
|
|
@@ -657,93 +661,116 @@ page {
|
|
|
background: #fff;
|
|
|
}
|
|
|
.d-container {
|
|
|
- width: 560rpx;
|
|
|
- padding: 80rpx 30rpx;
|
|
|
- .d-title {
|
|
|
- width: 100%;
|
|
|
- height: 80rpx;
|
|
|
- line-height: 80rpx;
|
|
|
- text-align: center;
|
|
|
- color: #4688fa;
|
|
|
- font-size: $font-size-32;
|
|
|
- float: left;
|
|
|
- }
|
|
|
- .d-time {
|
|
|
+ width: 580rpx;
|
|
|
+ padding: 80rpx 0;
|
|
|
+ .drawer-main {
|
|
|
width: 100%;
|
|
|
- height: 70rpx;
|
|
|
- float: left;
|
|
|
+ height: auto;
|
|
|
box-sizing: border-box;
|
|
|
- padding: 0 10rpx;
|
|
|
- border: 1px solid rgba(0, 0, 0, 0.2);
|
|
|
- border-radius: 4rpx;
|
|
|
- margin-bottom: 30rpx;
|
|
|
- .iconfont {
|
|
|
- width: 70rpx;
|
|
|
- height: 60rpx;
|
|
|
- display: block;
|
|
|
- float: left;
|
|
|
- font-size: 50rpx;
|
|
|
- color: #666666;
|
|
|
- line-height: 70rpx;
|
|
|
+ float: left;
|
|
|
+ .drawer-main-name{
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
text-align: left;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #333333;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ font-weight: bold;
|
|
|
}
|
|
|
- .input {
|
|
|
- width: 220rpx;
|
|
|
- height: 70rpx;
|
|
|
- line-height: 70rpx;
|
|
|
- float: left;
|
|
|
+ .drawer-main-time{
|
|
|
+ width: 100%;
|
|
|
+ height: 56rpx;
|
|
|
box-sizing: border-box;
|
|
|
- font-size: $font-size-24;
|
|
|
- color: #333333;
|
|
|
- padding: 0 10rpx;
|
|
|
+ .line{
|
|
|
+ color: #999999;
|
|
|
+ float: left;
|
|
|
+ line-height: 56rpx;
|
|
|
+ }
|
|
|
+ .drawer-main-time-input{
|
|
|
+ width: 228rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ background: #F7F7F7;
|
|
|
+ border-radius: 28rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ line-height: 56rpx;
|
|
|
+ float: left;
|
|
|
+ margin: 0 20rpx;
|
|
|
+ position: relative;
|
|
|
+ box-shadow: 0 10rpx 10rpx 0 rgba(86, 119, 252, 0.2);
|
|
|
+ .input-text{
|
|
|
+ display: block;
|
|
|
+ height: 56rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ .icon-riqi{
|
|
|
+ color: $color-system;
|
|
|
+ display: block;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ position: absolute;
|
|
|
+ right: 10rpx;
|
|
|
+ top: 0;
|
|
|
+ line-height: 56rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .drawer-main-textarea {
|
|
|
+ width: 100%;
|
|
|
+ height: 160rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding:0 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ .textarea {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #F7F7F7;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding:10rpx 20rpx;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ box-shadow: 0 10rpx 10rpx 0 rgba(86, 119, 252, 0.2);
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- .d-input {
|
|
|
+ .drawer-input {
|
|
|
width: 100%;
|
|
|
- height: 70rpx;
|
|
|
float: left;
|
|
|
box-sizing: border-box;
|
|
|
- padding: 0 10rpx;
|
|
|
+ padding: 24rpx 10rpx 0 10rpx;
|
|
|
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
|
border-radius: 4rpx;
|
|
|
- margin-bottom: 30rpx;
|
|
|
position: relative;
|
|
|
+ background-color: #ffffff;
|
|
|
&.btn {
|
|
|
border: none;
|
|
|
- margin-top: 40rpx;
|
|
|
- }
|
|
|
- .input {
|
|
|
- width: 100%;
|
|
|
- height: 70rpx;
|
|
|
- line-height: 70rpx;
|
|
|
- float: left;
|
|
|
- box-sizing: border-box;
|
|
|
- font-size: $font-size-24;
|
|
|
- color: #333333;
|
|
|
- padding: 0 10rpx;
|
|
|
- padding-right: 68rpx;
|
|
|
+ display: flex;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
}
|
|
|
- .iconfont {
|
|
|
- width: 68rpx;
|
|
|
- height: 68rpx;
|
|
|
- display: block;
|
|
|
- line-height: 68rpx;
|
|
|
- text-align: center;
|
|
|
- font-size: 40rpx;
|
|
|
- color: #999999;
|
|
|
- position: absolute;
|
|
|
- right: 0;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
- .d-btn {
|
|
|
- width: 100%;
|
|
|
- height: 70rpx;
|
|
|
- border-radius: 35rpx;
|
|
|
- background-color: #4688fa;
|
|
|
- line-height: 70rpx;
|
|
|
+ .drawer-btn {
|
|
|
+ width: 210rpx;
|
|
|
+ height: 84rpx;
|
|
|
+ border-radius: 42rpx;
|
|
|
+ background: $btn-confirm;
|
|
|
+ line-height: 84rpx;
|
|
|
text-align: center;
|
|
|
+ font-size: $font-size-26;
|
|
|
color: #ffffff;
|
|
|
- font-size: $font-size-28;
|
|
|
+ flex: 1;
|
|
|
+ margin: 0 10rpx;
|
|
|
+ &.comfrim {
|
|
|
+ background: $btn-confirm;
|
|
|
+ }
|
|
|
+ &.clear {
|
|
|
+ background: #F7F7F7;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -822,8 +849,8 @@ page {
|
|
|
box-sizing: border-box;
|
|
|
&.day {
|
|
|
background: #ffffff;
|
|
|
- padding: 24rpx 20rpx;
|
|
|
- box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
+ box-shadow: 0 10rpx 10rpx 0 rgba(86, 119, 252, 0.2);
|
|
|
}
|
|
|
.title {
|
|
|
font-size: $font-size-36;
|
|
|
@@ -834,35 +861,61 @@ page {
|
|
|
}
|
|
|
.main {
|
|
|
width: 100%;
|
|
|
- height: 60rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ &.day {
|
|
|
+ height: 50rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+ &.one{
|
|
|
+ border-bottom: 1px solid #EFEFEF;
|
|
|
+ }
|
|
|
.main-item {
|
|
|
float: left;
|
|
|
- width: 21%;
|
|
|
text-align: center;
|
|
|
color: #ffffff;
|
|
|
box-sizing: border-box;
|
|
|
+ &.one{
|
|
|
+ width: 25%;
|
|
|
+ .text {
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ display: block;
|
|
|
+ float: left;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #666666;
|
|
|
+ text-align: center;
|
|
|
+ font-weight: 600;
|
|
|
+ font-family: '正楷';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.tab{
|
|
|
+ width: 140rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ background: #F7F7F7;
|
|
|
+ margin: 0 10rpx;
|
|
|
+ padding:0 20rpx;
|
|
|
+ .text {
|
|
|
+ width: 100%;
|
|
|
+ height: 50rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ display: block;
|
|
|
+ float: left;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ color: #666666;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
&.active {
|
|
|
.text {
|
|
|
- font-weight: bold;
|
|
|
color: #576efa;
|
|
|
font-size: $font-size-28;
|
|
|
}
|
|
|
}
|
|
|
- .text {
|
|
|
- width: 100%;
|
|
|
- height: 60rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- display: block;
|
|
|
- float: left;
|
|
|
- font-size: $font-size-26;
|
|
|
- color: #666666;
|
|
|
- text-align: center;
|
|
|
- &.nm {
|
|
|
- color: #222222;
|
|
|
- height: 40rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- font-size: $font-size-32;
|
|
|
- font-weight: bold;
|
|
|
+ &.tabActive {
|
|
|
+ .text {
|
|
|
+ color: #576efa;
|
|
|
}
|
|
|
}
|
|
|
}
|
