Skip to content

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

修改订单列表

parent 39e00b69
Hide 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 */ ) {
plugins: [
"Meta",
"Notify",
'Loading'
'Loading',
'Dialog'
]
},
......
src/boot/utils.js
View file @ 8ba78f0e
......@@ -26,7 +26,7 @@ Vue.prototype.domainManager = function() {
domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) {
// 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 = {
//主地址
......
src/components/navs/city-category.vue
View file @ 8ba78f0e
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
<style scoped>
.header-box {
max-width: 1200px;
......
src/components/navs/hor-big-one.vue
View file @ 8ba78f0e
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
<style scoped>
.header-box {
max-width: 1200px;
......
src/pages/usercenter/order.vue
View file @ 8ba78f0e
......@@ -88,8 +88,8 @@
}
</style>
<template>
<div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="flex justify-between margin">
<div :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'" style="min-height:80vh">
<!-- <div class="flex justify-between margin">
<div :class="$q.platform.is.desktop ? 'form-item': 'full-width'">
<q-input
placeholder="輸入商品名稱/訂單號"
......@@ -109,141 +109,202 @@
{{ item.Name }}
<div :class="orderStatus === item.ID ? 'border-bottom' : ''"></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>
<q-card class="rounded-borders q-pa-md q-mt-md" flat v-for="item in orderList" :key="item.id">
<div class="row justify-between items-center">
<div>
<q-chip size="12px" :class="[item.goodTypeEnum.bgColor,item.goodTypeEnum.color]" square>{{ item.goodTypeEnum?item.goodTypeEnum.desc:'' }}</q-chip>
<span class="f12 q-ml-md text-grey-5">訂單編號：#{{ item.orderNo }}</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 class="order-action text-center">
<q-btn
color="primary"
@click="cancalOrder(item)"
unelevated
outline
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>
<!-- mobile -->
<div v-else>
<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>
</div>
<span class="text-grey-6">{{ item.orderStatusStr }}</span>
</div>
<div class="q-pa-md">
<div class="flex no-wrap full-width">
<img class="product-img mr flex-noShark" :src="item.goodsPic" />
<div>
<div class="ellipsis-2">{{ item.goodsName }}</div>
<div>x1</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>
<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 class="q-ml-lg">
<div class="text-right">
<span>CNY:</span>
<span class="text-h6 q-ml-sm">{{ moneyFormat(item.totalPrice,2) }}</span>
</div>
<!-- <div>
<div class="primary">{{item.orderStatusStr}}</div>
<div class="q-mt-sm cursor-pointer">订单详情</div>
</div> -->
<div class="flex justify-end q-mt-sm">
<q-btn
color="primary"
@click="cancalOrder(item)"
unelevated
outline
size="sm"
label="取消订单">
</q-btn>
<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 class="q-mt-md text-right" v-else>
<q-btn color="dark" dense flat class="q-px-sm" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')" label="查看訂單" />
</div>
</div>
</div>
</div>
</q-card>
<div class="row justify-end q-mt-lg">
<q-pagination
v-if="pageCount > 1"
v-model="msg.pageIndex"
:max="pageCount"
@input="getOrderList"
:direction-links="true"
color="white"
text-color="dark"
active-color="primary"
active-text-color="white"
active-design="unelevated"
unelevated
glossy
ellipses
:max-pages="6"
boundary-numbers
size="13px"
padding="sm md"
></q-pagination>
</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>
<noneData v-show="!orderList.length"></noneData>
</div>
</template>
<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 {
components: {
noneData,
NoneData,
},
data() {
return {
orderEnums: [],
GoodsName: '',
orderList: [],
current: 1,
pageCount: 0,
orderStatus: 0,
orderStatusFiled:'',
productTypeFiled:'',
msg:{
pageSize:10,
pageIndex:1,
OrderStatus: 0,
GoodsName: '',
OrderTypeStr:''
},
productTypes:[]
};
},
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
if(this.type) {
this.orderStatus = Number(this.type)
this.msg.OrderStatus = Number(this.type)
}
this.getOrderEnums();
this.getOrderList();
},
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) {
this.current = value;
this.getOrderList();
},
changeOrderType(item) {
if (this.orderStatus === item.ID) {
this.orderStatus = 0;
} else {
this.orderStatus = item.ID;
if (this.msg.OrderStatus != item.ID) {
this.msg.OrderStatus = item.ID
this.orderStatusFiled = item.Name
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.orderList = [];
this.getOrderList();
......@@ -254,15 +315,13 @@ export default {
{},
(res) => {
if (res.data.resultCode == 1) {
this.orderEnums = res.data.data;
this.orderEnums.splice(0,0,{ID:0,Name:'全部訂單'})
console.log(this.orderEnums)
this.orderStatusFiled = this.orderEnums[0].Name
} else {
// this.$notify(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
this.$message.error(res.data.message);
}
},
null
......@@ -271,26 +330,19 @@ export default {
getOrderList() {
this.apipost(
"GetMyDirectOrderPageList_post",
{
pageIndex: this.current,
pageSize: 10,
orderStatus: this.orderStatus,
GoodsName: this.GoodsName,
},
this.msg,
(res) => {
if (res.data.resultCode == 1) {
const { count, pageData, pageCount } = res.data.data;
this.count = count;
this.pageCount = pageCount;
this.orderList = pageData;
this.orderList.forEach(x=>{
x.goodTypeEnum = mappingListType(x.goodsType)
x.orderStatusInfo = EnumHelper.ParseToEnum(OrderStatusEnum,x.orderStatus,'value')
})
} else {
// this.$notify(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
this.$message.error(res.data.message)
}
},
null
......
src/utils/enumhelper.js
View file @ 8ba78f0e
......@@ -2,7 +2,6 @@ const EnumHelper = {
ParseToEnum(TEnum, value, comparison = '') {
if (Object.isFrozen) {
let t = Object.values(TEnum)
console.log(t, Symbol(1) == 1)
let r = t.find(x => (comparison != '' && x[comparison] == value) || (comparison == '' && x == value))
return r
} else {
......
src/utils/listProductType.js
View file @ 8ba78f0e
......@@ -2,23 +2,33 @@ const ListProductTypeEnum = Object.freeze({
TRIP: {
value: 1,
desc: '線路旅遊'
desc: '線路旅遊',
bgColor: 'bg-pink-2',
color: 'text-pink'
},
SCENIC: {
value: 2,
desc: '景點門票'
desc: '景點門票',
bgColor: 'bg-purple-2',
color: 'text-purple'
},
HOTEL: {
value: 3,
desc: '酒店住宿'
desc: '酒店住宿',
bgColor: 'bg-indigo-2',
color: 'text-indigo'
},
CAR: {
value: 4,
desc: '目的地用車'
desc: '目的地用車',
bgColor: 'bg-teal-2',
color: 'text-teal'
},
JALAN: {
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({
/**
* 一日游
......@@ -112,4 +115,29 @@ const ProductTypeEnum = Object.freeze({
})
export default ProductTypeEnum
\ No newline at end of file
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 { 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