订单模块联调
This commit is contained in:
parent
4c69fcbe62
commit
f3501d4385
@ -5,7 +5,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicts } from '@/api/system/dict/data';
|
||||
export default {
|
||||
props: ['radioData', 'size', 'value', 'showAll', 'filter'],
|
||||
emits: ['change', 'input'],
|
||||
@ -24,32 +23,15 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
async created() {
|
||||
if (this.radioData) {
|
||||
this.getEmuList();
|
||||
const resDic = await this.getDictionaryByKey(this.radioData);
|
||||
this.dictList = resDic;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(val) {
|
||||
this.$emit('change', val);
|
||||
},
|
||||
|
||||
getEmuList() {
|
||||
getDicts(this.radioData)
|
||||
.then((res) => {
|
||||
const { code, data = [] } = res || {};
|
||||
if (code == 200) {
|
||||
const dicArr = data.map((p) => {
|
||||
return { label: p.dictLabel, value: p.dictValue, elTagType: p.listClass, elTagClass: p.cssClass };
|
||||
});
|
||||
this.dictList = dicArr || [];
|
||||
} else {
|
||||
this.dictList = [];
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.dictList = [];
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -7,7 +7,7 @@ import auth from './auth';
|
||||
import animate from '@/animate';
|
||||
|
||||
import { download as dl } from '@/utils/request';
|
||||
import { useDict } from '@/utils/dict';
|
||||
import { useDict, getDictionaryByKey } from '@/utils/dict';
|
||||
import { getConfigKey, updateConfigByKey } from '@/api/system/config';
|
||||
import {
|
||||
parseTime,
|
||||
@ -56,4 +56,5 @@ export default function installPlugin(app: App) {
|
||||
app.config.globalProperties.addDateRange2 = addDateRange2;
|
||||
app.config.globalProperties.getHiddenName = getHiddenName;
|
||||
app.config.globalProperties.getHiddenDetailAddress = getHiddenDetailAddress;
|
||||
app.config.globalProperties.getDictionaryByKey = getDictionaryByKey;
|
||||
}
|
||||
|
@ -21,6 +21,7 @@ export const useMallStore = defineStore('mall', () => {
|
||||
if (!force && state.value.areaSelect.length > 0) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
|
||||
return areaSelect({}).then((res) => {
|
||||
state.value.areaSelect = res.data;
|
||||
});
|
||||
|
@ -1,5 +1,7 @@
|
||||
import { getDicts } from '@/api/system/dict/data';
|
||||
import { useDictStore } from '@/store/modules/dict';
|
||||
import { TUIChatService } from '@tencentcloud/chat-uikit-engine';
|
||||
import { IChatResponese } from '@/TUIKit/interface';
|
||||
/**
|
||||
* 获取字典数据
|
||||
*/
|
||||
@ -24,3 +26,21 @@ export const useDict = (...args: string[]): { [key: string]: DictDataOption[] }
|
||||
});
|
||||
return res.value;
|
||||
};
|
||||
|
||||
// 根据key获取指定枚举值
|
||||
export const getDictionaryByKey = (args: string): DictDataOption[] => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const dicts = useDictStore().getDict(args);
|
||||
if (dicts) {
|
||||
resolve(dicts);
|
||||
} else {
|
||||
getDicts(args).then((resp) => {
|
||||
const resDic = resp.data.map(
|
||||
(p): DictDataOption => ({ label: p.dictLabel, value: p.dictValue, elTagType: p.listClass, elTagClass: p.cssClass })
|
||||
);
|
||||
useDictStore().setDict(args, resDic);
|
||||
resolve(resDic);
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
@ -17,7 +17,7 @@
|
||||
import { useMallStore } from '@/store/modules/mall';
|
||||
export default {
|
||||
name: 'AddressSelector',
|
||||
props: ['value', 'props', 'size'],
|
||||
props: ['modelValue', 'props', 'size'],
|
||||
computed: {
|
||||
areaSelect: {
|
||||
get() {
|
||||
@ -26,18 +26,19 @@ export default {
|
||||
},
|
||||
tempValue: {
|
||||
get() {
|
||||
return this.value;
|
||||
return this.modelValue;
|
||||
},
|
||||
set(v) {
|
||||
this.$emit('input', v);
|
||||
this.$emit('update:modelValue', v);
|
||||
}
|
||||
},
|
||||
menuOptions() {
|
||||
if (!this.areaSelect || this.areaSelect.length === 0) {
|
||||
return [];
|
||||
} else {
|
||||
const afterHandled = this.recurs(this.areaSelect);
|
||||
return afterHandled;
|
||||
}
|
||||
this.recurs(this.areaSelect);
|
||||
return this.areaSelect;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -45,12 +46,16 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
recurs(list) {
|
||||
list.forEach((it) => {
|
||||
it.label = it.name;
|
||||
it.value = it.name;
|
||||
return list.map((it) => {
|
||||
const resItem = {
|
||||
...it,
|
||||
label: it.name,
|
||||
value: it.name
|
||||
};
|
||||
if (it.children) {
|
||||
this.recurs(it.children);
|
||||
resItem.children = this.recurs(it.children);
|
||||
}
|
||||
return resItem;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -167,7 +167,6 @@ function imLogin(loginInfo) {
|
||||
// TUIUserService.switchUserStatus({ displayOnlineStatus: true });
|
||||
})
|
||||
.catch((error: any) => {
|
||||
console.info('111111111111111111111111', error);
|
||||
ElMessage({
|
||||
message: '登录失败',
|
||||
grouping: true,
|
||||
|
@ -1,168 +1,148 @@
|
||||
<template>
|
||||
<div class="order_detail_wrapper">
|
||||
<el-main v-loading="loading">
|
||||
<el-card class="mt10">
|
||||
<div slot="header" class="clearfix">
|
||||
<span style="font-size: 16px;font-weight: bold">订单进程</span>
|
||||
<el-button style="float: right;" size="small" @click="$router.back()">返回</el-button>
|
||||
</div>
|
||||
<el-steps :active="active" align-center>
|
||||
<el-step title="买家下单" :description="parseTime(orderDetail.createTime, '')"></el-step>
|
||||
<el-step title="买家付款" :description="parseTime(orderDetail.payTime, '')"></el-step>
|
||||
<el-step title="商家发货" :description="parseTime(orderDetail.deliveryTime, '')"></el-step>
|
||||
<el-step title="买家收货" :description="parseTime(orderDetail.receiveTime, '')"></el-step>
|
||||
</el-steps>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="订单信息" :column="2" border label-class-name="my-label" contentClassName="my-content">
|
||||
<!-- <template slot="extra">-->
|
||||
<!-- <el-button size="small" @click="$router.back()">返回</el-button>-->
|
||||
<!-- </template>-->
|
||||
<el-descriptions-item label="订单编号">{{ orderDetail.orderSn }}</el-descriptions-item>
|
||||
<el-descriptions-item label="用户名称">{{ orderDetail.userName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="用户手机号">{{ orderDetail.userPhone }}</el-descriptions-item>
|
||||
<el-descriptions-item label="下单时间">{{ parseTime(orderDetail.createTime, '') }}</el-descriptions-item>
|
||||
<el-descriptions-item label="支付方式">{{ getPayType(orderDetail) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="支付时间">{{ parseTime(orderDetail.payTime, '')
|
||||
}}</el-descriptions-item>
|
||||
<el-descriptions-item label="订单状态">{{ getOrderStatus(orderDetail) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="收货信息" :column="2" border label-class-name="my-label" contentClassName="my-content">
|
||||
<el-descriptions-item label="收货人姓名">{{ getHiddenName(addressInfo.name) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="收货人手机号">{{ addressInfo.userPhone }}</el-descriptions-item>
|
||||
<el-descriptions-item label="收货区域">{{ addressInfo.area }}</el-descriptions-item>
|
||||
<el-descriptions-item label="详细地址">{{ getHiddenDetailAddress(addressInfo.address) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<div slot="header" style="font-size: 16px;font-weight: bold;">商品信息</div>
|
||||
<el-table :data="products">
|
||||
<el-table-column label="商品图片" prop="pic">
|
||||
<template slot-scope="{row}"><el-image class="small-img circle-img" :src="row.pic"
|
||||
:preview-src-list="[row.pic]" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品ID" prop="productId"></el-table-column>
|
||||
<el-table-column label="商品名称" prop="productName"></el-table-column>
|
||||
<el-table-column label="商品规格" align="center" prop="spData" width="180">
|
||||
<template slot-scope="scope">
|
||||
<div v-for="(item,key) in JSON.parse(scope.row.spData)">{{ key }}:{{ item }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="购买数量" prop="buyNum"></el-table-column>
|
||||
<el-table-column label="实付金额" prop="payAmount">
|
||||
<template slot-scope="scope">
|
||||
<span>¥{{ orderDetail.payAmount }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="物流信息" :column="3" border label-class-name="my-label" contentClassName="my-content">
|
||||
<el-descriptions-item label="发货时间">{{ parseTime(orderDetail.deliveryTime, '')
|
||||
}}</el-descriptions-item>
|
||||
<el-descriptions-item label="快递单号">{{ orderDetail.expressNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="物流公司">{{ orderDetail.expressName }}</el-descriptions-item>
|
||||
<!-- <el-descriptions-item label="物流进度">-->
|
||||
<!-- <el-popover placement="top" width="300" trigger="hover" popper-class="popperOptions">-->
|
||||
<!-- <el-timeline-item v-for="(activity, index) in aliLogisticsInfoList" :key="index"-->
|
||||
<!-- :timestamp="activity.time">-->
|
||||
<!-- {{ activity.context }}-->
|
||||
<!-- </el-timeline-item>-->
|
||||
<!-- <span slot="reference">{{ orderDetail.logistics }}</span>-->
|
||||
<!-- </el-popover>-->
|
||||
<!-- </el-descriptions-item>-->
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-main>
|
||||
</div>
|
||||
<div class="order_detail_wrapper">
|
||||
<el-main v-loading="loading">
|
||||
<el-card class="mt10">
|
||||
<template v-slot:header>
|
||||
<div class="clearfix">
|
||||
<span style="font-size: 16px; font-weight: bold">订单进程</span>
|
||||
<el-button style="float: right" size="small" @click="$router.back()">返回</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<el-steps :active="active" align-center>
|
||||
<el-step title="买家下单" :description="parseTime(orderDetail.createTime, '')"></el-step>
|
||||
<el-step title="买家付款" :description="parseTime(orderDetail.payTime, '')"></el-step>
|
||||
<el-step title="商家发货" :description="parseTime(orderDetail.deliveryTime, '')"></el-step>
|
||||
<el-step title="买家收货" :description="parseTime(orderDetail.receiveTime, '')"></el-step>
|
||||
</el-steps>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="订单信息" :column="2" border label-class-name="my-label" contentClassName="my-content">
|
||||
<!-- <template slot="extra">-->
|
||||
<!-- <el-button size="small" @click="$router.back()">返回</el-button>-->
|
||||
<!-- </template>-->
|
||||
<el-descriptions-item label="订单编号">{{ orderDetail.orderSn }}</el-descriptions-item>
|
||||
<el-descriptions-item label="用户名称">{{ orderDetail.userName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="用户手机号">{{ orderDetail.userPhone }}</el-descriptions-item>
|
||||
<el-descriptions-item label="下单时间">{{ parseTime(orderDetail.createTime, '') }}</el-descriptions-item>
|
||||
<el-descriptions-item label="支付方式">{{ getPayType(orderDetail) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="支付时间">{{ parseTime(orderDetail.payTime, '') }}</el-descriptions-item>
|
||||
<el-descriptions-item label="订单状态">{{ getOrderStatus(orderDetail) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="收货信息" :column="2" border label-class-name="my-label" contentClassName="my-content">
|
||||
<el-descriptions-item label="收货人姓名">{{ getHiddenName(addressInfo.name) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="收货人手机号">{{ addressInfo.userPhone }}</el-descriptions-item>
|
||||
<el-descriptions-item label="收货区域">{{ addressInfo.area }}</el-descriptions-item>
|
||||
<el-descriptions-item label="详细地址">{{ getHiddenDetailAddress(addressInfo.address) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<template v-slot:header>
|
||||
<div style="font-size: 16px; font-weight: bold">商品信息</div>
|
||||
</template>
|
||||
<el-table :data="products">
|
||||
<el-table-column label="商品图片" prop="pic">
|
||||
<template v-slot="{ row }"><el-image class="small-img circle-img" :src="row.pic" :preview-src-list="[row.pic]" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品ID" prop="productId"></el-table-column>
|
||||
<el-table-column label="商品名称" prop="productName"></el-table-column>
|
||||
<el-table-column label="商品规格" align="center" prop="spData" width="180">
|
||||
<template v-slot="scope">
|
||||
<div v-for="(item, key) in JSON.parse(scope.row.spData)">{{ key }}:{{ item }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="购买数量" prop="buyNum"></el-table-column>
|
||||
<el-table-column label="实付金额" prop="payAmount">
|
||||
<template v-slot="scope">
|
||||
<span>¥{{ orderDetail.payAmount }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<el-descriptions title="物流信息" :column="3" border label-class-name="my-label" contentClassName="my-content">
|
||||
<el-descriptions-item label="发货时间">{{ parseTime(orderDetail.deliveryTime, '') }}</el-descriptions-item>
|
||||
<el-descriptions-item label="快递单号">{{ orderDetail.expressNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="物流公司">{{ orderDetail.expressName }}</el-descriptions-item>
|
||||
<!-- <el-descriptions-item label="物流进度">-->
|
||||
<!-- <el-popover placement="top" width="300" trigger="hover" popper-class="popperOptions">-->
|
||||
<!-- <el-timeline-item v-for="(activity, index) in aliLogisticsInfoList" :key="index"-->
|
||||
<!-- :timestamp="activity.time">-->
|
||||
<!-- {{ activity.context }}-->
|
||||
<!-- </el-timeline-item>-->
|
||||
<!-- <span slot="reference">{{ orderDetail.logistics }}</span>-->
|
||||
<!-- </el-popover>-->
|
||||
<!-- </el-descriptions-item>-->
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOmsOrder } from "@/api/oms/order";
|
||||
import { getConfigKey } from "@/api/system/config";
|
||||
const key = "express-set-key"
|
||||
import { getOmsOrder } from '@/api/oms/order';
|
||||
const key = 'express-set-key';
|
||||
|
||||
export default {
|
||||
name: "OrderDetail",
|
||||
dicts: ['oms_order_status', 'oms_pay_type'],
|
||||
data() {
|
||||
return {
|
||||
products: [],
|
||||
orderDetail: {},
|
||||
addressInfo: {},
|
||||
aliLogisticsInfoList: [],
|
||||
loading: false,
|
||||
experssList: [],
|
||||
active: 1
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.getExpressData()
|
||||
const { id } = this.$route.query
|
||||
this.queryDetail(id).then((expressNo) => {
|
||||
name: 'OrderDetail',
|
||||
dicts: ['oms_order_status', 'oms_pay_type'],
|
||||
data() {
|
||||
return {
|
||||
products: [],
|
||||
orderDetail: {},
|
||||
addressInfo: {},
|
||||
aliLogisticsInfoList: [],
|
||||
loading: false,
|
||||
experssList: [],
|
||||
active: 1,
|
||||
payTypeMap: [],
|
||||
orderStatusMap: []
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
const { id } = this.$route.query;
|
||||
this.queryDetail(id);
|
||||
const orderStatusMap = await this.getDictionaryByKey('oms_order_status');
|
||||
const payTypeMap = await this.getDictionaryByKey('oms_pay_type');
|
||||
this.orderStatusMap = orderStatusMap;
|
||||
this.payTypeMap = payTypeMap;
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
queryDetail(id) {
|
||||
this.loading = true;
|
||||
return new Promise((resolve) =>
|
||||
getOmsOrder(id).then((res) => {
|
||||
const { productInfo, addressInfo } = res;
|
||||
this.orderDetail = res;
|
||||
this.products = productInfo;
|
||||
this.addressInfo = addressInfo;
|
||||
if (this.orderDetail.orderStatus <= 3) {
|
||||
this.active = this.orderDetail.orderStatus + 1;
|
||||
} else {
|
||||
this.active = 1;
|
||||
}
|
||||
this.loading = false;
|
||||
})
|
||||
|
||||
);
|
||||
},
|
||||
computed: {
|
||||
orderStatusMap() {
|
||||
let obj = this.dict.type.oms_order_status.map(item => [item.value, item.label])
|
||||
let map = new Map(obj)
|
||||
return map;
|
||||
},
|
||||
payTypeMap() {
|
||||
let obj = this.dict.type.oms_pay_type.map(item => [item.value, item.label])
|
||||
let map = new Map(obj)
|
||||
return map
|
||||
},
|
||||
// expressMap() {
|
||||
// let obj = this.experssList.map(item => [item.expressCode, item.expressName])
|
||||
// let map = new Map(obj)
|
||||
// return map
|
||||
// }
|
||||
getOrderStatus(row) {
|
||||
const { label = '' } =
|
||||
this.orderStatusMap.find((item) => {
|
||||
return row.orderStatus == item.value;
|
||||
}) || {};
|
||||
return label;
|
||||
},
|
||||
methods: {
|
||||
queryDetail(id) {
|
||||
this.loading = true
|
||||
return new Promise(resolve =>
|
||||
getOmsOrder(id).then(res => {
|
||||
const { productInfo, addressInfo } = res;
|
||||
this.orderDetail = res;
|
||||
// if (allLogistics) {
|
||||
// this.aliLogisticsInfoList = JSON.parse(allLogistics)
|
||||
// }
|
||||
this.products = productInfo
|
||||
this.addressInfo = addressInfo
|
||||
if (this.orderDetail.orderStatus <= 3){
|
||||
this.active = this.orderDetail.orderStatus + 1
|
||||
}else {
|
||||
this.active = 1
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
)
|
||||
},
|
||||
getOrderStatus(row) {
|
||||
return this.orderStatusMap.get(row.orderStatus + '')
|
||||
},
|
||||
getPayType(row) {
|
||||
return this.payTypeMap.get(row.payType + '')
|
||||
},
|
||||
// getExpressName(row) {
|
||||
// return this.expressMap.get(row.expressName + '')
|
||||
// },
|
||||
// getExpressData() {
|
||||
// getConfigKey(key).then(res => {
|
||||
// if (res.msg) {
|
||||
// this.experssList = JSON.parse(res.msg)
|
||||
// } else {
|
||||
// // this.list = [...defaultList]
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
getPayType(row) {
|
||||
const { label = '' } =
|
||||
this.payTypeMap.find((item) => {
|
||||
return row.orderStatus == item.value;
|
||||
}) || {};
|
||||
return label;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
@ -203,4 +183,4 @@ export default {
|
||||
.el-timeline-item__timestamp {
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
@ -248,7 +248,6 @@ import {
|
||||
} from '@/api/oms/order';
|
||||
import AddressSelector from '@/views/components/AddressSelector/index.vue';
|
||||
import dateUtil, { dateFormat } from '@/utils/DateUtil';
|
||||
import { isStarRepo } from '@/utils/is-star-plugin';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
|
||||
export default {
|
||||
@ -363,29 +362,19 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
const res = await isStarRepo(
|
||||
'zccbbg',
|
||||
'RuoYi-Mall',
|
||||
this.userId,
|
||||
'https://mall.ichengle.top/order/order',
|
||||
'ruoyi-mall-商城',
|
||||
'https://gitee.com/zccbbg/RuoYi-Mall'
|
||||
);
|
||||
this.show = res;
|
||||
if (res) {
|
||||
const { phone, status, today } = this.$route.query;
|
||||
if (phone) {
|
||||
this.queryParams.userPhone = phone;
|
||||
}
|
||||
if (status) {
|
||||
this.queryParams.status = status;
|
||||
}
|
||||
if (today) {
|
||||
this.setToday();
|
||||
}
|
||||
this.getList();
|
||||
mounted() {
|
||||
this.show = true;
|
||||
const { phone, status, today } = this.$route.query;
|
||||
if (phone) {
|
||||
this.queryParams.userPhone = phone;
|
||||
}
|
||||
if (status) {
|
||||
this.queryParams.status = status;
|
||||
}
|
||||
if (today) {
|
||||
this.setToday();
|
||||
}
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 日期组件设置为今天 */
|
||||
|
@ -25,7 +25,7 @@ export default defineConfig(({ mode, command }) => {
|
||||
proxy: {
|
||||
[env.VITE_APP_BASE_API]: {
|
||||
// target: 'http://192.168.1.250:8080',
|
||||
target: 'http://111.62.22.190:8080',
|
||||
target: 'http://192.168.1.250:8080',
|
||||
changeOrigin: true,
|
||||
ws: true,
|
||||
rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), ''),
|
||||
|
Loading…
x
Reference in New Issue
Block a user