|
|
@@ -0,0 +1,777 @@
|
|
|
+<template>
|
|
|
+ <div class="page-wrap">
|
|
|
+ <div class="crumbs">
|
|
|
+ <el-breadcrumb separator="/">
|
|
|
+ <i class="el-icon-eleme"></i> 订单处理
|
|
|
+ </el-breadcrumb>
|
|
|
+ </div>
|
|
|
+ <div class="background">
|
|
|
+ <div class="topbox">
|
|
|
+ <div class="topbox-left">
|
|
|
+ <span class="page-title">订单处理</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="searchbox searchbox-multi">
|
|
|
+ <div class="filter-group filter-full">
|
|
|
+ <span>订单状态</span>
|
|
|
+ <el-radio-group v-model="tabIndex" @change="getDataList">
|
|
|
+ <el-radio-button label="all">全部</el-radio-button>
|
|
|
+ <el-radio-button label="0">待支付</el-radio-button>
|
|
|
+ <el-radio-button label="10">待接单</el-radio-button>
|
|
|
+ <el-radio-button label="20">
|
|
|
+ 已接单
|
|
|
+ <div class="high-light-number" v-if="receivedNum != 0 && receivedNum != null">{{receivedNum}}</div>
|
|
|
+ </el-radio-button>
|
|
|
+ <el-radio-button label="30">待配送</el-radio-button>
|
|
|
+ <el-radio-button label="40">配送中</el-radio-button>
|
|
|
+ <el-radio-button label="60">已完成</el-radio-button>
|
|
|
+ <el-radio-button label="-20">
|
|
|
+ 已完成 (退款)
|
|
|
+ <div class="high-light-number" v-if="refundNum != 0 && refundNum != null">{{refundNum}}</div>
|
|
|
+ </el-radio-button>
|
|
|
+ <el-radio-button label="50">待自取</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <div class="filter-group">
|
|
|
+ <span>下单时间</span>
|
|
|
+ <el-date-picker v-model="createDateS" value-format="yyyy-MM-dd" placeholder="开始日期" style="width:140px;"></el-date-picker>
|
|
|
+ <span class="time-separator">至</span>
|
|
|
+ <el-date-picker v-model="createDateE" value-format="yyyy-MM-dd" placeholder="结束日期" style="width:140px;"></el-date-picker>
|
|
|
+ </div>
|
|
|
+ <div class="filter-group">
|
|
|
+ <span>顾客姓名</span>
|
|
|
+ <el-input v-model="orderName" style="width:150px;" placeholder="根据顾客姓名查询" clearable></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="filter-group">
|
|
|
+ <span>手机号</span>
|
|
|
+ <el-input v-model="orderTel" style="width:150px;" placeholder="根据顾客手机号查询" clearable></el-input>
|
|
|
+ </div>
|
|
|
+ <span style="flex:1"></span>
|
|
|
+ <el-button type="primary" icon="el-icon-search" @click="getDataList">查询</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="tablebox">
|
|
|
+ <div class="order-table">
|
|
|
+ <table style="margin-top: 15px;width:100%;border-collapse: collapse;">
|
|
|
+ <tbody v-for="(order, index) in tableData" :key="order.orderId">
|
|
|
+ <tr class="sep"></tr>
|
|
|
+ <tr class="trhead">
|
|
|
+ <td colspan="4" class="td1">
|
|
|
+ <span style="font-size: 24px; font-weight: bolder; color: rgb(25, 137, 250);margin-left: 13px;">{{ order.takeupCode }}</span>
|
|
|
+ <span style="padding-left: 20px; font-size: 14px; font-weight: bold;">{{typeFormatter(order.orderType)}}</span>
|
|
|
+ <span style="float:right;margin-top: 5px;margin-right: 12px;">{{order.statusName}}({{order.sourceTypeStr}})</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td class="first-td">
|
|
|
+ <img style="margin-left: 6px;" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE1IDE2Ij4KICAgIDxwYXRoIGZpbGw9IiM4NzhEOTkiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTcuNSA4YTMuNSAzLjUgMCAxIDAgMC03IDMuNSAzLjUgMCAwIDAgMCA3em0wIDFhNC41IDQuNSAwIDEgMSAwLTkgNC41IDQuNSAwIDAgMSAwIDl6bTYuMzYgNmMuNjg1LTMuMTIyLTEuMjEtNC41NDUtNi4zNTMtNC41NDVTLjQ2MiAxMS44NzkgMS4xMzYgMTVIMTMuODZ6TTcuNTA3IDkuNDU1YzYuMTEgMCA4LjQ4NCAyLjE4MSA3LjEyIDYuNTQ1SC4zNjdjLTEuMzUtNC4zNjQgMS4wMy02LjU0NSA3LjE0LTYuNTQ1eiIvPgo8L3N2Zz4K">
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="min-height: 60px; height: 60px;">
|
|
|
+ <span style="display: block; text-align: left;">
|
|
|
+ {{ order.orderName }} {{ order.orderTel }}
|
|
|
+ <b style="float:right">{{order.storeName}}</b>
|
|
|
+ </span>
|
|
|
+ <p style="text-align: left;">{{ order.orderAddress }}</p>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td style="text-align:right;">
|
|
|
+ 备注:
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="min-height: 60px; height: 60px;">
|
|
|
+ <span style="display: block; text-align: left;">
|
|
|
+ {{ order.customerMes }}
|
|
|
+ </span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border" >
|
|
|
+ <td class="first-td">
|
|
|
+ <img style="margin-left: 6px;" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDIwIDE2Ij4KICAgIDxwYXRoIGZpbGw9IiM4NzhEOTkiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE0LjgyNiA5LjY5NGwtMi4zNTYgMS4yNDhhLjUuNSAwIDAgMS0uMjM0LjA1OEg3LjVhLjUuNSAwIDAgMS0uNS0uNXYtM2EuNS41IDAgMCAwLS41LS41aC01YS41LjUgMCAwIDAtLjUuNVYxMmEzIDMgMCAwIDAgNS42IDEuNWwuMjg4LS41aDYuMjI0bC4yODkuNWEzIDMgMCAxIDAgMy45OC00LjE2M2wtLjM4Mi0uMi0xLjY1LTUuNzc0QS41LjUgMCAwIDAgMTQuODcgM2gtLjg4NGEuNS41IDAgMCAwLS40OC42MzhsMS41NjggNS40NzZhLjUuNSAwIDAgMS0uMjQ3LjU4ek0yMCAxMmE0IDQgMCAwIDEtNy40NjUgMmgtNS4wN0E0IDQgMCAwIDEgMCAxMlY3YTEgMSAwIDAgMSAxLTFoNmExIDEgMCAwIDEgMSAxdjNoNC4xMTFMMTQgOWwtMS43MTgtNmgtMS42OTZhLjUuNSAwIDAgMS0uMDAyLTFIMTZsMS44NDIgNi40NDlBNCA0IDAgMCAxIDIwIDEyek0xIDBoNWExIDEgMCAwIDEgMSAxdjNhMSAxIDAgMCAxLTEgMUgxYTEgMSAwIDAgMS0xLTFWMWExIDEgMCAwIDEgMS0xem0uNSA0aDRhLjUuNSAwIDAgMCAuNS0uNXYtMmEuNS41IDAgMCAwLS41LS41aC00YS41LjUgMCAwIDAtLjUuNXYyYS41LjUgMCAwIDAgLjUuNXoiLz4KPC9zdmc+Cg==">
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="text-align: left;">
|
|
|
+ <p><span>{{deliveryTypeFormatter( order.orderType )}}</span></p>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td class="first-td">
|
|
|
+ <img style="margin-left: 6px;" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICAgIDxwYXRoIGZpbGw9IiM4NzhEOTkiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTEuNSA2aDRhLjUuNSAwIDAgMCAuNS0uNXYtNGEuNS41IDAgMCAwLS41LS41aC00YS41LjUgMCAwIDAtLjUuNXY0YS41LjUgMCAwIDAgLjUuNXpNMSAwaDVhMSAxIDAgMCAxIDEgMXY1YTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xVjFhMSAxIDAgMCAxIDEtMXptOS41IDZoNGEuNS41IDAgMCAwIC41LS41di00YS41LjUgMCAwIDAtLjUtLjVoLTRhLjUuNSAwIDAgMC0uNS41djRhLjUuNSAwIDAgMCAuNS41ek0xMCAwaDVhMSAxIDAgMCAxIDEgMXY1YTEgMSAwIDAgMS0xIDFoLTVhMSAxIDAgMCAxLTEtMVYxYTEgMSAwIDAgMSAxLTF6TTEuNSAxNWg0YS41LjUgMCAwIDAgLjUtLjV2LTRhLjUuNSAwIDAgMC0uNS0uNWgtNGEuNS41IDAgMCAwLS41LjV2NGEuNS41IDAgMCAwIC41LjV6TTEgOWg1YTEgMSAwIDAgMSAxIDF2NWExIDEgMCAwIDEtMSAxSDFhMSAxIDAgMCAxLTEtMXYtNWExIDEgMCAwIDEgMS0xem0xMCA2aDNhMSAxIDAgMCAwIDEtMXYtM2ExIDEgMCAwIDAtMS0xaC0zYTEgMSAwIDAgMC0xIDF2M2ExIDEgMCAwIDAgMSAxem0tMS02aDVhMSAxIDAgMCAxIDEgMXY1YTEgMSAwIDAgMS0xIDFoLTVhMSAxIDAgMCAxLTEtMXYtNWExIDEgMCAwIDEgMS0xeiIvPgo8L3N2Zz4K">
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="text-align: left;">
|
|
|
+ <span style="display: block; font: 15px bolder; color: rgb(45, 47, 51);">
|
|
|
+ {{order.buyCount}} 件商品 <b class="state_b_3168206771703696" style="color: rgb(25, 137, 250);float:right;margin-right: 12px;" @click="expand(index)">{{ !order.buttonText ? '展开' : order.buttonText }}</b>
|
|
|
+ </span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr v-show="order.isExpand" v-for="item in order.detailList" :key="item.orderDetailId" class="product_table_3168206771703696 tr-border" style="display: table-row;">
|
|
|
+ <td></td>
|
|
|
+ <td style="text-align: left;padding: 10px 0;">
|
|
|
+ {{item.goodsName}}<span>{{item.propertys == '' ? '' : '(' + item.propertys + ')'}}</span>
|
|
|
+ </td>
|
|
|
+ <td style="text-align: right;">× {{item.buyCount}}</td>
|
|
|
+ <td style="text-align: right;padding-right: 12px;padding-left: 5px;">{{moneyConverter(item.salesPrice)}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr v-if="order.isExpand" class="product_table_3168206771703696 tr-border" style="display: table-row;">
|
|
|
+ <td></td>
|
|
|
+ <td class="first-td" colspan="3" style="text-align: left;">
|
|
|
+ <span style="font-size: 12px; color: rgb(135, 141, 153);">其他</span>
|
|
|
+ <p>餐盒费
|
|
|
+ <span style="float: right; margin-right: 15px;">{{moneyConverter(order.packingFee )}}</span>
|
|
|
+ </p>
|
|
|
+ <p>配送费
|
|
|
+ <span style="float: right; margin-right: 15px;">{{moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) }}</span>
|
|
|
+ </p>
|
|
|
+ <p v-if="order.deliveryDiscountsFlag == 1" >免配送费
|
|
|
+ <span style="float: right; margin-right: 15px;">{{-moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) }}</span>
|
|
|
+ </p>
|
|
|
+ <p>新客立减
|
|
|
+ <span style="float: right; margin-right: 15px;">{{moneyConverter(order.newcusDiscounts) }}</span>
|
|
|
+ </p>
|
|
|
+ <p>满减
|
|
|
+ <span style="float: right; margin-right: 15px;">{{moneyConverter(order.fullDiscounts) }}</span>
|
|
|
+ </p>
|
|
|
+ <p>优惠券
|
|
|
+ <span style="float: right; margin-right: 15px;">{{order.couponName == '' || order.couponName == null ? '' : '（' + order.couponName + '）'}}{{order.couponCost ? moneyConverter(order.couponCost) : '' }}</span>
|
|
|
+ </p>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td class="first-td">
|
|
|
+ <img style="margin-left: 6px;" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE1IDE2Ij4KICAgIDxnIGZpbGw9IiM4NzhEOTkiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMSAwaDEzYTEgMSAwIDAgMSAxIDF2MTRhMSAxIDAgMCAxLTEgMUgxYTEgMSAwIDAgMS0xLTFWMWExIDEgMCAwIDEgMS0xem0wIDEuNXYxM2EuNS41IDAgMCAwIC41LjVoMTJhLjUuNSAwIDAgMCAuNS0uNXYtMTNhLjUuNSAwIDAgMC0uNS0uNWgtMTJhLjUuNSAwIDAgMC0uNS41eiIvPgogICAgICAgIDxwYXRoIGQ9Ik02Ljg0NCA3SDVhLjUuNSAwIDAgMCAwIDFoMnYxSDVhLjUuNSAwIDAgMCAwIDFoMnYyLjVhLjUuNSAwIDEgMCAxIDBWMTBoMmEuNS41IDAgMSAwIDAtMUg4VjhoMmEuNS41IDAgMSAwIDAtMUg4LjE1MmwyLjQzLTIuODc3YS41LjUgMCAxIDAtLjc2NC0uNjQ2bC0yLjMyIDIuNzQ4LTIuMzItMi43NDhhLjUuNSAwIDEgMC0uNzY0LjY0Nkw2Ljg0NCA3eiIvPgogICAgPC9nPgo8L3N2Zz4K">
|
|
|
+ </td>
|
|
|
+ <td style="text-align: left; font: 15px bolder; color: rgb(45, 47, 51);">顾客实付</td>
|
|
|
+ <td colspan="2" style="text-align: right;"><b style="color: rgb(90, 94, 102);padding-right: 12px;">¥{{moneyConverter(order.orderFee)}}</b></td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td></td>
|
|
|
+ <td style="text-align: left; font: 15px bolder; color: rgb(45, 47, 51);padding: 10px 0;">
|
|
|
+ 商家预计收入
|
|
|
+ <el-tooltip class="item" effect="dark" placement="top-end">
|
|
|
+ <div slot="content" class="shouru_div sr_tc_3168206771703696">
|
|
|
+ <p>订单总额<span>¥{{moneyConverter(order.orderFee)}}</span></p>
|
|
|
+ <p>配送费<span>¥-{{moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) }}</span></p>
|
|
|
+ <p v-if="order.deliveryDiscountsFlag == 1" >免配送费
|
|
|
+ <span>¥-{{moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) }}</span>
|
|
|
+ </p>
|
|
|
+ <p>微信扣点<span>¥-{{moneyConverter(calcPoints((order.wxPoint / 1000), order.orderFee ))}}</span></p>
|
|
|
+ <p>平台扣点<span>¥-{{moneyConverter(calcPoints((Number(order.commissionRate) / Number(1000)), order.orderFee - (order.deliveryFee + order.climbingFee + order.sortingFee)))}}</span></p>
|
|
|
+ <p style="border-bottom: none;">商家预计收入<span>¥{{toFixed2(moneyConverter( order.orderFee) - moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) - moneyConverter(calcPoints((order.wxPoint / 1000), order.orderFee)) - moneyConverter(calcPoints((Number(order.commissionRate) / Number(1000)), order.orderFee - (order.deliveryFee + order.climbingFee + order.sortingFee))))}}</span></p> <i class="layui-edge"></i>
|
|
|
+ </div>
|
|
|
+ <i class="el-icon-question"></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </td>
|
|
|
+ <td colspan="2" style="text-align: right;">
|
|
|
+ <b style="color: rgb(250, 85, 85);padding-right: 12px;">¥{{toFixed2(moneyConverter( order.orderFee) - moneyConverter(order.deliveryFee + order.climbingFee + order.sortingFee) - moneyConverter(calcPoints((order.wxPoint / 1000), order.orderFee)) - moneyConverter(calcPoints((Number(order.commissionRate) / Number(1000)), order.orderFee - (order.deliveryFee + order.climbingFee + order.sortingFee))))}}</b>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td></td>
|
|
|
+ <td colspan="2" style="text-align: left;padding: 10px 0;">
|
|
|
+ <p>下单时间:{{order.createDateStr}}</p>
|
|
|
+ <p>订单号:{{order.orderCode}}</p>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border" v-if="order.reason != null && order.reason.length > 0">
|
|
|
+ <td style="text-align:right;">
|
|
|
+ 退款原因:
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="min-height: 60px; height: 60px;">
|
|
|
+ <span style="display: block; text-align: left;">
|
|
|
+ {{ order.reason }}
|
|
|
+ </span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr-border">
|
|
|
+ <td></td>
|
|
|
+ <td colspan="2" style="text-align: right;padding: 10px 0;width: 100%;">
|
|
|
+ <el-button v-if="order.status == 10" @click="printOrder(order.orderId)">
|
|
|
+ 打印订单
|
|
|
+ </el-button>
|
|
|
+ <el-button v-if="order.status == 10" @click="acceptOrder(order.orderId)">
|
|
|
+ 接单
|
|
|
+ </el-button>
|
|
|
+ <el-button style="margin-right: 20px;" @click="orderPayedInfo(order.orderId)">
|
|
|
+ 查询支付状态
|
|
|
+ </el-button>
|
|
|
+ <el-button v-if="order.status == 10" style="margin-right: 20px;" @click="refuseOrder(order.orderId)">
|
|
|
+ 拒绝
|
|
|
+ </el-button>
|
|
|
+ <el-button v-if="order.status != 50 && order.status > 0 && order.status != 0 && order.status != 10" style="margin-right: 20px;" @click="allRefund(order.orderId)">
|
|
|
+ 全部退单
|
|
|
+ </el-button>
|
|
|
+ <el-button v-if="order.status == 50" style="margin-right: 20px;" @click="completeOrder(order.orderId)">
|
|
|
+ 客户已取货
|
|
|
+ </el-button>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ <el-pagination
|
|
|
+ style="margin-top: 16px; text-align: right;"
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-sizes="[10, 20, 30, 40]"
|
|
|
+ :page-size="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog title="全部退款" :visible.sync="dialogVisible" :before-close="closeDialog" width="500px">
|
|
|
+ <div style="line-height: 72px;">
|
|
|
+ <span>退款原因</span>
|
|
|
+ <el-input type="textarea" rows="3" placeholder="请输入退款原因" v-model="refundReason" style="margin-left: 15px;width: 350px;"></el-input>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="doRefund">保存</el-button>
|
|
|
+ <el-button @click="closeDialog">关闭</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog title="支付明细" :visible.sync="payedDialogVisible" :before-close="closePayedDialog" width="80%">
|
|
|
+ <div style="padding-bottom: 30px">
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <div class="crumbs">
|
|
|
+ <el-breadcrumb separator="/">
|
|
|
+ <el-breadcrumb-item style="font-size: 16px;"><i class="el-icon-lx-calendar"></i>支付信息</el-breadcrumb-item>
|
|
|
+ </el-breadcrumb>
|
|
|
+ </div>
|
|
|
+ <el-form ref="form" :model="payedInfo" label-width="120px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="通信标识：">
|
|
|
+ <span>{{payedInfo.return_code}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="业务结果： ">
|
|
|
+ <span>{{payedInfo.result_code}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="错误描述： ">
|
|
|
+ <span>{{payedInfo.err_code_des}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="交易状态：">
|
|
|
+ <span>{{payedInfo.trade_state}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="状态描述： ">
|
|
|
+ <span>{{payedInfo.trade_state_desc}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="付款银行：">
|
|
|
+ <span>{{payedInfo.bank_type}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="付款金额(分)： ">
|
|
|
+ <span>{{payedInfo.total_fee}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="交易时间：">
|
|
|
+ <span>{{payedInfo.time_end}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-button style="margin-top: 20px;" v-if="payedInfo.trade_state == 'REFUND' && refundFlg" type="primary" @click="orderRefundInfo(cOrderCode)">查询退款信息</el-button>
|
|
|
+ <div v-if="refundShow" style="margin-top:20px">
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <div class="crumbs">
|
|
|
+ <el-breadcrumb separator="/">
|
|
|
+ <el-breadcrumb-item style="font-size: 16px;"><i class="el-icon-lx-calendar"></i>退款信息</el-breadcrumb-item>
|
|
|
+ </el-breadcrumb>
|
|
|
+ </div>
|
|
|
+ <el-form ref="form" :model="refundInfo" label-width="120px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="订单金额(分)：">
|
|
|
+ <span>{{refundInfo.total_fee}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="总退货额(分)： ">
|
|
|
+ <span>{{refundInfo.refund_fee}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <dptable :columns="columns3" :dataSource="refundList" :options="options3"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import dptable from '@/components/common/Dptable.vue'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ dptable
|
|
|
+ },
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ tabIndex: "all",
|
|
|
+ storeList: [],
|
|
|
+ url: '/thirdOrderManage/orderPage',
|
|
|
+ numUrl: '/thirdOrderManage/getReceivedAndRefundOrderNum',
|
|
|
+ detailUrl: '/thirdOrderManage/getOrderDetails',
|
|
|
+ refundUrl: '/thirdOrderManage/orderRefund',
|
|
|
+ acceptUrl: '/thirdOrderManage/acceptOrder',
|
|
|
+ printUrl: '/thirdOrderManage/printOrder',
|
|
|
+ refuseUrl: '/thirdOrderManage/refuseOrder',
|
|
|
+ completeUrl: '/thirdOrderManage/completeOrder',
|
|
|
+ storeUrl: '/thirdStoreManage/getStoreList',
|
|
|
+ payedInfoUrl: '/thirdOrderManage/getOrderPayedInfo',
|
|
|
+ refundInfoUrl: '/thirdOrderManage/getOrderRefundInfo',
|
|
|
+ storeId: '',
|
|
|
+ dateArray: [],
|
|
|
+ orderName: '',
|
|
|
+ orderTel: '',
|
|
|
+ dialogVisible: false,
|
|
|
+ receivedNum: 0,
|
|
|
+ refundNum: 0,
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 0,
|
|
|
+ tableData: [],
|
|
|
+ createDateS: null,
|
|
|
+ createDateE: null,
|
|
|
+ refundOrderId: null,
|
|
|
+ refundReason: null,
|
|
|
+ storeInfo: null,
|
|
|
+ payedDialogVisible: false,
|
|
|
+ payedInfo: {
|
|
|
+ return_code: '',
|
|
|
+ result_code: '',
|
|
|
+ err_code_des: '',
|
|
|
+ trade_state: '',
|
|
|
+ trade_state_desc: '',
|
|
|
+ bank_type: '',
|
|
|
+ total_fee: '',
|
|
|
+ time_end: ''
|
|
|
+ },
|
|
|
+ cOrderCode: '',
|
|
|
+ refundFlg: true,
|
|
|
+ refundShow: false,
|
|
|
+ refundInfo: {
|
|
|
+ total_fee: '',
|
|
|
+ refund_fee: ''
|
|
|
+ },
|
|
|
+ refundList: [],
|
|
|
+ columns3: [
|
|
|
+ {
|
|
|
+ prop: 'refund_fee', label: '申请退款金额(分)', width: 200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'refund_status', label: '退款状态', width: 200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'refund_channel', label: '退款渠道', width: 250
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'refund_recv_accout', label: '退款入账账户', width: 250
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'refund_success_time', label: '退款成功时间',
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ options3: {
|
|
|
+ index: false, // 显示序号， 多选则 mutiSelect
|
|
|
+ initTable: false, // 是否一挂载就加载数据
|
|
|
+ border:true
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.storeInfo = JSON.parse(localStorage.getItem("storeInfo"));
|
|
|
+ const date = new Date();
|
|
|
+ this.createDateS = this.$moment(date).format("YYYY-MM-DD");
|
|
|
+ this.createDateE = this.$moment(date).format("YYYY-MM-DD");
|
|
|
+ this.getStoreList();
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ closeDialog() {
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.refundReason = null;
|
|
|
+ },
|
|
|
+ expand(index) {
|
|
|
+ let order = this.tableData[index]
|
|
|
+ if (!order.isExpand) {
|
|
|
+ if (!!order.detailList && order.detailList.length > 0) {
|
|
|
+ this.$set(order, 'buttonText', '收起')
|
|
|
+ this.$set(order, 'isExpand', true)
|
|
|
+ } else {
|
|
|
+ // 获取详情数据
|
|
|
+ const querystring = require('querystring');
|
|
|
+ this.$axios.post(this.detailUrl, querystring.stringify({orderId: order.orderId})).then(res => {
|
|
|
+ if (res.data.rtnBean.rtnCode == 0) {
|
|
|
+ this.$set(order, 'detailList', res.data.list);
|
|
|
+ this.$set(order, 'buttonText', '收起')
|
|
|
+ this.$set(order, 'isExpand', true)
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ console.log(error);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (order.isExpand) {
|
|
|
+ this.$set(order, 'buttonText', '展开')
|
|
|
+ this.$set(order, 'isExpand', false)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ allRefund(id) {
|
|
|
+ this.refundOrderId = id;
|
|
|
+ this.dialogVisible = true;
|
|
|
+ },
|
|
|
+ doRefund() {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$confirm('确认退单并退款给用户?', '询问', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$axios.post(this.refundUrl, querystring.stringify({
|
|
|
+ orderId: this.refundOrderId, reason: this.refundReason
|
|
|
+ })).then(res => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '退款成功!'
|
|
|
+ });
|
|
|
+ this.dialogVisible = false;
|
|
|
+ this.getDataList();
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ toFixed2(money) {
|
|
|
+ return Math.round(money * 100) / 100
|
|
|
+ },
|
|
|
+ getDataList() {
|
|
|
+ var dateS;
|
|
|
+ var dateE;
|
|
|
+ if (this.createDateS != "" && this.createDateS != null) {
|
|
|
+ dateS = this.$moment(this.createDateS).format("YYYY/MM/DD");
|
|
|
+ }
|
|
|
+ if (this.createDateE != "" && this.createDateE != null) {
|
|
|
+ dateE = this.$moment(this.createDateE).format("YYYY/MM/DD");
|
|
|
+ }
|
|
|
+ // 开始时间不能大于结束时间
|
|
|
+ if(dateS !='' && dateS != null && dateE != '' && dateE != null){
|
|
|
+ if(dateS > dateE){
|
|
|
+ this.$message.error("开始时间不能大于结束时间，请更换查询条件重新再试");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const querystring = require("querystring");
|
|
|
+ let obj = {
|
|
|
+ storeId: this.storeInfo.storeId,
|
|
|
+ beginDate: dateS,
|
|
|
+ endDate: dateE,
|
|
|
+ orderName: this.orderName,
|
|
|
+ orderTel: this.orderTel,
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ currentPage: this.currentPage
|
|
|
+ }
|
|
|
+ if (this.tabIndex != "all") {
|
|
|
+ obj.status = this.tabIndex
|
|
|
+ }
|
|
|
+ this.$axios.post(this.url, querystring.stringify(obj)).then(res => {
|
|
|
+ if (res.data.list.length == 0) {
|
|
|
+ this.$message("数据不存在，请更换查询条件重新再试");
|
|
|
+ }
|
|
|
+ this.tableData = res.data.list;
|
|
|
+ this.receivedNum = res.data.obj.receivedNum;
|
|
|
+ this.refundNum = res.data.obj.refundNum;
|
|
|
+ this.total = res.data.page.resultCount;
|
|
|
+ this.currentPage = res.data.page.currentPage;
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getStoreList() {
|
|
|
+ this.$axios.post(this.storeUrl, {}).then(res => {
|
|
|
+ this.storeList = res.data.list;
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ typeFormatter(type) {
|
|
|
+ let str = (type == 1 || type == 2) ? '配送订单' : '自提订单'
|
|
|
+ return str;
|
|
|
+ },
|
|
|
+ statusFormatter(status) {
|
|
|
+ if (status == 0 || status == -1 || status == 5 || status == 10 || status == -10 || status == -30 || status == -40) {
|
|
|
+ return "未生效订单"
|
|
|
+ } else if (status == 20 || status == 30 || status == 40 || status == 50 || status == 60) {
|
|
|
+ return "已生效订单"
|
|
|
+ } else if (status == -20 || status == -50) {
|
|
|
+ return "退款订单"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deliveryTypeFormatter(type) {
|
|
|
+ if (type == 1) {
|
|
|
+ return '楼下自提'
|
|
|
+ } else if (type == 2) {
|
|
|
+ return '直达宿舍'
|
|
|
+ } else if (type == 3) {
|
|
|
+ return '自提外带'
|
|
|
+ } else if (type == 4) {
|
|
|
+ return '自提堂食'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dateChange() {
|
|
|
+ if (null != this.dateArray && this.dateArray.length > 0) {
|
|
|
+ this.createDateS = this.dateArray[0];
|
|
|
+ this.createDateE = this.dateArray[1];
|
|
|
+ } else {
|
|
|
+ this.createDateS = null;
|
|
|
+ this.createDateE = null;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ printOrder(orderId) {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$axios.post(this.printUrl, querystring.stringify({
|
|
|
+ orderId: orderId
|
|
|
+ })).then(res => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '已成功发起打印!'
|
|
|
+ });
|
|
|
+ this.getDataList();
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ },
|
|
|
+ acceptOrder(orderId) {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$axios.post(this.acceptUrl, querystring.stringify({
|
|
|
+ orderId: orderId
|
|
|
+ })).then(res => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '接单成功'
|
|
|
+ });
|
|
|
+ this.getDataList();
|
|
|
+ }).catch(error => {
|
|
|
+ })
|
|
|
+ },
|
|
|
+ refuseOrder(orderId) {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$confirm('确认拒绝接单并退款给用户?', '询问', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$axios.post(this.refuseUrl, querystring.stringify({
|
|
|
+ orderId: orderId
|
|
|
+ })).then(res => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '拒绝成功!'
|
|
|
+ });
|
|
|
+ this.getDataList();
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ completeOrder(orderId) {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$confirm('确认客户已取货?', '询问', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$axios.post(this.completeUrl, querystring.stringify({
|
|
|
+ orderId: orderId
|
|
|
+ })).then(res => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '操作成功!'
|
|
|
+ });
|
|
|
+ this.getDataList();
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSizeChange(size) { // 切换每页显示的数量
|
|
|
+ this.pageSize = size;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ handleCurrentChange(current) { // 切换页码
|
|
|
+ this.currentPage = current;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ calcPoints(rate, orderFee) {
|
|
|
+ return (Number(orderFee) * Number(rate));
|
|
|
+ },
|
|
|
+ orderPayedInfo(orderId) {
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$axios.post(this.payedInfoUrl, querystring.stringify({
|
|
|
+ orderId: orderId
|
|
|
+ })).then(res => {
|
|
|
+ this.cOrderCode = orderId;
|
|
|
+ this.payedDialogVisible = true;
|
|
|
+ if (res.data.rtnBean.rtnCode == 0) {
|
|
|
+ this.payedInfo = res.data.obj
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ },
|
|
|
+ closePayedDialog() {
|
|
|
+ this.payedDialogVisible = false;
|
|
|
+ this.refundFlg = true;
|
|
|
+ this.refundShow = false;
|
|
|
+ },
|
|
|
+ orderRefundInfo(orderCode) {
|
|
|
+ this.refundFlg = false;
|
|
|
+ this.refundShow = true;
|
|
|
+ const querystring = require("querystring");
|
|
|
+ this.$axios.post(this.refundInfoUrl, querystring.stringify({
|
|
|
+ orderCode: orderCode
|
|
|
+ })).then(res => {
|
|
|
+ if (res.data.rtnBean.rtnCode == 0) {
|
|
|
+ this.refundInfo = res.data.obj;
|
|
|
+ this.refundList = res.data.obj.refundList;
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.page-wrap{
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.crumbs{
|
|
|
+ color: #666;
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+.background{
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 10px;
|
|
|
+ padding: 0 10px 10px;
|
|
|
+}
|
|
|
+.topbox{
|
|
|
+ background: white;
|
|
|
+ box-shadow: 0 12px 20px -8px rgba(22, 50, 62, 0.3);
|
|
|
+ border-radius: 10px;
|
|
|
+ min-height: 52px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 10px 16px;
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+.topbox-left{ flex-shrink: 0; }
|
|
|
+.page-title{
|
|
|
+ font-size: 14px;
|
|
|
+ color: #409EFF;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+.searchbox{
|
|
|
+ background: white;
|
|
|
+ box-shadow: 0 12px 20px -8px rgba(22, 50, 62, 0.3);
|
|
|
+ border-radius: 10px;
|
|
|
+ padding: 12px 16px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 10px;
|
|
|
+ flex-shrink: 0;
|
|
|
+ font-size: 13px;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+.searchbox-multi{
|
|
|
+ flex-wrap: wrap;
|
|
|
+ max-height: 160px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+.searchbox > span{ flex: 1; }
|
|
|
+.filter-group{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 6px;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.filter-group > span{
|
|
|
+ white-space: nowrap;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+.filter-full{
|
|
|
+ flex-basis: 100%;
|
|
|
+}
|
|
|
+.tablebox{
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
+ background: white;
|
|
|
+ box-shadow: 0 12px 20px -8px rgba(22, 50, 62, 0.3);
|
|
|
+ border-radius: 10px;
|
|
|
+ padding: 16px;
|
|
|
+ overflow: hidden;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.order-table {
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
+ overflow: auto;
|
|
|
+ border: 1px solid #e6e6e6;
|
|
|
+ border-radius: 6px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-size: 13px;
|
|
|
+}
|
|
|
+.order-info {
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+.trhead {
|
|
|
+ background: #f2f2f2;
|
|
|
+ width: 100%;
|
|
|
+ height: 36px;
|
|
|
+}
|
|
|
+.tr-border {
|
|
|
+ border-bottom: 1px solid #E6E6E6;
|
|
|
+}
|
|
|
+.first-td {
|
|
|
+ width: 50px;
|
|
|
+ padding: 10px 17px;
|
|
|
+}
|
|
|
+table {
|
|
|
+ font-size: 13px;
|
|
|
+}
|
|
|
+.high-light-number{
|
|
|
+ float: right;
|
|
|
+ margin-left: 5px;
|
|
|
+ background: #FF5722;
|
|
|
+ color: #fff;
|
|
|
+ padding: 1px 4px;
|
|
|
+ border-radius: 2px;
|
|
|
+ margin-top: -1px;
|
|
|
+}
|
|
|
+.time-separator{
|
|
|
+ margin: 0 2px;
|
|
|
+ color: #909399;
|
|
|
+}
|
|
|
+</style>
|
