429 lines
10 KiB
Vue
429 lines
10 KiB
Vue
<template>
|
||
<view>
|
||
<!-- <navBar :navTitle="collectionsDetail.Name" :isBack="true" :stickyShow="stickyShow"></navBar> -->
|
||
<view class="fixed-box">
|
||
<view class="btn">
|
||
<u-button
|
||
type="warning"
|
||
:text="$t('navbar.back')"
|
||
class="back"
|
||
@click="back"
|
||
></u-button>
|
||
<u-button
|
||
v-if="collectionsDetail.Num === collectionsDetail.SellNum"
|
||
:disabled="true"
|
||
type="primary"
|
||
:text="$t('buyVerfy.noGift')"
|
||
class="buyer"
|
||
></u-button>
|
||
<u-button
|
||
v-else
|
||
type="primary"
|
||
:text="$t('collection.buy')"
|
||
class="buyer"
|
||
@click="buy"
|
||
></u-button>
|
||
</view>
|
||
</view>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_01.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_02.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_03.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_04.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_05.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_06.png"
|
||
mode="widthFix"
|
||
></image>
|
||
<image
|
||
src="@/static/image/home/activity/xqy1_07.png"
|
||
mode="widthFix"
|
||
></image>
|
||
|
||
<view style="height: 160rpx"></view>
|
||
<u-popup
|
||
:show="showVerfy"
|
||
mode="center"
|
||
@close="closeVerfy"
|
||
bgColor="transparent"
|
||
>
|
||
<view class="popup-box">
|
||
<view class="title">{{ $t("buyVerfy.title") }}</view>
|
||
<view class="">
|
||
<view class="input-box">
|
||
<view class="label">{{ $t("buyVerfy.username") }}：</view>
|
||
<view class="input">
|
||
<u--input
|
||
border="none"
|
||
shape="circle"
|
||
v-model="realName"
|
||
@focus="verfFocus"
|
||
></u--input>
|
||
</view>
|
||
</view>
|
||
<view class="input-box">
|
||
<view class="label">{{ $t("buyVerfy.idNum") }}：</view>
|
||
<view class="input">
|
||
<u--input
|
||
border="none"
|
||
shape="circle"
|
||
v-model="idNum"
|
||
@focus="verfFocus"
|
||
></u--input>
|
||
</view>
|
||
</view>
|
||
<view class="flex-end">
|
||
<view class="fl-e" v-if="succes">
|
||
<image
|
||
src="../../../static/image/home/true.png"
|
||
mode=""
|
||
style="width: 30rpx; height: 30rpx; margin-right: 5px"
|
||
></image>
|
||
<text style="color: #ffffff; font-size: 24rpx">{{
|
||
$t("buyVerfy.suss")
|
||
}}</text>
|
||
</view>
|
||
<view class="fl-e" v-if="err">
|
||
<image
|
||
src="../../../static/image/home/false.png"
|
||
mode=""
|
||
style="width: 30rpx; height: 30rpx; margin-right: 5px"
|
||
></image>
|
||
<text style="color: #fd343c; font-size: 24rpx">{{
|
||
$t("buyVerfy.error")
|
||
}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<u-button
|
||
:text="$t('buyVerfy.done')"
|
||
color="#558BF2"
|
||
@click="verifyName"
|
||
style="
|
||
width: 622rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 30rpx;
|
||
"
|
||
></u-button>
|
||
<u-button
|
||
:text="$t('buyVerfy.cancel')"
|
||
color="#000000"
|
||
@click="closeVerfy"
|
||
style="
|
||
width: 622rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 30rpx;
|
||
"
|
||
></u-button>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
stickyShow: false,
|
||
showVerfy: false,
|
||
CollectionUID: "",
|
||
collectionsDetail: {},
|
||
sellPoint: [],
|
||
collDetails: [],
|
||
companyInfo: [],
|
||
copyright: [],
|
||
Blockchain: [],
|
||
realName: "",
|
||
idNum: "",
|
||
err: false,
|
||
succes: false,
|
||
SeriesName: "",
|
||
isHave: false,
|
||
AirdorpUid: "",
|
||
isClose: true,
|
||
};
|
||
},
|
||
onPageScroll(e) {
|
||
this.stickyShow = e.scrollTop > 5 ? true : false;
|
||
},
|
||
onLoad: function (option) {
|
||
this.CollectionUID = option.CollectionUID;
|
||
this.SeriesName = option.SeriesName;
|
||
// this.getCollectionDetail();
|
||
},
|
||
onShow() {
|
||
this.getCollectionDetail();
|
||
},
|
||
methods: {
|
||
open3D() {
|
||
uni.navigateTo({
|
||
url: "/pages/index/detail/open3D/open3D",
|
||
});
|
||
},
|
||
back() {
|
||
// this.$common.navigateBack();
|
||
uni.navigateTo({
|
||
url:
|
||
"/pages/index/activity/index?detail=" +
|
||
uni.getStorageSync("activity_params"),
|
||
});
|
||
},
|
||
async getCollectionDetail() {
|
||
let data = {
|
||
CollectionsUID: this.CollectionUID,
|
||
};
|
||
let res = await this.$api.series.collectionsInfo(data);
|
||
if (res.status === 0) {
|
||
// await this.getPick(res.data.CollectionUID)
|
||
this.collectionsDetail = res.data;
|
||
// (this.AllImgList = res.data.CutImg ? JSON.parse(res.data.CutImg) : []),
|
||
// this.cutImg();
|
||
} else {
|
||
uni.$u.toast(this.$t("load.failed"));
|
||
}
|
||
},
|
||
/* async getPick(uid) {
|
||
let parmas = {
|
||
uuid: uid
|
||
}
|
||
let res = await this.$api.series.userHaveDropNo(parmas);
|
||
if(res.status === 0) {
|
||
console.log(res.data.Hava);
|
||
this.isHave = res.data.Have != 0 ? false : true;
|
||
this.AirdorpUid = res.data.UserAirdorpUid
|
||
} else {
|
||
this.isHave = false
|
||
}
|
||
}, */
|
||
/* cutImg() {
|
||
this.AllImgList.forEach((v) => {
|
||
if (v.label === "卖点") {
|
||
this.sellPoint = v.imgs;
|
||
} else if (v.label === "藏品细节") {
|
||
this.collDetails = v.imgs;
|
||
} else if (v.label === "工艺/公司介绍") {
|
||
this.companyInfo = v.imgs;
|
||
} else if (v.label === "版权声明") {
|
||
this.copyright = v.imgs;
|
||
} else if (v.label === "区块链说明") {
|
||
this.Blockchain = v.imgs;
|
||
}
|
||
});
|
||
}, */
|
||
buy() {
|
||
let token = uni.getStorageSync("mall_token");
|
||
let realName = uni.getStorageSync("mall-user-info")
|
||
? uni.getStorageSync("mall-user-info").realName
|
||
: "";
|
||
if (!token) {
|
||
uni.$u.toast(this.$t("login.pls"));
|
||
uni.setStorageSync(
|
||
"return_url",
|
||
"/pages/index/activity/detail?CollectionUID=" +
|
||
this.CollectionUID +
|
||
"&SeriesName=" +
|
||
this.SeriesName
|
||
);
|
||
uni.navigateTo({
|
||
url: "/pages/login/login",
|
||
});
|
||
} else if (!realName) {
|
||
this.showVerfy = true;
|
||
} else {
|
||
uni.navigateTo({
|
||
url:
|
||
"/pages/index/comfirm/comfirm?Collection=" +
|
||
encodeURIComponent(JSON.stringify(this.collectionsDetail)),
|
||
});
|
||
}
|
||
},
|
||
/* async pickUp() {
|
||
let data = {
|
||
UserId: uni.getStorageSync('mall-user-info').ID,
|
||
Uuid: this.AirdorpUid
|
||
};
|
||
let res = await this.$api.airdrop.getCollection(data);
|
||
if (res.status === 0) {
|
||
this.recive();
|
||
} else {
|
||
uni.$u.toast(res.msg);
|
||
}
|
||
},
|
||
async recive() {
|
||
let data = {
|
||
collectionsUID: this.CollectionUID,
|
||
userAirdropUuid: this.AirdorpUid
|
||
};
|
||
let res = await this.$api.airdrop.getCollectionStepTwo(data);
|
||
if (res.status === 0) {
|
||
uni.navigateTo({
|
||
url: '/pages/index/payment/reciveOK'
|
||
})
|
||
} else {
|
||
uni.$u.toast(res.msg);
|
||
}
|
||
}, */
|
||
async verifyName() {
|
||
let data = {
|
||
idNum: this.idNum,
|
||
realName: this.realName,
|
||
};
|
||
let res = await this.$api.mine.update(data);
|
||
|
||
if (res.status === 0) {
|
||
this.succes = true;
|
||
uni.setStorageSync("mall-user-info", res.data);
|
||
setTimeout(() => {
|
||
this.idNum = "";
|
||
this.realName = "";
|
||
this.showVerfy = false;
|
||
this.err = false;
|
||
}, 1000);
|
||
} else {
|
||
this.err = true;
|
||
this.succes = false;
|
||
uni.$u.toast(res.msg);
|
||
}
|
||
},
|
||
verfFocus() {
|
||
this.err = false;
|
||
this.succes = false;
|
||
},
|
||
doneVerfy() {
|
||
this.showVerfy = false;
|
||
},
|
||
closeVerfy() {
|
||
this.showVerfy = false;
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.fixed-box {
|
||
position: fixed;
|
||
bottom: 0;
|
||
width: 100%;
|
||
height: 172rpx;
|
||
// background: #3e3e3e;
|
||
background: rgba(0, 0, 0, 1);
|
||
z-index: 10;
|
||
|
||
.btn {
|
||
display: flex;
|
||
padding: 42rpx 38rpx;
|
||
}
|
||
|
||
.back {
|
||
width: 172rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
// background: #efba42;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
border-color: rgba(0, 0, 0, 1);
|
||
margin-right: 30rpx;
|
||
}
|
||
|
||
.buyer {
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
// background: #558bf2;
|
||
background: rgba(
|
||
252,
|
||
73,
|
||
71,
|
||
1
|
||
); //linear-gradient(#FFA10A 0%,#C12020 100%);
|
||
border-color: rgba(0, 0, 0, 1);
|
||
}
|
||
|
||
/* .disBtn {
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
line-height: 56upx;
|
||
border-radius: 40rpx;
|
||
background: rgba(65, 0, 0, 1);
|
||
border: 1upx #fff solid;
|
||
text-align: center;
|
||
}
|
||
*/
|
||
}
|
||
|
||
image {
|
||
width: 100%;
|
||
height: auto;
|
||
display: block;
|
||
}
|
||
.popup-box {
|
||
background: rgba(0, 0, 0, 1);
|
||
width: 698rpx;
|
||
overflow: hidden;
|
||
padding: 30rpx 0;
|
||
|
||
.title {
|
||
font-size: 40rpx;
|
||
text-align: center;
|
||
margin-top: 80rpx;
|
||
margin-bottom: 100rpx;
|
||
}
|
||
|
||
.input-box {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 0 34rpx 34rpx 38rpx;
|
||
|
||
.label {
|
||
font-size: 22rpx;
|
||
}
|
||
|
||
.input {
|
||
background: rgba(255, 255, 255, 0.5);
|
||
width: 450rpx;
|
||
height: 60rpx;
|
||
border-radius: 40rpx;
|
||
padding: 0 20rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
/deep/ .input-placeholder {
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
/deep/ .uni-input-input {
|
||
font-size: 24rpx;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.flex-end {
|
||
padding: 0 34rpx 34rpx 38rpx;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
|
||
.fl-e {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
}
|
||
</style>
|