Skip to content

M
million
Commit 8ba78f0e authored by 罗超's avatar 罗超
Browse files
Options

修改订单列表

parent 39e00b69
Show whitespace changes
Inline Side-by-side
Showing with 245 additions and 136 deletions
quasar.conf.js
View file @ 8ba78f0e
...@@ -183,7 +183,8 @@ module.exports = function( /* ctx */ ) { ...@@ -183,7 +183,8 @@ module.exports = function( /* ctx */ ) {
plugins: [ plugins: [
"Meta", "Meta",
"Notify", "Notify",
'Loading' 'Loading',
'Dialog'
] ]
}, },
......
src/boot/utils.js
View file @ 8ba78f0e
...@@ -26,7 +26,7 @@ Vue.prototype.domainManager = function() { ...@@ -26,7 +26,7 @@ Vue.prototype.domainManager = function() {
domainUrl = "http://testapi.oytour.com"; domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) { } else if (domainNameUrl.indexOf('oytour') !== -1) {
// domainUrl = "http://reborn.oytour.com"; // domainUrl = "http://reborn.oytour.com";
domainUrl = 'http://192.168.10.11:8083' //'http://192.168.10.206:8015' ''http://192.168.10.11:8083' ' domainUrl = 'http://192.168.10.206:8015' //'http://192.168.10.206:8015' ''http://192.168.10.11:8083' '
} }
var obj = { var obj = {
//主地址 //主地址
......
src/components/navs/city-category.vue
View file @ 8ba78f0e
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
<style scoped> <style scoped>
.header-box { .header-box {
max-width: 1200px; max-width: 1200px;
......
src/components/navs/hor-big-one.vue
View file @ 8ba78f0e
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
<style scoped> <style scoped>
.header-box { .header-box {
max-width: 1200px; max-width: 1200px;
......
src/pages/usercenter/order.vue
View file @ 8ba78f0e
...@@ -88,8 +88,8 @@ ...@@ -88,8 +88,8 @@
} }
</style> </style>
<template> <template>
<div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'"> <div :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'" style="min-height:80vh">
<div class="flex justify-between margin"> <!-- <div class="flex justify-between margin">
<div :class="$q.platform.is.desktop ? 'form-item': 'full-width'"> <div :class="$q.platform.is.desktop ? 'form-item': 'full-width'">
<q-input <q-input
placeholder="輸入商品名稱/訂單號" placeholder="輸入商品名稱/訂單號"
...@@ -109,141 +109,202 @@ ...@@ -109,141 +109,202 @@
{{ item.Name }} {{ item.Name }}
<div :class="orderStatus === item.ID ? 'border-bottom' : ''"></div> <div :class="orderStatus === item.ID ? 'border-bottom' : ''"></div>
</div> </div>
</div> -->
<div class="row items-center">
<q-btn-dropdown color="dark" flat dense :label="`訂單狀態：${orderStatusFiled}`" class="q-px-md">
<q-list>
<q-item clickable v-close-popup v-for="item in orderEnums" :key="item.ID" @click="changeOrderType(item)">
<q-item-section>
<q-item-label>{{ item.Name }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
<q-btn-dropdown color="dark" flat dense :label="`商品類型：${productTypeFiled}`" class="q-px-md">
<q-list>
<q-item clickable v-close-popup v-for="(x,i) in productTypes" :key="i" @click="changeProductTypeHandler(x)">
<q-item-section>
<q-item-label>{{ x.desc }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
<q-space />
<div>
<q-input standout dense v-model="msg.GoodsName" label="商品名稱/訂單編號" @keypress.enter.native="initListHandler" >
<template v-slot:prepend>
<q-icon name="search" />
</template>
</q-input>
</div> </div>
<!-- pc -->
<div v-if="$q.platform.is.desktop">
<div class="card" v-for="item in orderList" :key="item.id">
<div class="flex card-title justify-between">
<div class="flex">
<span><span class="text-grey-6">订单号:</span>{{ item.orderNo }}</span>
<span class="phone text-grey-6">
<i class="iconfont iconmessage"></i>
联系客服
</span>
</div>
<span class="text-grey-6">{{ item.createTimeStr }}</span>
</div>
<div class="flex justify-between">
<div class="name flex no-wrap">
<img class="product-img mr" :src="item.goodsPic" />
<div style="max-width: 300px">
<div class="ellipsis-2">{{ item.goodsName }}</div>
<div>x1</div>
</div>
</div>
<div class="flex">
<div class="user-name text-center">
<i class="iconfont iconpeople1"></i>{{ item.surName
}} {{ item.name }}
</div>
<div class="pay-info text-center">
<div class=" text-grey-6">CNY{{ item.totalPrice }}</div>
<div>{{ item.payTypeStr }}</div>
</div>
<div class="order-info text-center">
<div class="primary">{{item.orderStatusStr}}</div>
<div class="q-mt-sm cursor-pointer">订单详情</div>
</div> </div>
<div class="order-action text-center">
<q-btn <q-card class="rounded-borders q-pa-md q-mt-md" flat v-for="item in orderList" :key="item.id">
color="primary" <div class="row justify-between items-center">
@click="cancalOrder(item)" <div>
unelevated <q-chip size="12px" :class="[item.goodTypeEnum.bgColor,item.goodTypeEnum.color]" square>{{ item.goodTypeEnum?item.goodTypeEnum.desc:'' }}</q-chip>
outline <span class="f12 q-ml-md text-grey-5">訂單編號：#{{ item.orderNo }}</span>
size="sm"
label="取消订单">
</q-btn>
<div>查看發票</div>
</div> </div>
<div class="text-grey-5">下單日期：{{ item.createTimeStr }}</div>
<div class="row items-center">
<q-icon :name="item.orderStatusInfo.icon" :class="[item.orderStatusInfo.color]" size="14px" />
<span class="q-ml-sm" :class="[item.orderStatusInfo.color]">{{ item.orderStatusInfo.desc }}</span>
</div> </div>
</div> </div>
<div class="q-mt-sm row">
<q-img
:src="item.goodsPic"
class="rounded-borders q-mr-md"
spinner-color="grey-2"
style="width: 150px;height:80px;"
/>
<div class="col">
<div class="text-body1 ellipsis cursor-pointer" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')">{{ item.goodsName }}</div>
<div class="q-mt-sm text-grey-5">{{ item.orderMake }} </div>
<div class="q-mt-sm text-grey-8 f12 row items-center">
<q-icon name="iconfont iconpeople1" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.surName }}/{{ item.name }}</span>
<q-icon name="iconfont icontelephone" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.contactNumber }}</span>
<q-icon name="iconfont iconemail" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.mailbox }}</span>
</div> </div>
</div> </div>
<!-- mobile --> <div class="q-ml-lg">
<div v-else> <div class="text-right">
<div class="card" v-for="item in orderList" :key="item.id"> <span>CNY:</span>
<div class="flex card-title justify-between"> <span class="text-h6 q-ml-sm">{{ moneyFormat(item.totalPrice,2) }}</span>
<div class="flex">
<span><span class="text-grey-6">订单号:</span>{{ item.orderNo }}</span>
</div> </div>
<span class="text-grey-6">{{ item.orderStatusStr }}</span> <div class="q-mt-md text-right" v-if="item.orderStatus==1">
<!-- <q-btn color="dark" dense flat class="q-px-sm" label="查看訂單" /> -->
<q-btn color="primary" dense flat class="q-px-sm" label="取消訂單" @click="cancalOrder(item.orderNo)" />
<q-btn color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click="CommonJump('/pay/'+item.orderNo,{},'blank')" />
</div> </div>
<div class="q-pa-md"> <div class="q-mt-md text-right" v-else>
<div class="flex no-wrap full-width"> <q-btn color="dark" dense flat class="q-px-sm" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')" label="查看訂單" />
<img class="product-img mr flex-noShark" :src="item.goodsPic" />
<div>
<div class="ellipsis-2">{{ item.goodsName }}</div>
<div>x1</div>
</div> </div>
</div> </div>
<div>
<!-- <div>
<i class="iconfont iconpeople1"></i>{{ item.surName
}} {{ item.name }}
</div> -->
<div>
<div class="f18 text-right">CNY{{ item.totalPrice }}</div>
<!-- <div>{{ item.payTypeStr }}</div> -->
</div> </div>
<!-- <div> </q-card>
<div class="primary">{{item.orderStatusStr}}</div> <div class="row justify-end q-mt-lg">
<div class="q-mt-sm cursor-pointer">订单详情</div> <q-pagination
</div> --> v-if="pageCount > 1"
<div class="flex justify-end q-mt-sm"> v-model="msg.pageIndex"
<q-btn :max="pageCount"
color="primary" @input="getOrderList"
@click="cancalOrder(item)" :direction-links="true"
color="white"
text-color="dark"
active-color="primary"
active-text-color="white"
active-design="unelevated"
unelevated unelevated
outline glossy
size="sm" ellipses
label="取消订单"> :max-pages="6"
</q-btn> boundary-numbers
</div> size="13px"
</div> padding="sm md"
</div> ></q-pagination>
</div> </div>
<!-- <noneData v-show="!orderList.length"></noneData> -->
<div class="text-center" v-if="!orderList || orderList.length==0">
<none-data
iconType="order"
title="沒有找到您的訂單信息哦"
subtitle="趕緊去挑選心儀的旅遊產品吧"
></none-data>
</div> </div>
<noneData v-show="!orderList.length"></noneData>
</div> </div>
</template> </template>
<script> <script>
import noneData from "../../components/noneData.vue"; import NoneData from "src/components/common/noneData.vue";
import {mappingListType,transProductEnum} from "src/utils/producttypeenum";
import EnumHelper from 'src/utils/enumhelper';
import OrderStatusEnum from 'src/utils/orderStautsEnum';
import ListProductTypeEnum from 'src/utils/listProductType';
export default { export default {
components: { components: {
noneData, NoneData,
}, },
data() { data() {
return { return {
orderEnums: [], orderEnums: [],
GoodsName: '',
orderList: [], orderList: [],
current: 1, current: 1,
pageCount: 0, pageCount: 0,
orderStatus: 0, orderStatusFiled:'',
productTypeFiled:'',
msg:{
pageSize:10,
pageIndex:1,
OrderStatus: 0,
GoodsName: '',
OrderTypeStr:''
},
productTypes:[]
}; };
}, },
mounted() { mounted() {
this.productTypes = Object.values(ListProductTypeEnum).filter(x=>x.value!=3)
this.productTypes.splice(0,0,{
value:'',
desc:'全部類型'
})
this.productTypeFiled=this.productTypes[0].desc
this.type = this.$route.query.type this.type = this.$route.query.type
if(this.type) { if(this.type) {
this.orderStatus = Number(this.type) this.msg.OrderStatus = Number(this.type)
} }
this.getOrderEnums(); this.getOrderEnums();
this.getOrderList(); this.getOrderList();
}, },
methods: { methods: {
cancalOrder() {}, cancalOrder(OrderNo) {
console.log(this.$q.dialog)
this.$q.dialog({
title: '取消確認',
message: '訂單取消後，系統將立即釋放位置，請問是否執行?',
cancel: true,
persistent: true
}).onOk(() => {
this.apipost('GetCancelOrder_post',{OrderNo},r=>{
if(r.data.resultCode==1){
this.$message.success('訂單取消成功')
this.getOrderList()
}else{
this.$message.error('訂單取消失敗，請重新嘗試')
}
})
}).onCancel(() => {
// console.log('>>>> Cancel')
})
},
pageChange(value) { pageChange(value) {
this.current = value; this.current = value;
this.getOrderList(); this.getOrderList();
}, },
changeOrderType(item) { changeOrderType(item) {
if (this.orderStatus === item.ID) { if (this.msg.OrderStatus != item.ID) {
this.orderStatus = 0; this.msg.OrderStatus = item.ID
} else { this.orderStatusFiled = item.Name
this.orderStatus = item.ID; this.initListHandler()
}
},
changeProductTypeHandler(x){
if(x.desc!=this.productTypeFiled){
this.msg.OrderTypeStr = x.value==''?'':transProductEnum(x.value).join(',')
this.productTypeFiled = x.desc
this.initListHandler()
} }
this.current = 1; },
initListHandler(){
this.msg.pageIndex = 1;
this.pageCount = 0; this.pageCount = 0;
this.orderList = []; this.orderList = [];
this.getOrderList(); this.getOrderList();
...@@ -254,15 +315,13 @@ export default { ...@@ -254,15 +315,13 @@ export default {
{}, {},
(res) => { (res) => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.orderEnums = res.data.data; this.orderEnums = res.data.data;
this.orderEnums.splice(0,0,{ID:0,Name:'全部訂單'})
console.log(this.orderEnums)
this.orderStatusFiled = this.orderEnums[0].Name
} else { } else {
// this.$notify(res.data.message); this.$message.error(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
} }
}, },
null null
...@@ -271,26 +330,19 @@ export default { ...@@ -271,26 +330,19 @@ export default {
getOrderList() { getOrderList() {
this.apipost( this.apipost(
"GetMyDirectOrderPageList_post", "GetMyDirectOrderPageList_post",
{ this.msg,
pageIndex: this.current,
pageSize: 10,
orderStatus: this.orderStatus,
GoodsName: this.GoodsName,
},
(res) => { (res) => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
const { count, pageData, pageCount } = res.data.data; const { count, pageData, pageCount } = res.data.data;
this.count = count; this.count = count;
this.pageCount = pageCount; this.pageCount = pageCount;
this.orderList = pageData; this.orderList = pageData;
this.orderList.forEach(x=>{
x.goodTypeEnum = mappingListType(x.goodsType)
x.orderStatusInfo = EnumHelper.ParseToEnum(OrderStatusEnum,x.orderStatus,'value')
})
} else { } else {
// this.$notify(res.data.message); this.$message.error(res.data.message)
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
} }
}, },
null null
......
src/utils/enumhelper.js
View file @ 8ba78f0e
...@@ -2,7 +2,6 @@ const EnumHelper = { ...@@ -2,7 +2,6 @@ const EnumHelper = {
ParseToEnum(TEnum, value, comparison = '') { ParseToEnum(TEnum, value, comparison = '') {
if (Object.isFrozen) { if (Object.isFrozen) {
let t = Object.values(TEnum) let t = Object.values(TEnum)
console.log(t, Symbol(1) == 1)
let r = t.find(x => (comparison != '' && x[comparison] == value) || (comparison == '' && x == value)) let r = t.find(x => (comparison != '' && x[comparison] == value) || (comparison == '' && x == value))
return r return r
} else { } else {
......
src/utils/listProductType.js
View file @ 8ba78f0e
...@@ -2,23 +2,33 @@ const ListProductTypeEnum = Object.freeze({ ...@@ -2,23 +2,33 @@ const ListProductTypeEnum = Object.freeze({
TRIP: { TRIP: {
value: 1, value: 1,
desc: '線路旅遊' desc: '線路旅遊',
bgColor: 'bg-pink-2',
color: 'text-pink'
}, },
SCENIC: { SCENIC: {
value: 2, value: 2,
desc: '景點門票' desc: '景點門票',
bgColor: 'bg-purple-2',
color: 'text-purple'
}, },
HOTEL: { HOTEL: {
value: 3, value: 3,
desc: '酒店住宿' desc: '酒店住宿',
bgColor: 'bg-indigo-2',
color: 'text-indigo'
}, },
CAR: { CAR: {
value: 4, value: 4,
desc: '目的地用車' desc: '目的地用車',
bgColor: 'bg-teal-2',
color: 'text-teal'
}, },
JALAN: { JALAN: {
value: 5, value: 5,
desc: '酒店住宿' desc: '酒店住宿',
bgColor: 'bg-indigo-2',
color: 'text-indigo'
}, },
}) })
......
src/utils/orderStautsEnum.js 0 → 100644
View file @ 8ba78f0e
const OrderStatusEnum = Object.freeze({
UN_PAY: {
value: 1,
desc: '待付款',
icon: 'iconfont icontime1',
color: 'text-orange'
},
PAYED: {
value: 2,
desc: '待出行',
icon: 'iconfont iconflag',
color: 'text-green'
},
FINISH: {
value: 3,
desc: '已完成',
icon: 'iconfont iconsuccess',
color: 'text-dark'
},
CANCEL: {
value: 4,
desc: '已取消',
icon: 'iconfont iconminus',
color: 'text-grey-6'
}
})
export default OrderStatusEnum
\ No newline at end of file
src/utils/producttypeenum.js
View file @ 8ba78f0e
import EnumHelper from "./enumhelper"
import ListProductTypeEnum from "./listProductType"
const ProductTypeEnum = Object.freeze({ const ProductTypeEnum = Object.freeze({
/** /**
* 一日游 * 一日游
...@@ -112,4 +115,29 @@ const ProductTypeEnum = Object.freeze({ ...@@ -112,4 +115,29 @@ const ProductTypeEnum = Object.freeze({
}) })
const mappingRules = [
[-1],
[1, 2, 3],
[4, 5, 6, 7],
[-1],
[12, 13, 14],
[8, 9, 10, 11]
]
const mappingListType = (value) => {
let val = mappingRules.findIndex(x => {
return x.indexOf(value) != -1
})
if (val && val > 0) {
return EnumHelper.ParseToEnum(ListProductTypeEnum, val, 'value')
}
return {}
}
const transProductEnum = (value) => {
return mappingRules[value]
}
export default ProductTypeEnum export default ProductTypeEnum
export { mappingListType, transProductEnum }
\ No newline at end of file
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