Commit 134644ca authored by 郭志伟's avatar 郭志伟

fix: 问题修复

parent 747c28a4
export default {
101: `<p>充值类商品售出<strong>后无法进行退换</strong>,非充值用户请谨慎购买。</p>`,
102: `<p>充值类商品售出<strong>后无法进行退换</strong>,非充值用户请谨慎购买。</p>`
1: {
title: '温馨提示',
content: `<p>充值类商品售出后无法进行退换,非充值用户请谨慎购买。</p>`
},
2: {
title: '温馨提示',
content: `<p>充值类商品售出后无法进行退换,非充值用户请谨慎购买。</p>`
},
401: {
title: '使用方法',
content: `<p>1. 进入猫眼APP,登陆后打开“我的”,点击“优惠券”;</p>
<p>2. 进入“优惠券”,在页面上方白框中输入13位优惠券密码,点击“添加”即可;</p>
<p>3. 返回,选定场次并完成选座;</p>
<p>4. 核对购票信息、结算金额,点击“确认支付”完成选座购票;</p>
<p>5. 用户到影城“取票机”取票即可使用。</p>`
},
301: {
title: '使用方法',
content: `<p>1. 进入饿了么APP-选择我的-点击会员,使用兑换码兑换会员,输入兑换码即可兑换;</p>
<p>2. 饿了么月度会员含4个5元的红包总计20元,全品类通用(早餐及帮买帮送等特殊订单除外),红包仅限购买会员时选择的城市使用;</p>
<p>3. 每完成1笔在线订单(实际支付金额大于等于20元),即可获得1个奖励金,奖励金可累计并兑换各种无门槛红包及高额商家红包。</p>`
}
};
......@@ -78,7 +78,7 @@
v-if="orderInfo.orderStatusInfo.orderStatus === 11"
size="small"
plain
type="primary"
type="default"
shape="circle"
@click="openCancelPopup"
>
......@@ -98,7 +98,7 @@
v-if="orderInfo.orderStatusInfo.orderStatus === 21"
size="small"
plain
type="primary"
type="default"
shape="circle"
@click="orderNotify"
>
......
......@@ -30,7 +30,7 @@
plain
type="default"
shape="circle"
@click="onOptionClick(item, 'cancel')"
@click.stop="onOptionClick(item, 'cancel')"
>
取消订单
</cr-button>
......@@ -40,7 +40,7 @@
plain
type="primary"
shape="circle"
@click="onOptionClick(item, 'pay')"
@click.stop="onOptionClick(item, 'pay')"
>
付款
</cr-button>
......@@ -50,7 +50,7 @@
plain
type="default"
shape="circle"
@click="onOptionClick(item, 'notify')"
@click.stop="onOptionClick(item, 'notify')"
>
提醒发货
</cr-button>
......@@ -60,7 +60,7 @@
plain
type="primary"
shape="circle"
@click="onOptionClick(item, 'again')"
@click.stop="onOptionClick(item, 'again')"
>
再次购买
</cr-button>
......
......@@ -2,7 +2,13 @@
<div class="Vl__account">
<cr-field v-model="accountMask" :placeholder="`请输入${info.name || ''}账号`" clearable>
<template #button>
<cr-image v-if="info.icon" :src="info.icon" width="0.64rem" height="0.64rem" />
<cr-image
v-if="info.icon"
:src="info.icon"
fit="contain"
width="0.64rem"
height="0.64rem"
/>
</template>
</cr-field>
<!-- <div class="Vl__list" :class="{ show: !inputBlur }">
......@@ -46,7 +52,7 @@ export default {
computed: {
accountMask: {
get() {
return this.info.rechargeAccountType !== 3 ? this.phoneFormat(this.value) : this.value;
return this.info.type !== 101 ? this.phoneFormat(this.value) : this.value;
},
set(val) {
this.$emit('input', val.replace(/\s/g, ''));
......
<template functional>
<div class="Vl__sku" :class="{ disabled: props.disabled, 'three-col': props.threeCol }">
<div
v-for="(item, index) in props.list"
:key="index"
class="Vl__sku-item"
:class="{
cheap: item.price - item.salePrice > 0,
active: props.info.skuNo === item.skuNo,
nohhird: (index + 1) % 3 !== 0
}"
@click="parent.handleSkuSelected(item, index)"
>
<div class="Vl__sku-name">
{{ props.threeCol ? item.salePrice : item.skuName }}{{ showUnit ? '' : '' }}
<template v-if="props.list.length">
<div
v-for="(item, index) in props.list"
:key="index"
class="Vl__sku-item"
:class="{
cheap: item.price - item.salePrice > 0,
active: props.info.skuNo === item.skuNo,
'no-stock': !props.info.hasStock,
nohhird: (index + 1) % 3 !== 0
}"
@click="props.info.hasStock && parent.handleSkuSelected(item, index)"
>
<div class="Vl__sku-name">
{{ props.threeCol ? item.salePrice : item.skuName }}{{ props.showUnit ? '' : '' }}
</div>
<div class="Vl__sku-price">售价{{ item.price }}</div>
</div>
<div class="Vl__sku-price">售价{{ props.threeCol ? item.price : item.salePrice }}</div>
<div class="Vl__sku-tag">优惠</div>
</div>
</template>
<cr-empty v-else class="Vl__sku-empty" image="commodity" description="暂无商品~" />
</div>
</template>
<script>
......@@ -49,6 +52,9 @@ export default {
align-content: flex-start;
position: relative;
z-index: 1;
&-empty {
flex-flow: wrap;
}
&.disabled::before {
content: ' ';
z-index: 2;
......@@ -85,13 +91,45 @@ export default {
position: relative;
margin-bottom: @padding-xs;
transition: all 0.1s linear;
&::before {
content: ' ';
background: @gray-2;
.text-10();
border-radius: 0 @border-radius-sm - 2 0 @border-radius-sm - 2;
padding: 0 @padding-unit;
position: absolute;
top: 0;
right: 0;
display: none;
}
// 优惠
&.cheap {
.Vl__sku-tag {
&::before {
content: '\4f18\60e0';
display: block;
color: @white;
background: linear-gradient(269deg, #ff5d00 12%, #ff1900 86%);
}
}
// 补货中
&.no-stock {
background: @white !important;
border-color: @grey-border !important;
pointer-events: none;
cursor: not-allowed;
&::before {
content: '\8865\8d27\4e2d';
display: block;
color: @white;
background: linear-gradient(90deg, #cecece 2%, #989898 98%);
}
.Vl__sku-name {
color: @gray-4 !important;
}
.Vl__sku-price {
color: @gray-4 !important;
}
}
&.active {
background: #fff5f5;
border: 1px solid @red;
......@@ -117,16 +155,6 @@ export default {
color: @gray-5;
.text-12();
}
&-tag {
background: @gray-2;
.text-10();
border-radius: 0 @border-radius-sm - 2 0 @border-radius-sm - 2;
padding: 0 @padding-unit;
position: absolute;
top: 0;
right: 0;
display: none;
}
}
}
</style>
<template>
<div ref="spuList" class="Vl__spu-wrapper">
<div class="Vl__spu" :style="{ width: numAddUnit(contentWidth) }">
<div class="Vl__spu" :style="{ minWidth: numAddUnit(contentWidth) }">
<div
v-for="(item, index) in list"
:key="index"
class="Vl__spu-item"
:class="{ 'Vl__spu-item_active': info.spuNo === item.spuNo }"
:class="{ 'Vl__spu-item_active': info.spuNos === item.spuNos }"
@click="handleSpuClick($event, item, index)"
>
<cr-image :src="item.icon" height="1.093333rem" width="1.093333rem" class="Vl__spu-icon" />
<cr-image
:src="item.icon"
height="1.093333rem"
width="1.093333rem"
fit="contain"
class="Vl__spu-icon"
/>
<div class="Vl__spu-name">{{ item.name }}</div>
</div>
<div class="Vl__spu-placeholder" :style="{ width: numAddUnit(placeholderWidth) }" />
</div>
</div>
</template>
......@@ -42,34 +47,44 @@ export default {
};
},
computed: {
contentWidth() {
return ITEM_WIDTH * (this.list.length + 2.34);
}
},
watch: {
contentWidth() {
this.$nextTick(() => {
this.listWrapper && this.listWrapper.refresh();
this.listWrapper.scrollTo(0, 0);
this.listWrapper.refresh();
});
return ITEM_WIDTH * this.list.length + this.placeholderWidth;
},
placeholderWidth() {
return ((this.list.length % 4) + 1.335) * ITEM_WIDTH;
}
},
mounted() {
this.$nextTick(() => {
this.listWrapper = new BScroll(this.$refs.spuList, {
click: true,
scrollX: true,
scrollY: false
});
});
this.createScroller();
},
beforeDestroy() {
this.listWrapper.destroy();
},
methods: {
createScroller() {
this.$nextTick(() => {
if (this.listWrapper) {
this.listWrapper.destroy();
}
this.listWrapper = new BScroll(this.$refs.spuList, {
click: true,
scrollX: true,
scrollY: false
});
});
},
numAddUnit(num) {
return num / 37.5 + 'rem';
},
handleSpuClick(e, item, index) {
this.$parent.handleSpuSelected(item, index);
const target = e.path.find(item => item.className.indexOf('Vl__spu-item') > -1);
console.dir(target);
this.listWrapper.scrollToElement(target, 500, -10, 0);
}
}
......
......@@ -15,8 +15,8 @@
<cr-loading color="#ec1500" />
</div>
<template v-if="tips">
<div class="Vl__panel-title">温馨提示</div>
<div class="Vl__panel-tips" v-html="tips" />
<div class="Vl__panel-title">{{ tips.title }}</div>
<div class="Vl__panel-tips" v-html="tips.content" />
</template>
</div>
<div class="Vl__bottom">
......@@ -64,7 +64,9 @@ export default {
return this.spuData[this.currentTab - 1] ? this.spuData[this.currentTab - 1].itemList : [];
},
tips() {
return tipsData[this.spuInfo.spuNo];
return this.spuInfo.type
? tipsData[this.spuInfo.type] || tipsData[+('' + this.spuInfo.type)[0]] || {}
: {};
}
},
mounted() {
......@@ -89,7 +91,6 @@ export default {
this.getSkuListDebounce();
},
handleSpuSelected(item) {
this.spuInfo = item;
this.updateSpuInfo(item);
this.getSkuListDebounce();
},
......@@ -117,11 +118,13 @@ export default {
},
async getSkuList() {
this.skuList = [];
const { spuNo: spuNos, type } = this.spuInfo;
const { spuNos, type } = this.spuInfo;
const [res] = await rechargeApi.getSkuList(spuNos, type);
if (res) {
this.skuList = res.rechargeList;
this.handleSkuSelected(res.rechargeList[0], 0);
const defaultItem = res.rechargeList.find(item => item.hasStock);
const defaultIndex = res.rechargeList.findIndex(item => item.hasStock);
defaultItem && this.handleSkuSelected(defaultItem, defaultIndex);
}
this.showLoading = false;
},
......
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