Skip to content

A
admin-base
Commit 028d86f2 authored by 王's avatar 王
Browse files
Options

订单列表

parent 39b3c095
Show whitespace changes
Inline Side-by-side
Showing with 23024 additions and 6 deletions
config/index.js
View file @ 028d86f2
...@@ -12,8 +12,8 @@ module.exports = { ...@@ -12,8 +12,8 @@ module.exports = {
//本地代理设置 //本地代理设置
proxyTable: { proxyTable: {
'/api': { '/api': {
// target: 'http://local.base-api.sing.com', // 接口的域名 target: 'http://local.base-api.sing.com', // 接口的域名
target: 'https://admin_test.changchangenglish.com/', // target: 'https://admin_test.changchangenglish.com/',
changeOrigin: true, // 如果接口跨域，需要进行这个参数配置 changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
} }
}, },
......
src/components/framework/address-picker/Address.vue 0 → 100644
View file @ 028d86f2
<template>
<div class="address">
<section style="width:100%; height: 100%;">
<el-form :model='form' class='demo-ruleForm' ref='form' label-width="100px" :rules='rules'>
<el-row :gutter='20'>
<el-col :span='20'>
<el-form-item prop='name' label="收货人">
<el-input v-model="form.name"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='20'>
<el-form-item prop='mobile' label="手机号">
<el-input v-model="form.mobile"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20' class='address'>
<el-col :span='20'>
<el-form-item prop='province' label="省">
<el-select v-model='form.province' placeholder='请选择省' @change='proChange'>
<el-option v-for='item in provinces' :key='item.value' :value='item.value' :label="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20' class='address'>
<el-col :span='20'>
<el-form-item prop='city' label="市">
<el-select v-model='form.city' placeholder='请选择市' @change='cityChange'>
<el-option v-for='item in cities' :key='item.value' :value='item.value' :label="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20' class='address'>
<el-col :span='20'>
<el-form-item prop='district' label="县／区">
<el-select v-model='form.district' placeholder='请选择区/县' @change='districtChange'>
<el-option v-for='item in districts' :key='item.value' :value='item.value' :label="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20' class='address'>
<el-col :span='20'>
<el-form-item prop='detail' label="详细地址">
<el-input placeholder='请填写详细地址' :number='true' v-model='form.detail'>
</el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</section>
</div>
</template>
<script>
import Address from './addr.js'
let type = 1
// let provinceValue = 2
// let cityValue = 52
//根据apid查找对象
function findcity(item) {
return item.type == type;
}
function findChildren(list, value) {
let filtered = list.filter((item) => {
return item.value === value
})
return filtered[0].children
}
//筛选出各省级对象
let pObj = Address.filter(findcity)
export default {
name: 'vueAddress',
props: ['province', 'city', 'district', 'detail', 'name', 'mobile'],
created() {
},
mounted() {
let vm = this
vm.show = vm.showAddressPicker
},
computed: {
cities: function () {
if(this.form.province){
return findChildren(pObj, this.form.province)
} else {
return []
}
},
districts: function () {
if(this.form.city){
return findChildren(this.cities, this.form.city)
} else {
return []
}
}
},
data() {
return {
rules: {
province: [{ required: true, message: '请选择省份', trigger: 'change' }],
city: [{ required: true, message: '请选择城市', trigger: 'change' }],
district: [{ required: true, message: '请选择区/县', trigger: 'change' }],
detail: [{ required: true, message: '请填写详细地址', trigger: 'change' }],
name: [{ required: true, message: '请填写收货人', trigger: 'change' }],
mobile: [{ required: true, message: '请填写手机号', trigger: 'change' }]
},
form: {
province: this.province,
city: this.city,
district: this.district,
detail: this.detail,
name: this.name,
mobile: this.mobile
},
provinces: pObj
}
},
watch: {
form: {
handler: function (val) {
this.$emit('change', val);
},
deep: true
}
},
methods: {
proChange: function (val, oldVal) {
if (oldVal) {
this.form.city = '';
this.form.detail = '';
}
this.form.city = this.cities[0].value;
},
cityChange: function (val, oldVal) {
this.form.district = this.districts[0].value;
},
districtChange: function (val, oldVal) {
if (oldVal) {
this.form.detail = '';
}
},
detailChange: function (val) {
console.log(val);
}
}
}
</script>
<style scoped>
.mint-popup {
width: 100%;
}
.footer-btn {
box-sizing: border-box;
position: fixed;
width: 100%;
z-index: 2;
left: 0;
bottom: 3rem;
}
.input {
border: none;
}
.padding {
padding: 1.5rem;
font-size: 1.4rem;
}
.float-right {
float: right;
}
</style>
src/components/framework/address-picker/addr.js 0 → 100644
View file @ 028d86f2
This source diff could not be displayed because it is too large. You can view the blob instead.
src/components/order/dialog.vue 0 → 100644
View file @ 028d86f2
<template>
<el-dialog
title="编辑收货地址"
center
append-to-body
:visible.sync="dialogObj.show"
width="800px">
<vue-address :province="dialogObj.province" :city="dialogObj.city" :district="dialogObj.district" :detail="dialogObj.detail" :mobile="dialogObj.receive_mobile" :name="dialogObj.receive_name" @change="handlerAddressChange">
</vue-address>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogObj.show = false">取 消</el-button>
<el-button type="primary" @click="saveAddress">保 存</el-button>
</div>
</el-dialog>
</template>
<script>
// import {getCategoryApi} from "../../service/api";
import vueAddress from '../framework/address-picker/Address'
import AddressArray from '../framework/address-picker/addr'
export default {
name: "dialogObj",
props:[
'dialogObj'
],
data(){
return{
}
},
methods:{
handlerAddressChange (val) {
if(!val.province || !val.city || !val.district){
return
}
this.dialogObj.detail = val.detail;
this.dialogObj.province = val.province;
this.dialogObj.city = val.city;
this.dialogObj.district = val.district;
this.dialogObj.receive_mobile = val.mobile;
this.dialogObj.receive_name = val.name;
let provinceObj = AddressArray.filter((item) => {
return item.value === val.province
})
let cityObj = provinceObj[0].children.filter((city) => {
return city.value === val.city
})
let districtObj = cityObj[0].children.filter((district) => {
return district.value === val.district
})
this.dialogObj.province_name = provinceObj[0].label;
this.dialogObj.city_name = cityObj[0].label;
this.dialogObj.district_name = districtObj.length > 0 ? districtObj[0].label : '';
},
saveAddress () {
let json = {
province_id: this.dialogObj.province,
province_name: this.dialogObj.province_name,
city_id: this.dialogObj.city,
city: this.dialogObj.city_name,
area: this.dialogObj.district_name,
area_id: this.dialogObj.district,
address: this.dialogObj.detail,
receive_name: this.dialogObj.receive_name,
receive_mobile: this.dialogObj.receive_mobile
};
this.$emit("reflash");
// Service.updateUserAddress(json, this.dialogObj.user_id, this.dialogObj.pay_id).then(res=>{
// if(res.data.result=='success'){
// this.$message.success(res.data.message);
// this.$emit("reflash");
// }else{
// this.$message.error(res.data.message);
// }
// })
},
},
components:{
vueAddress
},
mounted(){
}
}
</script>
<style scoped lang="less">
.dialog-footer{
display: block;
text-align: center;
}
</style>
src/components/order/index.vue
View file @ 028d86f2
<template> <template>
<div> <div>
<el-table
:data="tableData"
border
style="width: 100%">
<el-table-column type="expand">
<template slot-scope="props">
<el-form label-position="left" class="demo-table-expand">
<el-row>
<el-col :span="10">
<el-form-item label="客户信息:">
<span>ID:{{props.row.user_id}} {{props.row.username}} {{props.row.mobile}}</span>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="班主任:">
<span>{{ props.row.teacher_name }}</span>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="来源:">
<span> {{props.row.invite_username}}<br>{{props.row.invite_mobile}}</span>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注:">
<span>{{ props.row.desc }}</span>
</el-form-item>
<el-form-item label="收货地址:">
<div>
{{props.row.receive_name}}
{{props.row.receive_mobile}}
{{props.row.province_name}}{{props.row.city}}{{props.row.area}}{{props.row.address}}
</div>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column
prop="out_trade_no"
label="订单号"
>
</el-table-column>
<el-table-column
prop="product_title"
label="商品名称">
</el-table-column>
<el-table-column
:min-width="'150px'"
prop="course_title"
label="课程名称"
>
<template slot-scope="scope">
<router-link :to="{name:'ClassList', params: { courseId: scope.row.courses_id }, query: { courseName: scope.row.course_title}}" >
{{scope.row.course_title}} <br>【{{scope.row.instructor}}】<br>
{{scope.row|courseTypeFilter}}
</router-link>
</template>
</el-table-column>
<el-table-column
label="价格（元）"
>
<template slot-scope="scope">
{{scope.row.money|moneytFilter}}
</template>
</el-table-column>
<el-table-column label="推荐收益(元)">
<template slot-scope="scope">
{{parseInt(scope.row.revenue_fixed, 10) / 100}}
</template>
</el-table-column>
<el-table-column
prop="created_at"
label="订单创建时间"
>
</el-table-column>
<el-table-column
prop="pay_at"
label="购买时间"
>
</el-table-column>
<el-table-column
label="付款状态">
<template slot-scope="scope">
{{scope.row.is_pay|payMentFilter}}
</template>
</el-table-column>
<el-table-column
label="操作"
min-width="250"
>
<template slot-scope="scope">
<el-button
v-if="scope.row.is_pay == 1"
@click="onRefund(scope.row.pay_id, scope.row.money)"
type="warning"
plain
size="mini">
退款
</el-button>
<el-button
@click="editComment(scope.row.pay_id, scope.row.desc)"
type="warning"
plain
size="mini">
编辑备注
</el-button>
<el-button
@click="editAddress(scope.row)"
plain
type="warning"
size="mini">
编辑收货地址
</el-button>
</template>
</el-table-column>
</el-table>
<address-dialog v-if="dialogObj.show" :dialogObj="dialogObj" @reflash="onUpdateAddress"></address-dialog>
<refund-dialog :dialogObj="refundDialogObj" @reflash="onAfterRefund" @changeShow="changeShow"></refund-dialog>
</div> </div>
</template> </template>
<script> <script>
import {getOrderListApi} from "../../service/api";
import addressDialog from './dialog'
import refundDialog from './refundDialog'
import AddressArray from '../framework/address-picker/addr'
export default { export default {
name: 'index',
data(){
return {
tableData: [
{
"pay_id": 269,
"out_trade_no": "sing_pay_6333_1535597840440458",
"user_id": 6333,
"user_address_id": 185,
"product_id": 1,
"invite_type": 0,
"invite_user_id": 0,
"money": 1,
"desc": "系统备注：付款成功，但未找到ID为0的课程或它的课程类型不匹配（下单类型：1）",
"revenue_fixed": 0,
"is_pay": 0,
"pay_at": "2018-08-30 10:57:25",
"teacher_id": 0,
"created_at": "2018-08-30 10:57:21",
"username": "青山",
"mobile": "18616964357",
"course_title": null,
"instructor": null,
"courses_id": null,
"type": 1,
"duration": 12,
"product_title": "1499元一年课 ",
"teacher_name": null,
"receive_name": "江姐",
"receive_mobile": "13424673456",
"province_name": "广东",
"province_id": null,
"city": "深圳",
"city_id": null,
"area": "福田区",
"area_id": null,
"address": " 我"
},
{
"pay_id": 267,
"out_trade_no": "sing_pay_6281_1533889878982223",
"user_id": 6295,
"user_address_id": 168,
"product_id": 4,
"invite_type": 0,
"invite_user_id": 6300,
"money": 1,
"desc": "",
"revenue_fixed": 6000,
"is_pay": 1,
"pay_at": null,
"teacher_id": 0,
"created_at": "2018-08-10 16:31:18",
"username": null,
"mobile": null,
"course_title": "30天高效英语启蒙主题训练营",
"instructor": "8月20日开课",
"courses_id": 65,
"type": 1,
"duration": 1,
"product_title": "30天高效英语启蒙主题训练营（买课赠实物教具礼盒）",
"teacher_name": null,
"receive_name": "www",
"receive_mobile": "16766467976",
"province_name": "广东",
"province_id": null,
"city": "深圳",
"city_id": null,
"area": "福田区",
"area_id": null,
"address": "6164466"
}
],
dialogObj: {
show: false
},
refundDialogObj: {
show: false,
id: '',
money: 0
}
}
},
methods: {
editComment(id, desc) {
this.$prompt('编辑备注', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: desc
}).then(({ value }) => {
this.$message({
type: 'success',
message: '你的备注是: ' + value
});
}).catch(() => {
this.$message({
type: 'info',
message: '取消编辑备注'
});
});
},
getOrderList(){
getOrderListApi().then((res)=>{
})
},
changeShow(data){
this.refundDialogObj.show=data
},
onRefund(id, money){
console.log('onRefund', id, money)
this.refundDialogObj.id= id;
this.refundDialogObj.money= money;
this.refundDialogObj.show = true;
},
onAfterRefund(){
},
onUpdateAddress(){
this.dialogObj.show = false;
this.getOrderList();
},
editAddress(row){
if(!row.province_name){
this.dialogObj.province = ''
this.dialogObj.city = ''
this.dialogObj.district = ''
} else {
let provinceObj = AddressArray.filter((item) => {
return item.label === row.province_name
})
if(provinceObj && provinceObj.length > 0){
this.dialogObj.province = row.province_id ? row.province_id : provinceObj[0].value
if(!row.city){
this.dialogObj.city = ''
} else {
let cityObj = provinceObj[0].children.filter((city) => {
return city.label === row.city
})
this.dialogObj.city = row.city_id ? row.city_id : cityObj[0].value
if(!row.area){
this.dialogObj.district = ''
}else {
let districtObj = cityObj[0].children.filter((district) => {
return district.label === row.area
})
this.dialogObj.district = row.area_id ? row.area_id : districtObj[0].value
}
}
} else {
this.dialogObj.province = ''
this.dialogObj.district = ''
this.dialogObj.city = ''
}
}
this.dialogObj.detail = row.address
this.dialogObj.user_id = row.user_id
this.dialogObj.pay_id = row.pay_id
this.dialogObj.receive_mobile = row.receive_mobile
this.dialogObj.receive_name = row.receive_name
this.dialogObj.province_name = row.province_name
this.dialogObj.city_name = row.city
this.dialogObj.district_name = row.area
this.dialogObj.show=true;
}
},
components: {
addressDialog,
refundDialog
},
mounted(){
this.getOrderList();
},
filters:{
payMentFilter(val){
return val=='1'?'已付款':'未付款'
},
courseTypeFilter(val){
return val.type=='1'?`正式课(${val.duration}个月)`:`试听课(${val.duration}天)`
},
moneytFilter(val){
return val = val / 100
}
}
} }
</script> </script>
......
src/components/order/refundDialog.vue 0 → 100644
View file @ 028d86f2
<template>
<el-dialog
title="退款"
center
append-to-body
:visible.sync="show"
width="800px">
<div v-loading="loading">
<el-form ref="form" :model="form" :rules="rules" >
<el-row>
<el-col :span="4"><label>退款金额</label></el-col>
<el-col :span="8">
<el-form-item prop="key">
<el-input v-model="form.money"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="4"><label>退款原因</label></el-col>
<el-col :span="8">
<el-form-item>
<el-input v-model="form.desc" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="show = false">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</span>
</div>
</el-dialog>
</template>
<script>
import {refundApi} from "../../service/api";
export default {
name: "dialogObj",
props:[
'dialogObj'
],
data(){
return{
show:false,
id: '',
loading:true,
form:{
money:0,
desc:''
},
rules:{
money:[
{ required: true, message: '请输入退款金额', trigger: 'change' }
],
desc:[
{ required: true, message: '请输入退款原因', trigger: 'change' }
]
}
}
},
methods:{
save(){
if(this.dialogObj.id){
this.$refs['form'].validate((valid) => {
if(valid){
let json = {
refund_money: parseFloat(this.form.money) * 100,
desc: this.form.desc
}
refundApi(this.dialogObj.id,json).then(res=>{
this.$message({
type: 'success',
message: '退款成功!'
});
this.$emit("reflash");
this.show = false;
})
}
});
}
},
initDialog(){
console.log('initDialog')
this.show = this.dialogObj.show;
if (this.dialogObj.id) {
this.id = this.dialogObj.id;
}
this.form.money = parseFloat(this.dialogObj.money / 100);
this.form.desc = this.dialogObj.desc;
this.loading = false
}
},
watch:{
dialogObj:{
handler: function () {
this.initDialog()
},
deep: true
},
show(value){
this.$emit("changeShow",value);
}
}
}
</script>
<style scoped lang="less">
</style>
src/service/api.js
View file @ 028d86f2
...@@ -439,8 +439,8 @@ export const editOrderDescApi = function (orderId, type) { ...@@ -439,8 +439,8 @@ export const editOrderDescApi = function (orderId, type) {
}; };
// 给用户退款 // 给用户退款
const refundUrl = `${_baseUrl}api/admin/bill/refund/`; const refundUrl = `${_baseUrl}api/admin/bill/refund/`;
export const refundApi = function (id) { export const refundApi = function (id, json) {
return Vue.prototype.$post(`${refundUrl}${id}`) return Vue.prototype.$post(`${refundUrl}${id}`,json)
} ; } ;
// 修改订单收货地址 // 修改订单收货地址
const editAddressUrl = `${_baseUrl}api/admin/order/address/`; const editAddressUrl = `${_baseUrl}api/admin/order/address/`;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment