Commit 494f6f50 authored by 罗超's avatar 罗超

Merge branch 'master' of http://gitlab.oytour.com/viitto/million

# Conflicts:
#	src/pages/usercenter/setUserInfo.vue
parents ba5b6011 af342763
...@@ -43,15 +43,16 @@ ...@@ -43,15 +43,16 @@
</div> </div>
</div> </div>
<template v-if="TicketIds&&TicketIds.length>0">
<div class="text-grey-6 f12 q-my-md">選擇車類型</div> <div class="text-grey-6 f12 q-my-md">選擇車類型</div>
<div class="row wrap"> <div class="row wrap">
<div v-for="(x,i) in dataList.CarTypeList" :key="i"> <div v-for="(x,i) in dataList.CarTypeList" :key="i">
<q-chip size="14px" clickable @click="handleSelect(x,2)" <q-chip v-if="TicketIds.indexOf(x.Id)!=-1" size="14px" clickable @click="handleSelect(x,2)"
:text-color="selectedCarObj&&selectedCarObj.Id==x.Id?'white':'dark'" :text-color="selectedCarObj&&selectedCarObj.Id==x.Id?'white':'dark'"
:color="selectedCarObj&&selectedCarObj.Id==x.Id?'primary':'grey-3'" square>{{ x.CarName }}({{ x.PeopleNum }}人)</q-chip> :color="selectedCarObj&&selectedCarObj.Id==x.Id?'primary':'grey-3'" square>{{ x.CarName }}({{ x.PeopleNum }}人)</q-chip>
</div> </div>
</div> </div>
</template>
<div class="text-grey-6 f12 q-my-md">選擇數量</div> <div class="text-grey-6 f12 q-my-md">選擇數量</div>
<div class="row items-end"> <div class="row items-end">
<div class="col" :class="{'column':$q.platform.is.mobile}"> <div class="col" :class="{'column':$q.platform.is.mobile}">
...@@ -150,6 +151,8 @@ export default { ...@@ -150,6 +151,8 @@ export default {
this.p = n; this.p = n;
if(n&&n.startDate){ if(n&&n.startDate){
this.chosenObj.startDate = n.startDate; this.chosenObj.startDate = n.startDate;
let arr = this.dataAll.filter(x=> x.Date==this.chosenObj.startDate)
this.TicketIds = arr[0].Price.map(x=> {return x.TicketId})
// this.selectedCar = this.dataList.CarTypeList[0].Id // this.selectedCar = this.dataList.CarTypeList[0].Id
// this.selectedCarObj = this.dataList.CarTypeList[0] // this.selectedCarObj = this.dataList.CarTypeList[0]
} }
...@@ -178,17 +181,17 @@ export default { ...@@ -178,17 +181,17 @@ export default {
selectedAirportObj: null, selectedAirportObj: null,
onCarObj: null, onCarObj: null,
unCarObj: null, unCarObj: null,
TicketIds: null
}; };
}, },
created() { created() {
this.initModel(); this.initModel();
console.log(this.p,'=======')
if(this.p.startDate){ if(this.p.startDate){
this.chosenObj.startDate = this.p.startDate; this.chosenObj.startDate = this.p.startDate;
this.calcMoney() this.calcMoney()
this.getCarPriceData2() this.getCarPriceData2()
} }
this.getCarPriceData()
}, },
methods: { methods: {
goOrderHandler(){ goOrderHandler(){
...@@ -267,6 +270,24 @@ export default { ...@@ -267,6 +270,24 @@ export default {
},null) },null)
}, },
getCarPriceData() {
this.priceList = []
this.apipost(
"b2c_get_GetCarSingleProductMonthPriceAll",
{
ProductId: this.configId,
Month: this.Month,
// AirportId: '',
// CarTypeId: this.selectedCarObj.Id
},
(r) => {
if (r.data.resultCode == 1) {
this.dataAll = r.data.data
}
},null)
},
handleSelectAirport(item){ handleSelectAirport(item){
this.selectedAirportObj = item this.selectedAirportObj = item
}, },
......
...@@ -46,7 +46,6 @@ border-radius: 28px; ...@@ -46,7 +46,6 @@ border-radius: 28px;
top: 5px; top: 5px;
width: 102px; width: 102px;
height: 46px; height: 46px;
background: #EE4454;
border-radius: 23px; border-radius: 23px;
} }
</style>> </style>>
...@@ -60,7 +59,7 @@ border-radius: 23px; ...@@ -60,7 +59,7 @@ border-radius: 23px;
最高可省60%,只有订阅用户才能享受到隐藏优惠,点击“订阅”,即表示你同意我们的《訂閱條款》 最高可省60%,只有订阅用户才能享受到隐藏优惠,点击“订阅”,即表示你同意我们的《訂閱條款》
</div> </div>
<div class="email-box" :class="{'mobile':$q.platform.is.mobile}"> <div class="email-box" :class="{'mobile':$q.platform.is.mobile}">
<q-input class="input" :class="{'mobile':$q.platform.is.mobile}" rounded outlined placeholder="請輸入您在使用的電子郵件"></q-input><q-btn class="btn" label="提交"></q-btn> <q-input class="input" :class="{'mobile':$q.platform.is.mobile}" rounded outlined placeholder="請輸入您在使用的電子郵件"></q-input><q-btn color="primary" class="btn" label="提交"></q-btn>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -24,6 +24,9 @@ ...@@ -24,6 +24,9 @@
.flex-wrap { .flex-wrap {
flex-wrap: wrap; flex-wrap: wrap;
} }
.flex-noShark {
flex-shrink: 0;
}
.margin { .margin {
margin: 10px; margin: 10px;
...@@ -114,6 +117,9 @@ ...@@ -114,6 +117,9 @@
.f36 { .f36 {
font-size: 36px; font-size: 36px;
} }
.f42 {
font-size: 42px;
}
.text-center { .text-center {
text-align: center; text-align: center;
} }
......
...@@ -30,8 +30,8 @@ ...@@ -30,8 +30,8 @@
<hor-big-one :base-data="baseinfo" :dataList="dataList" ref="webhead"></hor-big-one> <hor-big-one :base-data="baseinfo" :dataList="dataList" ref="webhead"></hor-big-one>
<!-- <hor-big-two v-if="headType==2" :base-data="baseinfo" ref="webhead"></hor-big-two> --> <!-- <hor-big-two v-if="headType==2" :base-data="baseinfo" ref="webhead"></hor-big-two> -->
<q-page-container> <q-page-container>
<div class="flex justify-between" v-if="showUserInfo" style="width: 1200px; margin: 0 auto"> <div class="flex justify-between" v-if="showUserInfo" :style="$q.platform.is.desktop ? 'width: 1200px; margin: 0 auto' : ''">
<navs></navs> <navs v-if="$q.platform.is.desktop"></navs>
<router-view /> <router-view />
</div> </div>
<router-view v-else /> <router-view v-else />
......
...@@ -170,7 +170,7 @@ ...@@ -170,7 +170,7 @@
standout standout
v-model="parameters.Mobile" v-model="parameters.Mobile"
label="電話" label="電話"
:rules="[(val) => !!val && val.length == 11 || '請輸正確電話']" :rules="[(val) => !!val || '請輸正確電話']"
ref="Mobile" ref="Mobile"
mask="#" mask="#"
reverse-fill-mask reverse-fill-mask
...@@ -423,6 +423,12 @@ ...@@ -423,6 +423,12 @@
<q-input standout v-model="parameters.Remark" input-style="height:170px;" type="textarea" placeholder="此欄位僅限資料備註。不在商品規範內的個人需求,不保證提供" maxlength="200" counter /> <q-input standout v-model="parameters.Remark" input-style="height:170px;" type="textarea" placeholder="此欄位僅限資料備註。不在商品規範內的個人需求,不保證提供" maxlength="200" counter />
</q-card> </q-card>
</q-form> </q-form>
<coupon
v-if="sumPrice>0&&productType"
:product-type="productType"
:current-price="sumPrice"
@change="changeDiscountHandler"
></coupon>
</div> </div>
<div class="relative-position" v-if="details" <div class="relative-position" v-if="details"
...@@ -510,15 +516,21 @@ ...@@ -510,15 +516,21 @@
<div class="col">{{CarObj.CarName}} x {{ chosenObj.Count }}</div> <div class="col">{{CarObj.CarName}} x {{ chosenObj.Count }}</div>
<div>{{details.CurrencyCode}} {{ moneyFormat(OrderDate.originalB2CPrice,2) }}</div> <div>{{details.CurrencyCode}} {{ moneyFormat(OrderDate.originalB2CPrice,2) }}</div>
</div> </div>
<!-- <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" /> <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
<div class="row q-mb-sm items-center" v-if="(chosenObj.Count)>0"> <div class="row q-mb-sm items-center">
<div class="col">總金額</div> <div class="col">優惠金額</div>
<div class="text-subtitle2 text-weight-bolder text-primary">{{details.CurrencyCode}} {{ moneyFormat(OrderDate.sumPrice,2) }}</div> <div
</div> --> class="text-subtitle2 text-weight-bolder text-teal"
v-if="parameters.DiscountsMoney > 0"
>
CNY - {{ moneyFormat(parameters.DiscountsMoney, 2) }}
</div>
<div class="text-grey-5" v-else>暫無優惠</div>
</div>
<hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" /> <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
<div class="row q-mb-sm items-center" v-if="chosenObj.Count>0"> <div class="row q-mb-sm items-center" v-if="chosenObj.Count>0">
<div class="col">支付金額</div> <div class="col">支付金額</div>
<div class="text-h6 text-weight-bolder text-primary product-price">{{details.CurrencyCode}} {{ moneyFormat(OrderDate.sumPrice,2) }}</div> <div class="text-h6 text-weight-bolder text-primary product-price">{{details.CurrencyCode}} {{ moneyFormat(parameters.Money,2) }}</div>
</div> </div>
</div> </div>
<div class="text-right q-mt-md" v-if="step!=3"> <div class="text-right q-mt-md" v-if="step!=3">
...@@ -570,6 +582,9 @@ export default { ...@@ -570,6 +582,9 @@ export default {
}, },
data() { data() {
return { return {
CouponIds: [],
productType: null,
sumPrice: 0,//总金额
order: null,//订单信息 order: null,//订单信息
orderKey: "", orderKey: "",
isShowDialog: false, isShowDialog: false,
...@@ -608,6 +623,8 @@ export default { ...@@ -608,6 +623,8 @@ export default {
Unit_Price: '',//单价 Unit_Price: '',//单价
Num: '',//数量 Num: '',//数量
Money: 0.0, Money: 0.0,
DiscountsMoney: 0,//优惠金额
DiscountsIds: '',//优惠券id
Sex: 1,//1男2女 Sex: 1,//1男2女
SurName: '',//姓 SurName: '',//姓
Name: '',//名 Name: '',//名
...@@ -661,6 +678,19 @@ export default { ...@@ -661,6 +678,19 @@ export default {
this.getUserInfoHandler() this.getUserInfoHandler()
}, },
methods: { methods: {
changeDiscountHandler(coupon) {
if (coupon) {
this.parameters.DiscountsMoney = coupon.discountMoney;
this.CouponIds = [coupon.couponId];
this.parameters.DiscountsIds = this.CouponIds.join(",")
} else {
this.parameters.DiscountsMoney = 0;
this.CouponIds = [];
this.parameters.DiscountsIds = ''
}
this.parameters.Money = this.sumPrice - this.parameters.DiscountsMoney
this.$forceUpdate();
},
// 获取商品详情 // 获取商品详情
getCarData() { getCarData() {
this.$q.loading.show(); this.$q.loading.show();
...@@ -680,6 +710,14 @@ export default { ...@@ -680,6 +710,14 @@ export default {
} }
this.parameters.CarId = this.OrderDate.CarId this.parameters.CarId = this.OrderDate.CarId
this.parameters.OrderType = this.details.CarType this.parameters.OrderType = this.details.CarType
//13接机 14送机 12包车
if(this.parameters.OrderType==1){
this.productType = 13
}else if(this.parameters.OrderType==2){
this.productType = 14
}else if(this.parameters.OrderType==3){
this.productType = 12
}
} else { } else {
this.$q.notify({ this.$q.notify({
type: "negative", type: "negative",
...@@ -711,6 +749,7 @@ export default { ...@@ -711,6 +749,7 @@ export default {
this.parameters.Unit_Price = this.OrderDate.originalB2CPrice this.parameters.Unit_Price = this.OrderDate.originalB2CPrice
this.parameters.Num = this.chosenObj.Count this.parameters.Num = this.chosenObj.Count
this.parameters.Money = this.OrderDate.sumPrice this.parameters.Money = this.OrderDate.sumPrice
this.sumPrice = this.OrderDate.sumPrice
} }
} }
} }
...@@ -780,15 +819,7 @@ export default { ...@@ -780,15 +819,7 @@ export default {
}) })
}, },
AddOrderInfo(ErpOrderId){ AddOrderInfo(ErpOrderId){
let GoodsType = null
//13接机 14送机 12包车
if(this.parameters.OrderType==1){
GoodsType = 13
}else if(this.parameters.OrderType==2){
GoodsType = 14
}else if(this.parameters.OrderType==3){
GoodsType = 12
}
this.apipost( this.apipost(
"AddOrderInfo_post", "AddOrderInfo_post",
{ {
...@@ -799,10 +830,10 @@ export default { ...@@ -799,10 +830,10 @@ export default {
GoodsId: this.parameters.ProductId,//商品id GoodsId: this.parameters.ProductId,//商品id
GoodsName: this.details.Name,//商品名称 GoodsName: this.details.Name,//商品名称
GoodsPic: this.details.ImageList[0],//商品图片 GoodsPic: this.details.ImageList[0],//商品图片
GoodsType: GoodsType,//商品类型(见枚举) 12包车 13 接机 14送机 GoodsType: this.productType,//商品类型(见枚举) 12包车 13 接机 14送机
OrderMake: this.parameters.OrderDate,//订单摘要(例如出行时间) OrderMake: this.parameters.OrderDate,//订单摘要(例如出行时间)
TotalPrice: this.parameters.Money,//总价格 TotalPrice: this.parameters.Money,//总价格
PreferentialPrice: 0,// 优惠总金额 PreferentialPrice: this.parameters.DiscountsMoney,// 优惠总金额
ErpOrderId: ErpOrderId,//erp订单id ErpOrderId: ErpOrderId,//erp订单id
Country: this.userInfo.Country,//国家id Country: this.userInfo.Country,//国家id
PlatformTax: 0,//平台税金默认0 PlatformTax: 0,//平台税金默认0
...@@ -821,22 +852,14 @@ export default { ...@@ -821,22 +852,14 @@ export default {
}) })
}, },
goPayHandler(pay){ goPayHandler(pay){
let key = this.$md5(JSON.stringify(pay)) let pickuporderCars = localStorage.getItem("pickuporderCars");
let pays = localStorage.getItem('pays') pickuporderCars = pickuporderCars ? JSON.parse(pickuporderCars) : [];
pays = pays?JSON.parse(pays):[] let i = pickuporderCars.findIndex((x) => x.key == this.orderKey);
pays.push({ if (i >= 0) {
key, pickuporderCars.splice(i, 1);
pay localStorage.setItem("pickuporderCars", JSON.stringify(pickuporderCars));
})
localStorage.setItem("pays",JSON.stringify(pays))
let pickuporderCars = localStorage.getItem('pickuporderCars')
pickuporderCars = pickuporderCars?JSON.parse(pickuporderCars):[]
let i = pickuporderCars.findIndex(x=>x.key==this.orderKey)
if(i>=0){
pickuporderCars.splice(i,1)
localStorage.setItem("pickuporderCars",JSON.stringify(pickuporderCars))
} }
this.CommonJump('/pay/'+key, {}); this.CommonJump("/pay/" + pay.OrderNo, {});
}, },
// 航班起飞抵达时间 // 航班起飞抵达时间
getTime(type){ getTime(type){
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
class="col product-price text-subtitle1 text-weight-bold" class="col product-price text-subtitle1 text-weight-bold"
style="text-align: left" style="text-align: left"
> >
<span v-if="priceList2&&priceList2.length">{{dataList.CurrencyCode}} {{ moneyFormat(priceList2[0].originalB2CPrice, 0) }}</span> <span v-if="priceList&&priceList.length">{{dataList.CurrencyCode}} {{ moneyFormat(priceList[0].originalB2CPrice, 0) }}</span>
<span class="q-ml-sm f12 text-grey-7"></span> <span class="q-ml-sm f12 text-grey-7"></span>
</span> </span>
<q-btn <q-btn
...@@ -174,9 +174,9 @@ ...@@ -174,9 +174,9 @@
$q.platform.is.mobile, $q.platform.is.mobile,
}" }"
> >
<div class="product-price text-h6" v-if="priceList2&&priceList2.length>0"> <div class="product-price text-h6" v-if="priceList&&priceList.length>0">
<!-- CNY:{{ dataList. }} --> <!-- CNY:{{ dataList. }} -->
{{dataList.CurrencyCode?dataList.CurrencyCode:'CNY'}}{{ moneyFormat(priceList2[0].originalB2CPrice, 0) }} {{dataList.CurrencyCode?dataList.CurrencyCode:'CNY'}}{{ moneyFormat(priceList[0].originalB2CPrice, 0) }}
<span class="f12 text-grey-6"></span> <span class="f12 text-grey-6"></span>
</div> </div>
<div v-else class="text-subtitle1 text-grey-6">暫無報價</div> <div v-else class="text-subtitle1 text-grey-6">暫無報價</div>
...@@ -318,7 +318,7 @@ ...@@ -318,7 +318,7 @@
<span class="product-price text-h6 q-mr-md" <span class="product-price text-h6 q-mr-md"
>{{dataList.CurrencyCode?dataList.CurrencyCode:'CNY'}} >{{dataList.CurrencyCode?dataList.CurrencyCode:'CNY'}}
{{ {{
moneyFormat(priceList2[0].originalB2CPrice, 0) moneyFormat(priceList[0].originalB2CPrice, 0)
}}</span }}</span
> >
<q-btn <q-btn
...@@ -330,7 +330,7 @@ ...@@ -330,7 +330,7 @@
/> />
</div> </div>
<div class="text-info q-mt-md text-right"> <div class="text-info q-mt-md text-right">
最早可預訂日期:{{ priceList2[0].startDate }} 最早可預訂日期:{{ priceList[0].startDate }}
</div> </div>
</div> </div>
</div> </div>
...@@ -562,7 +562,6 @@ export default { ...@@ -562,7 +562,6 @@ export default {
data() { data() {
return { return {
AddressObj: null, AddressObj: null,
priceList2: [],
priceList: [], priceList: [],
selectedId: '', selectedId: '',
currentYM: { year: 2023, month: 2, str: "2023-02" }, // 当前年月 currentYM: { year: 2023, month: 2, str: "2023-02" }, // 当前年月
...@@ -713,7 +712,6 @@ export default { ...@@ -713,7 +712,6 @@ export default {
this.TripConfig = JSON.parse(window.localStorage.getItem("baseifo")); this.TripConfig = JSON.parse(window.localStorage.getItem("baseifo"));
} }
window.addEventListener("scroll", this.menu); window.addEventListener("scroll", this.menu);
window.addEventListener("scroll", this.menu);
this.getData(); this.getData();
}, },
methods: { methods: {
...@@ -722,6 +720,9 @@ export default { ...@@ -722,6 +720,9 @@ export default {
if(!this.showOrderPreview){ if(!this.showOrderPreview){
this.changeTripShowHandler() this.changeTripShowHandler()
} }
this.dataList.TicketList.forEach(x=>{
x.checked = false
})
}, },
changeTripShowHandler() { changeTripShowHandler() {
this.$nextTick(() => { this.$nextTick(() => {
...@@ -815,6 +816,7 @@ export default { ...@@ -815,6 +816,7 @@ export default {
}, },
resetHandler() { resetHandler() {
this.currentPrice.startDate = ""; this.currentPrice.startDate = "";
if(!this.$q.platform.is.mobile){ if(!this.$q.platform.is.mobile){
this.$refs.calendar.reset(); this.$refs.calendar.reset();
} }
...@@ -841,14 +843,18 @@ export default { ...@@ -841,14 +843,18 @@ export default {
{ CouponsId: this.msg.configId }, { CouponsId: this.msg.configId },
(r) => { (r) => {
if (r.data.resultCode == 1) { if (r.data.resultCode == 1) {
let addList = function (arr) {
arr.forEach(item => {
item.checked = false
item.Count = 1
});
};
addList(r.data.data.TicketList);
this.dataList = r.data.data; this.dataList = r.data.data;
this.selectedId = this.dataList.TicketList.find(x=>x.Id) this.selectedId = this.dataList.TicketList.find(x=>x.Id)
this.dataList.imgCover = this.dataList.PicPathList; this.dataList.imgCover = this.dataList.PicPathList;
this.AddressObj = this.dataList this.AddressObj = this.dataList
this.AddressObj.Address = `${this.dataList.CountryName}-${this.dataList.CityName}-${this.dataList.ProvinceName}-${this.dataList.Address}` this.AddressObj.Address = `${this.dataList.CountryName}-${this.dataList.CityName}-${this.dataList.ProvinceName}-${this.dataList.Address}`
// {
// Address:`${this.dataList.CountryName}-${this.dataList.CityName}-${this.dataList.Address}`
// }
this.isShow = true; this.isShow = true;
if (this.dataList.videoStr && this.dataList.videoStr != "") { if (this.dataList.videoStr && this.dataList.videoStr != "") {
this.options.loop = false; this.options.loop = false;
...@@ -864,7 +870,7 @@ export default { ...@@ -864,7 +870,7 @@ export default {
}); });
} }
this.$nextTick(() => { this.$nextTick(() => {
this.getCarPriceData2() this.getCarPriceData()
setTimeout(() => { setTimeout(() => {
this.navs.forEach((x) => { this.navs.forEach((x) => {
x.top = x.top =
...@@ -900,36 +906,35 @@ export default { ...@@ -900,36 +906,35 @@ export default {
); );
}, },
// 获取报价的详情 // 获取报价的详情
getCarPriceData2() { getCarPriceData() {
this.priceList = [] this.priceList = []
this.apipost( this.apipost(
"b2c_get_GetTicketCouponsMonthPrice", "b2c_get_GetTicketCouponsMonthPriceAll",
{ {
CouponsId: this.msg.configId, CouponsId: this.msg.configId,
TicketId: this.dataList.TicketList[1].Id, // TicketId: this.dataList.TicketList[0].Id,
Month: this.currentYM.str, Month: this.currentYM.str,
}, },
(r) => { (r) => {
if (r.data.resultCode == 1) { if (r.data.resultCode == 1) {
let arr = [] let arr = []
r.data.data.forEach(x=>{ r.data.data.forEach(x=>{
if(x.Price){ x.PriceList = x.PriceList.sort((a,b)=>{return a.Price-b.Price})
let MailingMoneyList = x.PriceList.sort((a,b)=>{return b.MailingMoney-a.MailingMoney})
let dataObj = { let dataObj = {
startDate: x.Date, startDate: x.Date,
originalB2CPrice: x.Price, originalB2CPrice: x.PriceList[0].Price,
remainNum: 1, remainNum: 1,
Count: 1, Count: 1,
safeMoney: 0, safeMoney: 0,
PeopleNum: 1 MailingMoney: MailingMoneyList[0].MailingMoney,
PriceList: x.PriceList,
} }
if(date.formatDate(Date.now(), 'YYYY-MM-DD')!=x.Date&&x.Date>date.formatDate(Date.now(), 'YYYY-MM-DD')){ if(date.formatDate(Date.now(), 'YYYY-MM-DD')!=x.Date&&x.Date>date.formatDate(Date.now(), 'YYYY-MM-DD')){
arr.push(dataObj) arr.push(dataObj)
} }
}
}) })
this.priceList = JSON.parse(JSON.stringify(arr)) this.priceList = JSON.parse(JSON.stringify(arr))
this.priceList2 = JSON.parse(JSON.stringify(arr))
} }
},null) },null)
......
This diff is collapsed.
...@@ -773,10 +773,7 @@ export default { ...@@ -773,10 +773,7 @@ export default {
this.TripConfig = JSON.parse(window.localStorage.getItem("baseifo")); this.TripConfig = JSON.parse(window.localStorage.getItem("baseifo"));
} }
window.addEventListener("scroll", this.menu); window.addEventListener("scroll", this.menu);
// this.getData();
window.addEventListener("scroll", this.menu);
this.getCarData(); this.getCarData();
// this.getCarPriceData();
}, },
methods: { methods: {
changeShowOrderPreviewHandler(){ changeShowOrderPreviewHandler(){
......
...@@ -17,7 +17,6 @@ ...@@ -17,7 +17,6 @@
} }
.select { .select {
height: 41px; height: 41px;
background: #F43849;
border-radius: 8px; border-radius: 8px;
color: #ffffff; color: #ffffff;
} }
...@@ -36,7 +35,7 @@ color: #ffffff; ...@@ -36,7 +35,7 @@ color: #ffffff;
@click="navigateTo(item.key)" @click="navigateTo(item.key)"
v-for="item in menuList" v-for="item in menuList"
:key="item.key" :key="item.key"
:class="{'select': selectKey === item.key}" :class="{'select bg-primary': selectKey === item.key}"
> >
<div class="flex items-center"> <div class="flex items-center">
<i class="iconfont" :class="item.icon"></i> <i class="iconfont" :class="item.icon"></i>
...@@ -52,7 +51,7 @@ color: #ffffff; ...@@ -52,7 +51,7 @@ color: #ffffff;
@click="navigateTo(item.key)" @click="navigateTo(item.key)"
v-for="item in menuList2" v-for="item in menuList2"
:key="item.key" :key="item.key"
:class="{'select': selectKey === item.key}" :class="{'select bg-primary': selectKey === item.key}"
> >
<div class="flex items-center"> <div class="flex items-center">
<i class="iconfont" :class="item.icon"></i> <i class="iconfont" :class="item.icon"></i>
...@@ -82,18 +81,18 @@ export default { ...@@ -82,18 +81,18 @@ export default {
label: "訂單", label: "訂單",
number: "", number: "",
}, },
{ // {
icon: "iconmessage", // icon: "iconmessage",
key: "", // key: "",
label: "我的评价", // label: "我的评价",
number: "", // number: "",
}, // },
{ // {
icon: "iconmoney-credit-card", // icon: "iconmoney-credit-card",
key: "/payInfo", // key: "/payInfo",
label: "支付管理", // label: "支付管理",
number: "", // number: "",
}, // },
], ],
menuList2: [ menuList2: [
{ {
......
<style> <style>
.login-box { .login-box-pc {
width: 436px; width: 436px;
}
.login-box {
padding: 30px 40px; padding: 30px 40px;
background-clip: padding-box; background-clip: padding-box;
background: #ffffff; background: #ffffff;
...@@ -70,7 +72,7 @@ ...@@ -70,7 +72,7 @@
</style> </style>
<template> <template>
<div class="login"> <div class="login">
<div class="login-box"> <div class="login-box" :class="$q.platform.is.desktop ? 'login-box-pc' : ''">
<div class="f34 bold">注销账户</div> <div class="f34 bold">注销账户</div>
<div class="login_row"> <div class="login_row">
<div class="form-group"> <div class="form-group">
......
<style> <style>
.login-box { .login-box-pc {
width: 436px; width: 436px;
}
.login-box {
padding: 30px 40px; padding: 30px 40px;
background-clip: padding-box; background-clip: padding-box;
background: #ffffff; background: #ffffff;
...@@ -70,7 +72,7 @@ ...@@ -70,7 +72,7 @@
</style> </style>
<template> <template>
<div class="login"> <div class="login">
<div class="login-box"> <div class="login-box" :class="$q.platform.is.desktop ? 'login-box-pc' : ''">
<div class="f34 bold">修改邮箱</div> <div class="f34 bold">修改邮箱</div>
<div class="login_row"> <div class="login_row">
<div class="form-group"> <div class="form-group">
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
...@@ -50,16 +49,19 @@ ...@@ -50,16 +49,19 @@
color: #195954; color: #195954;
} }
} }
.card-pc {
width: 201px;
}
.card { .card {
margin: 10px; margin: 10px;
width: 201px;
height: 310px; height: 310px;
background: #f9f9f9; background: #f9f9f9;
border-radius: 8px; border-radius: 8px;
} }
.nav-item { .nav-item {
width: 100px; width: 33%;
margin: 0 10px; max-width: 100px;
// margin: 0 10px;
text-align: center; text-align: center;
} }
.border-bottom { .border-bottom {
...@@ -86,10 +88,15 @@ ...@@ -86,10 +88,15 @@
.circle { .circle {
width: 24px; width: 24px;
height: 10px; height: 10px;
left: 88px;
border-radius: 0 0 14px 14px; border-radius: 0 0 14px 14px;
background: #f9f9f9; background: #f9f9f9;
} }
.circle-pc {
left: 88px;
}
.circle-mobile {
left: calc(50% - 12px)
}
// .circle:after { // .circle:after {
// content: '.'; // content: '.';
// display: block; // display: block;
...@@ -99,7 +106,7 @@ ...@@ -99,7 +106,7 @@
// } // }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="q-ma-lg"> <div class="q-ma-lg">
<div class="tips flex"> <div class="tips flex">
<div <div
...@@ -113,12 +120,12 @@ ...@@ -113,12 +120,12 @@
</div> </div>
</div> </div>
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="card" v-for="item in couponList" :key="item.id"> <div class="card" v-for="item in couponList" :key="item.id" :class="$q.platform.is.desktop ? 'card-pc': 'full-width'">
<div class="bg-blue relative" :class="[colorMap[item.couponsUseScope], {'bg-grey': CouponTimeStatus !== 1}]"> <div class="bg-blue relative" :class="[colorMap[item.couponsUseScope], {'bg-grey': CouponTimeStatus !== 1}]">
<div v-if="item.IsEnd" class="absolute deadline"> <div v-if="item.IsEnd" class="absolute deadline">
<div class="text f12">即將過期</div> <div class="text f12">即將過期</div>
</div> </div>
<div class="absolute circle"></div> <div class="absolute circle" :class="$q.platform.is.desktop ? 'circle-pc': 'circle-mobile'"></div>
<div class="white text-center f16 q-pt-lg">CYN</div> <div class="white text-center f16 q-pt-lg">CYN</div>
<div class="white text-center f26">{{ item.denomination }}</div> <div class="white text-center f26">{{ item.denomination }}</div>
<div class="white text-center"> <div class="white text-center">
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
...@@ -22,8 +21,10 @@ ...@@ -22,8 +21,10 @@
margin-top: 20px; margin-top: 20px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.card { .card-pc {
width: 434px; width: 434px;
}
.card {
height: 75px; height: 75px;
background: #ffffff; background: #ffffff;
border: 1px solid #eeeeee; border: 1px solid #eeeeee;
...@@ -45,10 +46,10 @@ ...@@ -45,10 +46,10 @@
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="q-ma-lg"> <div class="q-ma-lg">
<div class="tips">登陸方式管理</div> <div class="tips">登陸方式管理</div>
<div class="card"> <div class="card" :class="{'card-pc': $q.platform.is.desktop}">
<div class="flex justify-between"> <div class="flex justify-between">
<div> <div>
<span class="f18 bold">郵箱</span <span class="f18 bold">郵箱</span
...@@ -61,7 +62,7 @@ ...@@ -61,7 +62,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="card flex justify-between"> <div class="card flex justify-between" :class="{'card-pc': $q.platform.is.desktop}">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="img-box"> <div class="img-box">
<img class="img" src="../../assets/img/wechat.png" /> <img class="img" src="../../assets/img/wechat.png" />
......
<style lang="scss" scoped>
.avatar {
width: 60px;
height: 60px;
background: #ffffff;
border: 2px solid #f0efef;
border-radius: 50%;
margin: 0 auto;
display: block;
}
.nav-item {
margin:0 10px;
padding: 10px;
border-bottom: 1px solid #eee;
}
.nav-item:last-child {
border-bottom: none;
}
.select {
height: 41px;
border-radius: 8px;
color: #ffffff;
}
.action-item {
width: 18px;
height: 18px;
display: inline-block;
margin-left: 10px;
}
.edit-info {
width: 12px;
height: 12px;
}
.padding-20 {
padding: 20px;
}
.card {
margin: 25px 15px;
border-radius: 15px;
padding: 10px;
}
.order-item {
width: 25%;
display: inline-block;
}
.order-img {
width: 26px;
height: 26px;
}
.go-play {
width: 36px;
height: 36px;
}
.play-box {
padding: 8px;
background: #FAF9F9;
border-radius: 9px;
margin: 10px 13px 0 13px;
}
</style>
<template>
<div class="user-nav-box">
<div class="padding-20">
<div class="flex justify-between items-center">
<span class="f20">个人中心</span>
<div>
<img class="action-item" src="../../assets/img/userCenter/help.png" />
<img @click="CommonJump('/setInfo')" class="action-item" src="../../assets/img/userCenter/set.png" />
</div>
</div>
<div class="flex items-center q-mt-md">
<div>
<img class="avatar" v-if="LoginUser.photo" :src="LoginUser.photo" />
<img class="avatar" v-else src="../../assets/img/avatar.png" />
</div>
<div class="q-ml-md">
<div class="f18">hello,开起你的旅程吧~</div>
<div @click="CommonJump('/setUserInfo')">
<img class="edit-info" src="../../assets/img/userCenter/edit.png" />
個人信息管理
</div>
</div>
</div>
</div>
<div class="bg-white card">
<div
class="order-item cursor-pointer"
@click="navigateTo(item.key)"
v-for="item in orderList"
:key="item.key"
:class="{ 'select bg-primary': selectKey === item.key }"
>
<div class="column flex-center">
<img class="order-img" :src="require(`../../assets/img/userCenter/${item.icon}.png`)" />
<div>{{ item.label }}</div>
</div>
<!-- <span class="text-primary">{{ item.label }}</span> -->
</div>
<div class="flex play-box q-mt-md">
<img class="go-play q-mr-md" src="../../assets/img/userCenter/set.png" />
<div class="f12">
<div>即將出行</div>
<div class="text-grey-6">[2023年3月6日]日本富士山尊享一日遊</div>
</div>
</div>
</div>
<div class="bg-white card">
<div
class="nav-item flex justify-between items-center cursor-pointer"
@click="navigateTo(item.key)"
v-for="item in menuList"
:key="item.key"
>
<div class="flex items-center">
<i class="iconfont" :class="item.icon"></i>
<span class="q-ml-lg">{{ item.label }}</span>
</div>
<i class="iconfont iconpreviewright"></i>
<!-- <span class="text-primary">{{ item.label }}</span> -->
</div>
</div>
<div class="bg-white card">
<div
class="nav-item flex justify-between items-center cursor-pointer"
@click="navigateTo(item.key)"
v-for="item in menuList2"
:key="item.key"
>
<div class="flex items-center">
<i class="iconfont" :class="item.icon"></i>
<span class="q-ml-lg">{{ item.label }}</span>
</div>
<i class="iconfont iconpreviewright"></i>
<!-- <span class="text-primary">{{item.label}}</span> -->
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
selectKey: "",
LoginUser: {},
orderList: [
{
icon: "order-pay",
key: "/order?type=1",
label: "待付款",
number: "",
},
{
icon: "order-use",
key: "/order?type=2",
label: "待出行",
number: "",
},
{
icon: "order-finish",
key: "/order?type=3",
label: "已完成",
number: "",
},
{
icon: "order-all",
key: "/order?type=0",
label: "全部订单",
number: "",
},
],
menuList: [
{
icon: "iconqianbao",
key: "/coupon",
label: "可用優惠券",
number: "",
},
// {
// icon: "iconmessage",
// key: "",
// label: "我的评价",
// number: "",
// },
// {
// icon: "iconmoney-credit-card",
// key: "/payInfo",
// label: "支付管理",
// number: "",
// },
],
menuList2: [
{
icon: "iconpeople1",
key: "/setUsersList",
label: "出行人信息管理",
number: "",
},
{
icon: "iconemail",
key: "/setAddress",
label: "管理邮寄地址",
number: "",
},
{
icon: "iconcomputer",
key: "/loginInfo",
label: "登录方式管理",
number: "",
},
// {
// icon: "iconset",
// key: "/setInfo",
// label: "账户设置",
// number: "",
// },
],
};
},
mounted() {
this.selectKey = this.$route.path;
if (localStorage.b2bUser) {
this.LoginUser = JSON.parse(window.localStorage.getItem("b2bUser"));
}
},
methods: {
navigateTo(route) {
this.selectKey = route;
this.CommonJump(route, {});
},
},
};
</script>
\ No newline at end of file
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px;
} }
.content { .content {
width: 900px; width: 900px;
...@@ -73,8 +71,8 @@ ...@@ -73,8 +71,8 @@
width: 120px; width: 120px;
} }
.nav-item { .nav-item {
width: 100px; width: 25%;
margin: 0 10px; max-width: 100px;
text-align: center; text-align: center;
} }
.border-bottom { .border-bottom {
...@@ -90,11 +88,10 @@ ...@@ -90,11 +88,10 @@
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="flex justify-between"> <div class="flex justify-between margin">
<div> <div :class="$q.platform.is.desktop ? 'form-item': 'full-width'">
<q-input <q-input
class="form-item"
placeholder="輸入商品名稱/訂單號" placeholder="輸入商品名稱/訂單號"
v-model="GoodsName" v-model="GoodsName"
clearable clearable
...@@ -113,7 +110,8 @@ ...@@ -113,7 +110,8 @@
<div :class="orderStatus === item.ID ? 'border-bottom' : ''"></div> <div :class="orderStatus === item.ID ? 'border-bottom' : ''"></div>
</div> </div>
</div> </div>
<div> <!-- pc -->
<div v-if="$q.platform.is.desktop">
<div class="card" v-for="item in orderList" :key="item.id"> <div class="card" v-for="item in orderList" :key="item.id">
<div class="flex card-title justify-between"> <div class="flex card-title justify-between">
<div class="flex"> <div class="flex">
...@@ -160,9 +158,53 @@ ...@@ -160,9 +158,53 @@
</div> </div>
</div> </div>
</div> </div>
<noneData v-show="!orderList.length"></noneData> </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> </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 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>
</div>
</div>
</div>
</div>
<noneData v-show="!orderList.length"></noneData>
</div>
</template> </template>
<script> <script>
...@@ -178,10 +220,14 @@ export default { ...@@ -178,10 +220,14 @@ export default {
orderList: [], orderList: [],
current: 1, current: 1,
pageCount: 0, pageCount: 0,
orderStatus: "", orderStatus: 0,
}; };
}, },
mounted() { mounted() {
this.type = this.$route.query.type
if(this.type) {
this.orderStatus = Number(this.type)
}
this.getOrderEnums(); this.getOrderEnums();
this.getOrderList(); this.getOrderList();
}, },
...@@ -193,7 +239,7 @@ export default { ...@@ -193,7 +239,7 @@ export default {
}, },
changeOrderType(item) { changeOrderType(item) {
if (this.orderStatus === item.ID) { if (this.orderStatus === item.ID) {
this.orderStatus = ""; this.orderStatus = 0;
} else { } else {
this.orderStatus = item.ID; this.orderStatus = item.ID;
} }
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
...@@ -9,11 +8,10 @@ ...@@ -9,11 +8,10 @@
} }
.tips { .tips {
width: 100%; width: 100%;
height: 42px;
background: #f5f5f5; background: #f5f5f5;
border-radius: 8px; border-radius: 8px;
padding: 0 35px; padding: 19px 35px;
line-height: 42px; line-height: 22px;
} }
::v-deep .q-field__control { ::v-deep .q-field__control {
height: 40px; height: 40px;
...@@ -24,18 +22,25 @@ ...@@ -24,18 +22,25 @@
::v-deep .q-field__marginal { ::v-deep .q-field__marginal {
height: 40px; height: 40px;
} }
::v-deep .q-field--auto-height .q-field__native {
min-height: 40px;
}
.title { .title {
margin-top: 20px; margin-top: 20px;
margin-bottom: 10px; margin-bottom: 10px;
margin-left: 10px;
} }
.card { .card {
margin-top: 20px; margin-top: 20px;
width: 413px;
height: 170px; height: 170px;
background: #ffffff; background: #ffffff;
border: 1px solid #eeeeee; border: 1px solid #eeeeee;
border-radius: 8px; border-radius: 8px;
} }
.card-pc {
width: 413px;
}
.img-box { .img-box {
width: 50px; width: 50px;
height: 50px; height: 50px;
...@@ -65,13 +70,13 @@ ...@@ -65,13 +70,13 @@
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="q-ma-lg"> <div class="q-ma-lg">
<div class="tips"> <div class="tips">
收貨地址 <span>您已创建 {{count}}个收货地址,最多可创建 10个</span> 收貨地址 <span>您已创建 {{count}}个收货地址,最多可创建 10个</span>
</div> </div>
<div class="flex flex-wrap justify-between"> <div class="flex flex-wrap justify-between">
<div class="card" v-for="item in pageData" :key="item.Id"> <div class="card" :class="$q.platform.is.desktop ? 'card-pc': 'full-width'" v-for="item in pageData" :key="item.Id">
<div class="flex justify-between label"> <div class="flex justify-between label">
<div> <div>
{{ item.Name {{ item.Name
...@@ -94,6 +99,7 @@ ...@@ -94,6 +99,7 @@
</div> </div>
<!-- <div class="card flex flex-center" @click="showDialog"><span></span>添加郵寄地址</div> --> <!-- <div class="card flex flex-center" @click="showDialog"><span></span>添加郵寄地址</div> -->
<q-btn v-if="count < 10" <q-btn v-if="count < 10"
:class="$q.platform.is.desktop ? 'card-pc': 'full-width'"
class="card flex flex-center" class="card flex flex-center"
color="blue" color="blue"
unelevated unelevated
...@@ -107,7 +113,7 @@ ...@@ -107,7 +113,7 @@
<div class="f22 bold">{{form.Id ? '编辑': '添加'}}邮寄地址</div> <div class="f22 bold">{{form.Id ? '编辑': '添加'}}邮寄地址</div>
<form @submit.prevent.stop="submit" class="q-gutter-md"> <form @submit.prevent.stop="submit" class="q-gutter-md">
<div> <div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title">全名</div> <div class="title">全名</div>
<q-input <q-input
...@@ -119,9 +125,27 @@ ...@@ -119,9 +125,27 @@
:rules="[(val) => !!val || '请输入全名']" :rules="[(val) => !!val || '请输入全名']"
></q-input> ></q-input>
</div> </div>
</div>
<div class="row">
<div class="col"> <div class="col">
<div class="title">國家/地區</div>
<q-select
@input="changeCountry"
emit-value
map-options
ref="CountryId"
square
outlined
option-value="ID"
option-label="Name"
class="form-item"
v-model="form.CountryId"
:options="countList"
placeholder="Filled"
:rules="[(val) => Boolean(val) || '请选择國家/地區']"
/>
</div>
</div>
<div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<!-- <div class="col">
<div class="title">選擇手機區號</div> <div class="title">選擇手機區號</div>
<q-select <q-select
ref="AreaCode" ref="AreaCode"
...@@ -137,7 +161,7 @@ ...@@ -137,7 +161,7 @@
placeholder="選擇手機區號" placeholder="選擇手機區號"
:rules="[(val) => Boolean(val) || '请選擇手機區號']" :rules="[(val) => Boolean(val) || '请選擇手機區號']"
/> />
</div> </div> -->
<div class="col"> <div class="col">
<div class="title">手機號碼</div> <div class="title">手機號碼</div>
<q-input <q-input
...@@ -147,27 +171,12 @@ ...@@ -147,27 +171,12 @@
v-model="form.Mobile" v-model="form.Mobile"
outlined outlined
:rules="[(val) => !!val || '请输入手機號碼']" :rules="[(val) => !!val || '请输入手機號碼']"
></q-input> >
</div> <template v-slot:prepend>
<div class="text-subtitle2">
{{ form.PhoneCountryStr }}
</div> </div>
</template></q-input>
<div class="row">
<div class="col">
<div class="title">國家/地區</div>
<q-select
emit-value
map-options
ref="CountryId"
square
outlined
option-value="ID"
option-label="Name"
class="form-item"
v-model="form.CountryId"
:options="countList"
placeholder="Filled"
:rules="[(val) => Boolean(val) || '请选择國家/地區']"
/>
</div> </div>
<div class="col"> <div class="col">
<div class="title">城市</div> <div class="title">城市</div>
...@@ -181,7 +190,7 @@ ...@@ -181,7 +190,7 @@
></q-input> ></q-input>
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title">詳細地址</div> <div class="title">詳細地址</div>
<q-input <q-input
...@@ -247,12 +256,6 @@ export default { ...@@ -247,12 +256,6 @@ export default {
this.getCountryInfo(); this.getCountryInfo();
}, },
methods: { methods: {
addAddress() {
this.isShowDialog = true
this.form = {
Name: "",
Mobile: "",}
},
getCountryInfo() { getCountryInfo() {
this.apipost( this.apipost(
"GetCountryInfo_post", "GetCountryInfo_post",
...@@ -262,6 +265,17 @@ export default { ...@@ -262,6 +265,17 @@ export default {
const { phoneCountList, countList } = res.data.data; const { phoneCountList, countList } = res.data.data;
this.countList = countList; this.countList = countList;
this.phoneCountList = phoneCountList; this.phoneCountList = phoneCountList;
this.form.CountryId = this.countList[0].ID;
this.changeCountry(this.form.CountryId);
this.phoneCountList.forEach((x) => {
let temp = this.countList.find((y) => y.ID == x.ID);
x.EnName = `${temp.EnName}(${x.PhoneCode})`;
});
this.form.CountryId =
this.form.CountryId == 0
? this.countList[0].ID
: this.form.CountryId;
this.changeCountry(this.form.CountryId);
} else { } else {
// this.$notify(res.data.message); // this.$notify(res.data.message);
this.$q.notify({ this.$q.notify({
...@@ -275,6 +289,18 @@ export default { ...@@ -275,6 +289,18 @@ export default {
null null
); );
}, },
changeCountry(id) {
this.form.AreaCode = this.phoneCountList.find(
(x) => x.ID == id
).PhoneCode;
this.form.PhoneCountryStr = "+" + this.form.AreaCode;
},
addAddress() {
this.isShowDialog = true
this.form = {
Name: "",
Mobile: "",}
},
changeCouponType(item) { changeCouponType(item) {
this.selectedKey = item; this.selectedKey = item;
}, },
...@@ -282,7 +308,6 @@ export default { ...@@ -282,7 +308,6 @@ export default {
this.formHasError = false; this.formHasError = false;
const verifyArr = [ const verifyArr = [
"Name", "Name",
"AreaCode",
"Mobile", "Mobile",
"CountryId", "CountryId",
"CityName", "CityName",
...@@ -290,17 +315,13 @@ export default { ...@@ -290,17 +315,13 @@ export default {
"PostalCode", "PostalCode",
]; ];
verifyArr.forEach((item) => { verifyArr.forEach((item) => {
console.log("this.$refs[item]", this, item, this.$refs[item]);
this.$refs[item].validate(); this.$refs[item].validate();
}); });
verifyArr.forEach((item) => { verifyArr.forEach((item) => {
console.log("item", item);
if (this.$refs[item].hasError) { if (this.$refs[item].hasError) {
console.log("item", item);
this.formHasError = true; this.formHasError = true;
} }
}); });
console.log("this.formHasError", this.formHasError, this.form);
if (this.formHasError) { if (this.formHasError) {
return; return;
} }
...@@ -329,7 +350,6 @@ export default { ...@@ -329,7 +350,6 @@ export default {
); );
}, },
editUser(item) { editUser(item) {
console.log("editUser", item);
this.form = {...item}; this.form = {...item};
this.form.AreaCode = Number(this.form.AreaCode) this.form.AreaCode = Number(this.form.AreaCode)
this.form.IsDefault = this.form.IsDefault === 1 this.form.IsDefault = this.form.IsDefault === 1
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.form-group { .form-group {
...@@ -14,7 +13,7 @@ ...@@ -14,7 +13,7 @@
.form-group i { .form-group i {
position: absolute; position: absolute;
right: 12px; right: 12px;
bottom: 0; top: 0;
z-index: 2; z-index: 2;
width: 40px; width: 40px;
height: 40px; height: 40px;
...@@ -44,7 +43,7 @@ ...@@ -44,7 +43,7 @@
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="content bg-white" :class="{'q-ma-lg': $q.platform.is.desktop}">
<div class="q-ma-lg"> <div class="q-ma-lg">
<div class="tips">密碼管理</div> <div class="tips">密碼管理</div>
<div> <div>
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
max-width: 940px; max-width: 940px;
} }
.tips { .tips {
height: 42px;
background: #f5f5f5; background: #f5f5f5;
border-radius: 8px; border-radius: 8px;
padding: 0 35px; padding: 10px 35px;
line-height: 42px; line-height: 22px;
} }
::v-deep .q-field__control { ::v-deep .q-field__control {
height: 40px; height: 40px;
...@@ -29,11 +27,16 @@ ...@@ -29,11 +27,16 @@
.title { .title {
margin-top: 20px; margin-top: 20px;
margin-bottom: 10px; margin-bottom: 10px;
margin-left: 10px;
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white q-pa-lg"> <div
<div class="tips"> class="bg-white"
:class="$q.platform.is.desktop ? 'content q-ma-lg' : 'full-width'"
>
<div class="q-ma-lg">
<div class="tips q-mb-lg">
個人信息<span class="text-grey-6" 個人信息<span class="text-grey-6"
>(以下信息仅用于帮助你在支付时自动填写你的个人资料,你的信息将会安全地被印象保存且不会公开)</span >(以下信息仅用于帮助你在支付时自动填写你的个人资料,你的信息将会安全地被印象保存且不会公开)</span
> >
...@@ -41,14 +44,13 @@ ...@@ -41,14 +44,13 @@
<div> <div>
<form @submit.prevent.stop="submit" class="q-gutter-md"> <form @submit.prevent.stop="submit" class="q-gutter-md">
<div> <div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row' : 'culmuns'">
<div class="col"> <div class="col">
<div class="title"></div> <div class="title"></div>
<q-input <q-input
class="form-item" class="form-item"
v-model="form.Surname" v-model="form.Surname"
outlined outlined
placeholder="姓"
ref="Surname" ref="Surname"
:rules="[(val) => !!val || '请输入姓氏']" :rules="[(val) => !!val || '请输入姓氏']"
></q-input> ></q-input>
...@@ -58,21 +60,19 @@ ...@@ -58,21 +60,19 @@
<q-input <q-input
ref="Name" ref="Name"
class="form-item" class="form-item"
placeholder="名"
v-model="form.Name" v-model="form.Name"
outlined outlined
:rules="[(val) => !!val || '请输入名字']" :rules="[(val) => !!val || '请输入名字']"
></q-input> ></q-input>
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row' : 'culmuns'">
<div class="col"> <div class="col">
<div class="title">姓氏(需與旅遊證件一致)</div> <div class="title">姓氏(需與旅遊證件一致)</div>
<q-input <q-input
class="form-item" class="form-item"
v-model="form.EnName" v-model="form.EnName"
outlined outlined
placeholder="姓氏(需與旅遊證件一致)"
ref="EnName" ref="EnName"
:rules="[(val) => !!val || '请输入姓氏(需與旅遊證件一致)']" :rules="[(val) => !!val || '请输入姓氏(需與旅遊證件一致)']"
></q-input> ></q-input>
...@@ -82,17 +82,17 @@ ...@@ -82,17 +82,17 @@
<q-input <q-input
ref="EnSurname" ref="EnSurname"
class="form-item" class="form-item"
placeholder="名字(需與旅遊證件一致)"
v-model="form.EnSurname" v-model="form.EnSurname"
standout outlined
:rules="[(val) => !!val || '请输入名字(需與旅遊證件一致)']" :rules="[(val) => !!val || '请输入名字(需與旅遊證件一致)']"
></q-input> ></q-input>
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row' : 'culmuns'">
<div class="col"> <div class="col">
<div class="title">居住國家/地區</div> <div class="title">居住國家/地區</div>
<q-select <q-select
@input="changeCountry"
emit-value emit-value
map-options map-options
ref="Country" ref="Country"
...@@ -103,7 +103,6 @@ ...@@ -103,7 +103,6 @@
class="form-item" class="form-item"
v-model="form.Country" v-model="form.Country"
:options="countList" :options="countList"
placeholder="请选择居住國家/地區"
:rules="[(val) => Boolean(val) || '请选择居住國家/地區']" :rules="[(val) => Boolean(val) || '请选择居住國家/地區']"
/> />
</div> </div>
...@@ -120,14 +119,13 @@ ...@@ -120,14 +119,13 @@
option-label="Name" option-label="Name"
v-model="form.Appellation" v-model="form.Appellation"
:options="AppellationList" :options="AppellationList"
placeholder="请选择稱謂"
:rules="[(val) => Boolean(val) || '请选择稱謂']" :rules="[(val) => Boolean(val) || '请选择稱謂']"
/> />
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row' : 'culmuns'">
<div class="col"> <!-- <div class="col">
<div class="title">國家/地區代碼</div> <div class="title">國家/地區代碼</div>
<q-select <q-select
emit-value emit-value
...@@ -140,29 +138,30 @@ ...@@ -140,29 +138,30 @@
class="form-item" class="form-item"
v-model="form.PhoneCountry" v-model="form.PhoneCountry"
:options="phoneCountList" :options="phoneCountList"
placeholder="请选择國家/地區代碼"
:rules="[(val) => Boolean(val) || '请选择國家/地區代碼']" :rules="[(val) => Boolean(val) || '请选择國家/地區代碼']"
/> />
</div> </div> -->
<div class="col"> <div class="col">
<div class="title">電話(首次需驗證)</div> <div class="title">電話(首次需驗證)</div>
<q-input <q-input
ref="Moblie" ref="Moblie"
class="form-item" class="form-item"
placeholder="電話(首次需驗證)"
v-model="form.Moblie" v-model="form.Moblie"
outlined outlined
:rules="[(val) => !!val || '请输入電話(首次需驗證)']" :rules="[(val) => !!val || '请输入電話(首次需驗證)']"
></q-input> >
<template v-slot:prepend>
<div class="text-subtitle2">
{{ form.PhoneCountryStr }}
</div> </div>
</template></q-input
>
</div> </div>
<div class="row">
<div class="col"> <div class="col">
<div class="title">出生日期</div> <div class="title">出生日期</div>
<q-input <q-input
ref="BirthDate" ref="BirthDate"
class="form-item" class="form-item"
placeholder="出生日期"
v-model="form.BirthDate" v-model="form.BirthDate"
outlined outlined
mask="date" mask="date"
...@@ -183,15 +182,18 @@ ...@@ -183,15 +182,18 @@
</template> </template>
</q-input> </q-input>
</div> </div>
</div>
<div :class="$q.platform.is.desktop ? 'row' : 'culmuns'">
<div class="col"> <div class="col">
<div class="title">電子郵件(接收订单确认邮件)</div> <div class="title">電子郵件(接收订单确认邮件)</div>
<q-input <q-input
ref="Mailbox" ref="Mailbox"
class="form-item" class="form-item"
placeholder="電子郵件(接收订单确认邮件)"
v-model="form.Mailbox" v-model="form.Mailbox"
outlined outlined
:rules="[(val) => !!val || '请输入電子郵件(接收订单确认邮件)']" :rules="[
(val) => !!val || '请输入電子郵件(接收订单确认邮件)',
]"
></q-input> ></q-input>
</div> </div>
</div> </div>
...@@ -202,6 +204,7 @@ ...@@ -202,6 +204,7 @@
</form> </form>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { export default {
...@@ -226,7 +229,6 @@ export default { ...@@ -226,7 +229,6 @@ export default {
}, },
mounted() { mounted() {
this.userInfo = JSON.parse(window.localStorage.getItem("b2bUser")); this.userInfo = JSON.parse(window.localStorage.getItem("b2bUser"));
console.log("getUserInfo", this.userInfo);
this.getUserInfo(); this.getUserInfo();
this.getCountryInfo(); this.getCountryInfo();
this.GetAppellationEnum(); this.GetAppellationEnum();
...@@ -241,8 +243,14 @@ export default { ...@@ -241,8 +243,14 @@ export default {
const { phoneCountList, countList } = res.data.data; const { phoneCountList, countList } = res.data.data;
this.countList = countList; this.countList = countList;
this.phoneCountList = phoneCountList; this.phoneCountList = phoneCountList;
this.phoneCountList.forEach((x) => {
let temp = this.countList.find((y) => y.ID == x.ID);
x.EnName = `${temp.EnName}(${x.PhoneCode})`;
});
if (this.form.Country) {
this.changeCountry(this.form.Country);
}
} else { } else {
// this.$notify(res.data.message);
this.$q.notify({ this.$q.notify({
type: "negative", type: "negative",
message: res.data.message, message: res.data.message,
...@@ -254,6 +262,12 @@ export default { ...@@ -254,6 +262,12 @@ export default {
null null
); );
}, },
changeCountry(id) {
this.form.PhoneCountry = this.phoneCountList.find(
(x) => x.ID == id
).PhoneCode;
this.form.PhoneCountryStr = "+" + this.form.PhoneCountry;
},
GetAppellationEnum() { GetAppellationEnum() {
this.apipost( this.apipost(
"GetAppellationEnum_post", "GetAppellationEnum_post",
...@@ -283,6 +297,9 @@ export default { ...@@ -283,6 +297,9 @@ export default {
(res) => { (res) => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.form = res.data.data; this.form = res.data.data;
if (this.phoneCountList.length) {
this.changeCountry(this.form.Country);
}
} else { } else {
// this.$notify(res.data.message); // this.$notify(res.data.message);
this.$q.notify({ this.$q.notify({
...@@ -297,7 +314,7 @@ export default { ...@@ -297,7 +314,7 @@ export default {
); );
}, },
submitUserInfo() { submitUserInfo() {
let params = {...this.form} let params = { ...this.form };
// params.Appellation = params.Appellation.ID // params.Appellation = params.Appellation.ID
// params.Country = params.Country.ID // params.Country = params.Country.ID
// params.PhoneCountry = params.PhoneCountry.ID // params.PhoneCountry = params.PhoneCountry.ID
...@@ -323,23 +340,28 @@ export default { ...@@ -323,23 +340,28 @@ export default {
} }
}, },
null null
) ; );
}, },
submit() { submit() {
this.formHasError = false; this.formHasError = false;
const verifyArr = ["Surname", "Name", "BirthDate", "Appellation", "EnName", "EnSurname", "Country", "Moblie"]; const verifyArr = [
"Surname",
"Name",
"BirthDate",
"Appellation",
"EnName",
"EnSurname",
"Country",
"Moblie",
];
verifyArr.forEach((item) => { verifyArr.forEach((item) => {
console.log('this.$refs[item]', this, item, this.$refs[item])
this.$refs[item].validate(); this.$refs[item].validate();
}); });
verifyArr.forEach((item) => { verifyArr.forEach((item) => {
console.log('item', item)
if (this.$refs[item].hasError) { if (this.$refs[item].hasError) {
console.log('item', item)
this.formHasError = true; this.formHasError = true;
} }
}); });
console.log('this.formHasError', this.formHasError, this.form)
if (this.formHasError) { if (this.formHasError) {
return; return;
} }
......
<style lang="scss" scoped> <style lang="scss" scoped>
.form-item { .form-item {
max-width: 320px; max-width: 320px;
height: 40px;
margin: 10px; margin: 10px;
} }
.content { .content {
...@@ -43,6 +42,7 @@ ...@@ -43,6 +42,7 @@
.title { .title {
margin-top: 20px; margin-top: 20px;
margin-bottom: 10px; margin-bottom: 10px;
margin-left: 10px;
} }
.phone { .phone {
margin-left: 100px; margin-left: 100px;
...@@ -82,13 +82,13 @@ ...@@ -82,13 +82,13 @@
} }
</style> </style>
<template> <template>
<div class="content q-ma-lg bg-white"> <div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div> <div>
<div class="card" v-for="item in pageData" :key="item.id"> <div class="card" v-for="item in pageData" :key="item.id">
<div class="flex card-title justify-between"> <div class="flex card-title justify-between">
<div class="flex"> <div class="flex">
<span>{{ item.Name }}</span> <span>{{ item.Name }}</span>
<span class="phone">手機號:{{ item.Mobile }}</span> <span v-if="$q.platform.is.desktop" class="phone">手機號:{{ item.Mobile }}</span>
</div> </div>
<span> <span>
<span class="user-edit" @click="editUser(item)">编辑</span> <span class="user-edit" @click="editUser(item)">编辑</span>
...@@ -98,14 +98,15 @@ ...@@ -98,14 +98,15 @@
</span> </span>
</div> </div>
<div class="q-pa-sm"> <div class="q-pa-sm">
<span class="q-ml-sm" v-if="$q.platform.is.mobile">手機號:{{ item.Mobile }}</span>
<div class="q-pa-sm full-width" <div class="q-pa-sm full-width"
:class="{ 'border-b': index < item.CardList.length - 1 }" :class="{ 'border-b': index < item.CardList.length - 1 }"
v-for="(el, index) in item.CardList" v-for="(el, index) in item.CardList"
:key="index" :key="index"
> >
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col-6">{{ el.TypeName }}</div> <div class="col-6">{{ el.TypeName }}</div>
<div class="col-6">{{ el.CardNo }}</div> <div class="col-6" :class="$q.platform.is.mobile ? 'q-mt-xs': ''">{{ el.CardNo }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -142,14 +143,13 @@ ...@@ -142,14 +143,13 @@
<div class="f22 bold">{{ form.Id ? "编辑" : "新增" }}出行人信息</div> <div class="f22 bold">{{ form.Id ? "编辑" : "新增" }}出行人信息</div>
<form @submit.prevent.stop="submit" class="q-gutter-md"> <form @submit.prevent.stop="submit" class="q-gutter-md">
<div> <div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title"></div> <div class="title"></div>
<q-input <q-input
class="form-item" class="form-item"
v-model="form.SurName" v-model="form.SurName"
outlined outlined
placeholder="姓"
ref="SurName" ref="SurName"
:rules="[(val) => !!val || '请输入姓氏']" :rules="[(val) => !!val || '请输入姓氏']"
></q-input> ></q-input>
...@@ -159,21 +159,19 @@ ...@@ -159,21 +159,19 @@
<q-input <q-input
ref="Name" ref="Name"
class="form-item" class="form-item"
placeholder="名"
v-model="form.Name" v-model="form.Name"
outlined outlined
:rules="[(val) => !!val || '请输入名字']" :rules="[(val) => !!val || '请输入名字']"
></q-input> ></q-input>
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title">姓氏(需與旅遊證件一致)</div> <div class="title">姓氏(需與旅遊證件一致)</div>
<q-input <q-input
class="form-item" class="form-item"
v-model="form.EnName" v-model="form.EnName"
outlined outlined
placeholder="姓氏(需與旅遊證件一致)"
ref="EnName" ref="EnName"
:rules="[(val) => !!val || '请输入姓氏(需與旅遊證件一致)']" :rules="[(val) => !!val || '请输入姓氏(需與旅遊證件一致)']"
></q-input> ></q-input>
...@@ -183,7 +181,6 @@ ...@@ -183,7 +181,6 @@
<q-input <q-input
ref="EnSurName" ref="EnSurName"
class="form-item" class="form-item"
placeholder="名字(需與旅遊證件一致)"
v-model="form.EnSurName" v-model="form.EnSurName"
outlined outlined
:rules="[(val) => !!val || '请输入名字(需與旅遊證件一致)']" :rules="[(val) => !!val || '请输入名字(需與旅遊證件一致)']"
...@@ -191,7 +188,7 @@ ...@@ -191,7 +188,7 @@
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title">國家/地區代碼</div> <div class="title">國家/地區代碼</div>
<q-select <q-select
...@@ -205,7 +202,6 @@ ...@@ -205,7 +202,6 @@
class="form-item" class="form-item"
v-model="form.AreaCode" v-model="form.AreaCode"
:options="phoneCountList" :options="phoneCountList"
placeholder="请选择國家/地區代碼"
:rules="[(val) => Boolean(val) || '请选择國家/地區代碼']" :rules="[(val) => Boolean(val) || '请选择國家/地區代碼']"
/> />
</div> </div>
...@@ -214,7 +210,6 @@ ...@@ -214,7 +210,6 @@
<q-input <q-input
ref="Mobile" ref="Mobile"
class="form-item" class="form-item"
placeholder="手機號"
v-model="form.Mobile" v-model="form.Mobile"
outlined outlined
:rules="[(val) => !!val || '请输入手機號']" :rules="[(val) => !!val || '请输入手機號']"
...@@ -233,7 +228,7 @@ ...@@ -233,7 +228,7 @@
<img style="width: 15px" src="../../assets/img/delete.png" /> <img style="width: 15px" src="../../assets/img/delete.png" />
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'culmuns'">
<div class="col"> <div class="col">
<div class="title">证件类型</div> <div class="title">证件类型</div>
<q-select <q-select
......
...@@ -175,6 +175,12 @@ const routes = [{ ...@@ -175,6 +175,12 @@ const routes = [{
] ]
}, },
{
path: '/userCenter', //移动端个人中心
meta: { isUserCenter: true, needLogin: true },
component: () =>
import ('pages/usercenter/mobileUserCenter.vue')
},
{ {
path: '/login', path: '/login',
component: () => component: () =>
......
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