剩余未走组件的分页加跳转选择页数大小条数

feature/0423
fanfan 11 months ago
parent 0feea13468
commit 012efd4116
  1. 29
      src/views/apps/dealer/order/Index.vue
  2. 24
      src/views/market/presale/Index copy 2.vue
  3. 60
      src/views/market/presale/modules/Log.vue
  4. 165
      src/views/order/refund/Index.vue
  5. 25
      src/views/order/tools/delivery/Index.vue
  6. 26
      src/views/order/tools/delivery/Record.vue
  7. 22
      src/views/server/Order.vue

@ -184,8 +184,15 @@
<div v-if="orderList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="orderList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="orderList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
@ -279,8 +286,11 @@ export default {
columns,
//
page: 1,
pageSize: 15,
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
//
orderList: { data: [], total: 0, per_page: 10 }
orderList: { data: [], total: 0}
}
},
beforeCreate () {
@ -324,7 +334,7 @@ export default {
getList () {
const { queryParam, page } = this
this.isLoading = true
return Api.list({ ...queryParam, page })
return Api.list({ ...queryParam, page,pageSize:this.pageSize })
.then(response => {
this.orderList = response.data.list
})
@ -367,12 +377,17 @@ export default {
handleReset () {
this.searchForm.resetFields()
},
//
onChangePage (current) {
//
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
}
},
handleSizeChange(current, size){
this.page = current
this.pageSize = size
this.handleRefresh()
},
}
}

@ -146,8 +146,15 @@
<div v-if="orderList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="orderList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="orderList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
@ -250,6 +257,9 @@ export default {
columns,
//
page: 1,
pageSize: 15,
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
//
orderList: { data: [], total: 0, per_page: 10 },
//
@ -307,7 +317,7 @@ export default {
getList () {
const { dataType, queryParam, page } = this
this.isLoading = true
return Api.list({ dataType, ...queryParam, page })
return Api.list({ dataType, ...queryParam, page,pageSize:this.pageSize })
.then(response => {
this.orderList = response.data.list
console.log('🚀 ~ file: Index.vue:312 ~ getList ~ this.orderList:', this.orderList)
@ -352,9 +362,15 @@ export default {
this.searchForm.resetFields()
},
//
onChangePage (current) {
//
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
handleSizeChange(current, size){
this.page = current
this.pageSize = size
this.handleRefresh()
},

@ -12,10 +12,10 @@
<div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-bordered">
<div class="ant-table-content">
<div class="ant-table-scroll">
<div class="ant-table-body" style="overflow-x: scroll;">
<table style="width: 1450px;">
<div class="ant-table-body" style="overflow-x: scroll">
<table style="width: 1450px">
<tbody class="ant-table-tbody">
<template v-for="(item) in orderList.data">
<template v-for="item in orderList.data">
<tr class="order-empty" :key="`order_${item.id}_1`">
<td colspan="8"></td>
</tr>
@ -25,10 +25,7 @@
<span class="mr-20">创建时间{{ item.ctime }}</span>
</td>
</tr>
<tr
v-for="(goodsItm, goodsIdx) of item.goods"
:key="`orderGoods_${item.id}_${goodsIdx}`"
>
<tr v-for="(goodsItm, goodsIdx) of item.goods" :key="`orderGoods_${item.id}_${goodsIdx}`">
<td>
<p>{{ goodsItm.goods_name }}</p>
</td>
@ -46,12 +43,18 @@
<div v-if="orderList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="orderList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="orderList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
</div>
</a-modal>
</template>
@ -64,9 +67,9 @@ import { Empty } from 'ant-design-vue'
export default {
components: {
STable
STable,
},
data () {
data() {
return {
//
title: '预售记录',
@ -85,13 +88,15 @@ export default {
//
page: 1,
orderList: { data: [], total: 0, per_page: 10 },
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE
pageSize: 15,
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
orderList: { data: [], total: 0},
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE,
}
},
methods: {
visibleLog (preId) {
visibleLog(preId) {
//
this.visible = true
// ID
@ -103,18 +108,18 @@ export default {
},
//
getList () {
getList() {
const { queryParam, page } = this
this.isLoading = true
return Api.log({ ...queryParam, page })
.then(response => {
return Api.log({ ...queryParam, page,pageSize:this.pageSize })
.then((response) => {
this.orderList = response.data.list
})
.finally(() => this.isLoading = false)
.finally(() => (this.isLoading = false))
},
//
handleCancel () {
handleCancel() {
this.visible = false
},
@ -122,17 +127,22 @@ export default {
* 刷新列表
* @param Boolean bool 强制刷新到第一页
*/
handleRefresh (bool = false) {
handleRefresh(bool = false) {
bool && (this.page = 1)
this.getList()
},
//
onChangePage (current) {
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
}
}
},
handleSizeChange(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
},
}
</script>

@ -8,37 +8,27 @@
<a-form class="search-form" :form="searchForm" layout="inline" @submit="handleSearch">
<a-form-item label="关键词查询">
<a-input style="width: 342px" placeholder="请输入关键词" v-decorator="['searchValue']">
<a-select
slot="addonBefore"
v-decorator="['searchType', { initialValue: 10 }]"
style="width: 100px"
>
<a-select-option
v-for="(item, index) in SearchTypeEnum"
:key="index"
:value="item.value"
>{{ item.name }}</a-select-option>
<a-select slot="addonBefore" v-decorator="['searchType', { initialValue: 10 }]" style="width: 100px">
<a-select-option v-for="(item, index) in SearchTypeEnum" :key="index" :value="item.value">{{
item.name
}}</a-select-option>
</a-select>
</a-input>
</a-form-item>
<a-form-item label="售后类型">
<a-select v-decorator="['refundType', { initialValue: -1 }]">
<a-select-option :value="-1">全部</a-select-option>
<a-select-option
v-for="(item, index) in RefundTypeEnum.data"
:key="index"
:value="item.value"
>{{ item.name }}</a-select-option>
<a-select-option v-for="(item, index) in RefundTypeEnum.data" :key="index" :value="item.value">{{
item.name
}}</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="售后单状态">
<a-select v-decorator="['refundStatus', { initialValue: -1 }]">
<a-select-option :value="-1">全部</a-select-option>
<a-select-option
v-for="(item, index) in RefundStatusEnum.data"
:key="index"
:value="item.value"
>{{ item.name }}</a-select-option>
<a-select-option v-for="(item, index) in RefundStatusEnum.data" :key="index" :value="item.value">{{
item.name
}}</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="申请时间">
@ -87,7 +77,7 @@
image: item.orderGoods.goods_image,
imageAlt: '商品图片',
title: item.orderGoods.goods_name,
goodsProps: item.orderGoods.goods_props
goodsProps: item.orderGoods.goods_props,
}"
/>
</td>
@ -107,49 +97,52 @@
<td>
<p class="mtb-2">
<span class="f-13">商家审核</span>
<a-tag
:color="renderAuditStatusColor(item.audit_status)"
>{{ AuditStatusEnum[item.audit_status].name }}</a-tag>
<a-tag :color="renderAuditStatusColor(item.audit_status)">{{
AuditStatusEnum[item.audit_status].name
}}</a-tag>
</p>
<p v-if="item.type == RefundTypeEnum.RETURN.value" class="mtb-2">
<span class="f-13">用户发货</span>
<a-tag
:color="item.is_user_send ? 'green' : ''"
>{{ item.is_user_send ? '已发货' : '待发货' }}</a-tag>
<a-tag :color="item.is_user_send ? 'green' : ''">{{
item.is_user_send ? '已发货' : '待发货'
}}</a-tag>
</p>
<p v-if="item.type == RefundTypeEnum.RETURN.value" class="mtb-2">
<span class="f-13">商家收货</span>
<a-tag
:color="item.is_receipt ? 'green' : ''"
>{{ item.is_receipt ? '已收货' : '待收货' }}</a-tag>
<a-tag :color="item.is_receipt ? 'green' : ''">{{
item.is_receipt ? '已收货' : '待收货'
}}</a-tag>
</p>
</td>
<td>
<a-tag
:color="renderRefundStatusColor(item.status)"
>{{ RefundStatusEnum[item.status].name }}</a-tag>
<a-tag :color="renderRefundStatusColor(item.status)">{{
RefundStatusEnum[item.status].name
}}</a-tag>
</td>
<td>
<div class="actions">
<router-link
v-if="$auth('/order/refund/detail')"
:to="{ path: '/order/refund/detail', query: { orderRefundId: item.order_refund_id } }"
>详情</router-link>
>详情</router-link
>
<a
v-action:audit
v-if="item.audit_status == AuditStatusEnum.WAIT.value"
@click="handleAudit(item)"
>审核</a>
>审核</a
>
<a
v-action:receipt
v-if="(
item.type == RefundTypeEnum.RETURN.value
&& item.audit_status == AuditStatusEnum.REVIEWED.value
&& item.is_user_send
&& !item.is_receipt
)"
v-if="
item.type == RefundTypeEnum.RETURN.value &&
item.audit_status == AuditStatusEnum.REVIEWED.value &&
item.is_user_send &&
!item.is_receipt
"
@click="handleReceipt(item)"
>确认收货</a>
>确认收货</a
>
</div>
</td>
</tr>
@ -165,8 +158,15 @@
<div v-if="refundList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="refundList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="refundList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
@ -188,52 +188,52 @@ import { AuditForm, ReceiptForm } from './modules'
const columns = [
{
title: '商品信息',
align: 'center'
align: 'center',
},
{
title: '单价/数量',
align: 'center',
scopedSlots: { customRender: 'unit_price' }
scopedSlots: { customRender: 'unit_price' },
},
{
title: '付款金额',
align: 'center',
dataIndex: 'total_pay_price',
scopedSlots: { customRender: 'pay_price' }
scopedSlots: { customRender: 'pay_price' },
},
{
title: '买家',
dataIndex: 'user',
scopedSlots: { customRender: 'user' }
scopedSlots: { customRender: 'user' },
},
{
title: '售后类型',
dataIndex: 'type',
scopedSlots: { customRender: 'type' }
scopedSlots: { customRender: 'type' },
},
{
title: '处理进度',
dataIndex: 'progress',
scopedSlots: { customRender: 'progress' }
scopedSlots: { customRender: 'progress' },
},
{
title: '售后单状态',
dataIndex: 'status',
scopedSlots: { customRender: 'status' }
scopedSlots: { customRender: 'status' },
},
{
title: '操作',
dataIndex: 'action',
width: '180px',
scopedSlots: { customRender: 'action' }
}
scopedSlots: { customRender: 'action' },
},
]
//
const SearchTypeEnum = [
{ name: '订单号', value: 10 },
{ name: '会员昵称', value: 20 },
{ name: '会员ID', value: 30 }
{ name: '会员ID', value: 30 },
]
export default {
@ -242,9 +242,9 @@ export default {
GoodsItem,
UserItem,
AuditForm,
ReceiptForm
ReceiptForm,
},
data () {
data() {
return {
//
searchForm: this.$form.createForm(this),
@ -256,11 +256,15 @@ export default {
columns,
//
page: 1,
pageSize: 15,
//
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
//
refundList: { data: [], total: 0, per_page: 10 }
refundList: { data: [], total: 0 },
}
},
beforeCreate () {
beforeCreate() {
//
assignment(this, {
inArray,
@ -268,52 +272,51 @@ export default {
RefundStatusEnum,
RefundTypeEnum,
SearchTypeEnum,
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE,
})
},
created () {
created() {
//
this.init()
},
methods: {
//
init () {
init() {
this.searchForm.resetFields()
this.queryParam = {}
this.handleRefresh(true)
},
//
getList () {
getList() {
const { queryParam, page } = this
this.isLoading = true
return Api.list({ ...queryParam, page })
.then(response => {
return Api.list({ ...queryParam, page,pageSize:this.pageSize })
.then((response) => {
this.refundList = response.data.list
})
.finally(() => this.isLoading = false)
.finally(() => (this.isLoading = false))
},
//
renderAuditStatusColor (status) {
renderAuditStatusColor(status) {
const { AuditStatusEnum } = this
const ColorEnum = {
[AuditStatusEnum.WAIT.value]: '',
[AuditStatusEnum.REVIEWED.value]: 'green',
[AuditStatusEnum.REJECTED.value]: 'red'
[AuditStatusEnum.REJECTED.value]: 'red',
}
return ColorEnum[status]
},
//
renderRefundStatusColor (status) {
renderRefundStatusColor(status) {
const { RefundStatusEnum } = this
const ColorEnum = {
[RefundStatusEnum.NORMAL.value]: '',
[RefundStatusEnum.REJECTED.value]: 'red',
[RefundStatusEnum.COMPLETED.value]: 'green',
[RefundStatusEnum.CANCELLED.value]: 'red'
[RefundStatusEnum.CANCELLED.value]: 'red',
}
return ColorEnum[status]
},
@ -322,13 +325,13 @@ export default {
* 刷新列表
* @param Boolean bool 强制刷新到第一页
*/
handleRefresh (bool = false) {
handleRefresh(bool = false) {
bool && (this.page = 1)
this.getList()
},
//
handleSearch (e) {
handleSearch(e) {
e.preventDefault()
this.searchForm.validateFields((error, values) => {
if (!error) {
@ -339,27 +342,31 @@ export default {
},
//
handleReset () {
handleReset() {
this.searchForm.resetFields()
},
//
onChangePage (current) {
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
handleSizeChange(current, size){
this.page = current
this.pageSize = size
this.handleRefresh()
},
//
handleAudit (record) {
handleAudit(record) {
this.$refs.AuditForm.show(record)
},
//
handleReceipt (record) {
handleReceipt(record) {
this.$refs.ReceiptForm.show(record)
}
}
},
},
}
</script>
<style lang="less" scoped>

@ -177,8 +177,15 @@
<div v-if="orderList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="orderList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="orderList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
@ -283,8 +290,11 @@ export default {
columns,
//
page: 1,
pageSize: 15,
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
//
orderList: { data: [], total: 0, per_page: 10 },
orderList: { data: [], total: 0},
}
},
beforeCreate () {
@ -319,7 +329,7 @@ export default {
getList () {
const { dataType, queryParam, page } = this
this.isLoading = true
return Api.list({ dataType, ...queryParam, deliveryType: DeliveryTypeEnum.EXPRESS.value, page })
return Api.list({ dataType, ...queryParam, deliveryType: DeliveryTypeEnum.EXPRESS.value, page,pageSize:this.pageSize })
.then(response => {
this.orderList = response.data.list
})
@ -352,11 +362,16 @@ export default {
},
//
onChangePage (current) {
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
handleSizeChange(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
//
handleDelivery (item) {
this.$refs.DeliveryForm.show(item)

@ -133,8 +133,15 @@
<div v-if="orderList.data.length" class="pagination">
<a-pagination
:current="page"
:pageSize="orderList.per_page"
:default-page-size="pageSize"
:pageSizes="pageSize"
:total="orderList.total"
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="onChangePage"
/>
</div>
@ -218,8 +225,11 @@ export default {
columns,
//
page: 1,
pageSize: 15,
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
//
orderList: { data: [], total: 0, per_page: 10 },
orderList: { data: [], total: 0, },
}
},
beforeCreate () {
@ -247,7 +257,7 @@ export default {
getList () {
const { queryParam, page } = this
this.isLoading = true
return Api.list({ ...queryParam, page })
return Api.list({ ...queryParam, page,pageSize:this.pageSize })
.then(response => {
this.orderList = response.data.list
})
@ -278,13 +288,17 @@ export default {
handleReset () {
this.searchForm.resetFields()
},
//
onChangePage (current) {
onChangePage(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
handleSizeChange(current, size) {
this.page = current
this.pageSize = size
this.handleRefresh()
},
//
handleEorder (item) {
this.$refs.EorderShow.handle(item)

@ -69,10 +69,16 @@
</a-table>
<a-pagination
v-model="queryParam.page"
:default-page-size="queryParam.pageSize"
:pageSizes="queryParam.pageSize"
:total="total"
show-less-items
:showSizeChanger="true"
:showQuickJumper="true"
:pageSizeOptions="pageSizeOptions"
:layout="'total, sizes, prev, pager, next, jumper'"
:showTotal="showTotal"
@showSizeChange="handleSizeChange"
@change="handlePageChange"
:page-size="queryParam.pageSize"
style="float: right"
/>
<dispatch ref="dispatchRef" @handleSubmit="handleRefresh" />
@ -162,6 +168,8 @@ export default {
page: 1,
pageSize: 15,
},
pageSizeOptions: ['15', '30', '50'],
showTotal: (total) => `${total} 条记录`, //
total: 0,
//
isLoading: false,
@ -221,8 +229,14 @@ export default {
handleReset() {
this.searchForm.resetFields()
},
handlePageChange(val) {
this.queryParam.page = val
handlePageChange(current, size) {
this.queryParam.page = current
this.queryParam.pageSize = size
this.fetchData()
},
handleSizeChange(current, size) {
this.queryParam.page = current
this.queryParam.pageSize = size
this.fetchData()
},
//

Loading…
Cancel
Save