|
@@ -1,59 +1,52 @@
|
|
|
<template>
|
|
<template>
|
|
|
<view class="page-container">
|
|
<view class="page-container">
|
|
|
-<!-- <view class="search-wrapper">-->
|
|
|
|
|
-<!-- <view class="search-bar">-->
|
|
|
|
|
-<!-- <uni-icons type="search" size="20" color="#999"></uni-icons>-->
|
|
|
|
|
-<!-- <input-->
|
|
|
|
|
-<!-- class="search-input"-->
|
|
|
|
|
-<!-- v-model="searchQuery"-->
|
|
|
|
|
-<!-- placeholder="输入门店名称/上货日期搜索"-->
|
|
|
|
|
-<!-- placeholder-class="placeholder"-->
|
|
|
|
|
-<!-- confirm-type="search"-->
|
|
|
|
|
-<!-- @confirm="handleSearch"-->
|
|
|
|
|
-<!-- />-->
|
|
|
|
|
-<!-- </view>-->
|
|
|
|
|
-<!-- </view>-->
|
|
|
|
|
|
|
+ <view class="search-wrapper">
|
|
|
|
|
+ <view class="query">
|
|
|
|
|
+ <u-row customStyle="margin-bottom: 10px" gutter="20">
|
|
|
|
|
+ <u-col span="9">
|
|
|
|
|
+ <u--input
|
|
|
|
|
+ @focus="timeShow = true"
|
|
|
|
|
+ v-model="startTimeXd"
|
|
|
|
|
+ placeholder="开始日期 ~ 结束日期"
|
|
|
|
|
+ prefixIcon="calendar"
|
|
|
|
|
+ prefixIconStyle="font-size: 22px;color: #909399"
|
|
|
|
|
+ @input="handleSearch"
|
|
|
|
|
+ @change="change"
|
|
|
|
|
+ ></u--input>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ <u-col span="3">
|
|
|
|
|
+ <view class="query-btn" @click="show = !show">
|
|
|
|
|
+ <view class="query-btn-icon">
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="query-btn-text">筛选</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ </u-row>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
|
|
|
<scroll-view class="list-container" scroll-y="true" @scrolltolower="loadMore">
|
|
<scroll-view class="list-container" scroll-y="true" @scrolltolower="loadMore">
|
|
|
<view v-if="recordList.length === 0 && loadStatus !== 'loading'" class="empty-list">
|
|
<view v-if="recordList.length === 0 && loadStatus !== 'loading'" class="empty-list">
|
|
|
<text>暂无上货记录</text>
|
|
<text>暂无上货记录</text>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
- <view v-for="record in recordList" :key="record.id" class="record-card">
|
|
|
|
|
|
|
+ <view @click="detail(record.id)" v-for="record in recordList" :key="record.id" class="record-card">
|
|
|
<view class="card-decorator"></view>
|
|
<view class="card-decorator"></view>
|
|
|
<view class="card-content">
|
|
<view class="card-content">
|
|
|
<view class="card-header">
|
|
<view class="card-header">
|
|
|
<uni-icons type="shop-filled" size="20" color="#3c82f8"></uni-icons>
|
|
<uni-icons type="shop-filled" size="20" color="#3c82f8"></uni-icons>
|
|
|
- <text class="record-id">{{ record.recordNo }}</text>
|
|
|
|
|
|
|
+ <text class="record-id">{{ record.storeName }}</text>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<view class="details-section">
|
|
<view class="details-section">
|
|
|
- <view class="detail-row">
|
|
|
|
|
- <text class="detail-label">上货商品总数</text>
|
|
|
|
|
- <text class="detail-value">{{ record.totalNum }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <view class="detail-row" v-for="item in record.queryActiveRecordDetailVos">
|
|
|
|
|
- <text class="detail-label">{{ item.productName }}</text>
|
|
|
|
|
- <text class="detail-value">{{ item.num }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
|
|
|
- <view class="detail-row product-item" v-for="(product, index) in record.products" :key="index">
|
|
|
|
|
- <text class="detail-label product-name">{{ product.name }}</text>
|
|
|
|
|
- <text class="detail-value">{{ product.quantity }}{{ product.unit }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <view class="detail-row">
|
|
|
|
|
- <text class="detail-label">上货门店</text>
|
|
|
|
|
- <text class="detail-value">{{ record.storeName }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
<view class="detail-row">
|
|
<view class="detail-row">
|
|
|
- <text class="detail-label">上货时间</text>
|
|
|
|
|
- <text class="detail-value">{{ record.activeTime }}</text>
|
|
|
|
|
|
|
+ <text class="detail-label">巡店时间</text>
|
|
|
|
|
+ <text class="detail-value">{{ record.getTime }}</text>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="detail-row">
|
|
<view class="detail-row">
|
|
|
<text class="detail-label">上货奖励</text>
|
|
<text class="detail-label">上货奖励</text>
|
|
|
- <text class="detail-value reward">{{ record.reward==null?"0":record.reward }}积分</text>
|
|
|
|
|
|
|
+ <text class="detail-value reward">{{ record.point==null?"0":record.point }}积分</text>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
@@ -61,18 +54,63 @@
|
|
|
|
|
|
|
|
<uni-load-more :status="loadStatus"></uni-load-more>
|
|
<uni-load-more :status="loadStatus"></uni-load-more>
|
|
|
</scroll-view>
|
|
</scroll-view>
|
|
|
|
|
+ <u-popup :show="show" mode="bottom" @close="show = false" >
|
|
|
|
|
+ <view class="popup-content">
|
|
|
|
|
+ <view class="popup-text">筛选</view>
|
|
|
|
|
+ <u-row customStyle="margin-bottom: 10px">
|
|
|
|
|
+ <u-col span="3">
|
|
|
|
|
+ <view class="explain">选择日期</view>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ <u-col span="9">
|
|
|
|
|
+ <u--input
|
|
|
|
|
+ v-model="startTimeXd"
|
|
|
|
|
+ placeholder="开始日期 ~ 结束日期"
|
|
|
|
|
+ prefixIcon="calendar"
|
|
|
|
|
+ prefixIconStyle="font-size: 22px;color: #909399"
|
|
|
|
|
+ @focus="timeShow = true"
|
|
|
|
|
+ ></u--input>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ </u-row>
|
|
|
|
|
+ <u-row customStyle="margin-bottom: 10px">
|
|
|
|
|
+ <u-col span="3">
|
|
|
|
|
+ <view class="explain">门店名称</view>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ <u-col span="9">
|
|
|
|
|
+ <u--input v-model="searchQuery"
|
|
|
|
|
+ placeholder="请输入内容"
|
|
|
|
|
+ border="surround"
|
|
|
|
|
+ ></u--input>
|
|
|
|
|
+ </u-col>
|
|
|
|
|
+ </u-row>
|
|
|
|
|
+ <view class="popup-btn">
|
|
|
|
|
+ <u-button @click="handleSearch" class="popup-btn-one">搜索</u-button>
|
|
|
|
|
+ <u-button @click="resetForm" class="popup-btn-one" type="primary">重置</u-button>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ </u-popup>
|
|
|
|
|
+ <u-calendar @close="timeShow = false" :show="timeShow" :mode="mode" @confirm="confirm"></u-calendar>
|
|
|
</view>
|
|
</view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
-import {queryActiveRecord} from "@/api/hexiao";
|
|
|
|
|
-import {xundianRecord} from "../../../../api/hexiao";
|
|
|
|
|
|
|
+import {xundianRecord} from "@/api/hexiao";
|
|
|
|
|
|
|
|
export default {
|
|
export default {
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
|
|
+ startTime: '',
|
|
|
|
|
+ endTime: '',
|
|
|
|
|
+ timeShow: false,
|
|
|
|
|
+ startTimeXd:"",
|
|
|
|
|
+ mode: 'range',
|
|
|
|
|
+ show:false,
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
searchQuery: '',
|
|
searchQuery: '',
|
|
|
recordList: [],
|
|
recordList: [],
|
|
|
|
|
+ ywyId:0,
|
|
|
pagination: {
|
|
pagination: {
|
|
|
page: 1,
|
|
page: 1,
|
|
|
limit: 10,
|
|
limit: 10,
|
|
@@ -81,15 +119,23 @@ export default {
|
|
|
isLoading: false,
|
|
isLoading: false,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
- onLoad() {
|
|
|
|
|
|
|
+ onLoad(opt) {
|
|
|
// 页面加载时获取第一页数据
|
|
// 页面加载时获取第一页数据
|
|
|
|
|
+ if(opt.id){
|
|
|
|
|
+ this.ywyId = opt.id
|
|
|
|
|
+ }
|
|
|
this.fetchRecords(true);
|
|
this.fetchRecords(true);
|
|
|
|
|
+
|
|
|
},
|
|
},
|
|
|
// 监听下拉刷新
|
|
// 监听下拉刷新
|
|
|
onPullDownRefresh() {
|
|
onPullDownRefresh() {
|
|
|
this.fetchRecords(true);
|
|
this.fetchRecords(true);
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
|
|
+ detail(id){
|
|
|
|
|
+ uni.navigateTo({ url: `/pages/cjx/hexiao/ywy/patrol_detail?id=`+id });
|
|
|
|
|
+
|
|
|
|
|
+ },
|
|
|
// 核心:获取记录列表数据
|
|
// 核心:获取记录列表数据
|
|
|
async fetchRecords(isRefresh = false) {
|
|
async fetchRecords(isRefresh = false) {
|
|
|
if (this.isLoading || (this.loadStatus === 'noMore' && !isRefresh)) {
|
|
if (this.isLoading || (this.loadStatus === 'noMore' && !isRefresh)) {
|
|
@@ -108,7 +154,18 @@ export default {
|
|
|
// 在这里替换成您真实的 uni.request API 调用
|
|
// 在这里替换成您真实的 uni.request API 调用
|
|
|
console.log(`正在请求第 ${this.pagination.page} 页数据...`);
|
|
console.log(`正在请求第 ${this.pagination.page} 页数据...`);
|
|
|
|
|
|
|
|
- xundianRecord(this.pagination.page,this.pagination.limit).then(res=>{
|
|
|
|
|
|
|
+ let data = {
|
|
|
|
|
+ pageIndex:this.pagination.page,
|
|
|
|
|
+ pageSize:this.pagination.limit,
|
|
|
|
|
+ storeName:this.searchQuery,
|
|
|
|
|
+ startTime:this.startTime,
|
|
|
|
|
+ endTime:this.endTime
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ if(this.ywyId>0){
|
|
|
|
|
+ data.ywyId = this.ywyId
|
|
|
|
|
+ }
|
|
|
|
|
+ xundianRecord(data).then(res=>{
|
|
|
let mockData = res.data.records;
|
|
let mockData = res.data.records;
|
|
|
if (mockData.length > 0) {
|
|
if (mockData.length > 0) {
|
|
|
this.recordList = [...this.recordList, ...mockData];
|
|
this.recordList = [...this.recordList, ...mockData];
|
|
@@ -128,7 +185,22 @@ export default {
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
},
|
|
|
|
|
+ resetForm(){
|
|
|
|
|
+ this.searchQuery = "";
|
|
|
|
|
+ this.startTime = "";
|
|
|
|
|
+ this.endTime = "";
|
|
|
|
|
+ this.startTimeXd = "";
|
|
|
|
|
+ },
|
|
|
|
|
+ confirm(e) {
|
|
|
|
|
+ this.startTime = e[0];
|
|
|
|
|
+ this.endTime = e[e.length-1];
|
|
|
|
|
+ this.startTimeXd = e[0]+' ~ '+e[e.length-1];
|
|
|
|
|
+ if(!this.show){
|
|
|
|
|
+ this.handleSearch()
|
|
|
|
|
+ }
|
|
|
|
|
+ this.timeShow = false;
|
|
|
|
|
|
|
|
|
|
+ },
|
|
|
// 上拉加载更多
|
|
// 上拉加载更多
|
|
|
loadMore() {
|
|
loadMore() {
|
|
|
this.fetchRecords();
|
|
this.fetchRecords();
|
|
@@ -137,8 +209,7 @@ export default {
|
|
|
// 搜索
|
|
// 搜索
|
|
|
handleSearch() {
|
|
handleSearch() {
|
|
|
// 在实际项目中,搜索应该调用API,这里为简单起见只做前端筛选
|
|
// 在实际项目中,搜索应该调用API,这里为简单起见只做前端筛选
|
|
|
- // this.fetchRecords(true);
|
|
|
|
|
- uni.showToast({ title: '触发搜索', icon: 'none' });
|
|
|
|
|
|
|
+ this.fetchRecords(true);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -252,4 +323,59 @@ export default {
|
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+.query-btn {
|
|
|
|
|
+ background-color: #409eff;
|
|
|
|
|
+ color: #fff;
|
|
|
|
|
+ padding: 20rpx;
|
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
|
+ height: 34rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+}
|
|
|
|
|
+.query-btn-icon {
|
|
|
|
|
+ height: 32rpx;
|
|
|
|
|
+ width: 32rpx;
|
|
|
|
|
+ background-image:
|
|
|
|
|
+ url("https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/cjx/queryIoc.png");
|
|
|
|
|
+ background-size: cover;
|
|
|
|
|
+ background-position: center;
|
|
|
|
|
+ background-repeat: no-repeat;
|
|
|
|
|
+}
|
|
|
|
|
+.query-btn-text {
|
|
|
|
|
+ font-weight: 400;
|
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
|
+ color: #F5F5F5;
|
|
|
|
|
+}
|
|
|
|
|
+.popup-content{
|
|
|
|
|
+ height: 25vh;
|
|
|
|
|
+ padding: 10px;
|
|
|
|
|
+}
|
|
|
|
|
+.popup-text{
|
|
|
|
|
+ font-family: PingFang SC;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ font-size: 36rpx;
|
|
|
|
|
+ color: #1C1E1D;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin-bottom: 10px;
|
|
|
|
|
+}
|
|
|
|
|
+.popup-btn{
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: space-around;
|
|
|
|
|
+}
|
|
|
|
|
+.popup-btn-one{
|
|
|
|
|
+ width: 275rpx;
|
|
|
|
|
+ height: 70rpx;
|
|
|
|
|
+ background: linear-gradient(0deg, #6FA4FE, #488CFF);
|
|
|
|
|
+ box-shadow: 0rpx 9rpx 16rpx 0rpx rgba(153,153,153,0.35);
|
|
|
|
|
+ border-radius: 35rpx;
|
|
|
|
|
+}
|
|
|
</style>
|
|
</style>
|