|
@@ -1,55 +1,41 @@
|
|
|
<template>
|
|
|
<view class="content flex flex_column">
|
|
|
- <view class="header u-flex">
|
|
|
- <view class="tab">
|
|
|
- <u-tabs :show-bar="false" :active-item-style="activeItemStyle" :list="tabsList" :is-scroll="false" :current="current" @change="changeTabs"></u-tabs>
|
|
|
- </view>
|
|
|
- <view class="payType" @click="gatherShow = true">
|
|
|
- <text :style="{ color: wordColor }">收款方式</text>
|
|
|
- <u-icon name="shaixuan" custom-prefix="iscm-icon" size="30" :color="wordColor"></u-icon>
|
|
|
+ <view id="tab">
|
|
|
+ <view class="header u-flex">
|
|
|
+ <view class="tab">
|
|
|
+ <u-tabs :show-bar="false" :active-item-style="activeItemStyle" :list="tabsList" :is-scroll="false" :current="params.allCustomerFlag" @change="changeTabs"></u-tabs>
|
|
|
+ </view>
|
|
|
+ <view class="payType" @click="gatherShow = true">
|
|
|
+ <text :style="{ color: wordColor }">收款方式</text>
|
|
|
+ <u-icon name="shaixuan" custom-prefix="iscm-icon" size="30" :color="wordColor"></u-icon>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <view class="tabCon flex flex_column" v-show="current == 0">
|
|
|
- <view class="scroll-con u-flex u-row-between">
|
|
|
+ <view class="scroll-con u-flex u-row-between" v-show="params.allCustomerFlag == 0">
|
|
|
<scroll-view scroll-x class="scroll-date">
|
|
|
<view class="u-flex" v-show="!showType">
|
|
|
- <view v-for="(item, i) in 10" :key="i">
|
|
|
+ <view v-for="(item, i) in dayGatherArr" :key="i">
|
|
|
<view class="scroll-box" :class="chooseNum == i ? 'activeBox' : ''" v-if="i < 2" @click="handleDate(i)">
|
|
|
- <view>11.{{ i + 1 }}</view>
|
|
|
- <view>今日</view>
|
|
|
+ <view>{{item}}</view>
|
|
|
+ <view>{{i==0?'今日':'昨日'}}</view>
|
|
|
</view>
|
|
|
- <view class="scroll-box" v-else :class="chooseNum == i ? 'activeBox' : ''" @click="handleDate(i)">{{ i + 1 }}</view>
|
|
|
+ <view class="scroll-box" v-else :class="chooseNum == i ? 'activeBox' : ''" @click="handleDate(i)">{{item.split('.')[1]}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="u-flex" v-show="showType">
|
|
|
- <view v-for="(item, i) in 10" :key="i">
|
|
|
- <view class="scroll-box" :class="chooseNum == i ? 'activeBox' : ''" v-if="i < 2" @click="handleDate(i)">
|
|
|
- <view>2022.{{ i + 1 }}</view>
|
|
|
- <view>本月</view>
|
|
|
+ <view v-for="(con, j) in monthGatherArr" :key="j">
|
|
|
+ <view class="scroll-box" :class="chooseNum == j ? 'activeBox' : ''" v-if="j < 2" @click="handleDate(j)">
|
|
|
+ <view>{{con}}</view>
|
|
|
+ <view>{{j==0?'本月':'上月'}}</view>
|
|
|
</view>
|
|
|
- <view class="scroll-box" v-else :class="chooseNum == i ? 'activeBox' : ''" @click="handleDate(i)">2022.{{ i + 1 }}</view>
|
|
|
+ <view class="scroll-box" v-else :class="chooseNum == j ? 'activeBox' : ''" @click="handleDate(j)">{{con}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
<u-image :src="`../../static/${theme}/navIcon/dayImg.png`" width="42" height="42" v-show="!showType" @click="chooseType"></u-image>
|
|
|
<u-image :src="`../../static/${theme}/navIcon/monthImg.png`" width="42" height="42" v-show="showType" @click="chooseType"></u-image>
|
|
|
</view>
|
|
|
- <view class="customer-con">
|
|
|
- <view class="customer-list">
|
|
|
- <view class="u-line-1">按成修配按成修配按成修配按成修配按成修配按成修配按成修配按成修配按成修配</view>
|
|
|
- <view class="customer-b u-flex">
|
|
|
- <view class="customer-box">
|
|
|
- <text>欠款:</text>
|
|
|
- <text>¥582222.00</text>
|
|
|
- </view>
|
|
|
- <view class="customer-box">收款方式:现金</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="tabCon flex flex_column" v-show="current == 1">
|
|
|
- <view class="customer-search">
|
|
|
- <u-search
|
|
|
+ <view class="customer-search" v-show="params.allCustomerFlag == 1">
|
|
|
+ <u-search
|
|
|
v-model="keyword"
|
|
|
@input="$u.debounce(getSearchCon, 800)"
|
|
|
@search="getSearchCon"
|
|
@@ -59,23 +45,9 @@
|
|
|
placeholder="请输入客户名称拼音首字母查询"
|
|
|
></u-search>
|
|
|
</view>
|
|
|
- <view class="customer-con">
|
|
|
- <u-index-list :scrollTop="scrollTop">
|
|
|
- <view v-for="(item, index) in indexList" :key="index">
|
|
|
- <u-index-anchor :index="item" />
|
|
|
- <view class="customer-list">
|
|
|
- <view class="u-line-1">按成修配按成修配按成修配按成修配按成修配按成修配按成修配按成修配按成修配</view>
|
|
|
- <view class="customer-b u-flex">
|
|
|
- <view class="customer-box">
|
|
|
- <text>欠款:</text>
|
|
|
- <text>¥582222.00</text>
|
|
|
- </view>
|
|
|
- <view class="customer-box">收款方式:现金</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </u-index-list>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ <view class="customer-con">
|
|
|
+ <customerList ref="customer" :height="listHeight" :params="params" ></customerList>
|
|
|
</view>
|
|
|
<!-- 收款方式弹窗 -->
|
|
|
<search :showModal="gatherShow" @refresh="refreshList" @close="gatherShow=false"/>
|
|
@@ -84,8 +56,11 @@
|
|
|
|
|
|
<script>
|
|
|
import search from './gather.vue'
|
|
|
+import customerList from './customerList.vue'
|
|
|
+import { queryVerifySalesParams } from '@/api/dealerBizParam.js';
|
|
|
+import getDate from '@/libs/getDate.js';
|
|
|
export default {
|
|
|
- components:{search},
|
|
|
+ components:{search,customerList},
|
|
|
data() {
|
|
|
return {
|
|
|
tabsList: [
|
|
@@ -93,22 +68,37 @@ export default {
|
|
|
name: '最近开单'
|
|
|
},
|
|
|
{
|
|
|
- name: '全部用户'
|
|
|
+ name: '全部客户'
|
|
|
}
|
|
|
],
|
|
|
- current: 0,
|
|
|
activeItemStyle: {
|
|
|
color: this.$config('primaryColor'),
|
|
|
borderBottom: '4rpx solid ' + this.$config('primaryColor')
|
|
|
},
|
|
|
wordColor: this.$config('infoColor'),
|
|
|
theme: '',
|
|
|
- chooseNum: 0,
|
|
|
showType: false,
|
|
|
- indexList: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'],
|
|
|
- scrollTop: 0,
|
|
|
+
|
|
|
+ chooseNum: 0,
|
|
|
+
|
|
|
keyword:'',
|
|
|
- gatherShow:false
|
|
|
+ gatherShow:false,
|
|
|
+ systemSetList:null,//系统参数列表
|
|
|
+ params:{
|
|
|
+ allCustomerFlag:0 ,//1全部 0需要查询条件
|
|
|
+ customer:{
|
|
|
+ queryWord:undefined,
|
|
|
+ settleStyleSn:undefined
|
|
|
+ },
|
|
|
+ bizBeginDate:undefined,
|
|
|
+ bizEndDate:undefined
|
|
|
+ },
|
|
|
+ pageNo:1,
|
|
|
+ pageSize:15,
|
|
|
+ noDataText: '暂无数据',
|
|
|
+ listHeight:200,
|
|
|
+ dayGatherArr:[],
|
|
|
+ monthGatherArr:[]
|
|
|
};
|
|
|
},
|
|
|
onReady() {
|
|
@@ -116,31 +106,80 @@ export default {
|
|
|
frontColor: '#ffffff',
|
|
|
backgroundColor: this.$config('primaryColor')
|
|
|
});
|
|
|
+ const query = uni.createSelectorQuery().in(this);
|
|
|
+ query.select('#tab').boundingClientRect(data => {
|
|
|
+ this.listHeight = Math.floor(data.height)
|
|
|
+ }).exec();
|
|
|
},
|
|
|
onLoad() {
|
|
|
this.theme = getApp().globalData.theme;
|
|
|
+ this.getSetInfo();
|
|
|
+ //获取日期集合
|
|
|
+ this.dayGatherArr = getDate.getWeekGather();
|
|
|
+ this.monthGatherArr = getDate.getMonthGather();
|
|
|
+ },
|
|
|
+ onBackPress() {
|
|
|
+ if(this.gatherShow){
|
|
|
+ this.gatherShow = false
|
|
|
+ return true
|
|
|
+ }
|
|
|
},
|
|
|
- onPageScroll(e) {
|
|
|
- this.scrollTop = e.scrollTop;
|
|
|
- },
|
|
|
methods: {
|
|
|
+ //获取系统参数
|
|
|
+ getSetInfo(){
|
|
|
+ // month day all
|
|
|
+ queryVerifySalesParams({}).then(res => {
|
|
|
+ this.systemSetList = res.data;
|
|
|
+ let obj=res.data.find(item=>{return item.remarks == 'verify_default_customer'})
|
|
|
+ if(obj.paramValue == 'all'){
|
|
|
+ this.params.allCustomerFlag = 1;
|
|
|
+ }else if(obj.paramValue == 'month'){
|
|
|
+ this.showType = true
|
|
|
+ }else{
|
|
|
+ this.showType = false
|
|
|
+ }
|
|
|
+ this.momentTime(0)
|
|
|
+ });
|
|
|
+ },
|
|
|
changeTabs(index) {
|
|
|
- this.current = index;
|
|
|
+ this.params.allCustomerFlag = index;
|
|
|
+ this.$refs.customer.getList(1);
|
|
|
},
|
|
|
handleDate(i) {
|
|
|
this.chooseNum = i;
|
|
|
+ this.momentTime(i)
|
|
|
},
|
|
|
chooseType() {
|
|
|
+ this.chooseNum = 0;
|
|
|
this.showType = !this.showType;
|
|
|
+ this.momentTime(0)
|
|
|
+ },
|
|
|
+ momentTime(pos){
|
|
|
+ var obj=null;
|
|
|
+ if(!this.showType){//日
|
|
|
+ obj =getDate.getFullToday(this.dayGatherArr[pos])
|
|
|
+ }else{
|
|
|
+ obj=getDate.getFullMonth(this.monthGatherArr[pos])
|
|
|
+ }
|
|
|
+ this.params.bizBeginDate = obj.starttime;
|
|
|
+ this.params.bizEndDate = obj.endtime;
|
|
|
+ this.refreshList();
|
|
|
},
|
|
|
getSearchCon(){
|
|
|
-
|
|
|
+ this.params.customer.queryWord = this.keyword.trim();
|
|
|
+ this.refreshList();
|
|
|
},
|
|
|
clearSearch(){
|
|
|
-
|
|
|
+ this.refreshList();
|
|
|
},
|
|
|
- refreshList(){
|
|
|
-
|
|
|
+ refreshList(e){
|
|
|
+ const _this= this
|
|
|
+ if(e){
|
|
|
+ _this.params.customer.settleStyleSn = e.code;
|
|
|
+ }
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ _this.$refs.customer.getList(1);
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
};
|
|
@@ -166,67 +205,47 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .tabCon {
|
|
|
- flex-grow: 1;
|
|
|
- .scroll-con {
|
|
|
- width: 100%;
|
|
|
- background: #fff;
|
|
|
- margin: 6rpx 0;
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- .scroll-date {
|
|
|
- width: calc(100% - 62rpx);
|
|
|
- .scroll-box {
|
|
|
- margin-right: 20rpx;
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- text-align: center;
|
|
|
- font-size: 26rpx;
|
|
|
- view {
|
|
|
- &:last-child {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #666;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .activeBox {
|
|
|
- font-weight: bold;
|
|
|
- color: $uni-color-primary;
|
|
|
- view {
|
|
|
- &:last-child {
|
|
|
- font-size: 24rpx;
|
|
|
- color: $uni-color-primary;
|
|
|
- }
|
|
|
+ .scroll-con {
|
|
|
+ width: 100%;
|
|
|
+ background: #fff;
|
|
|
+ margin: 6rpx 0;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ .scroll-date {
|
|
|
+ width: calc(100% - 62rpx);
|
|
|
+ .scroll-box {
|
|
|
+ margin-right: 28rpx;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 26rpx;
|
|
|
+ view {
|
|
|
+ &:last-child {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #666;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
- .customer-con {
|
|
|
- flex-grow: 1;
|
|
|
- overflow: auto;
|
|
|
- background: #fff;
|
|
|
- .customer-list {
|
|
|
- padding: 20rpx;
|
|
|
- border-bottom: 1rpx solid #f8f8f8;
|
|
|
- }
|
|
|
- .customer-b {
|
|
|
- margin-top: 10rpx;
|
|
|
- color: #666;
|
|
|
- font-size: 26rpx;
|
|
|
- .customer-box {
|
|
|
- width: 46%;
|
|
|
- text {
|
|
|
- &:last-child {
|
|
|
- color: $uni-color-warning;
|
|
|
- }
|
|
|
+ .activeBox {
|
|
|
+ font-weight: bold;
|
|
|
+ color: $uni-color-primary;
|
|
|
+ view {
|
|
|
+ &:last-child {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: $uni-color-primary;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- //选择客户
|
|
|
- .customer-search {
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- background: #fff;
|
|
|
- margin: 6rpx 0;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .customer-con {
|
|
|
+ flex-grow: 1;
|
|
|
+ overflow: auto;
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+ //选择客户
|
|
|
+ .customer-search {
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ background: #fff;
|
|
|
+ margin: 6rpx 0;
|
|
|
}
|
|
|
}
|
|
|
</style>
|