141 lines
3.7 KiB
Vue
141 lines
3.7 KiB
Vue
<template>
|
|
<JeepayBackground>
|
|
<JeepayCustomNavbar>
|
|
<view class="store-name" @tap="selectedStore">{{ vdata.store.storeName }}<image src="/static/iconImg/icon-arrow-black.svg" mode="scaleToFill" /></view>
|
|
</JeepayCustomNavbar>
|
|
<view class="input-wrapper">
|
|
<view class="input-main" @tap="go.toSearchPage('payOrder')">
|
|
<image src="/static/iconImg/icon-search.svg" mode="scaleToFill" />
|
|
<input type="text" placeholder="搜索订单号" disabled placeholder-style="color:rgba(0, 0, 0, 0.35)" />
|
|
</view>
|
|
<view class="screen-wrapper flex-center" @tap="screen.open()">
|
|
<image src="/static/iconImg/icon-screen.svg" mode="scaleToFill" />
|
|
筛选
|
|
</view>
|
|
</view>
|
|
<JeepayTableList ref="jeepayTableListRef" :reqTableDataFunc="reqTableDataFunc" :searchData="vdata.searchData">
|
|
<template #tableBody="{ record }">
|
|
<PayOrderRender :record="record" />
|
|
</template>
|
|
</JeepayTableList>
|
|
<OrderScreen ref="screen" />
|
|
</JeepayBackground>
|
|
|
|
<!-- 选择门店 -->
|
|
<JeepayBizinfoSelect :isShowAllBiz="true" ref="jeepayPopupListSelect" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import { reactive, ref, computed, provide } from 'vue'
|
|
import { onReachBottom, onUnload } from '@dcloudio/uni-app'
|
|
import go from '@/commons/utils/go.js'
|
|
import { stateList } from './components/stateList.js'
|
|
import OrderScreen from './components/OrderScreen.vue'
|
|
import PayOrderRender from '@/pages/list/render/PayOrderRender.vue'
|
|
import { req, reqLoad, API_URL_PAY_ORDER_LIST, API_URL_MCH_STORE_LIST } from '@/http/apiManager.js'
|
|
import emit from '@/commons/utils/emit.js'
|
|
|
|
onReachBottom(() => {})
|
|
|
|
// 监听 更新事件
|
|
onUnload(() => uni.$off(emit.ENAME_REF_PAY_ORDER))
|
|
uni.$on(emit.ENAME_REF_PAY_ORDER, function (data) {
|
|
jeepayTableListRef.value.refTable(true)
|
|
})
|
|
|
|
const screen = ref(null) //获取抽屉实例
|
|
const jeepayTableListRef = ref()
|
|
// 获取门店选择弹窗实例
|
|
const jeepayPopupListSelect = ref(null)
|
|
const vdata = reactive({
|
|
// 搜索对象 默认查询条件 今天 成功和已退款
|
|
searchData: {
|
|
queryDateRange: 'today',
|
|
unionOrderState: '2,5',
|
|
},
|
|
store: {
|
|
storeId: '',
|
|
storeName: '全部门店',
|
|
},
|
|
})
|
|
|
|
// 向子组件注入： 搜索条件
|
|
provide(
|
|
'searchData',
|
|
computed(() => vdata.searchData)
|
|
)
|
|
|
|
provide('refTableFunc', refTableFunc)
|
|
const toDetail = () => uni.navigateTo({ url: '/pages/order/orderDetail' })
|
|
|
|
// 请求
|
|
function reqTableDataFunc(params) {
|
|
return reqLoad.list(API_URL_PAY_ORDER_LIST, params)
|
|
}
|
|
// 选择门店
|
|
const selectedStore = () => {
|
|
jeepayPopupListSelect.value.open(vdata.store).then((selected) => {
|
|
if (selected) {
|
|
vdata.store = selected
|
|
vdata.searchData.storeId = selected.storeId
|
|
refTableFunc()
|
|
}
|
|
})
|
|
}
|
|
// 点击筛选条件的确定按钮
|
|
function refTableFunc() {
|
|
jeepayTableListRef.value.refTable(true)
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.store-name {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 33rpx;
|
|
font-weight: 500;
|
|
image {
|
|
width: 44rpx;
|
|
height: 44rpx;
|
|
margin-left: 5rpx;
|
|
transform: rotate(180deg);
|
|
}
|
|
}
|
|
.input-wrapper {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 0 30rpx;
|
|
padding-top: 22rpx;
|
|
height: 110rpx;
|
|
background-color: $J-bg-ff;
|
|
.input-main {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
height: 70rpx;
|
|
background: $J-bg-f5;
|
|
border-radius: $J-b-r12;
|
|
image {
|
|
padding: 22rpx;
|
|
width: 26rpx;
|
|
height: 26rpx;
|
|
}
|
|
input {
|
|
flex: 1;
|
|
font-size: 27rpx;
|
|
}
|
|
}
|
|
.screen-wrapper {
|
|
margin: 0 12rpx 0 20rpx;
|
|
font-size: 32rpx;
|
|
color: $J-color-t99;
|
|
image {
|
|
width: 28rpx;
|
|
height: 26rpx;
|
|
padding: 0 21rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|