feat: 订单列表样式和接口更新
This commit is contained in:
parent
0aa1746679
commit
df15102661
|
|
@ -12,7 +12,7 @@
|
|||
(function () {
|
||||
window.SITE_CONFIG = {};
|
||||
// api接口请求地址
|
||||
window.SITE_CONFIG["baseUrl"] = "https://admin.damajishi.cn/";
|
||||
window.SITE_CONFIG["baseUrl"] = "https://admin-test.damajishi.cn/";
|
||||
// 在线api接口请求地址
|
||||
// window.SITE_CONFIG['baseUrl'] = 'http://119.29.103.250:8082/red-memory';
|
||||
// 在线api接口请求地址
|
||||
|
|
|
|||
|
|
@ -352,5 +352,45 @@ export const mer_admin = {
|
|||
},
|
||||
membershipEnableSaveSettings: data => {
|
||||
return $http.post(`/merchant-api/membershipEnable/saveSettings`, data);
|
||||
},
|
||||
/**
|
||||
* 订单分页查询
|
||||
* @param {object} data 查询参数
|
||||
* @param {number} data.pageNumber 页码
|
||||
* @param {number} data.pageSize 每页数量
|
||||
* @param {string} data.sortOrder 排序顺序
|
||||
* @param {string} data.sortName 排序字段
|
||||
* @param {string} data.receiverName 收货人姓名
|
||||
* @param {string} data.receiverPhone 收货人手机号
|
||||
* @param {string} data.statusList 订单业务状态列表 0： 待支付、1：待接单、2：待备货、3：待取货、4：已取货（待配送）、5： 配送中（待送达）、6： 已配送（待收货）、8：完成、-1：未支付订单取消、-2：用户申请退款中、-3：用户申请已退款：-4：商家取消订单、-5：平台取消订单
|
||||
* @param {string} data.unitOrderNo 结算订单号
|
||||
* @param {string} data.startTime 开始日期
|
||||
* @param {string} data.endTime 结束日期
|
||||
* @returns {Promise}
|
||||
*/
|
||||
orderV2Page: data => {
|
||||
return $http.request({
|
||||
method: "get",
|
||||
url: `/merchant-api/backend/order/v2/page`,
|
||||
params: data
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 订单概览
|
||||
* @param {object} data 查询参数
|
||||
* @param {string} data.receiverName 收货人姓名
|
||||
* @param {string} data.receiverPhone 收货人手机号
|
||||
* @param {string} data.statusList 订单业务状态 0： 待支付、1：待接单、2：待备货、3：待取货、4：已取货（待配送）、5： 配送中（待送达）、6： 已配送（待收货）、8：完成、-1：未支付订单取消、-2：用户申请退款中、-3：用户申请已退款：-4：商家取消订单、-5：平台取消订单
|
||||
* @param {string} data.unitOrderNo 结算订单号
|
||||
* @param {string} data.startTime 开始日期
|
||||
* @param {string} data.endTime 结束日期
|
||||
* @returns {Promise}
|
||||
*/
|
||||
orderV2Overview: data => {
|
||||
return $http.request({
|
||||
method: "get",
|
||||
url: `/merchant-api/backend/order/v2/overview`,
|
||||
params: data
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,209 +1,498 @@
|
|||
<template>
|
||||
<div style="height: calc(100vh - 200px)">
|
||||
<el-form
|
||||
v-if="storeList.length > 1"
|
||||
:inline="true"
|
||||
:model="formInline"
|
||||
class="demo-form-inline"
|
||||
>
|
||||
<el-form-item label="摊铺">
|
||||
<el-select
|
||||
class="filter-item"
|
||||
style="width: 200px"
|
||||
v-model="formInline.shopId"
|
||||
placeholder="请选择摊铺"
|
||||
<div class="page-container">
|
||||
<div class="fixed-content">
|
||||
<el-card class="search-card" shadow="never">
|
||||
<!-- 搜索表单 -->
|
||||
<el-form
|
||||
:model="searchForm"
|
||||
ref="searchForm"
|
||||
label-position="top"
|
||||
class="search-form"
|
||||
size="small"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in storeList"
|
||||
:key="item.shopId"
|
||||
:label="item.shopName"
|
||||
:value="item.shopId"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList">查询</el-button>
|
||||
<el-button type="primary" @click="Reset">重置</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
@click="
|
||||
$router.push({ name: 'operation-management-total-order/index' })
|
||||
"
|
||||
>菜市场总订单</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-tabs v-model="formInline.group" @tab-click="handleClick">
|
||||
<el-tab-pane
|
||||
v-for="item in statusList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:name="item.value"
|
||||
></el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-table :data="tableData" height="70vh" border style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
<div style="padding-left: 20px" m="4">
|
||||
<el-table :data="props.row.productOrders" :border="true">
|
||||
<el-table-column type="index" width="50" label="序号">
|
||||
</el-table-column>
|
||||
<el-table-column label="商品订单号" prop="productOrderNo" />
|
||||
<el-table-column label="商品名称" prop="productName" />
|
||||
<el-table-column label="商品原价" prop="originPrice" />
|
||||
<el-table-column label="商品终价" prop="finalPrice" />
|
||||
<el-table-column label="商品订单金额" prop="productOrderMoney" />
|
||||
<el-table-column label="商品数量" prop="productCount" />
|
||||
<el-table-column label="商品单价" prop="productFinalPrice" />
|
||||
<el-table-column label="商品图片" prop="productImg">
|
||||
<template slot-scope="scope">
|
||||
<el-image
|
||||
style="width: 60px; height: 60px"
|
||||
:src="scope.row.productImg"
|
||||
:preview-src-list="[scope.row.productImg]"
|
||||
>
|
||||
</el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="总订单号" prop="orderNo" />
|
||||
<el-table-column label="结算单位订单号" prop="unitOrderNo" />
|
||||
<el-table-column label="总商品数量" prop="productCount" />
|
||||
<el-table-column label="顾客实际支付" prop="totalPayMoney" />
|
||||
<el-table-column label="商品总价" prop="productMoney" />
|
||||
<el-table-column label="配送费" prop="deliveryMoney" />
|
||||
<el-table-column label="优惠券减免" prop="couponMoney" />
|
||||
<el-table-column label="支付时间" prop="payTime" />
|
||||
<el-table-column label="预计送达时间" prop="predictDeliveryTime" />
|
||||
<el-table-column label="预计收入" prop="predictIncome" />
|
||||
<el-table-column label="距离" prop="distance" />
|
||||
<el-table-column label="备注" prop="remark" />
|
||||
<el-table-column fixed="right" width="100px" label="操作" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary" size="mini" @click="view(scope.row)">
|
||||
查看
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页 -->
|
||||
<div class="pagination-container">
|
||||
<el-row :gutter="15">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="收货人姓名" prop="receiverName">
|
||||
<el-input
|
||||
v-model="searchForm.receiverName"
|
||||
placeholder="请输入收货人姓名"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="订单编号" prop="unitOrderNo">
|
||||
<el-input
|
||||
v-model="searchForm.unitOrderNo"
|
||||
placeholder="请输入订单编号"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="订单状态" prop="statusList">
|
||||
<el-select
|
||||
v-model="searchForm.statusList"
|
||||
multiple
|
||||
placeholder="请选择订单状态"
|
||||
clearable
|
||||
style="width: 100%;"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in orderStatusOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="订单时间" prop="dateRange">
|
||||
<el-date-picker
|
||||
v-model="searchForm.dateRange"
|
||||
type="datetimerange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="width: 100%;"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24" class="search-buttons">
|
||||
<el-button type="primary" @click="handleSearch" icon="el-icon-search" size="small">搜索</el-button>
|
||||
<el-button @click="handleReset" icon="el-icon-refresh" size="small">重置</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<el-card class="stats-card" shadow="never">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6">
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">订单数量(笔)</div>
|
||||
<div class="stat-value">{{ stats.totalCount || 0 }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">订单金额(元)</div>
|
||||
<div class="stat-value">¥ {{ (stats.totalMoney / 100).toFixed(2) || '0.00' }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">订单完成率</div>
|
||||
<div class="stat-value">{{ (stats.completeRate * 100).toFixed(2) || '0.00' }}%</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">代理商抽成(元)</div>
|
||||
<div class="stat-value">¥ {{ (stats.agentCommission / 100).toFixed(2) || '0.00' }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<el-card class="table-card" shadow="never">
|
||||
<div slot="header">
|
||||
<span>订单列表</span>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="tableData"
|
||||
v-loading="loading"
|
||||
style="width: 100%"
|
||||
row-key="unitOrderNo"
|
||||
size="small"
|
||||
:expand-row-keys="expandedRows"
|
||||
@expand-change="handleExpandChange"
|
||||
:default-expand-all="false">
|
||||
|
||||
<el-table-column type="expand" width="50">
|
||||
<template slot-scope="props">
|
||||
<div class="expand-content">
|
||||
<div class="shop-order" v-for="(shopOrder, shopIndex) in props.row.shopOrderList" :key="shopIndex">
|
||||
<h4>店铺: {{ shopOrder.shopName }}</h4>
|
||||
<!-- 二级子列表: 店铺订单信息 -->
|
||||
<el-table
|
||||
:data="[shopOrder]"
|
||||
size="small"
|
||||
style="width: 100%; margin-bottom: 10px;"
|
||||
:show-header="true">
|
||||
<el-table-column label="序号" width="50">
|
||||
<template slot-scope="shopScope">
|
||||
{{ shopIndex + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="shopOrderNo" label="店铺订单号" width="180"></el-table-column>
|
||||
<el-table-column prop="status" label="档位" width="100">
|
||||
<template slot-scope="shopScope">
|
||||
{{ shopScope.row.status || "暂无" }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="订单状态" width="120">
|
||||
<template slot-scope="shopScope">
|
||||
<el-tag :type="getShopStatusType(shopScope.row.status)" size="small">
|
||||
{{ getShopStatusText(shopScope.row.status) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 三级子列表: 商品信息 -->
|
||||
<el-table
|
||||
:data="shopOrder.productOrderList"
|
||||
size="small"
|
||||
style="width: 100%"
|
||||
:show-header="true">
|
||||
<el-table-column label="序号" width="50">
|
||||
<template slot-scope="productScope">
|
||||
{{ productScope.$index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="productName" label="商品名称" width="150"></el-table-column>
|
||||
<el-table-column prop="productCount" label="商品数量" width="80"></el-table-column>
|
||||
<el-table-column label="商品原价" width="100">
|
||||
<template slot-scope="productScope">
|
||||
¥ {{ (productScope.row.originPrice / 100).toFixed(2) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品终价" width="100">
|
||||
<template slot-scope="productScope">
|
||||
¥ {{ (productScope.row.finalPrice / 100).toFixed(2) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品订单金额" width="120">
|
||||
<template slot-scope="productScope">
|
||||
¥ {{ (productScope.row.productOrderMoney / 100).toFixed(2) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="productImg" label="商品图片" width="80">
|
||||
<template slot-scope="productScope">
|
||||
<el-image v-if="productScope.row.productImg"
|
||||
:src="productScope.row.productImg"
|
||||
style="width: 40px; height: 40px;"
|
||||
fit="cover"
|
||||
:preview-src-list="[productScope.row.productImg]"></el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 一级列表字段 -->
|
||||
<el-table-column label="序号" width="50">
|
||||
<template slot-scope="scope">
|
||||
{{ (pagination.pageNumber - 1) * pagination.pageSize + scope.$index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="unitOrderNo" label="结算订单号" min-width="180"></el-table-column>
|
||||
<el-table-column prop="createTime" label="下单时间" width="180"></el-table-column>
|
||||
<el-table-column prop="receiverName" label="收货人姓名" width="120"></el-table-column>
|
||||
<el-table-column prop="receiverPhone" label="收货人电话" width="150"></el-table-column>
|
||||
<el-table-column prop="poi" label="收货人地址" min-width="200"></el-table-column>
|
||||
<el-table-column label="市场订单金额" width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>¥ {{ (scope.row.unitOrderMoney / 100).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="市场订单商品金额" width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>¥ {{ (scope.row.productMoney / 100).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="市场订单配送费" width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>¥ {{ (scope.row.deliveryMoney / 100).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="调度费" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>¥ {{ (scope.row.dispatchMoney / 100).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="包装费" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>¥ {{ (scope.row.packageMoney / 100).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="订单状态" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="getStatusTagType(scope.row.status)" size="small">
|
||||
{{ getStatusText(scope.row.status) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="marketId" label="市场编号" width="100"></el-table-column>
|
||||
<el-table-column prop="marketName" label="市场名称" min-width="150"></el-table-column>
|
||||
<el-table-column prop="refundReason" label="申请退款原因" min-width="150"></el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
:current-page="formInline.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="formInline.pageSize"
|
||||
:total="total"
|
||||
background
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<!-- 订单详情 -->
|
||||
<viewDetails ref="viewDetails"></viewDetails>
|
||||
:current-page="pagination.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pagination.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pagination.total"
|
||||
class="pagination-container"
|
||||
></el-pagination>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import viewDetails from "./popup/view-details.vue";
|
||||
import { mapState } from "vuex";
|
||||
import { mer_admin } from "@/api/modules/mer_admin";
|
||||
|
||||
export default {
|
||||
components: { viewDetails },
|
||||
name: "OrderManagement",
|
||||
data() {
|
||||
return {
|
||||
formInline: {
|
||||
group: "",
|
||||
shopId: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
searchForm: {
|
||||
receiverName: "",
|
||||
unitOrderNo: "",
|
||||
statusList: [],
|
||||
dateRange: [],
|
||||
},
|
||||
statusList: [
|
||||
{
|
||||
label: "全部订单",
|
||||
value: "0",
|
||||
},
|
||||
{
|
||||
label: "待备货",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
label: "待取货",
|
||||
value: "2",
|
||||
},
|
||||
{
|
||||
label: "待收货",
|
||||
value: "3",
|
||||
},
|
||||
{
|
||||
label: "已完成",
|
||||
value: "4",
|
||||
},
|
||||
stats: {
|
||||
totalCount: 0,
|
||||
totalMoney: 0,
|
||||
completeRate: 0,
|
||||
agentCommission: 0,
|
||||
},
|
||||
orderStatusOptions: [
|
||||
{ label: "待支付", value: 0 },
|
||||
{ label: "待接单", value: 1 },
|
||||
{ label: "待备货", value: 2 },
|
||||
{ label: "待取货", value: 3 },
|
||||
{ label: "已取货（待配送）", value: 4 },
|
||||
{ label: "配送中（待送达）", value: 5 },
|
||||
{ label: "已配送（待收货）", value: 6 },
|
||||
{ label: "完成", value: 8 },
|
||||
{ label: "未支付订单取消", value: -1 },
|
||||
{ label: "用户申请退款中", value: -2 },
|
||||
{ label: "用户申请已退款", value: -3 },
|
||||
{ label: "商家取消订单", value: -4 },
|
||||
{ label: "平台取消订单", value: -5 },
|
||||
],
|
||||
tableData: [],
|
||||
total: 0,
|
||||
pagination: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
},
|
||||
loading: false,
|
||||
expandedRows: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.formInline = {
|
||||
group: "0",
|
||||
// marketId: this.marketId,
|
||||
shopId: this.shopId,
|
||||
agentId: this.agentId
|
||||
};
|
||||
this.getList();
|
||||
this.fetchData();
|
||||
this.fetchOverview();
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
//根据店铺查询
|
||||
this.$api.mer_admin
|
||||
.shopOrderPage({
|
||||
...this.formInline,
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
this.tableData = res.data.data.data;
|
||||
this.total = Number(res.data.data.total);
|
||||
});
|
||||
},
|
||||
Reset() {
|
||||
this.formInline = {
|
||||
group: "0",
|
||||
shopId: this.shopId,
|
||||
agentId: this.agentId
|
||||
getCommonParams() {
|
||||
const params = {
|
||||
receiverName: this.searchForm.receiverName || null,
|
||||
unitOrderNo: this.searchForm.unitOrderNo || null,
|
||||
statusList: this.searchForm.statusList.length ? this.searchForm.statusList.join(',') : null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
};
|
||||
this.getList();
|
||||
if (this.searchForm.dateRange && this.searchForm.dateRange.length === 2) {
|
||||
params.startTime = this.searchForm.dateRange[0];
|
||||
params.endTime = this.searchForm.dateRange[1];
|
||||
}
|
||||
return params;
|
||||
},
|
||||
handleClick(e) {
|
||||
this.advanceSellStatus = e.name;
|
||||
this.getList();
|
||||
fetchData() {
|
||||
this.loading = true;
|
||||
const params = {
|
||||
...this.getCommonParams(),
|
||||
pageNumber: this.pagination.pageNumber,
|
||||
pageSize: this.pagination.pageSize,
|
||||
};
|
||||
|
||||
mer_admin.orderV2Page(params).then(res => {
|
||||
if (res.data && res.data.data) {
|
||||
this.tableData = res.data.data.data;
|
||||
this.pagination.total = parseInt(res.data.data.total) || 0;
|
||||
} else {
|
||||
this.tableData = [];
|
||||
this.pagination.total = 0;
|
||||
}
|
||||
}).catch(err => {
|
||||
console.error("Error fetching order data:", err);
|
||||
this.tableData = [];
|
||||
this.pagination.total = 0;
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
view(row) {
|
||||
this.$refs.viewDetails.toggle(row).update();
|
||||
fetchOverview() {
|
||||
const params = this.getCommonParams();
|
||||
mer_admin.orderV2Overview(params).then(res => {
|
||||
if (res.data && res.data.data) {
|
||||
this.stats = res.data.data;
|
||||
} else {
|
||||
this.stats = {
|
||||
totalCount: 0,
|
||||
totalMoney: 0,
|
||||
completeRate: 0,
|
||||
agentCommission: 0,
|
||||
};
|
||||
}
|
||||
}).catch(err => {
|
||||
console.error("Error fetching overview data:", err);
|
||||
});
|
||||
},
|
||||
handleSearch() {
|
||||
this.pagination.pageNumber = 1;
|
||||
this.fetchData();
|
||||
this.fetchOverview();
|
||||
},
|
||||
handleReset() {
|
||||
this.$refs.searchForm.resetFields();
|
||||
this.searchForm.dateRange = [];
|
||||
this.handleSearch();
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.formInline.pageSize = val;
|
||||
this.getList();
|
||||
this.pagination.pageSize = val;
|
||||
this.fetchData();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.formInline.pageNumber = val;
|
||||
this.getList();
|
||||
this.pagination.pageNumber = val;
|
||||
this.fetchData();
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState("userData", [
|
||||
"isMerchant",
|
||||
"marketList",
|
||||
"storeList",
|
||||
"marketId",
|
||||
"shopId",
|
||||
"agentId"
|
||||
]),
|
||||
getStatusText(status) {
|
||||
if (status === undefined || status === null) {
|
||||
return "未知状态";
|
||||
}
|
||||
const statusOption = this.orderStatusOptions.find(opt => opt.value === status);
|
||||
return statusOption ? statusOption.label : "未知状态";
|
||||
},
|
||||
getStatusTagType(status) {
|
||||
switch (status) {
|
||||
case 0: return 'warning'; // 待支付
|
||||
case 1:
|
||||
case 2:
|
||||
case 3:
|
||||
case 4:
|
||||
case 5:
|
||||
case 6:
|
||||
return 'info'; // 进行中
|
||||
case 8: return 'success'; // 完成
|
||||
case -1:
|
||||
case -2:
|
||||
case -3:
|
||||
case -4:
|
||||
case -5:
|
||||
return 'danger'; // 取消或退款
|
||||
default: return 'primary';
|
||||
}
|
||||
},
|
||||
viewDetails(row) {
|
||||
// 路由跳转或弹窗显示详情
|
||||
console.log("View details for:", row.unitOrderNo);
|
||||
// this.$router.push({ name: 'OrderDetail', params: { id: row.unitOrderNo } });
|
||||
},
|
||||
handleExpandChange(row, expandedRows) {
|
||||
this.expandedRows = expandedRows.map(item => item.unitOrderNo);
|
||||
},
|
||||
getShopStatusText(status) {
|
||||
const shopStatusMap = {
|
||||
0: '待备货',
|
||||
1: '备货完成 待取货',
|
||||
2: '已取货（待配送）',
|
||||
3: '配送中',
|
||||
4: '配送完成(待收货)',
|
||||
5: '待评价',
|
||||
6: '已完成'
|
||||
};
|
||||
return shopStatusMap[status] || '未知状态';
|
||||
},
|
||||
getShopStatusType(status) {
|
||||
switch (status) {
|
||||
case 0: // 待备货
|
||||
case 1: // 备货完成 待取货
|
||||
return 'warning';
|
||||
case 2: // 已取货（待配送）
|
||||
case 3: // 配送中
|
||||
case 4: // 配送完成(待收货)
|
||||
return 'info';
|
||||
case 5: // 待评价
|
||||
return 'primary';
|
||||
case 6: // 已完成
|
||||
return 'success';
|
||||
default:
|
||||
return 'danger';
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
<style scoped>
|
||||
.page-container {
|
||||
}
|
||||
.search-card {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.stats-card {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.stat-item {
|
||||
text-align: center;
|
||||
background-color: #f5f5f5;
|
||||
padding: 15px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.stat-label {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.stat-value {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #409EFF;
|
||||
}
|
||||
.search-form .el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.search-buttons {
|
||||
text-align: left;
|
||||
}
|
||||
.pagination-container {
|
||||
margin-top: 20px;
|
||||
text-align: right;
|
||||
}
|
||||
.expand-content {
|
||||
padding: 10px;
|
||||
}
|
||||
.shop-order {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.shop-order h4 {
|
||||
margin: 0 0 10px 0;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.search-form .el-form-item__label {
|
||||
padding-bottom: 0px !important;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue