1503 lines
37 KiB
Vue
1503 lines
37 KiB
Vue
<template>
|
||
<view>
|
||
<view style="background: rgb(41, 36, 56)">
|
||
<view class="bargin" v-if="show == false">
|
||
<view class="top-sty">
|
||
<view class="user-info">
|
||
<image class="user-img" lazy-load :src="imgPath"></image>
|
||
<view class="username">{{ user_nickname }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="goods-sty">
|
||
<view class="goods-back-sty">
|
||
<view class="part1_product">
|
||
<view>
|
||
<image
|
||
class="pro_img"
|
||
lazy-load
|
||
:src="Info.activity_rule.product_image"
|
||
></image>
|
||
</view>
|
||
<view class="pro_info">
|
||
<view class="item_name_sty">{{
|
||
Info.activity_rule.product_item_name
|
||
}}</view>
|
||
<view class="price_sty">
|
||
<label style="color: #ff6803">{{ __("底价：") }}</label>
|
||
<label
|
||
style="color: #ff6803; font-weight: bold; font-size: 50rpx"
|
||
>{{
|
||
sprintf(
|
||
"%.2f",
|
||
Info.activity_rule.cut_down_min_limit_price
|
||
)
|
||
}}</label
|
||
>
|
||
<span
|
||
style="
|
||
text-decoration: line-through;
|
||
margin-left: 10rpx;
|
||
color: #999;
|
||
"
|
||
>{{ Info.activity_rule.item_unit_price }}</span
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="part-bottom-sty">
|
||
<view class="time_sty">
|
||
<view class="time_fon_sty">
|
||
{{ __("活动时间仅剩") }}
|
||
</view>
|
||
<view v-if="end == 1">
|
||
<view class="remaining_time">
|
||
<view class="time">{{ Time.hour }}</view
|
||
><view class="point_sty">{{ __(":") }}</view>
|
||
<view class="time">{{ Time.min }}</view
|
||
><view class="point_sty">{{ __(":") }}</view>
|
||
<view class="time">{{ Time.sec }}</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="end == 2">
|
||
<view class="remaining_time">
|
||
<view class="time">{{ Time.hour }}</view
|
||
><view class="point_sty">{{ __(":") }}</view>
|
||
<view class="time">{{ Time.min }}</view
|
||
><view class="point_sty">{{ __(":") }}</view>
|
||
<view class="time">{{ Time.sec }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-progressBar">
|
||
<view
|
||
class="u-progressBar-cont"
|
||
:style="'width:' + width + '%'"
|
||
></view>
|
||
</view>
|
||
<view class="part3">
|
||
<!-- 还未砍价，发起人=帮砍人，活动正在进行 开始砍价 -->
|
||
<view
|
||
class="button-start"
|
||
@click="bargin"
|
||
v-if="
|
||
Info.is_cut == false &&
|
||
istrue &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
></view>
|
||
<!-- 还未砍价，发起人=帮砍人，活动还未开始 -->
|
||
<view
|
||
class="button-start"
|
||
v-if="
|
||
Info.is_cut == false &&
|
||
istrue &&
|
||
end == 1 &&
|
||
Info.order_id == ''
|
||
"
|
||
></view>
|
||
<view class="cut_down_sty" v-if="Info.is_cut">
|
||
<view style="margin-left: 150rpx">
|
||
{{ __("原价") }}{{ __("￥")
|
||
}}{{ sprintf("%.2f", Info.activity_rule.item_unit_price) }}
|
||
</view>
|
||
<view style="margin-right: 150rpx">
|
||
{{ __("已砍") }}{{ __("￥")
|
||
}}{{
|
||
sprintf(
|
||
"%.2f",
|
||
Info.activity_rule.item_unit_price - Info.ac_sale_price
|
||
)
|
||
}}
|
||
</view>
|
||
</view>
|
||
<!-- 已经砍价，发起人=帮砍人，活动还未结束，已砍价！=砍价空间 -->
|
||
<view
|
||
style="display: flex"
|
||
v-if="
|
||
Info.is_cut &&
|
||
istrue &&
|
||
isCut &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
>
|
||
<view class="immediately_btn" @click="goshop"></view>
|
||
<view
|
||
class="help_cut_btn"
|
||
v-if="Info.activity_state == 1"
|
||
@click="shareBox"
|
||
></view>
|
||
</view>
|
||
<view style="display: flex; justify-content: space-between"> </view>
|
||
|
||
<!-- 还未砍价，发起人！=帮砍人，活动还未结束 帮忙砍价 -->
|
||
<view
|
||
class="cut_pri_sty"
|
||
@click="bargin"
|
||
v-if="
|
||
Info.is_cut == false &&
|
||
istrue == false &&
|
||
isCut &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
></view>
|
||
|
||
<!-- 已经砍价，发起人=帮砍人，活动还未结束，已砍价=砍价空间 立即出手-->
|
||
<!-- <view class="up_hands_sty" @click="goshop" v-if="(Info.is_cut&&istrue&&isCut==false&&end!=1&&end!=3&&Info.order_id=='')"></view> -->
|
||
|
||
<!-- 已经砍价，发起人！=帮砍人，活动还未结束，已砍价！=砍价空间 -->
|
||
<view
|
||
v-if="
|
||
Info.is_cut &&
|
||
istrue == false &&
|
||
isCut &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
>
|
||
<!-- 我也要 -->
|
||
<navigator
|
||
:url="
|
||
'/activity/cutprice/detail?mid=' +
|
||
mid +
|
||
'&pid=' +
|
||
pid +
|
||
'&ac_id=' +
|
||
ac_id
|
||
"
|
||
class="i_want_sty"
|
||
></navigator>
|
||
<!-- <button open-type="share" class="button1" style="margin:40rpx 0 0 0" @click='shareBox'>{{__('找人帮砍')}}</button> -->
|
||
<!-- 找人帮砍 -->
|
||
<button
|
||
class="help_cut_btn_1"
|
||
v-if="Info.activity_state == 1"
|
||
@click="shareBox"
|
||
></button>
|
||
</view>
|
||
<!-- 已经砍价，发起人！=帮砍人，活动还未结束，已砍价=砍价空间 我也要 -->
|
||
<navigator
|
||
:url="
|
||
'/activity/cutprice/detail?mid=' +
|
||
mid +
|
||
'&pid=' +
|
||
pid +
|
||
'&ac_id=' +
|
||
ac_id
|
||
"
|
||
v-if="
|
||
istrue == false &&
|
||
isCut == false &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
class="i_want_sty"
|
||
></navigator>
|
||
<!-- 活动已经结束 再逛逛-->
|
||
<navigator
|
||
class="again_stroll_sty"
|
||
url="/activity/cutprice/list"
|
||
v-if="end == 3"
|
||
></navigator>
|
||
<!-- 您已购买，再逛逛 -->
|
||
<navigator
|
||
class="again_stroll_sty"
|
||
url="/activity/cutprice/list"
|
||
v-if="Info.order_id && end != 3"
|
||
></navigator>
|
||
<!-- 恭喜你，砍价成功 -->
|
||
<view
|
||
class="congratulate-success"
|
||
@click="goshop"
|
||
v-if="
|
||
Info.is_cut &&
|
||
istrue &&
|
||
isCut == false &&
|
||
end != 1 &&
|
||
end != 3 &&
|
||
Info.order_id == ''
|
||
"
|
||
></view>
|
||
</view>
|
||
<view class="part4" v-if="Info.Description">
|
||
<view class="header">{{ __("活动说明") }}</view>
|
||
<rich-text :nodes="htmlString"></rich-text>
|
||
</view>
|
||
|
||
<view class="part6">
|
||
<scroll-view
|
||
class="m-nearbylist"
|
||
scroll-y="true"
|
||
@scrolltolower="scrollbottom"
|
||
>
|
||
<view
|
||
v-for="(items, index) in List"
|
||
:key="index"
|
||
style="
|
||
display: flex;
|
||
position: relative;
|
||
border-bottom: 1rpx solid mediumpurple;
|
||
"
|
||
>
|
||
<view>
|
||
<image
|
||
class="avatar_sty"
|
||
lazy-load
|
||
:src="items.user_avatar"
|
||
></image>
|
||
</view>
|
||
<view>
|
||
<view class="user_nickname_sty">
|
||
{{ items.user_nickname
|
||
}}<label style="margin-left: 10rpx">{{
|
||
items.user_mobile
|
||
}}</label>
|
||
</view>
|
||
</view>
|
||
<view class="cut_away_sty">
|
||
{{ __("砍掉") }}{{ sprintf("%.2f", items.ach_price)
|
||
}}{{ __("元") }}
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view :class="['msk']" @tap="back" v-if="showImg">
|
||
<view class="msk_box">
|
||
<image
|
||
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/cut-price-animation.png"
|
||
style="width: 100%"
|
||
mode="widthFix"
|
||
@tap="back"
|
||
></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-tap-btn">
|
||
<navigator
|
||
url="/pages/index/index"
|
||
open-type="switchTab"
|
||
class="u-go-home"
|
||
>
|
||
<view class="iconfont icon-shouyeshouye"></view>
|
||
</navigator>
|
||
</view>
|
||
<share-box-mp
|
||
:PageQRCodeInfo="PageQRCodeInfo"
|
||
@cancelShare="cancelShare"
|
||
@showCodeImg="showCodeImg"
|
||
@shareQRCode="shareQRCode"
|
||
@saveImg="saveImg"
|
||
:shareDataDefault="shareData"
|
||
ref="shareBoxMp"
|
||
></share-box-mp>
|
||
<share-box-app
|
||
:shareDataDefault="shareData"
|
||
ref="shareBoxApp"
|
||
></share-box-app>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
function getNowFormatDate() {
|
||
var e = new Date(),
|
||
t = "-",
|
||
n = e.getMonth() + 1,
|
||
r = e.getDate();
|
||
n >= 1 && n <= 9 && (n = "0" + n), r >= 0 && r <= 9 && (r = "0" + r);
|
||
var i = e.getFullYear() + t + n + t + r;
|
||
return i;
|
||
}
|
||
|
||
import $ from "../../helpers/util";
|
||
import { mapState, mapMutations } from "vuex";
|
||
|
||
import shareBoxMp from "../../components/share-box-mp.vue";
|
||
import shareBoxApp from "../../components/share-box-app.vue";
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
Time: "",
|
||
hours: "",
|
||
show: false,
|
||
showImg: false,
|
||
showPrice: false,
|
||
isCut: true,
|
||
imgPath: "",
|
||
user_nickname: "",
|
||
mid: 0,
|
||
uid: 0,
|
||
pid: 0,
|
||
page: 1,
|
||
rows: 10,
|
||
Info: {
|
||
activity_rule: {
|
||
product_image: "",
|
||
},
|
||
},
|
||
end: 0,
|
||
startTime: "",
|
||
endTime: "",
|
||
istrue: true,
|
||
flag: true,
|
||
ispage: true,
|
||
width: 100,
|
||
participantId: "",
|
||
ac_id: 0,
|
||
money: 0,
|
||
List: [],
|
||
hour: 0,
|
||
min: 0,
|
||
sec: 0,
|
||
htmlString: "",
|
||
PageQRCodeInfo: {
|
||
Path: "",
|
||
IsShare: false,
|
||
IsShareBox: false,
|
||
IsJT: false,
|
||
},
|
||
shareData: {
|
||
shareText: "澜驰商城系统，支持原生App、微信小程序，邀请你一起体验！",
|
||
shareTitle: "澜驰商城系统，支持原生App、微信小程序，邀请你一起体验！",
|
||
href: "https://www.suteshop.com",
|
||
image: "",
|
||
},
|
||
};
|
||
},
|
||
components: {
|
||
shareBoxMp,
|
||
shareBoxApp,
|
||
},
|
||
computed: mapState([
|
||
"Config",
|
||
"StateCode",
|
||
"notice",
|
||
"plantformInfo",
|
||
"shopInfo",
|
||
"userInfo",
|
||
"hasLogin",
|
||
]),
|
||
onLoad: function (options) {
|
||
uni.setNavigationBarTitle({
|
||
title: this.__("砍价详情"),
|
||
});
|
||
var t = this;
|
||
// 长参数解析
|
||
if (options.scene) {
|
||
let longUrl = decodeURIComponent(options.scene);
|
||
let paramsArray = longUrl.replace("longUrl=", "").split("-");
|
||
options.mid = paramsArray[0];
|
||
options.pid = paramsArray[1];
|
||
options.ac_id = paramsArray[2];
|
||
options.uid = paramsArray[3];
|
||
}
|
||
|
||
options.sid
|
||
? t.setData({
|
||
imgPath: this.userInfo.user_avatar,
|
||
user_nickname: this.userInfo.user_nickname,
|
||
mid: options.mid,
|
||
uid: options.sid,
|
||
participantId: this.userInfo.user_id,
|
||
pid: options.pid,
|
||
})
|
||
: t.setData({
|
||
imgPath: this.userInfo.user_avatar,
|
||
user_nickname: this.userInfo.user_nickname,
|
||
mid: options.mid,
|
||
uid: options.uid || this.userInfo.user_id,
|
||
participantId: this.userInfo.user_id,
|
||
pid: options.pid,
|
||
});
|
||
|
||
this.forceUserInfo(function (user) {
|
||
t.GetOtherCutPriceActivityList();
|
||
});
|
||
//t.getTime()
|
||
},
|
||
onShow: function () {
|
||
this.GetVendorCutPriceEventDetail();
|
||
},
|
||
onBackPress() {
|
||
if (this.$refs.shareBoxApp.showBoxView) {
|
||
this.$refs.shareBoxApp.cancel();
|
||
return true;
|
||
}
|
||
},
|
||
onUnload() {
|
||
// 离开页面，注销事件
|
||
var that = this;
|
||
|
||
if (this.$refs.shareBoxApp.showBoxView) {
|
||
this.$refs.shareBoxApp.cancel();
|
||
}
|
||
},
|
||
methods: {
|
||
...mapMutations([
|
||
"login",
|
||
"logout",
|
||
"getPlantformInfo",
|
||
"forceUserInfo",
|
||
"getUserInfo",
|
||
]),
|
||
|
||
GetVendorCutPriceEventDetail: function () {
|
||
var that = this,
|
||
params = {
|
||
activity_id: this.mid,
|
||
user_id: this.uid,
|
||
participant_id: this.userInfo.user_id,
|
||
};
|
||
params.user_id == params.participant_id
|
||
? this.setData({
|
||
istrue: true,
|
||
})
|
||
: this.setData({
|
||
istrue: false,
|
||
});
|
||
$.request({
|
||
url: this.Config.URL.user.getCutPriceActivity,
|
||
data: params,
|
||
success: function (data, status, msg, code) {
|
||
if (200 == status) {
|
||
data.CutPricePercent =
|
||
(data.activity_rule.item_unit_price - data.ac_sale_price) /
|
||
(data.activity_rule.item_unit_price -
|
||
data.activity_rule.cut_down_min_limit_price);
|
||
that.setData({
|
||
Info: data,
|
||
ac_id: data.ac_id,
|
||
width: 100 * parseFloat(data.CutPricePercent).toFixed(2),
|
||
});
|
||
that.getTime();
|
||
data.ac_sale_price - data.ac_mix_limit_price <= 0
|
||
? that.setData({
|
||
isCut: false,
|
||
})
|
||
: "";
|
||
|
||
//WxParse.wxParse("PromotionRule", "html", data.activity_rule.activity_intro, that)
|
||
|
||
if (data.activity_rule.activity_intro) {
|
||
that.htmlString = data.activity_rule.activity_intro
|
||
.replace(/\\/g, "")
|
||
.replace(/<img/g, '<img style="display:none;"');
|
||
}
|
||
} else {
|
||
that.setData({
|
||
flag: false,
|
||
ispage: true,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
},
|
||
getTime: function () {
|
||
var e = this,
|
||
t = new Date().getTime(),
|
||
s = this.Info.activity_endtime,
|
||
n = this.Info.activity_starttime;
|
||
var i = new Date(n.replace(/-/g, "/")).getTime(),
|
||
u = new Date(s.replace(/-/g, "/")).getTime();
|
||
if (i >= t) {
|
||
var a = setInterval(function () {
|
||
e.setData({
|
||
Time: $.Formattime1(e.Info.activity_starttime, a),
|
||
end: 1,
|
||
}),
|
||
e.Time == undefined && e.getTime();
|
||
}, 1e3);
|
||
return;
|
||
}
|
||
if (u <= t) {
|
||
var a = setInterval(function () {
|
||
e.setData({
|
||
Time: $.Formattime(e.Info.activity_endtime, a),
|
||
end: 3,
|
||
}),
|
||
e.Time == undefined && e.getTime();
|
||
}, 1e3);
|
||
return;
|
||
}
|
||
if (i < t < u) {
|
||
var a = setInterval(function () {
|
||
e.setData({
|
||
Time: $.Formattime(e.Info.activity_endtime, a),
|
||
end: 2,
|
||
}),
|
||
e.Time == undefined && e.getTime();
|
||
}, 1e3);
|
||
return;
|
||
}
|
||
},
|
||
GetOtherCutPriceActivityList: function () {
|
||
var params = {
|
||
activity_id: this.mid,
|
||
user_id: this.uid,
|
||
page: this.page,
|
||
},
|
||
t = this;
|
||
|
||
$.request({
|
||
url: this.Config.URL.user.listsCutPriceHistory,
|
||
data: params,
|
||
success: function (data, status, msg, code) {
|
||
if (200 == status && data.items.length > 0) {
|
||
t.setData({
|
||
flag: false,
|
||
});
|
||
t.setData({
|
||
ispage: true,
|
||
List: data.items,
|
||
});
|
||
} else {
|
||
t.setData({
|
||
flag: false,
|
||
ispage: true,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
},
|
||
scrollbottom: function () {
|
||
var e = this;
|
||
e.setData({
|
||
flag: false,
|
||
}),
|
||
clearTimeout(t);
|
||
var t = setTimeout(function () {
|
||
e.setData({
|
||
type: e.type,
|
||
page: parseInt(e.page) + 1,
|
||
rows: 10,
|
||
}),
|
||
e.GetOtherCutPriceActivityList();
|
||
}, 500);
|
||
},
|
||
CutPrice: function () {
|
||
if (this.Info.activity_state > 1) {
|
||
this.$.alert(this.__("活动已结束！"));
|
||
return;
|
||
}
|
||
var params = {
|
||
ac_id: this.ac_id,
|
||
user_id: this.userInfo.user_id,
|
||
},
|
||
that = this;
|
||
$.request({
|
||
url: this.Config.URL.user.doCutPrice,
|
||
data: params,
|
||
success: function (data, status, msg, code) {
|
||
if (200 == status) {
|
||
that.setData({
|
||
money: data.ach_price,
|
||
ac_id: data.ac_id,
|
||
showImg: true,
|
||
});
|
||
that.GetVendorCutPriceEventDetail();
|
||
that.GetOtherCutPriceActivityList();
|
||
} else {
|
||
that.$.alert(msg);
|
||
}
|
||
},
|
||
});
|
||
},
|
||
onShareAppMessage: function () {
|
||
// #ifdef MP-WEIXIN
|
||
wx.showShareMenu({
|
||
withShareTicket: true,
|
||
menus: ["shareAppMessage", "shareTimeline"],
|
||
});
|
||
// #endif
|
||
|
||
return {
|
||
title: this.Info.activity_rule.item_name,
|
||
path:
|
||
"/activity/cutprice/detail?mid=" +
|
||
this.mid +
|
||
"&uid=" +
|
||
this.uid +
|
||
"&pid=" +
|
||
this.pid +
|
||
"&ac_id=" +
|
||
this.ac_id,
|
||
};
|
||
},
|
||
|
||
/**
|
||
* 用户点击右上角分享朋友圈
|
||
*/
|
||
onShareTimeline: function () {
|
||
return {
|
||
title: this.Info.activity_rule.item_name,
|
||
query: {
|
||
mid: this.mid,
|
||
pid: this.pid,
|
||
ac_id: this.ac_id,
|
||
uid: this.userInfo.user_id,
|
||
},
|
||
};
|
||
},
|
||
|
||
bargin: function () {
|
||
this.CutPrice();
|
||
},
|
||
back: function () {
|
||
this.setData({
|
||
showImg: false,
|
||
}),
|
||
this.GetVendorCutPriceEventDetail(),
|
||
this.GetOtherCutPriceActivityList();
|
||
},
|
||
more: function (e) {
|
||
if (this.flag) {
|
||
var t = this;
|
||
clearTimeout(n);
|
||
var n = setTimeout(function () {
|
||
t.setData({
|
||
page: parseInt(t.page) + 1,
|
||
}),
|
||
t.GetOtherCutPriceActivityList();
|
||
}, 500);
|
||
}
|
||
},
|
||
goshop: function () {
|
||
var e = this,
|
||
params = {
|
||
amount: 1,
|
||
item_id: this.Info.activity_rule.item_id,
|
||
ac_id: this.Info.ac_id,
|
||
order_id: this.Info.order_id,
|
||
ac_id: this.ac_id,
|
||
};
|
||
if (this.Info.order_id == "") {
|
||
$.navigateTo({
|
||
url:
|
||
"/pages/checkout/checkout?single_activity=1&ifcart=0&cart_id=" +
|
||
params.item_id +
|
||
"|" +
|
||
params.amount +
|
||
"&activity_id=" +
|
||
this.mid +
|
||
"&ac_id=" +
|
||
this.ac_id,
|
||
});
|
||
} else {
|
||
// $.navigateTo({url: "/pages/checkout/checkout?spid=" + JSON.stringify(params) + "&activity_id=" + this.mid + "&sponsorId=" + this.uid + "&sp=" + this.Info.ServicePlaceCode + "&pm=" + this.Info.PayMethodCode + "&et=" + this.Info.BusinessHoursEnd + "&st=" + this.Info.BusinessHoursStart + "&showdate=" + this.Info.ReservationTimeEnabled + "&showname=" + this.Info.ContactEnabled})
|
||
}
|
||
},
|
||
shareQRCode: function (e) {
|
||
var that = this,
|
||
params = {
|
||
path:
|
||
this.Config.SiteUrl +
|
||
"/h5/activity/cutprice/detail?mid=" +
|
||
this.mid +
|
||
"&uid=" +
|
||
this.uid +
|
||
"&pid=" +
|
||
this.pid +
|
||
"&ac_id=" +
|
||
this.ac_id,
|
||
Path:
|
||
"/activity/cutprice/detail?mid=" +
|
||
this.mid +
|
||
"&uid=" +
|
||
this.uid +
|
||
"&pid=" +
|
||
this.pid +
|
||
"&ac_id=" +
|
||
this.ac_id,
|
||
MainImg: this.Info.activity_rule.product_image,
|
||
MainTitle: this.Info.activity_rule.product_item_name,
|
||
ProductId: this.pid,
|
||
MarketingEventId: this.mid,
|
||
ItemSalePrice: this.Info.activity_rule.item_unit_price,
|
||
OriginalPrice: "",
|
||
GroupPersonAmout: "",
|
||
CutPrice:
|
||
this.Info.activity_rule.item_unit_price - this.Info.ac_sale_price,
|
||
UserInfoId: this.uid,
|
||
MarketingEventTime: this.Info.activity_starttime,
|
||
};
|
||
//生成二维码并返回地址。 - 需要修改调整为小程序地址
|
||
$.request({
|
||
url: this.Config.URL.wx.getMiniAppQRCodeUnlimitPoster,
|
||
data: params,
|
||
success: function (data, status, msg, code) {
|
||
that.setData({
|
||
PageQRCodeInfo: {
|
||
Path: data.url,
|
||
IsShare: true,
|
||
IsShareBox: false,
|
||
IsJT: true,
|
||
},
|
||
});
|
||
},
|
||
});
|
||
},
|
||
shareBox: function () {
|
||
let that = this;
|
||
// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
|
||
var $href = $.sprintf(
|
||
"%s/h5/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d",
|
||
that.Config.SiteUrl,
|
||
this.mid,
|
||
this.pid,
|
||
this.ac_id,
|
||
this.uid
|
||
);
|
||
// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
|
||
// #ifdef APP-PLUS
|
||
$href = $.sprintf(
|
||
"%s/h5/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d",
|
||
that.Config.SiteUrl,
|
||
this.mid,
|
||
this.pid,
|
||
this.ac_id,
|
||
this.uid
|
||
);
|
||
// #endif
|
||
|
||
// #ifdef MP-WEIXIN
|
||
$href = $.sprintf(
|
||
"%s/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d",
|
||
that.Config.SiteUrl,
|
||
this.mid,
|
||
this.pid,
|
||
this.ac_id,
|
||
this.uid
|
||
);
|
||
// #endif
|
||
|
||
this.setData({
|
||
shareData: {
|
||
shareTitle: this.Info.activity_rule.product_item_name,
|
||
shareText: "",
|
||
href: $href,
|
||
image: this.Info.activity_rule.product_image,
|
||
price: this.number_format(this.Info.activity_rule.item_unit_price, 2),
|
||
},
|
||
});
|
||
|
||
// #ifdef APP-PLUS
|
||
this.$refs.shareBoxApp.show();
|
||
// #endif
|
||
|
||
// #ifdef MP-WEIXIN
|
||
this.$refs.shareBoxMp.show();
|
||
// #endif
|
||
|
||
// #ifdef H5
|
||
if (that.$.ifUniApp()) {
|
||
this.$refs.shareBoxH5.show();
|
||
} else {
|
||
this.$refs.shareBoxMp.show();
|
||
}
|
||
// #endif
|
||
|
||
return;
|
||
|
||
this.setData({
|
||
PageQRCodeInfo: {
|
||
Path: "",
|
||
IsShare: true,
|
||
IsShareBox: true,
|
||
IsJT: false,
|
||
},
|
||
});
|
||
},
|
||
cancelShare: function () {
|
||
this.setData({
|
||
PageQRCodeInfo: {
|
||
Path: "",
|
||
IsShare: false,
|
||
IsShareBox: false,
|
||
IsJT: false,
|
||
},
|
||
});
|
||
},
|
||
saveImg: function () {
|
||
var e = this;
|
||
$.showLoading(),
|
||
$.downloadFile({
|
||
url: this.PageQRCodeInfo.Path,
|
||
success: function (t) {
|
||
$.hideLoading(),
|
||
$.saveImageToPhotosAlbum({
|
||
filePath: t.tempFilePath,
|
||
success: function () {
|
||
e.setData({
|
||
PageQRCodeInfo: {
|
||
Path: "",
|
||
IsShare: false,
|
||
IsShareBox: false,
|
||
IsJT: false,
|
||
},
|
||
}),
|
||
$.alert("保存图片成功！");
|
||
},
|
||
fail: function (e) {
|
||
$.hideLoading();
|
||
},
|
||
});
|
||
},
|
||
fail: function (e) {
|
||
$.hideLoading();
|
||
},
|
||
});
|
||
},
|
||
showCodeImg: function () {
|
||
$.previewImage({
|
||
current: this.PageQRCodeInfo.Path,
|
||
urls: [this.PageQRCodeInfo.Path],
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import "../../styles/_variables";
|
||
|
||
.u-tap-btn {
|
||
position: fixed;
|
||
right: 20rpx;
|
||
bottom: 150rpx;
|
||
}
|
||
|
||
.u-go-home {
|
||
border-radius: 100%;
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border: 1px solid #eee;
|
||
font-size: 20rpx;
|
||
text-align: center;
|
||
background-color: #fff;
|
||
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.35);
|
||
z-index: 2;
|
||
opacity: 0.8;
|
||
line-height: 80rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.u-go-home .iconfont {
|
||
font-size: 40rpx;
|
||
}
|
||
|
||
.bargin {
|
||
width: 750rpx;
|
||
// background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/whole-background-start.png);
|
||
// background-repeat: no-repeat;
|
||
// background-size: 100% 100%;
|
||
// -moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.goods-back-sty {
|
||
background-color: #fff;
|
||
margin-left: 80rpx;
|
||
margin-right: 80rpx;
|
||
padding-bottom: 1rpx;
|
||
}
|
||
|
||
.part1_product {
|
||
display: flex;
|
||
background-color: #eceeff;
|
||
border-radius: 10rpx;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.pro_img {
|
||
margin-top: 20rpx;
|
||
margin-left: 10rpx;
|
||
width: 215rpx;
|
||
height: 205rpx;
|
||
border-radius: 15rpx;
|
||
border: 6rpx solid mediumpurple; /* 添加紫色 1px 边框 */
|
||
}
|
||
|
||
.pro_info {
|
||
margin-top: 50rpx;
|
||
margin-left: 20rpx;
|
||
position: relative;
|
||
padding-right: 70rpx;
|
||
}
|
||
|
||
.item_name_sty {
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: normal;
|
||
}
|
||
|
||
.price_sty {
|
||
position: absolute;
|
||
left: 1rpx;
|
||
bottom: 10rpx;
|
||
width: 300rpx;
|
||
}
|
||
|
||
.part-bottom-sty {
|
||
margin-top: -2rpx;
|
||
width: 750rpx;
|
||
height: 1200rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/background-bottom-one.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.goods {
|
||
padding-left: 60rpx;
|
||
padding-top: 90rpx;
|
||
}
|
||
|
||
.wxParse-p {
|
||
padding: 0 40rpx;
|
||
}
|
||
|
||
.remaining {
|
||
padding-left: 340rpx;
|
||
padding-top: 18rpx;
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.time_sty {
|
||
height: 125rpx;
|
||
margin-left: 90rpx;
|
||
margin-right: 90rpx;
|
||
padding-left: 150rpx;
|
||
}
|
||
|
||
.time_fon_sty {
|
||
margin-left: 65rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.remaining_time {
|
||
font-size: 45rpx;
|
||
color: white;
|
||
}
|
||
|
||
.time {
|
||
margin-right: 10rpx;
|
||
padding-left: 10rpx;
|
||
padding-right: 10rpx;
|
||
padding-top: 6rpx;
|
||
padding-bottom: 4rpx;
|
||
display: inline;
|
||
background-size: 80% 80%;
|
||
background-color: #5555ff;
|
||
border-radius: 8rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.point_sty {
|
||
color: #5555ff;
|
||
display: inline;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.present {
|
||
padding-left: 340rpx;
|
||
padding-top: 10rpx;
|
||
}
|
||
|
||
.present_price {
|
||
display: inline;
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.price {
|
||
display: inline;
|
||
font-size: 32rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.top-sty {
|
||
width: 750rpx;
|
||
height: 950rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/background-start-top.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.user-info {
|
||
padding-top: 690rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
flex-direction: column;
|
||
}
|
||
.user-img {
|
||
width: 180rpx;
|
||
height: 180rpx;
|
||
border-radius: 50%;
|
||
border: 8rpx solid mediumpurple;
|
||
}
|
||
|
||
.username {
|
||
margin-top: 5px;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
color: mediumpurple;
|
||
}
|
||
|
||
.goods-sty {
|
||
margin-top: -2rpx;
|
||
width: 750rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/background-goods.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
// .part2 {
|
||
// margin-top: 45rpx;
|
||
// margin-left: 58rpx;
|
||
// margin-right: 62rpx;
|
||
// border: 1rpx solid rgb(201, 76, 98);
|
||
// background: rgb(176, 14, 46);
|
||
// border-radius: 30rpx;
|
||
// height: 146rpx;
|
||
// display: flex;
|
||
// justify-content: space-between;
|
||
// align-items: center;
|
||
// padding: 0 10rpx;
|
||
// }
|
||
|
||
.text1 {
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
margin-top: 6rpx;
|
||
}
|
||
|
||
.progress-bar {
|
||
margin-top: 36rpx;
|
||
margin-left: 64rpx;
|
||
margin-right: 30rpx;
|
||
width: 618rpx;
|
||
height: 36rpx;
|
||
border: 5rpx solid rgb(89, 10, 35);
|
||
background: rgb(89, 10, 35);
|
||
border-radius: 40rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.left {
|
||
border-radius: 40rpx;
|
||
background: rgb(255, 231, 0);
|
||
height: 100%;
|
||
float: left;
|
||
}
|
||
|
||
.m-nearbylist {
|
||
height: 100%;
|
||
}
|
||
|
||
.original {
|
||
color: #fff;
|
||
float: left;
|
||
}
|
||
|
||
.og1 {
|
||
padding-left: 80rpx;
|
||
padding-top: 15rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.og2 {
|
||
padding-left: 75rpx;
|
||
font-weight: bolder;
|
||
padding-top: 6rpx;
|
||
color: #ffc001;
|
||
font-family: "微软雅黑";
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.part3 {
|
||
position: relative;
|
||
height: 210rpx;
|
||
}
|
||
|
||
.cut-off {
|
||
color: #fff;
|
||
display: flex;
|
||
flex-flow: column;
|
||
justify-content: center;
|
||
margin-right: 72rpx;
|
||
text-align: right;
|
||
}
|
||
|
||
.button-start {
|
||
margin-top: 20rpx;
|
||
margin-left: 270rpx;
|
||
margin-right: 270rpx;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
text-align: center;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/begin-bargaining-button.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.cut_down_sty {
|
||
margin-bottom: 10rpx;
|
||
justify-content: space-between;
|
||
display: flex;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
color: mediumpurple;
|
||
}
|
||
|
||
.immediately_btn {
|
||
margin-left: 180rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/sell-immediately.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.help_cut_btn {
|
||
margin-left: 100rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/help-cut.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.cut_pri_sty {
|
||
position: absolute;
|
||
right: 180rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/help-cut-price.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.up_hands_sty {
|
||
position: absolute;
|
||
left: 180rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/sell-immediately.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.i_want_sty {
|
||
position: absolute;
|
||
left: 180rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/i-want.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.help_cut_btn_1 {
|
||
position: absolute;
|
||
right: 180rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/help-cut.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.again_stroll_sty {
|
||
position: absolute;
|
||
left: 300rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/again-stroll.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.congratulate-success {
|
||
position: absolute;
|
||
left: 300rpx;
|
||
height: 60rpx;
|
||
width: 150rpx;
|
||
background-image: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/cutprice-1/sell-immediately.png);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
-moz-background-size: 100% 100%;
|
||
}
|
||
|
||
.button {
|
||
margin-top: 40rpx;
|
||
margin-left: 160rpx;
|
||
margin-right: 160rpx;
|
||
border: 1rpx solid rgb(255, 172, 51);
|
||
background: rgb(255, 172, 51);
|
||
border-radius: 12rpx;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
text-align: center;
|
||
color: #fff;
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.button1 {
|
||
width: 240rpx;
|
||
height: 70rpx;
|
||
font-size: 32rpx;
|
||
margin-top: 40rpx;
|
||
color: #fff;
|
||
text-align: center;
|
||
line-height: 70rpx;
|
||
border-radius: 12rpx;
|
||
background: rgb(255, 172, 51);
|
||
}
|
||
|
||
.button2 {
|
||
margin-top: 40rpx;
|
||
margin-left: 160rpx;
|
||
margin-right: 160rpx;
|
||
background: rgb(136, 136, 136);
|
||
border-radius: 12rpx;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
text-align: center;
|
||
color: #fff;
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.part4 {
|
||
color: #fff;
|
||
border-top: 2rpx solid rgb(140, 19, 55);
|
||
margin-top: 63rpx;
|
||
min-height: 360rpx;
|
||
}
|
||
|
||
.header {
|
||
padding-top: 36rpx;
|
||
text-align: center;
|
||
font-size: 32rpx;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.content {
|
||
text-indent: 3em;
|
||
padding-top: 22rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.content1 {
|
||
text-indent: 3em;
|
||
padding-top: 20rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.part5 {
|
||
margin-top: 40rpx;
|
||
}
|
||
|
||
.header1 {
|
||
text-align: center;
|
||
font-size: 32rpx;
|
||
color: #fff;
|
||
background: rgb(255, 172, 51);
|
||
border-radius: 42rpx;
|
||
height: 52rpx;
|
||
line-height: 52rpx;
|
||
}
|
||
|
||
.header_shadow {
|
||
margin-left: 222rpx;
|
||
margin-right: 233rpx;
|
||
border-radius: 42rpx;
|
||
height: 52rpx;
|
||
line-height: 52rpx;
|
||
padding-bottom: 4rpx;
|
||
}
|
||
|
||
.part6 {
|
||
margin-top: 110rpx;
|
||
height: 630rpx;
|
||
margin-left: 80rpx;
|
||
margin-right: 80rpx;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.avatar_sty {
|
||
margin-top: 20rpx;
|
||
margin-left: 20rpx;
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
border-radius: 50%;
|
||
border: 3rpx solid mediumpurple;
|
||
}
|
||
|
||
.user_nickname_sty {
|
||
margin-top: 30rpx;
|
||
margin-left: 15rpx;
|
||
font-size: 32rpx;
|
||
width: 280rpx;
|
||
height: 55rpx;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.cut_away_sty {
|
||
color: #0543d5;
|
||
font-size: 32rpx;
|
||
position: absolute;
|
||
right: 5rpx;
|
||
top: 50rpx;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.kanjia view {
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.animation {
|
||
width: 100%;
|
||
height: 100%;
|
||
// background: black;
|
||
position: absolute;
|
||
top: 0;
|
||
}
|
||
|
||
.dao {
|
||
width: 380rpx;
|
||
height: 340rpx;
|
||
position: absolute;
|
||
top: 4%;
|
||
right: 0%;
|
||
}
|
||
|
||
.dao1 {
|
||
width: 380rpx;
|
||
height: 340rpx;
|
||
position: absolute;
|
||
top: 4%;
|
||
right: 0%;
|
||
animation: move 300ms linear;
|
||
animation-delay: 500ms;
|
||
transform-origin: right bottom;
|
||
animation-fill-mode: forwards;
|
||
}
|
||
|
||
@keyframes move {
|
||
0% {
|
||
transform: rotateX(0);
|
||
}
|
||
|
||
50% {
|
||
transform: rotateZ(-45deg);
|
||
}
|
||
|
||
100% {
|
||
transform: rotateZ(-30deg);
|
||
}
|
||
}
|
||
|
||
.bag {
|
||
width: 336rpx;
|
||
height: 344rpx;
|
||
position: absolute;
|
||
top: 32%;
|
||
left: 25%;
|
||
}
|
||
|
||
.bagmoney {
|
||
width: 525rpx;
|
||
height: 516rpx;
|
||
position: absolute;
|
||
top: 24%;
|
||
left: 21%;
|
||
}
|
||
|
||
.success {
|
||
width: 60%;
|
||
height: 66rpx;
|
||
border-radius: 10rpx;
|
||
background: rgb(250, 51, 1);
|
||
line-height: 66rpx;
|
||
text-align: center;
|
||
position: absolute;
|
||
bottom: 15%;
|
||
left: 20%;
|
||
color: #fff;
|
||
}
|
||
|
||
.Price {
|
||
display: inline;
|
||
font-size: 42rpx;
|
||
position: absolute;
|
||
top: 67%;
|
||
width: 100%;
|
||
// #ifdef MP-WEIXIN
|
||
top: 62% !important;
|
||
// #endif
|
||
text-align: center;
|
||
color: rgb(255, 227, 130);
|
||
}
|
||
|
||
.more {
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
background: rgb(41, 36, 56);
|
||
padding-bottom: 40rpx;
|
||
}
|
||
|
||
/* .progressBarBox{position: absolute;right: 0;bottom: 38%;color: #888;font-size: 24rpx;margin-right: 20rpx;} */
|
||
|
||
.u-progressBar {
|
||
display: inline-block;
|
||
width: 80%;
|
||
height: 26rpx;
|
||
background-color: #d5d5d5;
|
||
border-radius: 20rpx;
|
||
overflow: hidden;
|
||
margin-left: 10%;
|
||
}
|
||
|
||
.u-progressBar-cont {
|
||
height: 26rpx;
|
||
background-color: mediumpurple;
|
||
}
|
||
|
||
.floor {
|
||
color: #ffc001;
|
||
font-size: 28rpx;
|
||
padding-top: 10rpx;
|
||
}
|
||
</style> |