|
@@ -1,17 +1,5 @@
|
|
<template>
|
|
<template>
|
|
<view class="myShopTour-wrap">
|
|
<view class="myShopTour-wrap">
|
|
- <!-- 自定义标题 -->
|
|
|
|
- <u-navbar :is-back="false" :border-bottom="false" :background="background" id="navbar">
|
|
|
|
- <view class="slot-wrap">
|
|
|
|
- <view class="back-icon" @click="goBack">
|
|
|
|
- <u-icon name="arrow-left" color="#fff" size="32"></u-icon>
|
|
|
|
- </view>
|
|
|
|
- <view class="left-icon">我的巡店</view>
|
|
|
|
- <view class="right-icon">
|
|
|
|
- <u-icon name="more-dot-fill" color="#fff" size="28" @click="openScreenFun"></u-icon>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </u-navbar>
|
|
|
|
<!-- 内容 -->
|
|
<!-- 内容 -->
|
|
<view class="myShopTour-con">
|
|
<view class="myShopTour-con">
|
|
<u-tabs-swiper ref="uTabs" :list="tabList" name="dispName" :current="current" @change="tabsChange" :is-scroll="false" swiperWidth="750"></u-tabs-swiper>
|
|
<u-tabs-swiper ref="uTabs" :list="tabList" name="dispName" :current="current" @change="tabsChange" :is-scroll="false" swiperWidth="750"></u-tabs-swiper>
|
|
@@ -19,10 +7,11 @@
|
|
<swiper-item class="swiper-item" v-for="(tabs, index) in tabList" :key="index">
|
|
<swiper-item class="swiper-item" v-for="(tabs, index) in tabList" :key="index">
|
|
<scroll-view scroll-y class="scroll-con" @scrolltolower="onreachBottom">
|
|
<scroll-view scroll-y class="scroll-con" @scrolltolower="onreachBottom">
|
|
<view class="record-con">
|
|
<view class="record-con">
|
|
|
|
+ <!-- 筛选日期,近7天 -->
|
|
<view v-show="searchForm.creatTime.length != 0" class="alert-tips">
|
|
<view v-show="searchForm.creatTime.length != 0" class="alert-tips">
|
|
<text>{{searchForm.creatTime[0]}} ~ {{searchForm.creatTime[1]}}</text>
|
|
<text>{{searchForm.creatTime[0]}} ~ {{searchForm.creatTime[1]}}</text>
|
|
</view>
|
|
</view>
|
|
- <view class="record-item" v-for="(item,index) in list" :key="index">
|
|
|
|
|
|
+ <view class="record-item" v-if="index==current" v-for="(item,sindex) in list" :key="item.id">
|
|
<view class="item-head">
|
|
<view class="item-head">
|
|
<text class="item-c-tit">{{item.name}}</text>
|
|
<text class="item-c-tit">{{item.name}}</text>
|
|
<u-tag class="item-c-type" :text="item.status" type="primary" />
|
|
<u-tag class="item-c-type" :text="item.status" type="primary" />
|
|
@@ -90,21 +79,28 @@
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
</u-popup>
|
|
<!-- 选择创建时间 -->
|
|
<!-- 选择创建时间 -->
|
|
- <mx-date-picker class="choose-date-wrap" :show="showPicker" :type="type" :value="searchForm.creatTime" :show-tips="true" :begin-text="'开始'" :end-text="'结束'" :show-seconds="true" @confirm="onSelected" @cancel="onSelected" />
|
|
|
|
|
|
+ <!-- <mx-date-picker class="choose-date-wrap" :show="showPicker" :type="type" :value="searchForm.creatTime" :show-tips="true" :begin-text="'开始'" :end-text="'结束'" :show-seconds="true" @confirm="onSelected" @cancel="onSelected" /> -->
|
|
|
|
+ <w-picker
|
|
|
|
+ :visible.sync="showPicker"
|
|
|
|
+ mode="range"
|
|
|
|
+ startYear="2017"
|
|
|
|
+ endYear="2030"
|
|
|
|
+ :value="searchForm.creatTime"
|
|
|
|
+ :current="false"
|
|
|
|
+ @confirm="onSelected($event,'range')"
|
|
|
|
+ @cancel="onSelected"
|
|
|
|
+ ref="range"></w-picker>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+ import wPicker from "@/components/w-picker/w-picker.vue"
|
|
import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"
|
|
import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"
|
|
import { queryMyTask } from '@/api/task.js'
|
|
import { queryMyTask } from '@/api/task.js'
|
|
export default {
|
|
export default {
|
|
- components: { MxDatePicker },
|
|
|
|
|
|
+ components: { MxDatePicker, wPicker },
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- background: {
|
|
|
|
- // 渐变色
|
|
|
|
- backgroundImage: 'linear-gradient(45deg, rgb(85, 170, 255), rgb(21, 102, 223))'
|
|
|
|
- },
|
|
|
|
tabList: [ // tab切换 类型
|
|
tabList: [ // tab切换 类型
|
|
{ dispName: '全部', code:'' },
|
|
{ dispName: '全部', code:'' },
|
|
{ dispName: '待处理', code:'0' },
|
|
{ dispName: '待处理', code:'0' },
|
|
@@ -119,13 +115,7 @@
|
|
total: 0, // 总条数
|
|
total: 0, // 总条数
|
|
status: 'loading', // 加载状态
|
|
status: 'loading', // 加载状态
|
|
noDataText: '暂无数据', // 列表数据为空时提示文字
|
|
noDataText: '暂无数据', // 列表数据为空时提示文字
|
|
- list: [ // 数据列表
|
|
|
|
- { name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
|
|
|
|
- { name: '常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
|
|
|
|
- { name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'invalid', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
|
|
|
|
- { name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
|
|
|
|
- { name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
|
|
|
|
- ],
|
|
|
|
|
|
+ list: [], // 数据列表
|
|
openScreen: false, // 是否打开筛选
|
|
openScreen: false, // 是否打开筛选
|
|
dateMode: 'range', // date单个日期 range日期范围
|
|
dateMode: 'range', // date单个日期 range日期范围
|
|
searchForm: { // 查询条件
|
|
searchForm: { // 查询条件
|
|
@@ -136,94 +126,116 @@
|
|
range: [], // 筛选创建时间的默认值
|
|
range: [], // 筛选创建时间的默认值
|
|
type: 'range', // 日期时间类型
|
|
type: 'range', // 日期时间类型
|
|
storeName: '', // 筛选的门店名称
|
|
storeName: '', // 筛选的门店名称
|
|
|
|
+ typeId: '', // 记录状态
|
|
|
|
+ action:'swiperChange', // 操作类型,上划分页,或左右滑动
|
|
}
|
|
}
|
|
},
|
|
},
|
|
onLoad() {
|
|
onLoad() {
|
|
- this.pageInit()
|
|
|
|
|
|
+ this.resetPage()
|
|
|
|
+ this.range = [ this.get7day(-6), this.get7day(0) ]
|
|
|
|
+ this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
|
|
|
|
+ uni.$on("updatePointTaskList",()=>{
|
|
|
|
+ this.resetPage()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ onUnload() {
|
|
|
|
+ uni.$off("updatePointTaskList")
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
- // 返回
|
|
|
|
- goBack() {
|
|
|
|
- uni.navigateBack({
|
|
|
|
- delta: 1
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- pageInit(){
|
|
|
|
- this.range = [ this.get7day(-6), this.get7day(0) ]
|
|
|
|
- this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
|
|
|
|
- this.status = 'loading'
|
|
|
|
- queryMyTask({
|
|
|
|
|
|
+ // 查询列表
|
|
|
|
+ pageInit(pageNo){
|
|
|
|
+ if (pageNo) {
|
|
|
|
+ this.pageNo = pageNo
|
|
|
|
+ }
|
|
|
|
+ let params = {
|
|
pageNo: this.pageNo,
|
|
pageNo: this.pageNo,
|
|
pageSize: this.pageSize,
|
|
pageSize: this.pageSize,
|
|
beginDate: this.searchForm.creatTime[0],
|
|
beginDate: this.searchForm.creatTime[0],
|
|
endDate: this.searchForm.creatTime[1],
|
|
endDate: this.searchForm.creatTime[1],
|
|
- storeName: this.searchForm.store
|
|
|
|
- }).then(res => {
|
|
|
|
- console.log(res)
|
|
|
|
|
|
+ storeName: this.searchForm.store,
|
|
|
|
+ status: this.typeId==''?'':this.typeId // 任务状态
|
|
|
|
+ }
|
|
|
|
+ this.status = 'loading'
|
|
|
|
+ queryMyTask(params).then(res => {
|
|
if(res.status == 200){
|
|
if(res.status == 200){
|
|
if(this.pageNo>1){
|
|
if(this.pageNo>1){
|
|
this.list = this.list.concat(res.data.list || [])
|
|
this.list = this.list.concat(res.data.list || [])
|
|
}else{
|
|
}else{
|
|
this.list = res.data.list || []
|
|
this.list = res.data.list || []
|
|
}
|
|
}
|
|
- this.noDataText = '暂无数据' // 有列表数据时不显示,因此只用默认设置为无数据时所需显示的'暂无数据'即可
|
|
|
|
this.total = res.data.count || 0
|
|
this.total = res.data.count || 0
|
|
}else{
|
|
}else{
|
|
this.list = []
|
|
this.list = []
|
|
- this.noDataText = res.message
|
|
|
|
this.total = 0
|
|
this.total = 0
|
|
|
|
+ this.noDataText = res.message || '暂无数据'
|
|
}
|
|
}
|
|
this.status = 'loadmore'
|
|
this.status = 'loadmore'
|
|
|
|
+
|
|
})
|
|
})
|
|
},
|
|
},
|
|
// tabs通知swiper切换
|
|
// tabs通知swiper切换
|
|
tabsChange(index) {
|
|
tabsChange(index) {
|
|
this.swiperCurrent = index
|
|
this.swiperCurrent = index
|
|
- this.list = []
|
|
|
|
- this.status = "loading"
|
|
|
|
},
|
|
},
|
|
- swiperChange(event){
|
|
|
|
- this.list = []
|
|
|
|
- this.status = "loading"
|
|
|
|
|
|
+ swiperChange(e) {
|
|
|
|
+ this.action = 'swiperChange'
|
|
|
|
+ this.status = 'loading'
|
|
|
|
+ this.typeId = this.tabList[e.detail.current].code
|
|
},
|
|
},
|
|
// swiper-item左右移动,通知tabs的滑块跟随移动
|
|
// swiper-item左右移动,通知tabs的滑块跟随移动
|
|
transition(e) {
|
|
transition(e) {
|
|
- let dx = e.detail.dx;
|
|
|
|
- this.$refs.uTabs.setDx(dx);
|
|
|
|
|
|
+ let dx = e.detail.dx
|
|
|
|
+ this.$refs.uTabs.setDx(dx)
|
|
},
|
|
},
|
|
// 由于swiper的内部机制问题,快速切换swiper不会触发dx的连续变化,需要在结束时重置状态
|
|
// 由于swiper的内部机制问题,快速切换swiper不会触发dx的连续变化,需要在结束时重置状态
|
|
// swiper滑动结束,分别设置tabs和swiper的状态
|
|
// swiper滑动结束,分别设置tabs和swiper的状态
|
|
animationfinish(e) {
|
|
animationfinish(e) {
|
|
let current = e.detail.current
|
|
let current = e.detail.current
|
|
- if(current != this.current){
|
|
|
|
- this.$refs.uTabs.setFinishCurrent(current)
|
|
|
|
- this.swiperCurrent = current
|
|
|
|
- this.current = current
|
|
|
|
- this.pageInit()
|
|
|
|
|
|
+ let isCurtab = this.current == current
|
|
|
|
+ if(this.status!="nomore"){
|
|
|
|
+ let loadData = this.action == 'swiperChange' ? !isCurtab : isCurtab
|
|
|
|
+ if(loadData){
|
|
|
|
+ this.$refs.uTabs.setFinishCurrent(current)
|
|
|
|
+ this.swiperCurrent = current
|
|
|
|
+ this.current = current
|
|
|
|
+ this.resetPage()
|
|
|
|
+ }
|
|
}
|
|
}
|
|
},
|
|
},
|
|
// scroll-view到底部加载更多
|
|
// scroll-view到底部加载更多
|
|
onreachBottom() {
|
|
onreachBottom() {
|
|
- if(this.list.length < this.total){
|
|
|
|
|
|
+ this.action = 'onreachBottom'
|
|
|
|
+ if (this.list.length < this.total) {
|
|
this.pageNo += 1
|
|
this.pageNo += 1
|
|
- this.pageInit()
|
|
|
|
- }else{
|
|
|
|
- this.status = "nomore"
|
|
|
|
|
|
+ } else {
|
|
|
|
+ this.status = 'nomore'
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- // 显示日期选择
|
|
|
|
- onShowDatePicker(type){
|
|
|
|
- this.type = type
|
|
|
|
- this.showPicker = true
|
|
|
|
- this.searchForm.creatTime = this[type]
|
|
|
|
|
|
+ // 初始化数据
|
|
|
|
+ resetPage(){
|
|
|
|
+ this.status = 'loading'
|
|
|
|
+ // 上划分页
|
|
|
|
+ if(this.action == 'onreachBottom'){
|
|
|
|
+ this.pageInit()
|
|
|
|
+ }
|
|
|
|
+ // 左右切换tab
|
|
|
|
+ if(this.action == 'swiperChange'){
|
|
|
|
+ this.list = []
|
|
|
|
+ this.pageInit(1)
|
|
|
|
+ }
|
|
},
|
|
},
|
|
- // 日期选择
|
|
|
|
- onSelected(e) {
|
|
|
|
|
|
+ // 选择日期范围
|
|
|
|
+ onSelected(e){
|
|
this.showPicker = false
|
|
this.showPicker = false
|
|
if(e) {
|
|
if(e) {
|
|
- this[this.type] = e.value
|
|
|
|
|
|
+ this.range = e.value
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ // 显示日期选择
|
|
|
|
+ onShowDatePicker(type){
|
|
|
|
+ this.showPicker = true
|
|
|
|
+ this.searchForm.creatTime = this.range
|
|
|
|
+ },
|
|
// 获取近几天的数据
|
|
// 获取近几天的数据
|
|
get7day(day){
|
|
get7day(day){
|
|
let today = new Date()
|
|
let today = new Date()
|
|
@@ -245,7 +257,8 @@
|
|
return m
|
|
return m
|
|
},
|
|
},
|
|
// 打开筛选条件
|
|
// 打开筛选条件
|
|
- openScreenFun(){
|
|
|
|
|
|
+ onNavigationBarButtonTap(e) {
|
|
|
|
+ this.resetF()
|
|
this.openScreen = true
|
|
this.openScreen = true
|
|
},
|
|
},
|
|
// 重置筛选条件
|
|
// 重置筛选条件
|
|
@@ -271,36 +284,18 @@ page {
|
|
}
|
|
}
|
|
.myShopTour-wrap {
|
|
.myShopTour-wrap {
|
|
height: 100%;
|
|
height: 100%;
|
|
- /* 自定义导航栏样式 */
|
|
|
|
- .slot-wrap {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- /* 如果您想让slot内容占满整个导航栏的宽度 */
|
|
|
|
- flex: 1;
|
|
|
|
- /* 如果您想让slot内容与导航栏左右有空隙 */
|
|
|
|
- padding: 0 30rpx;
|
|
|
|
- color: #fff;
|
|
|
|
- font-size: 28upx;
|
|
|
|
- .left-icon {
|
|
|
|
- flex-grow: 1;
|
|
|
|
- font-size: 32upx;
|
|
|
|
- margin-right: 10upx;
|
|
|
|
- text-align: center;
|
|
|
|
- }
|
|
|
|
- .right-icon {
|
|
|
|
- padding-left: 50upx;
|
|
|
|
- }
|
|
|
|
- .uni-icons {
|
|
|
|
- margin-right: 10upx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
// 内容
|
|
// 内容
|
|
.myShopTour-con{
|
|
.myShopTour-con{
|
|
.data-list{
|
|
.data-list{
|
|
height: calc(100vh - 84px);
|
|
height: calc(100vh - 84px);
|
|
.swiper-item{
|
|
.swiper-item{
|
|
|
|
+ height: 100%;
|
|
|
|
+ width: 100%;
|
|
|
|
+ overflow: hidden;
|
|
.scroll-con{
|
|
.scroll-con{
|
|
height: 100%;
|
|
height: 100%;
|
|
|
|
+ width: 100%;
|
|
|
|
+ overflow: auto;
|
|
// 列表
|
|
// 列表
|
|
.record-con{
|
|
.record-con{
|
|
padding-top: 74upx;
|
|
padding-top: 74upx;
|
|
@@ -438,8 +433,5 @@ page {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .choose-date-wrap{
|
|
|
|
- z-index: 999999;
|
|
|
|
- }
|
|
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|