edit
This commit is contained in:
gboy
parent
7c08c2885e
commit
6fa7a266c4
|
|
@ -0,0 +1,19 @@
|
||||||
|
# just a flag
|
||||||
|
ENV = 'development'
|
||||||
|
|
||||||
|
# base api
|
||||||
|
# VUE_APP_BASE_API = 'http://192.168.31.106:8324'
|
||||||
|
VUE_APP_BASE_API = 'http://many.shop.lo'
|
||||||
|
|
||||||
|
# socket 连接地址
|
||||||
|
VUE_APP_WS_URL = 'ws://many.shop.lo'
|
||||||
|
# VUE_APP_WS_URL = 'ws://mer1.crmeb.net'
|
||||||
|
|
||||||
|
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
|
||||||
|
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
|
||||||
|
# It only does one thing by converting all import() to require().
|
||||||
|
# This configuration can significantly increase the speed of hot updates,
|
||||||
|
# when you have a large number of pages.
|
||||||
|
# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
|
||||||
|
|
||||||
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|
@ -5,7 +5,6 @@ npm-debug.log*
|
||||||
yarn-debug.log*
|
yarn-debug.log*
|
||||||
yarn-error.log*
|
yarn-error.log*
|
||||||
**/*.log
|
**/*.log
|
||||||
.env.development
|
|
||||||
tests/**/coverage/
|
tests/**/coverage/
|
||||||
tests/e2e/reports
|
tests/e2e/reports
|
||||||
selenium-debug.log
|
selenium-debug.log
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
# just a flag
|
||||||
|
ENV = 'development'
|
||||||
|
|
||||||
|
# base api
|
||||||
|
# VUE_APP_BASE_API = 'http://192.168.31.106:8324'
|
||||||
|
VUE_APP_BASE_API = 'https://mer1.crmeb.net'
|
||||||
|
|
||||||
|
# socket 连接地址
|
||||||
|
VUE_APP_WS_URL = 'ws://192.168.31.106:8324'
|
||||||
|
# VUE_APP_WS_URL = 'ws://mer1.crmeb.net'
|
||||||
|
|
||||||
|
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
|
||||||
|
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
|
||||||
|
# It only does one thing by converting all import() to require().
|
||||||
|
# This configuration can significantly increase the speed of hot updates,
|
||||||
|
# when you have a large number of pages.
|
||||||
|
# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
|
||||||
|
|
||||||
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
# just a flag
|
||||||
|
ENV = 'development'
|
||||||
|
|
||||||
|
# base api
|
||||||
|
# VUE_APP_BASE_API = 'http://192.168.31.106:8324'
|
||||||
|
VUE_APP_BASE_API = 'http://many.shop.lo'
|
||||||
|
|
||||||
|
# socket 连接地址
|
||||||
|
VUE_APP_WS_URL = 'ws://many.shop.lo'
|
||||||
|
# VUE_APP_WS_URL = 'ws://mer1.crmeb.net'
|
||||||
|
|
||||||
|
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
|
||||||
|
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
|
||||||
|
# It only does one thing by converting all import() to require().
|
||||||
|
# This configuration can significantly increase the speed of hot updates,
|
||||||
|
# when you have a large number of pages.
|
||||||
|
# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
|
||||||
|
|
||||||
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
.DS_Store
|
||||||
|
node_modules/
|
||||||
|
dist/
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
**/*.log
|
||||||
|
.env.development
|
||||||
|
tests/**/coverage/
|
||||||
|
tests/e2e/reports
|
||||||
|
selenium-debug.log
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.local
|
||||||
|
|
||||||
|
package-lock.json
|
||||||
|
yarn.lock
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
.DS_Store
|
||||||
|
node_modules/
|
||||||
|
dist/
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
**/*.log
|
||||||
|
tests/**/coverage/
|
||||||
|
tests/e2e/reports
|
||||||
|
selenium-debug.log
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.local
|
||||||
|
|
||||||
|
package-lock.json
|
||||||
|
yarn.lock
|
||||||
|
|
@ -0,0 +1,65 @@
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import Mock from 'mockjs'
|
||||||
|
import { param2Obj } from '../src/utils'
|
||||||
|
import user from './user'
|
||||||
|
import role from './role'
|
||||||
|
import article from './article'
|
||||||
|
import search from './remote-search'
|
||||||
|
|
||||||
|
const mocks = [
|
||||||
|
...user,
|
||||||
|
...role,
|
||||||
|
...article,
|
||||||
|
...search
|
||||||
|
]
|
||||||
|
|
||||||
|
// for front mock
|
||||||
|
// please use it cautiously, it will redefine XMLHttpRequest,
|
||||||
|
// which will cause many of your third-party libraries to be invalidated(like progress event).
|
||||||
|
export function mockXHR() {
|
||||||
|
// mock patch
|
||||||
|
// https://github.com/nuysoft/Mock/issues/300
|
||||||
|
Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send
|
||||||
|
Mock.XHR.prototype.send = function() {
|
||||||
|
if (this.custom.xhr) {
|
||||||
|
this.custom.xhr.withCredentials = this.withCredentials || false
|
||||||
|
|
||||||
|
if (this.responseType) {
|
||||||
|
this.custom.xhr.responseType = this.responseType
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.proxy_send(...arguments)
|
||||||
|
}
|
||||||
|
|
||||||
|
function XHR2ExpressReqWrap(respond) {
|
||||||
|
return function(options) {
|
||||||
|
let result = null
|
||||||
|
if (respond instanceof Function) {
|
||||||
|
const { body, type, url } = options
|
||||||
|
// https://expressjs.com/en/4x/api.html#req
|
||||||
|
result = respond({
|
||||||
|
method: type,
|
||||||
|
body: JSON.parse(body),
|
||||||
|
query: param2Obj(url)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
result = respond
|
||||||
|
}
|
||||||
|
return Mock.mock(result)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const i of mocks) {
|
||||||
|
Mock.mock(new RegExp(i.url), i.type || 'get', XHR2ExpressReqWrap(i.response))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default mocks
|
||||||
|
|
@ -0,0 +1,65 @@
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import Mock from 'mockjs'
|
||||||
|
import { param2Obj } from '../src/utils'
|
||||||
|
import user from './user'
|
||||||
|
import role from './role'
|
||||||
|
import article from './article'
|
||||||
|
import search from './remote-search'
|
||||||
|
|
||||||
|
const mocks = [
|
||||||
|
...user,
|
||||||
|
...role,
|
||||||
|
...article,
|
||||||
|
...search
|
||||||
|
]
|
||||||
|
|
||||||
|
// for front mock
|
||||||
|
// please use it cautiously, it will redefine XMLHttpRequest,
|
||||||
|
// which will cause many of your third-party libraries to be invalidated(like progress event).
|
||||||
|
export function mockXHR() {
|
||||||
|
// mock patch
|
||||||
|
// https://github.com/nuysoft/Mock/issues/300
|
||||||
|
Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send
|
||||||
|
Mock.XHR.prototype.send = function() {
|
||||||
|
if (this.custom.xhr) {
|
||||||
|
this.custom.xhr.withCredentials = this.withCredentials || false
|
||||||
|
|
||||||
|
if (this.responseType) {
|
||||||
|
this.custom.xhr.responseType = this.responseType
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.proxy_send(...arguments)
|
||||||
|
}
|
||||||
|
|
||||||
|
function XHR2ExpressReqWrap(respond) {
|
||||||
|
return function(options) {
|
||||||
|
let result = null
|
||||||
|
if (respond instanceof Function) {
|
||||||
|
const { body, type, url } = options
|
||||||
|
// https://expressjs.com/en/4x/api.html#req
|
||||||
|
result = respond({
|
||||||
|
method: type,
|
||||||
|
body: JSON.parse(body),
|
||||||
|
query: param2Obj(url)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
result = respond
|
||||||
|
}
|
||||||
|
return Mock.mock(result)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const i of mocks) {
|
||||||
|
Mock.mock(new RegExp(i.url), i.type || 'get', XHR2ExpressReqWrap(i.response))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default mocks
|
||||||
|
|
@ -0,0 +1,670 @@
|
||||||
|
<template>
|
||||||
|
<div class="divBox">
|
||||||
|
<div class="selCard ">
|
||||||
|
<div class="container">
|
||||||
|
<el-form :model="tableFrom" ref="searchForm" size="small" label-width="85px" inline>
|
||||||
|
<el-form-item label="订单状态：" style="display: block;" prop="status">
|
||||||
|
<el-radio-group v-model="tableFrom.status" type="button" @change="getList(1)">
|
||||||
|
<el-radio-button label>全部 {{ '(' +orderChartType.all?orderChartType.all:0 + ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="0"
|
||||||
|
>待审核 {{ '(' +orderChartType.audit?orderChartType.audit:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="-1"
|
||||||
|
>审核未通过 {{ '(' +orderChartType.refuse?orderChartType.refuse:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="1"
|
||||||
|
>审核通过 {{ '(' +orderChartType.agree?orderChartType.agree:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="2"
|
||||||
|
>待收货 {{ '(' +orderChartType.backgood?orderChartType.backgood:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="3"
|
||||||
|
>已完成 {{ '(' +orderChartType.end?orderChartType.end:0+ ')' }}</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间选择：">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="timeVal"
|
||||||
|
value-format="yyyy/MM/dd"
|
||||||
|
format="yyyy/MM/dd"
|
||||||
|
size="small"
|
||||||
|
type="daterange"
|
||||||
|
placement="bottom-end"
|
||||||
|
placeholder="自定义时间"
|
||||||
|
style="width: 280px;"
|
||||||
|
:picker-options="pickerOptions"
|
||||||
|
@change="onchangeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款单号：" prop="refund_order_sn">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.refund_order_sn"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入订单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款类型：" prop="refund_type">
|
||||||
|
<el-select
|
||||||
|
v-model="tableFrom.refund_type"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
clearable
|
||||||
|
@change="getList(1)"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in refundTypeList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="发起方：" prop="user_type">
|
||||||
|
<el-select
|
||||||
|
v-model="tableFrom.user_type"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
clearable
|
||||||
|
@change="getList(1)"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in refundUserList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="订单单号：" prop="order_sn">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.order_sn"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入订单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="关键字：" prop="username">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.username"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入用户昵称、退货人姓名、手机号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退货单号：" prop="delivery_id">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.delivery_id"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入退货快递单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" size="small" @click="getList(1)">搜索</el-button>
|
||||||
|
<el-button size="small" @click="searchReset()">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-card class="mt14">
|
||||||
|
<el-button size="small" type="primary" @click.native="exports">导出退款单</el-button>
|
||||||
|
<el-table
|
||||||
|
v-loading="listLoading"
|
||||||
|
:data="tableData.data"
|
||||||
|
size="small"
|
||||||
|
class="table mt20"
|
||||||
|
highlight-current-row
|
||||||
|
>
|
||||||
|
<el-table-column type="expand">
|
||||||
|
<template slot-scope="props">
|
||||||
|
<el-form label-position="left" inline class="demo-table-expand demo-table-expands">
|
||||||
|
<el-form-item label="订单号：">
|
||||||
|
<span>{{ props.row.order.order_sn }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款商品总价：">
|
||||||
|
<span v-if="props.row.order.activity === 2">{{ getPresellTotal(props.row.refundProduct) }}</span>
|
||||||
|
<span v-else-if="props.row.order.activity === 3">{{ getAssistTotal(props.row.refundProduct) }}</span>
|
||||||
|
<span v-else>{{ getTotal(props.row.refundProduct) }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款商品总数：">
|
||||||
|
<span>{{ props.row.refund_num }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="申请退款时间：">
|
||||||
|
<span>{{ props.row.create_time | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="用户备注：">
|
||||||
|
<span>{{ props.row.mark | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商家备注：">
|
||||||
|
<span>{{ props.row.mer_mark | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="props.row.status === 2" label="快递公司：">
|
||||||
|
<span>{{ props.row.delivery_type | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="props.row.status === 2" label="快递单号：">
|
||||||
|
<span class="mr5">{{ props.row.delivery_id | filterEmpty }}</span>
|
||||||
|
<el-button type="text" @click="openLogistics(props.row)">物流查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="退款单号" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="display: block;" v-text="scope.row.refund_order_sn" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="user.nickname" label="用户信息" min-width="100" />
|
||||||
|
<el-table-column prop="refund_price" label="退款金额" min-width="80" />
|
||||||
|
<el-table-column prop="nickname" label="商品信息" min-width="260">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div
|
||||||
|
v-for="(val, i ) in scope.row.refundProduct"
|
||||||
|
:key="i"
|
||||||
|
class="tabBox acea-row row-middle"
|
||||||
|
>
|
||||||
|
<div class="demo-image__preview">
|
||||||
|
<el-image
|
||||||
|
:src="val.product && val.product.cart_info.product.image"
|
||||||
|
:preview-src-list="[val.product && val.product.cart_info.product.image]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span
|
||||||
|
class="tabBox_tit"
|
||||||
|
>{{ val.product && val.product.cart_info.product.store_name + ' | ' }}{{ val.product && val.product.cart_info.productAttr.sku }}</span>
|
||||||
|
<span
|
||||||
|
v-if="scope.row.order && scope.row.order.activity_type === 2 && val.product && val.product.cart_info.productPresellAttr"
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productPresellAttr.presell_price + ' x '+ val.refund_num }}</span>
|
||||||
|
<span
|
||||||
|
v-else-if="scope.row.order && scope.row.order.activity_type === 3 && val.product && val.product.cart_info.productAssistAttr.assist_price"
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productAssistAttr.assist_price + ' x '+ val.refund_num }}</span>
|
||||||
|
<span
|
||||||
|
v-else
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productAttr.price + ' x '+ val.refund_num }}</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="退款类型" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.refund_type == 1 ? '退款' : '退货退款' }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="order.real_name" label="退货人" min-width="90" />
|
||||||
|
<el-table-column prop="create_user" label="退款发起方" min-width="90" />
|
||||||
|
<el-table-column label="订单状态" min-width="90">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="scope.row.order.is_del === 0">
|
||||||
|
<span v-if="scope.row.order.paid === 0">待付款</span>
|
||||||
|
<span v-else>
|
||||||
|
<span v-if="scope.row.order.order_type === 0 || scope.row.order.order_type === 2">{{ scope.row.order.status | orderStatusFilter }}</span>
|
||||||
|
<span v-else>{{ scope.row.order.status | takeOrderStatusFilter }}</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
<span v-else>已删除</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="serviceScore" label="退款单状态" min-width="150">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="display: block">{{ scope.row.status | orderRefundFilter }}</span>
|
||||||
|
<span v-if="scope.row.status == -1" style="display: block">拒绝原因：{{ scope.row.fail_message }}</span>
|
||||||
|
<span style="display: block">退款原因：{{ scope.row.refund_message }}</span>
|
||||||
|
<span style="display: block">状态变更时间：{{ scope.row.status_time }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" min-width="150" fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button type="text" size="small" @click="onOrderDetail(scope.row.order.order_sn)">订单详情</el-button>
|
||||||
|
<el-button type="text" size="small" @click="onRefundOrderDetail(scope.row.refund_order_id)">退款单详情</el-button>
|
||||||
|
<el-button v-if="scope.row.status === 0" type="text" size="small" @click="onOrderStatus(scope.row.refund_order_id)">退款</el-button>
|
||||||
|
<!-- <el-button type="text" size="small" @click="onOrderLog(scope.row.refund_order_id)">订单记录</el-button> -->
|
||||||
|
<el-button type="text" size="small" @click="onOrderMark(scope.row.refund_order_id)">订单备注</el-button>
|
||||||
|
<el-button v-if="scope.row.status === 2" type="text" size="small" @click="confirmReceipt(scope.row)">确认收货</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="total, prev, pager, next, jumper"
|
||||||
|
:total="tableData.total"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="pageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!--记录-->
|
||||||
|
<el-dialog title="操作记录" :visible.sync="dialogVisible" width="700px">
|
||||||
|
<el-table v-loading="LogLoading" border :data="tableDataLog.data" style="width: 100%">
|
||||||
|
<el-table-column prop="refund_order_id" align="center" label="退款单ID" min-width="80" />
|
||||||
|
<el-table-column prop="change_message" label="操作记录" align="center" min-width="280" />
|
||||||
|
<el-table-column prop="change_time" label="操作时间" align="center" min-width="280" />
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
:page-size="tableFromLog.limit"
|
||||||
|
:current-page="tableFromLog.page"
|
||||||
|
layout="prev, pager, next, jumper"
|
||||||
|
:total="tableDataLog.total"
|
||||||
|
@size-change="handleSizeChangeLog"
|
||||||
|
@current-change="pageChangeLog"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<!--详情-->
|
||||||
|
<details-from ref="orderDetail" :order-datalist="orderDatalist" @get-logistics="openLogistics" />
|
||||||
|
<el-dialog
|
||||||
|
v-if="dialogLogistics"
|
||||||
|
title="物流查询"
|
||||||
|
:visible.sync="dialogLogistics"
|
||||||
|
width="350px"
|
||||||
|
:before-close="handleClose"
|
||||||
|
>
|
||||||
|
<logistics-from
|
||||||
|
v-if="orderDetails"
|
||||||
|
:order-datalist="orderDetails"
|
||||||
|
:result="result"
|
||||||
|
:logistics-name="logisticsName"
|
||||||
|
/>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import {
|
||||||
|
refundorderStatusApi,
|
||||||
|
refundorderListApi,
|
||||||
|
orderUpdateApi,
|
||||||
|
orderDeliveryApi,
|
||||||
|
refundorderLogApi,
|
||||||
|
refundorderDeleteApi,
|
||||||
|
refundorderMarkApi,
|
||||||
|
refundorderDetailApi,
|
||||||
|
refundorderExpressApi,
|
||||||
|
confirmReceiptApi,
|
||||||
|
refundListImportApi
|
||||||
|
} from '@/api/order'
|
||||||
|
import detailsFrom from './refundDetail'
|
||||||
|
import logisticsFrom from '../logistics'
|
||||||
|
import { roterPre } from '@/settings'
|
||||||
|
import createWorkBook from '@/utils/newToExcel.js'
|
||||||
|
import timeOptions from '@/utils/timeOptions';
|
||||||
|
export default {
|
||||||
|
name: 'OrderRefund',
|
||||||
|
components: { detailsFrom, logisticsFrom },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pickerOptions: timeOptions,
|
||||||
|
logisticsName: 'refund',
|
||||||
|
dialogLogistics: false,
|
||||||
|
orderId: 0,
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
refundTypeList: [
|
||||||
|
{ value: 1, label: '退款' },
|
||||||
|
{ value: 2, label: '退款退货' }
|
||||||
|
],
|
||||||
|
refundUserList: [
|
||||||
|
{ value: 1, label: '用户' },
|
||||||
|
{ value: 3, label: '商户' },
|
||||||
|
{ value: 4, label: '客服' }
|
||||||
|
],
|
||||||
|
listLoading: true,
|
||||||
|
roterPre: roterPre,
|
||||||
|
tableFrom: {
|
||||||
|
delivery_id: '',
|
||||||
|
refund_type: '',
|
||||||
|
user_type: '',
|
||||||
|
status: '',
|
||||||
|
date: '',
|
||||||
|
username: '',
|
||||||
|
page: 1,
|
||||||
|
limit: 20,
|
||||||
|
order_sn: this.$route.query.sn ? this.$route.query.sn : '',
|
||||||
|
refund_order_sn: this.$route.query.refund_order_sn ? this.$route.query.refund_order_sn : '',
|
||||||
|
id: this.$route.query.id ? this.$route.query.id : ''
|
||||||
|
},
|
||||||
|
orderChartType: {},
|
||||||
|
timeVal: [],
|
||||||
|
fromList: {
|
||||||
|
title: '选择时间',
|
||||||
|
custom: true,
|
||||||
|
fromTxt: [
|
||||||
|
{ text: '全部', val: '' },
|
||||||
|
{ text: '今天', val: 'today' },
|
||||||
|
{ text: '昨天', val: 'yesterday' },
|
||||||
|
{ text: '最近7天', val: 'lately7' },
|
||||||
|
{ text: '最近30天', val: 'lately30' },
|
||||||
|
{ text: '本月', val: 'month' },
|
||||||
|
{ text: '本年', val: 'year' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
selectionList: [],
|
||||||
|
tableFromLog: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10
|
||||||
|
},
|
||||||
|
tableDataLog: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
LogLoading: false,
|
||||||
|
dialogVisible: false,
|
||||||
|
orderDatalist: null,
|
||||||
|
orderDetails: {},
|
||||||
|
result: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.$route.query.hasOwnProperty('sn')) {
|
||||||
|
this.tableFrom.order_sn = this.$route.query.sn
|
||||||
|
} else {
|
||||||
|
this.tableFrom.order_sn = ''
|
||||||
|
}
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 被缓存接收参数
|
||||||
|
activated() {
|
||||||
|
if (this.$route.query.hasOwnProperty('sn')) {
|
||||||
|
this.tableFrom.order_sn = this.$route.query.sn
|
||||||
|
} else {
|
||||||
|
this.tableFrom.order_sn = ''
|
||||||
|
}
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/**重置 */
|
||||||
|
searchReset(){
|
||||||
|
this.timeVal = []
|
||||||
|
this.tableFrom.date = ""
|
||||||
|
this.$refs.searchForm.resetFields()
|
||||||
|
this.tableFrom.order_sn = ""
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 回
|
||||||
|
// 订单详情
|
||||||
|
onOrderDetail(order_sn) {
|
||||||
|
this.$router.push({
|
||||||
|
path: this.roterPre + "/order/list",
|
||||||
|
query: {
|
||||||
|
order_sn: order_sn
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 退款
|
||||||
|
onOrderStatus(id) {
|
||||||
|
this.$modalForm(refundorderStatusApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 确认收货
|
||||||
|
confirmReceipt(row) {
|
||||||
|
const that = this
|
||||||
|
const h = this.$createElement
|
||||||
|
this.$msgbox({
|
||||||
|
title: '是否确认收货？',
|
||||||
|
message: h('div', null, [
|
||||||
|
h('p', null, '退货物流公司：' + row.delivery_type),
|
||||||
|
h('p', null, '退货快递单号：' + row.delivery_id)
|
||||||
|
]),
|
||||||
|
showCancelButton: true,
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
beforeClose: (action, instance, done) => {
|
||||||
|
if (action === 'confirm') {
|
||||||
|
confirmReceiptApi(row.refund_order_id)
|
||||||
|
.then(res => {
|
||||||
|
that.$message.success(res.message)
|
||||||
|
done()
|
||||||
|
that.getList('')
|
||||||
|
})
|
||||||
|
.catch(({ res }) => {
|
||||||
|
that.$message.error(res.message)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
done()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).then(action => {}).catch(e => e)// 注意这里，这里是重点！！！;
|
||||||
|
},
|
||||||
|
/**导出退款单 */
|
||||||
|
async exports() {
|
||||||
|
let excelData = JSON.parse(JSON.stringify(this.tableFrom)), data = []
|
||||||
|
excelData.page = 1
|
||||||
|
let pageCount = 1
|
||||||
|
let lebData = {};
|
||||||
|
for (let i = 0; i < pageCount; i++) {
|
||||||
|
lebData = await this.downData(excelData)
|
||||||
|
pageCount = Math.ceil(lebData.count/excelData.limit)
|
||||||
|
if (lebData.export.length) {
|
||||||
|
data = data.concat(lebData.export)
|
||||||
|
excelData.page++
|
||||||
|
}
|
||||||
|
}
|
||||||
|
createWorkBook(lebData.header, lebData.title, data, lebData.foot,lebData.filename);
|
||||||
|
return
|
||||||
|
},
|
||||||
|
/**资金流水 */
|
||||||
|
downData(excelData) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
refundListImportApi(excelData).then((res) => {
|
||||||
|
return resolve(res.data)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getExportFileList() {
|
||||||
|
refundListImportApi()
|
||||||
|
.then((res) => {
|
||||||
|
const h = this.$createElement
|
||||||
|
this.$msgbox({
|
||||||
|
title: '提示',
|
||||||
|
message: h('p', null, [
|
||||||
|
h('span', null, '文件正在生成中，请稍后点击"'),
|
||||||
|
h('span', { style: 'color: teal' }, '导出记录'),
|
||||||
|
h('span', null, '"查看~ ')
|
||||||
|
]),
|
||||||
|
confirmButtonText: '我知道了'
|
||||||
|
}).then(action => {
|
||||||
|
this.$router.push({ path: this.roterPre + '/export/list' })
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productAttr.price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 预售商品退款金额
|
||||||
|
getPresellTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productPresellAttr.presell_price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 助力商品退款金额
|
||||||
|
getAssistTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productAssistAttr.assist_price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 详情
|
||||||
|
onRefundOrderDetail(id) {
|
||||||
|
this.orderId = id
|
||||||
|
this.$refs.orderDetail.dialogVisible = true
|
||||||
|
this.loading = true
|
||||||
|
refundorderDetailApi(id)
|
||||||
|
.then(res => {
|
||||||
|
this.orderDatalist = res.data
|
||||||
|
this.loading = false
|
||||||
|
this.$refs.orderDetail.onOrderLog(id)
|
||||||
|
})
|
||||||
|
.catch(({ message }) => {
|
||||||
|
this.loading = false
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 订单记录
|
||||||
|
onOrderLog(id) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.LogLoading = true
|
||||||
|
refundorderLogApi(id, this.tableFromLog)
|
||||||
|
.then(res => {
|
||||||
|
this.tableDataLog.data = res.data.list
|
||||||
|
this.tableDataLog.total = res.data.count
|
||||||
|
this.LogLoading = false
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.LogLoading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChangeLog(page) {
|
||||||
|
this.tableFromLog.page = page
|
||||||
|
this.getList('')
|
||||||
|
},
|
||||||
|
handleSizeChangeLog(val) {
|
||||||
|
this.tableFromLog.limit = val
|
||||||
|
this.getList('')
|
||||||
|
},
|
||||||
|
// 订单删除
|
||||||
|
handleDelete(row, idx) {
|
||||||
|
if (row.is_del === 1) {
|
||||||
|
this.$modalSure().then(() => {
|
||||||
|
refundorderDeleteApi(row.refund_order_id)
|
||||||
|
.then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.tableData.data.splice(idx, 1)
|
||||||
|
})
|
||||||
|
.catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$confirm(
|
||||||
|
'您选择的的订单存在用户未删除的订单，无法删除用户未删除的订单！',
|
||||||
|
'提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
type: 'error'
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 备注
|
||||||
|
onOrderMark(id) {
|
||||||
|
this.$modalForm(refundorderMarkApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 选择时间
|
||||||
|
selectChange(tab) {
|
||||||
|
this.tableFrom.date = tab
|
||||||
|
this.timeVal = []
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 具体日期
|
||||||
|
onchangeTime(e) {
|
||||||
|
this.timeVal = e
|
||||||
|
this.tableFrom.date = e ? this.timeVal.join('-') : ''
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
edit(id) {
|
||||||
|
this.$modalForm(orderUpdateApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 发货
|
||||||
|
send(id) {
|
||||||
|
this.$modalForm(orderDeliveryApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 列表
|
||||||
|
getList(num) {
|
||||||
|
this.listLoading = true
|
||||||
|
this.tableFrom.page = num || this.tableFrom.page
|
||||||
|
refundorderListApi(this.tableFrom)
|
||||||
|
.then(res => {
|
||||||
|
this.orderChartType = res.data.stat
|
||||||
|
this.tableData.data = res.data.list
|
||||||
|
this.tableData.total = res.data.count
|
||||||
|
this.listLoading = false
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.listLoading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChange(page) {
|
||||||
|
this.tableFrom.page = page
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.tableFrom.limit = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
openLogistics(row) {
|
||||||
|
this.orderDetails = row
|
||||||
|
this.getOrderData(row.refund_order_id)
|
||||||
|
this.dialogLogistics = true
|
||||||
|
},
|
||||||
|
handleClose() {
|
||||||
|
this.dialogLogistics = false
|
||||||
|
this.dialogConfirm = false
|
||||||
|
},
|
||||||
|
// 获取订单物流信息
|
||||||
|
getOrderData(id) {
|
||||||
|
refundorderExpressApi(id)
|
||||||
|
.then(async res => {
|
||||||
|
this.result = res.data
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.demo-table-expands ::v-deep label {
|
||||||
|
width: 110px !important;
|
||||||
|
color: #99a9bf;
|
||||||
|
}
|
||||||
|
::v-deep .el-input--suffix .el-input__inner{
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.el-icon-arrow-down {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.tabBox_tit {
|
||||||
|
max-width: 60%;
|
||||||
|
font-size: 12px !important;
|
||||||
|
margin: 0 2px 0 10px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
padding: 5px 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,671 @@
|
||||||
|
<template>
|
||||||
|
<div class="divBox">
|
||||||
|
<div class="selCard ">
|
||||||
|
<div class="container">
|
||||||
|
<el-form :model="tableFrom" ref="searchForm" size="small" label-width="85px" inline>
|
||||||
|
<el-form-item label="订单状态：" style="display: block;" prop="status">
|
||||||
|
<el-radio-group v-model="tableFrom.status" type="button" @change="getList(1)">
|
||||||
|
<el-radio-button label>全部 {{ '(' +orderChartType.all?orderChartType.all:0 + ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="0"
|
||||||
|
>待审核 {{ '(' +orderChartType.audit?orderChartType.audit:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="-1"
|
||||||
|
>审核未通过 {{ '(' +orderChartType.refuse?orderChartType.refuse:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="1"
|
||||||
|
>审核通过 {{ '(' +orderChartType.agree?orderChartType.agree:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="2"
|
||||||
|
>待收货 {{ '(' +orderChartType.backgood?orderChartType.backgood:0+ ')' }}</el-radio-button>
|
||||||
|
<el-radio-button
|
||||||
|
label="3"
|
||||||
|
>已完成 {{ '(' +orderChartType.end?orderChartType.end:0+ ')' }}</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间选择：">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="timeVal"
|
||||||
|
value-format="yyyy/MM/dd"
|
||||||
|
format="yyyy/MM/dd"
|
||||||
|
size="small"
|
||||||
|
type="daterange"
|
||||||
|
placement="bottom-end"
|
||||||
|
placeholder="自定义时间"
|
||||||
|
style="width: 280px;"
|
||||||
|
:picker-options="pickerOptions"
|
||||||
|
@change="onchangeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款单号：" prop="refund_order_sn">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.refund_order_sn"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入订单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款类型：" prop="refund_type">
|
||||||
|
<el-select
|
||||||
|
v-model="tableFrom.refund_type"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
clearable
|
||||||
|
@change="getList(1)"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in refundTypeList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="发起方：" prop="user_type">
|
||||||
|
<el-select
|
||||||
|
v-model="tableFrom.user_type"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
clearable
|
||||||
|
@change="getList(1)"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in refundUserList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="订单单号：" prop="order_sn">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.order_sn"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入订单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="关键字：" prop="username">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.username"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入用户昵称、退货人姓名、手机号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退货单号：" prop="delivery_id">
|
||||||
|
<el-input
|
||||||
|
v-model="tableFrom.delivery_id"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入退货快递单号"
|
||||||
|
class="selWidth"
|
||||||
|
@keyup.enter.native="getList(1)"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" size="small" @click="getList(1)">搜索</el-button>
|
||||||
|
<el-button size="small" @click="searchReset()">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-card class="mt14">
|
||||||
|
<el-button size="small" type="primary" @click.native="exports">导出退款单</el-button>
|
||||||
|
<el-table
|
||||||
|
v-loading="listLoading"
|
||||||
|
:data="tableData.data"
|
||||||
|
size="small"
|
||||||
|
class="table mt20"
|
||||||
|
highlight-current-row
|
||||||
|
>
|
||||||
|
<el-table-column type="expand">
|
||||||
|
<template slot-scope="props">
|
||||||
|
<el-form label-position="left" inline class="demo-table-expand demo-table-expands">
|
||||||
|
<el-form-item label="订单号：">
|
||||||
|
<span>{{ props.row.order.order_sn }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款商品总价：">
|
||||||
|
<span v-if="props.row.order.activity === 2">{{ getPresellTotal(props.row.refundProduct) }}</span>
|
||||||
|
<span v-else-if="props.row.order.activity === 3">{{ getAssistTotal(props.row.refundProduct) }}</span>
|
||||||
|
<span v-else>{{ getTotal(props.row.refundProduct) }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="退款商品总数：">
|
||||||
|
<span>{{ props.row.refund_num }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="申请退款时间：">
|
||||||
|
<span>{{ props.row.create_time | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="用户备注：">
|
||||||
|
<span>{{ props.row.mark | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商家备注：">
|
||||||
|
<span>{{ props.row.mer_mark | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="props.row.status === 2" label="快递公司：">
|
||||||
|
<span>{{ props.row.delivery_type | filterEmpty }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="props.row.status === 2" label="快递单号：">
|
||||||
|
<span class="mr5">{{ props.row.delivery_id | filterEmpty }}</span>
|
||||||
|
<el-button type="text" @click="openLogistics(props.row)">物流查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="退款单号" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="display: block;" v-text="scope.row.refund_order_sn" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="order.order_sn" label="订单号" min-width="100" />
|
||||||
|
<el-table-column prop="user.nickname" label="用户信息" min-width="100" />
|
||||||
|
<el-table-column prop="refund_price" label="退款金额" min-width="80" />
|
||||||
|
<el-table-column prop="nickname" label="商品信息" min-width="260">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div
|
||||||
|
v-for="(val, i ) in scope.row.refundProduct"
|
||||||
|
:key="i"
|
||||||
|
class="tabBox acea-row row-middle"
|
||||||
|
>
|
||||||
|
<div class="demo-image__preview">
|
||||||
|
<el-image
|
||||||
|
:src="val.product && val.product.cart_info.product.image"
|
||||||
|
:preview-src-list="[val.product && val.product.cart_info.product.image]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span
|
||||||
|
class="tabBox_tit"
|
||||||
|
>{{ val.product && val.product.cart_info.product.store_name + ' | ' }}{{ val.product && val.product.cart_info.productAttr.sku }}</span>
|
||||||
|
<span
|
||||||
|
v-if="scope.row.order && scope.row.order.activity_type === 2 && val.product && val.product.cart_info.productPresellAttr"
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productPresellAttr.presell_price + ' x '+ val.refund_num }}</span>
|
||||||
|
<span
|
||||||
|
v-else-if="scope.row.order && scope.row.order.activity_type === 3 && val.product && val.product.cart_info.productAssistAttr.assist_price"
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productAssistAttr.assist_price + ' x '+ val.refund_num }}</span>
|
||||||
|
<span
|
||||||
|
v-else
|
||||||
|
class="tabBox_pice"
|
||||||
|
>{{ '￥'+ val.product && val.product.cart_info.productAttr.price + ' x '+ val.refund_num }}</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="退款类型" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.refund_type == 1 ? '退款' : '退货退款' }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="order.real_name" label="退货人" min-width="90" />
|
||||||
|
<el-table-column prop="create_user" label="退款发起方" min-width="90" />
|
||||||
|
<el-table-column label="订单状态" min-width="90">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="scope.row.order.is_del === 0">
|
||||||
|
<span v-if="scope.row.order.paid === 0">待付款</span>
|
||||||
|
<span v-else>
|
||||||
|
<span v-if="scope.row.order.order_type === 0 || scope.row.order.order_type === 2">{{ scope.row.order.status | orderStatusFilter }}</span>
|
||||||
|
<span v-else>{{ scope.row.order.status | takeOrderStatusFilter }}</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
<span v-else>已删除</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="serviceScore" label="退款单状态" min-width="150">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="display: block">{{ scope.row.status | orderRefundFilter }}</span>
|
||||||
|
<span v-if="scope.row.status == -1" style="display: block">拒绝原因：{{ scope.row.fail_message }}</span>
|
||||||
|
<span style="display: block">退款原因：{{ scope.row.refund_message }}</span>
|
||||||
|
<span style="display: block">状态变更时间：{{ scope.row.status_time }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" min-width="150" fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button type="text" size="small" @click="onOrderDetail(scope.row.order.order_sn)">订单详情</el-button>
|
||||||
|
<el-button type="text" size="small" @click="onRefundOrderDetail(scope.row.refund_order_id)">退款单详情</el-button>
|
||||||
|
<el-button v-if="scope.row.status === 0" type="text" size="small" @click="onOrderStatus(scope.row.refund_order_id)">退款</el-button>
|
||||||
|
<!-- <el-button type="text" size="small" @click="onOrderLog(scope.row.refund_order_id)">订单记录</el-button> -->
|
||||||
|
<el-button type="text" size="small" @click="onOrderMark(scope.row.refund_order_id)">订单备注</el-button>
|
||||||
|
<el-button v-if="scope.row.status === 2" type="text" size="small" @click="confirmReceipt(scope.row)">确认收货</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="total, prev, pager, next, jumper"
|
||||||
|
:total="tableData.total"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="pageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!--记录-->
|
||||||
|
<el-dialog title="操作记录" :visible.sync="dialogVisible" width="700px">
|
||||||
|
<el-table v-loading="LogLoading" border :data="tableDataLog.data" style="width: 100%">
|
||||||
|
<el-table-column prop="refund_order_id" align="center" label="退款单ID" min-width="80" />
|
||||||
|
<el-table-column prop="change_message" label="操作记录" align="center" min-width="280" />
|
||||||
|
<el-table-column prop="change_time" label="操作时间" align="center" min-width="280" />
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
:page-size="tableFromLog.limit"
|
||||||
|
:current-page="tableFromLog.page"
|
||||||
|
layout="prev, pager, next, jumper"
|
||||||
|
:total="tableDataLog.total"
|
||||||
|
@size-change="handleSizeChangeLog"
|
||||||
|
@current-change="pageChangeLog"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<!--详情-->
|
||||||
|
<details-from ref="orderDetail" :order-datalist="orderDatalist" @get-logistics="openLogistics" />
|
||||||
|
<el-dialog
|
||||||
|
v-if="dialogLogistics"
|
||||||
|
title="物流查询"
|
||||||
|
:visible.sync="dialogLogistics"
|
||||||
|
width="350px"
|
||||||
|
:before-close="handleClose"
|
||||||
|
>
|
||||||
|
<logistics-from
|
||||||
|
v-if="orderDetails"
|
||||||
|
:order-datalist="orderDetails"
|
||||||
|
:result="result"
|
||||||
|
:logistics-name="logisticsName"
|
||||||
|
/>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import {
|
||||||
|
refundorderStatusApi,
|
||||||
|
refundorderListApi,
|
||||||
|
orderUpdateApi,
|
||||||
|
orderDeliveryApi,
|
||||||
|
refundorderLogApi,
|
||||||
|
refundorderDeleteApi,
|
||||||
|
refundorderMarkApi,
|
||||||
|
refundorderDetailApi,
|
||||||
|
refundorderExpressApi,
|
||||||
|
confirmReceiptApi,
|
||||||
|
refundListImportApi
|
||||||
|
} from '@/api/order'
|
||||||
|
import detailsFrom from './refundDetail'
|
||||||
|
import logisticsFrom from '../logistics'
|
||||||
|
import { roterPre } from '@/settings'
|
||||||
|
import createWorkBook from '@/utils/newToExcel.js'
|
||||||
|
import timeOptions from '@/utils/timeOptions';
|
||||||
|
export default {
|
||||||
|
name: 'OrderRefund',
|
||||||
|
components: { detailsFrom, logisticsFrom },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pickerOptions: timeOptions,
|
||||||
|
logisticsName: 'refund',
|
||||||
|
dialogLogistics: false,
|
||||||
|
orderId: 0,
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
refundTypeList: [
|
||||||
|
{ value: 1, label: '退款' },
|
||||||
|
{ value: 2, label: '退款退货' }
|
||||||
|
],
|
||||||
|
refundUserList: [
|
||||||
|
{ value: 1, label: '用户' },
|
||||||
|
{ value: 3, label: '商户' },
|
||||||
|
{ value: 4, label: '客服' }
|
||||||
|
],
|
||||||
|
listLoading: true,
|
||||||
|
roterPre: roterPre,
|
||||||
|
tableFrom: {
|
||||||
|
delivery_id: '',
|
||||||
|
refund_type: '',
|
||||||
|
user_type: '',
|
||||||
|
status: '',
|
||||||
|
date: '',
|
||||||
|
username: '',
|
||||||
|
page: 1,
|
||||||
|
limit: 20,
|
||||||
|
order_sn: this.$route.query.sn ? this.$route.query.sn : '',
|
||||||
|
refund_order_sn: this.$route.query.refund_order_sn ? this.$route.query.refund_order_sn : '',
|
||||||
|
id: this.$route.query.id ? this.$route.query.id : ''
|
||||||
|
},
|
||||||
|
orderChartType: {},
|
||||||
|
timeVal: [],
|
||||||
|
fromList: {
|
||||||
|
title: '选择时间',
|
||||||
|
custom: true,
|
||||||
|
fromTxt: [
|
||||||
|
{ text: '全部', val: '' },
|
||||||
|
{ text: '今天', val: 'today' },
|
||||||
|
{ text: '昨天', val: 'yesterday' },
|
||||||
|
{ text: '最近7天', val: 'lately7' },
|
||||||
|
{ text: '最近30天', val: 'lately30' },
|
||||||
|
{ text: '本月', val: 'month' },
|
||||||
|
{ text: '本年', val: 'year' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
selectionList: [],
|
||||||
|
tableFromLog: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10
|
||||||
|
},
|
||||||
|
tableDataLog: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
LogLoading: false,
|
||||||
|
dialogVisible: false,
|
||||||
|
orderDatalist: null,
|
||||||
|
orderDetails: {},
|
||||||
|
result: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.$route.query.hasOwnProperty('sn')) {
|
||||||
|
this.tableFrom.order_sn = this.$route.query.sn
|
||||||
|
} else {
|
||||||
|
this.tableFrom.order_sn = ''
|
||||||
|
}
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 被缓存接收参数
|
||||||
|
activated() {
|
||||||
|
if (this.$route.query.hasOwnProperty('sn')) {
|
||||||
|
this.tableFrom.order_sn = this.$route.query.sn
|
||||||
|
} else {
|
||||||
|
this.tableFrom.order_sn = ''
|
||||||
|
}
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/**重置 */
|
||||||
|
searchReset(){
|
||||||
|
this.timeVal = []
|
||||||
|
this.tableFrom.date = ""
|
||||||
|
this.$refs.searchForm.resetFields()
|
||||||
|
this.tableFrom.order_sn = ""
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 回
|
||||||
|
// 订单详情
|
||||||
|
onOrderDetail(order_sn) {
|
||||||
|
this.$router.push({
|
||||||
|
path: this.roterPre + "/order/list",
|
||||||
|
query: {
|
||||||
|
order_sn: order_sn
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 退款
|
||||||
|
onOrderStatus(id) {
|
||||||
|
this.$modalForm(refundorderStatusApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 确认收货
|
||||||
|
confirmReceipt(row) {
|
||||||
|
const that = this
|
||||||
|
const h = this.$createElement
|
||||||
|
this.$msgbox({
|
||||||
|
title: '是否确认收货？',
|
||||||
|
message: h('div', null, [
|
||||||
|
h('p', null, '退货物流公司：' + row.delivery_type),
|
||||||
|
h('p', null, '退货快递单号：' + row.delivery_id)
|
||||||
|
]),
|
||||||
|
showCancelButton: true,
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
beforeClose: (action, instance, done) => {
|
||||||
|
if (action === 'confirm') {
|
||||||
|
confirmReceiptApi(row.refund_order_id)
|
||||||
|
.then(res => {
|
||||||
|
that.$message.success(res.message)
|
||||||
|
done()
|
||||||
|
that.getList('')
|
||||||
|
})
|
||||||
|
.catch(({ res }) => {
|
||||||
|
that.$message.error(res.message)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
done()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).then(action => {}).catch(e => e)// 注意这里，这里是重点！！！;
|
||||||
|
},
|
||||||
|
/**导出退款单 */
|
||||||
|
async exports() {
|
||||||
|
let excelData = JSON.parse(JSON.stringify(this.tableFrom)), data = []
|
||||||
|
excelData.page = 1
|
||||||
|
let pageCount = 1
|
||||||
|
let lebData = {};
|
||||||
|
for (let i = 0; i < pageCount; i++) {
|
||||||
|
lebData = await this.downData(excelData)
|
||||||
|
pageCount = Math.ceil(lebData.count/excelData.limit)
|
||||||
|
if (lebData.export.length) {
|
||||||
|
data = data.concat(lebData.export)
|
||||||
|
excelData.page++
|
||||||
|
}
|
||||||
|
}
|
||||||
|
createWorkBook(lebData.header, lebData.title, data, lebData.foot,lebData.filename);
|
||||||
|
return
|
||||||
|
},
|
||||||
|
/**资金流水 */
|
||||||
|
downData(excelData) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
refundListImportApi(excelData).then((res) => {
|
||||||
|
return resolve(res.data)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getExportFileList() {
|
||||||
|
refundListImportApi()
|
||||||
|
.then((res) => {
|
||||||
|
const h = this.$createElement
|
||||||
|
this.$msgbox({
|
||||||
|
title: '提示',
|
||||||
|
message: h('p', null, [
|
||||||
|
h('span', null, '文件正在生成中，请稍后点击"'),
|
||||||
|
h('span', { style: 'color: teal' }, '导出记录'),
|
||||||
|
h('span', null, '"查看~ ')
|
||||||
|
]),
|
||||||
|
confirmButtonText: '我知道了'
|
||||||
|
}).then(action => {
|
||||||
|
this.$router.push({ path: this.roterPre + '/export/list' })
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productAttr.price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 预售商品退款金额
|
||||||
|
getPresellTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productPresellAttr.presell_price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 助力商品退款金额
|
||||||
|
getAssistTotal(row) {
|
||||||
|
let sum = 0
|
||||||
|
for (let i = 0; i < row.length; i++) {
|
||||||
|
sum += row[i].product ? row[i].product.cart_info.productAssistAttr.assist_price * row[i].refund_num : ''
|
||||||
|
}
|
||||||
|
return sum
|
||||||
|
},
|
||||||
|
// 详情
|
||||||
|
onRefundOrderDetail(id) {
|
||||||
|
this.orderId = id
|
||||||
|
this.$refs.orderDetail.dialogVisible = true
|
||||||
|
this.loading = true
|
||||||
|
refundorderDetailApi(id)
|
||||||
|
.then(res => {
|
||||||
|
this.orderDatalist = res.data
|
||||||
|
this.loading = false
|
||||||
|
this.$refs.orderDetail.onOrderLog(id)
|
||||||
|
})
|
||||||
|
.catch(({ message }) => {
|
||||||
|
this.loading = false
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 订单记录
|
||||||
|
onOrderLog(id) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.LogLoading = true
|
||||||
|
refundorderLogApi(id, this.tableFromLog)
|
||||||
|
.then(res => {
|
||||||
|
this.tableDataLog.data = res.data.list
|
||||||
|
this.tableDataLog.total = res.data.count
|
||||||
|
this.LogLoading = false
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.LogLoading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChangeLog(page) {
|
||||||
|
this.tableFromLog.page = page
|
||||||
|
this.getList('')
|
||||||
|
},
|
||||||
|
handleSizeChangeLog(val) {
|
||||||
|
this.tableFromLog.limit = val
|
||||||
|
this.getList('')
|
||||||
|
},
|
||||||
|
// 订单删除
|
||||||
|
handleDelete(row, idx) {
|
||||||
|
if (row.is_del === 1) {
|
||||||
|
this.$modalSure().then(() => {
|
||||||
|
refundorderDeleteApi(row.refund_order_id)
|
||||||
|
.then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.tableData.data.splice(idx, 1)
|
||||||
|
})
|
||||||
|
.catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$confirm(
|
||||||
|
'您选择的的订单存在用户未删除的订单，无法删除用户未删除的订单！',
|
||||||
|
'提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
type: 'error'
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 备注
|
||||||
|
onOrderMark(id) {
|
||||||
|
this.$modalForm(refundorderMarkApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 选择时间
|
||||||
|
selectChange(tab) {
|
||||||
|
this.tableFrom.date = tab
|
||||||
|
this.timeVal = []
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 具体日期
|
||||||
|
onchangeTime(e) {
|
||||||
|
this.timeVal = e
|
||||||
|
this.tableFrom.date = e ? this.timeVal.join('-') : ''
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
edit(id) {
|
||||||
|
this.$modalForm(orderUpdateApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 发货
|
||||||
|
send(id) {
|
||||||
|
this.$modalForm(orderDeliveryApi(id)).then(() => this.getList(''))
|
||||||
|
},
|
||||||
|
// 列表
|
||||||
|
getList(num) {
|
||||||
|
this.listLoading = true
|
||||||
|
this.tableFrom.page = num || this.tableFrom.page
|
||||||
|
refundorderListApi(this.tableFrom)
|
||||||
|
.then(res => {
|
||||||
|
this.orderChartType = res.data.stat
|
||||||
|
this.tableData.data = res.data.list
|
||||||
|
this.tableData.total = res.data.count
|
||||||
|
this.listLoading = false
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.listLoading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChange(page) {
|
||||||
|
this.tableFrom.page = page
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.tableFrom.limit = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
openLogistics(row) {
|
||||||
|
this.orderDetails = row
|
||||||
|
this.getOrderData(row.refund_order_id)
|
||||||
|
this.dialogLogistics = true
|
||||||
|
},
|
||||||
|
handleClose() {
|
||||||
|
this.dialogLogistics = false
|
||||||
|
this.dialogConfirm = false
|
||||||
|
},
|
||||||
|
// 获取订单物流信息
|
||||||
|
getOrderData(id) {
|
||||||
|
refundorderExpressApi(id)
|
||||||
|
.then(async res => {
|
||||||
|
this.result = res.data
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.demo-table-expands ::v-deep label {
|
||||||
|
width: 110px !important;
|
||||||
|
color: #99a9bf;
|
||||||
|
}
|
||||||
|
::v-deep .el-input--suffix .el-input__inner{
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.el-icon-arrow-down {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.tabBox_tit {
|
||||||
|
max-width: 60%;
|
||||||
|
font-size: 12px !important;
|
||||||
|
margin: 0 2px 0 10px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
padding: 5px 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,358 @@
|
||||||
|
<template>
|
||||||
|
<div class="divBox">
|
||||||
|
<div class="selCard">
|
||||||
|
<el-form :model="tableFrom" ref="searchForm" inline size="small" label-width="65px">
|
||||||
|
<el-form-item label="状态：" prop="status">
|
||||||
|
<el-select v-model="tableFrom.status" placeholder="客服状态：" clearable @change="getList(1)" class="selWidth">
|
||||||
|
<el-option
|
||||||
|
v-for="item in optionsData"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="关键字：" prop="keyword">
|
||||||
|
<el-input v-model="tableFrom.keyword" placeholder="请输入关键字" clearable class="selWidth" @keyup.enter.native="getList(1)" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" size="small" @click="getList(1)">搜索</el-button>
|
||||||
|
<el-button size="small" @click="searchReset()">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-card class="mt14">
|
||||||
|
<el-button size="small" type="primary" class="mb20" @click="onAdd">添加客服</el-button>
|
||||||
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
|
:data="tableData.data"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-table-column
|
||||||
|
prop="service_id"
|
||||||
|
label="ID"
|
||||||
|
min-width="60"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
prop="user.nickname"
|
||||||
|
label="微信用户名称"
|
||||||
|
min-width="130"
|
||||||
|
/>
|
||||||
|
<el-table-column label="客服头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div class="demo-image__preview">
|
||||||
|
<el-image
|
||||||
|
class="tabImage"
|
||||||
|
:src="scope.row.avatar"
|
||||||
|
:preview-src-list="[scope.row.avatar]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="nickname"
|
||||||
|
label="客服名称"
|
||||||
|
min-width="130"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
label="帐号状态"
|
||||||
|
min-width="100"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.is_open"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:disabled="!scope.row.user || scope.row.user.cancel_time"
|
||||||
|
active-text="开"
|
||||||
|
inactive-text="关"
|
||||||
|
@click.native="onchangeIsShow(scope.row)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="create_time"
|
||||||
|
label="添加时间"
|
||||||
|
min-width="150"
|
||||||
|
/>
|
||||||
|
<el-table-column label="操作" min-width="150" fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-if="scope.row.is_open && scope.row.status"
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="login(scope.row.service_id, scope.$index)"
|
||||||
|
>进入工作台
|
||||||
|
</el-button>
|
||||||
|
<el-button type="text" size="small" @click="goList(scope.row.service_id, scope.$index)">聊天记录</el-button>
|
||||||
|
<el-button v-if="scope.row.user && !scope.row.user.cancel_time" type="text" size="small" @click="onEdit(scope.row.service_id)">编辑</el-button>
|
||||||
|
<el-button type="text" size="small" @click="onDel(scope.row.service_id,scope.$index)">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="total, prev, pager, next, jumper"
|
||||||
|
:total="tableData.total"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="pageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
<!--聊天记录-->
|
||||||
|
<el-dialog title="聊天记录" :width="isChat?'600px':'800px'" :visible.sync="dialogTableVisible">
|
||||||
|
<el-table v-if="isChat" size="small" v-loading="loadingChat" :data="tableChatData.data">
|
||||||
|
<el-table-column property="user.nickname" label="用户名称" min-width="100" />
|
||||||
|
<el-table-column label="用户头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<img v-if="scope.row.user.avatar" class="tabImage" :src="scope.row.user.avatar">
|
||||||
|
<img v-else class="tabImage" src="../../../assets/images/f.png">
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" fixed="right" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button type="text" size="small" @click="check(scope.row.uid, scope.$index)">查看对话</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-button v-if="!isChat" type="primary" size="small" @click="goBack" class="mb20">返回聊天记录</el-button>
|
||||||
|
<el-table v-if="!isChat" key="isIndexs" v-loading="loadingChat" :data="tableServiceData.data" size="small">
|
||||||
|
<el-table-column label="发送人" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.send_type === 0 ? scope.row.user.nickname : scope.row.service.nickname }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="发送人头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<img v-if="scope.row.user.avatar" class="tabImage" :src="scope.row.user.avatar">
|
||||||
|
<img v-else class="tabImage" src="../../../assets/images/f.png">
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="发送消息" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="scope.row.msn_type === 2" class="tabImage">[{{ scope.row.msn }}]</span>
|
||||||
|
<img v-else-if="scope.row.msn_type === 3" class="tabImage" :src="scope.row.msn">
|
||||||
|
<span v-else>{{ scope.row.msn_info }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="create_time" label="发送时间" min-width="100" />
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="prev, pager, next, jumper"
|
||||||
|
:total="isChat?tableChatData.total:tableServiceData.total"
|
||||||
|
@size-change="handleSizeChangeChat"
|
||||||
|
@current-change="pageChangeChat"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import {
|
||||||
|
serviceLoginApi,
|
||||||
|
serviceListApi,
|
||||||
|
serviceCreateApi,
|
||||||
|
serviceUpdateApi,
|
||||||
|
serviceStatusApi,
|
||||||
|
serviceDeleteApi,
|
||||||
|
serviceChatListApi,
|
||||||
|
serviceChatUidListApi
|
||||||
|
} from '@/api/system'
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
import SettingMer from '@/libs/settingMer'
|
||||||
|
|
||||||
|
const optionsData = [
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '显示'
|
||||||
|
}, {
|
||||||
|
value: '0',
|
||||||
|
label: '隐藏'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
export default {
|
||||||
|
name: 'Service',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isChat: false,
|
||||||
|
loadingChat: false,
|
||||||
|
dialogTableVisible: false,
|
||||||
|
optionsData: optionsData,
|
||||||
|
loading: false,
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
tableFrom: {
|
||||||
|
page: 1,
|
||||||
|
limit: 20,
|
||||||
|
keyword: '',
|
||||||
|
status: ''
|
||||||
|
},
|
||||||
|
tableChatFrom: {
|
||||||
|
page: 1,
|
||||||
|
limit: 8
|
||||||
|
},
|
||||||
|
tableChatData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
tableServiceData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
serviceId: 0,
|
||||||
|
uid: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/**重置 */
|
||||||
|
searchReset(){
|
||||||
|
this.$refs.searchForm.resetFields()
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
login(id) {
|
||||||
|
serviceLoginApi(id)
|
||||||
|
.then(res => {
|
||||||
|
Cookies.set('SerToken', res.data.token)
|
||||||
|
window.open(SettingMer.httpUrl + res.data.url)
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 列表
|
||||||
|
getList(num) {
|
||||||
|
this.loading = true
|
||||||
|
this.tableFrom.page = num ? num : this.tableFrom.page
|
||||||
|
serviceListApi(this.tableFrom).then(res => {
|
||||||
|
this.tableData.data = res.data.list
|
||||||
|
this.tableData.total = res.data.count
|
||||||
|
this.loading = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChange(page) {
|
||||||
|
this.tableFrom.page = page
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.tableFrom.limit = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
goList(id) {
|
||||||
|
this.serviceId = id
|
||||||
|
this.dialogTableVisible = true
|
||||||
|
this.tableChatFrom.page = 1
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat = true
|
||||||
|
},
|
||||||
|
goBack() {
|
||||||
|
this.tableChatFrom.page = 1
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat = true
|
||||||
|
},
|
||||||
|
check(uid) {
|
||||||
|
this.uid = uid
|
||||||
|
this.serviceChatUidList(uid)
|
||||||
|
this.isChat = false
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
getListChat() {
|
||||||
|
this.loadingChat = true
|
||||||
|
serviceChatListApi(this.serviceId, this.tableChatFrom).then(res => {
|
||||||
|
this.tableChatData.data = res.data.list
|
||||||
|
this.tableChatData.total = res.data.count
|
||||||
|
this.loadingChat = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loadingChat = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
serviceChatUidList(uid) {
|
||||||
|
this.loadingChat = true
|
||||||
|
serviceChatUidListApi(this.serviceId, uid, this.tableChatFrom).then(res => {
|
||||||
|
this.tableChatData.data = []
|
||||||
|
this.tableServiceData.data = res.data.list
|
||||||
|
this.tableServiceData.total = res.data.count
|
||||||
|
this.loadingChat = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loadingChat = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChangeChat(page) {
|
||||||
|
this.tableChatFrom.page = page
|
||||||
|
this.isChat ? this.getListChat() : this.serviceChatUidList(this.uid)
|
||||||
|
},
|
||||||
|
handleSizeChangeChat(val) {
|
||||||
|
this.tableChatFrom.limit = val
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat ? this.getListChat() : this.serviceChatUidList(this.uid)
|
||||||
|
},
|
||||||
|
// 添加
|
||||||
|
onAdd() {
|
||||||
|
this.$modalForm(serviceCreateApi()).then(() => this.getList())
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
onEdit(id) {
|
||||||
|
this.$modalForm(serviceUpdateApi(id)).then(() => this.getList())
|
||||||
|
},
|
||||||
|
onDel(id, idx) {
|
||||||
|
this.$modalSure('删除该客服吗').then(() => {
|
||||||
|
serviceDeleteApi(id).then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.tableData.data.splice(idx, 1)
|
||||||
|
}).catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 修改状态
|
||||||
|
onchangeIsShow(row) {
|
||||||
|
if(!row.user || row.user.cancel_time){
|
||||||
|
return
|
||||||
|
}else{
|
||||||
|
serviceStatusApi(row.service_id, row.is_open).then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.getList()
|
||||||
|
}).catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import '@/styles/form.scss';
|
||||||
|
.tabImage{
|
||||||
|
width: 36px;
|
||||||
|
height: px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,359 @@
|
||||||
|
<template>
|
||||||
|
<div class="divBox">
|
||||||
|
<div class="selCard">
|
||||||
|
<el-form :model="tableFrom" ref="searchForm" inline size="small" label-width="65px">
|
||||||
|
<el-form-item label="状态：" prop="status">
|
||||||
|
<el-select v-model="tableFrom.status" placeholder="客服状态：" clearable @change="getList(1)" class="selWidth">
|
||||||
|
<el-option
|
||||||
|
v-for="item in optionsData"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="关键字：" prop="keyword">
|
||||||
|
<el-input v-model="tableFrom.keyword" placeholder="请输入关键字" clearable class="selWidth" @keyup.enter.native="getList(1)" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" size="small" @click="getList(1)">搜索</el-button>
|
||||||
|
<el-button size="small" @click="searchReset()">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-card class="mt14">
|
||||||
|
<el-button size="small" type="primary" class="mb20" @click="onAdd">添加客服</el-button>
|
||||||
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
|
:data="tableData.data"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-table-column
|
||||||
|
prop="service_id"
|
||||||
|
label="ID"
|
||||||
|
min-width="60"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
prop="user.nickname"
|
||||||
|
label="微信用户名称"
|
||||||
|
min-width="130"
|
||||||
|
/>
|
||||||
|
<el-table-column label="客服头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div class="demo-image__preview">
|
||||||
|
<el-image
|
||||||
|
class="tabImage"
|
||||||
|
:src="scope.row.avatar"
|
||||||
|
:preview-src-list="[scope.row.avatar]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="nickname"
|
||||||
|
label="客服名称"
|
||||||
|
min-width="130"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
label="帐号状态"
|
||||||
|
min-width="100"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.is_open"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:disabled="!scope.row.user || scope.row.user.cancel_time"
|
||||||
|
active-text="开"
|
||||||
|
inactive-text="关"
|
||||||
|
@click.native="onchangeIsShow(scope.row)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="create_time"
|
||||||
|
label="添加时间"
|
||||||
|
min-width="150"
|
||||||
|
/>
|
||||||
|
<el-table-column label="操作" min-width="150" fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-if="scope.row.is_open && scope.row.status"
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="login(scope.row.service_id, scope.$index)"
|
||||||
|
>进入工作台
|
||||||
|
</el-button>
|
||||||
|
<el-button type="text" size="small" @click="goList(scope.row.service_id, scope.$index)">聊天记录</el-button>
|
||||||
|
<el-button v-if="scope.row.user && !scope.row.user.cancel_time" type="text" size="small" @click="onEdit(scope.row.service_id)">编辑</el-button>
|
||||||
|
<el-button type="text" size="small" @click="onDel(scope.row.service_id,scope.$index)">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="total, prev, pager, next, jumper"
|
||||||
|
:total="tableData.total"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="pageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
<!--聊天记录-->
|
||||||
|
<el-dialog title="聊天记录" :width="isChat?'600px':'800px'" :visible.sync="dialogTableVisible">
|
||||||
|
<el-table v-if="isChat" size="small" v-loading="loadingChat" :data="tableChatData.data">
|
||||||
|
<el-table-column property="user.nickname" label="用户名称" min-width="100" />
|
||||||
|
<el-table-column label="用户头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<img v-if="scope.row.user.avatar" class="tabImage" :src="scope.row.user.avatar">
|
||||||
|
<img v-else class="tabImage" src="../../../assets/images/f.png">
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" fixed="right" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button type="text" size="small" @click="check(scope.row.uid, scope.$index)">查看对话</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-button v-if="!isChat" type="primary" size="small" @click="goBack" class="mb20">返回聊天记录</el-button>
|
||||||
|
<el-table v-if="!isChat" key="isIndexs" v-loading="loadingChat" :data="tableServiceData.data" size="small">
|
||||||
|
<el-table-column label="发送人" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.send_type === 0 ? scope.row.user.nickname : scope.row.service.nickname }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="发送人头像" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<img v-if="scope.row.user.avatar" class="tabImage" :src="scope.row.user.avatar">
|
||||||
|
<img v-else class="tabImage" src="../../../assets/images/f.png">
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="发送消息" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="scope.row.msn_type === 2" class="tabImage">[{{ scope.row.msn }}]</span>
|
||||||
|
<img v-else-if="scope.row.msn_type === 3" class="tabImage" :src="scope.row.msn">
|
||||||
|
<span v-else>{{ scope.row.msn_info }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="create_time" label="发送时间" min-width="100" />
|
||||||
|
</el-table>
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
:page-size="tableFrom.limit"
|
||||||
|
:current-page="tableFrom.page"
|
||||||
|
layout="prev, pager, next, jumper"
|
||||||
|
:total="isChat?tableChatData.total:tableServiceData.total"
|
||||||
|
@size-change="handleSizeChangeChat"
|
||||||
|
@current-change="pageChangeChat"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import {
|
||||||
|
serviceLoginApi,
|
||||||
|
serviceListApi,
|
||||||
|
serviceCreateApi,
|
||||||
|
serviceUpdateApi,
|
||||||
|
serviceStatusApi,
|
||||||
|
serviceDeleteApi,
|
||||||
|
serviceChatListApi,
|
||||||
|
serviceChatUidListApi
|
||||||
|
} from '@/api/system'
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
import SettingMer from '@/libs/settingMer'
|
||||||
|
|
||||||
|
const optionsData = [
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '显示'
|
||||||
|
}, {
|
||||||
|
value: '0',
|
||||||
|
label: '隐藏'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
export default {
|
||||||
|
name: 'Service',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isChat: false,
|
||||||
|
loadingChat: false,
|
||||||
|
dialogTableVisible: false,
|
||||||
|
optionsData: optionsData,
|
||||||
|
loading: false,
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
tableFrom: {
|
||||||
|
page: 1,
|
||||||
|
limit: 20,
|
||||||
|
keyword: '',
|
||||||
|
status: ''
|
||||||
|
},
|
||||||
|
tableChatFrom: {
|
||||||
|
page: 1,
|
||||||
|
limit: 8
|
||||||
|
},
|
||||||
|
tableChatData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
tableServiceData: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
serviceId: 0,
|
||||||
|
uid: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/**重置 */
|
||||||
|
searchReset(){
|
||||||
|
this.$refs.searchForm.resetFields()
|
||||||
|
this.getList(1)
|
||||||
|
},
|
||||||
|
login(id) {
|
||||||
|
serviceLoginApi(id)
|
||||||
|
.then(res => {
|
||||||
|
Cookies.set('SerToken', res.data.token)
|
||||||
|
window.open(SettingMer.httpUrl + res.data.url)
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 列表
|
||||||
|
getList(num) {
|
||||||
|
this.loading = true
|
||||||
|
this.tableFrom.page = num ? num : this.tableFrom.page
|
||||||
|
serviceListApi(this.tableFrom).then(res => {
|
||||||
|
this.tableData.data = res.data.list
|
||||||
|
this.tableData.total = res.data.count
|
||||||
|
this.loading = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChange(page) {
|
||||||
|
this.tableFrom.page = page
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.tableFrom.limit = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
goList(id) {
|
||||||
|
this.serviceId = id
|
||||||
|
this.dialogTableVisible = true
|
||||||
|
this.tableChatFrom.page = 1
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat = true
|
||||||
|
},
|
||||||
|
goBack() {
|
||||||
|
this.tableChatFrom.page = 1
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat = true
|
||||||
|
},
|
||||||
|
check(uid) {
|
||||||
|
this.uid = uid
|
||||||
|
this.serviceChatUidList(uid)
|
||||||
|
this.isChat = false
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
getListChat() {
|
||||||
|
this.loadingChat = true
|
||||||
|
serviceChatListApi(this.serviceId, this.tableChatFrom).then(res => {
|
||||||
|
this.tableChatData.data = res.data.list
|
||||||
|
this.tableChatData.total = res.data.count
|
||||||
|
this.loadingChat = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loadingChat = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 聊天记录列表
|
||||||
|
serviceChatUidList(uid) {
|
||||||
|
this.loadingChat = true
|
||||||
|
serviceChatUidListApi(this.serviceId, uid, this.tableChatFrom).then(res => {
|
||||||
|
this.tableChatData.data = []
|
||||||
|
this.tableServiceData.data = res.data.list
|
||||||
|
this.tableServiceData.total = res.data.count
|
||||||
|
this.loadingChat = false
|
||||||
|
}).catch(res => {
|
||||||
|
this.$message.error(res.message)
|
||||||
|
this.loadingChat = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
pageChangeChat(page) {
|
||||||
|
this.tableChatFrom.page = page
|
||||||
|
this.isChat ? this.getListChat() : this.serviceChatUidList(this.uid)
|
||||||
|
},
|
||||||
|
handleSizeChangeChat(val) {
|
||||||
|
this.tableChatFrom.limit = val
|
||||||
|
this.getListChat()
|
||||||
|
this.isChat ? this.getListChat() : this.serviceChatUidList(this.uid)
|
||||||
|
},
|
||||||
|
// 添加
|
||||||
|
onAdd() {
|
||||||
|
this.$modalForm(serviceCreateApi()).then(() => this.getList())
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
onEdit(id) {
|
||||||
|
this.$modalForm(serviceUpdateApi(id)).then(() => this.getList())
|
||||||
|
},
|
||||||
|
onDel(id, idx) {
|
||||||
|
this.$modalSure('删除该客服吗').then(() => {
|
||||||
|
serviceDeleteApi(id).then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.tableData.data.splice(idx, 1)
|
||||||
|
}).catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 修改状态
|
||||||
|
onchangeIsShow(row) {
|
||||||
|
if(!row.user || row.user.cancel_time){
|
||||||
|
return
|
||||||
|
}else{
|
||||||
|
serviceStatusApi(row.service_id, row.is_open).then(({ message }) => {
|
||||||
|
this.$message.success(message)
|
||||||
|
this.getList()
|
||||||
|
}).catch(({ message }) => {
|
||||||
|
this.$message.error(message)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import '@/styles/form.scss';
|
||||||
|
.tabImage{
|
||||||
|
width: 36px;
|
||||||
|
height: px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 5.2 KiB |
|
|
@ -159,6 +159,7 @@
|
||||||
<span style="display: block;" v-text="scope.row.refund_order_sn" />
|
<span style="display: block;" v-text="scope.row.refund_order_sn" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
<el-table-column prop="order.order_sn" label="订单号" min-width="100" />
|
||||||
<el-table-column prop="user.nickname" label="用户信息" min-width="100" />
|
<el-table-column prop="user.nickname" label="用户信息" min-width="100" />
|
||||||
<el-table-column prop="refund_price" label="退款金额" min-width="80" />
|
<el-table-column prop="refund_price" label="退款金额" min-width="80" />
|
||||||
<el-table-column prop="nickname" label="商品信息" min-width="260">
|
<el-table-column prop="nickname" label="商品信息" min-width="260">
|
||||||
|
|
|
||||||
|
|
@ -344,6 +344,7 @@ export default {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue