cashier_app/pagesOrder/index/index.vue

145 lines
3.1 KiB
Vue

<template>
<view class="min-page bg-gray u-font-28">
<up-sticky offset-top="0">
<view class="top">
<view class="search bg-fff u-p-t-32 u-p-l-28 u-p-r-28 u-p-b-32">
<up-search v-bind="search" v-model="pageData.query.orderNo" @search="searchConfirm" @clear="searchConfirm" @custom="searchConfirm"></up-search>
</view>
<filter-vue @updateStatus="updateQuery('status',$event)" v-model:time="pageData.createdAt" ></filter-vue>
</view>
</up-sticky>
<order-list @printOrder="onPrintOrder" :list="pageData.list"></order-list>
<template v-if="pageData.list.length>0">
<my-pagination :page="pageData.query.page" @change="pageChange" :totalElements="pageData.total"></my-pagination>
</template>
<view style="height: 100rpx;"></view>
</view>
</template>
<script setup>
import { reactive, ref, watch } from 'vue';
import {onLoad,onShow,onPullDownRefresh} from '@dcloudio/uni-app'
import LIST from '@/commons/class/list.js'
import filterVue from './compoents/filter.vue';
import orderList from './compoents/order-list.vue';
import infoBox from '@/commons/utils/infoBox.js'
import {getTodayTimestamps} from '@/commons/utils/dayjs-time.js';
import { getOrderList,printOrder } from '@/http/api/order.js'
const search = reactive({
placeholder: '搜索单号/商品名称',
shape: 'square',
inputStyle: {
borderRadius: '12rpx'
},
actionStyle: {
textAlign: 'right'
}
})
const today = getTodayTimestamps();
const pageData = reactive({
createdAt: [today.start,today.end],
list: [],
total: 0,
query: {
orderNo: "",
userId: "",
platformType: "",
page: 1,
pageSize: 10,
startTime: today.start,
endTime: today.end,
status: ""
}
})
onLoad((opt)=>{
if( opt.type == 'user' && opt.userId ) {
pageData.query.userId = opt.userId
}
})
onShow(init)
onPullDownRefresh(()=>{
pageData.query.page = 1
init()
})
watch(()=>pageData.createdAt,(newval)=>{
pageData.query.startTime = newval[0]
pageData.query.endTime = newval[1]
init()
})
/**
* 获取订单列表
*/
async function init() {
const res = await getOrderList({
...pageData.query,
})
uni.stopPullDownRefresh()
pageData.list = res.records
pageData.total = res.totalRow
}
/**
* 是否打印该订单
* @param {Object} e
*/
function onPrintOrder(item){
uni.showModal({
title: '提示',
content: '是否打印该订单',
async success(res) {
if (res.confirm) {
try{
const res= await printOrder({
id :item.id,
type: item.status == 'unpaid' ? 1 : 0
})
infoBox.showToast('已发送打印请求')
}catch(e){
infoBox.showToast('发送打印请求失败')
}
}
}
})
}
/**
* 分页加载
* @param {Object} e
*/
function pageChange(e){
pageData.query.page = e
console.log(e)
init()
}
/**
* 状态改变监听
* @param {Object} key
* @param {Object} e
*/
function updateQuery(key,e){
pageData.query[key] = e
pageData.query.page = 1
init()
}
/**
* 搜索监听
*/
function searchConfirm(){
pageData.query.page = 1
init()
}
</script>
<style>
.top {
background-color: #E5E5E5;
}
</style>