1208 lines
36 KiB
Vue
1208 lines
36 KiB
Vue
<template>
|
||
<view class="s-page-wrapper" v-if="showPage">
|
||
<view class="index-goods" v-if="loadGoods">
|
||
<view class="swiper">
|
||
<swiper class="swiper-container" :autoplay="true" :interval="4000" :circular="true"
|
||
:indicator-dots="true" indicator-active-color="#05C25C" indicator-color="#cccccc">
|
||
<block v-for="(item, index) in imageView" :key="index">
|
||
<swiper-item class="swiper-wrapper">
|
||
<image :src="item" mode="widthFix" class="is-response" lazy-load="true"
|
||
@tap="previewPhoto(index)"></image>
|
||
</swiper-item>
|
||
</block>
|
||
</swiper>
|
||
</view>
|
||
<view class="goods_info" style="padding-top: 6px;padding-bottom: 16upx">
|
||
<view class="coupon-price s-row">
|
||
<view class="price" style="width: 70%">
|
||
<text style="font-size: 24upx;margin-left: 4upx;">特惠价</text>
|
||
<text style="font-size: 34upx">￥</text>
|
||
<text style="font-weight: 700;">{{ ordersMoney }}</text>
|
||
<text
|
||
style="font-size: 24upx;color: grey;text-decoration:line-through;margin-left: 8px">￥{{ ordersList.originalPrice }}</text>
|
||
</view>
|
||
</view>
|
||
<view style="padding: 16upx 16upx 16upx 16upx;display: flex;">
|
||
<view style="width:99%;">
|
||
<text
|
||
style="color: #FFFFFF;background: #05C25C;font-size: 24upx;padding-left: 12upx;padding-right: 12upx;border-radius: 16upx;margin-right: 8upx;padding-top: 4upx;padding-bottom: 4upx;">
|
||
<text>自营</text>
|
||
</text>
|
||
<text style="font-weight: bold;font-size: 32upx;">
|
||
<text @longpress="copyTitle">{{ ordersList.title }}</text>
|
||
</text>
|
||
</view>
|
||
<!-- <view
|
||
style="width: 120upx;height:48upx; text-align: center;line-height: 48upx; background-color: #ebebeb;border-radius:24upx 0upx 0upx 24upx;">
|
||
<text @click="onShare()">
|
||
<text class="cuIcon cuIcon-share"></text>
|
||
<text>分享</text>
|
||
</text>
|
||
</view> -->
|
||
</view>
|
||
<view style="width:100%;height: 170upx;background-color:#F2F2F2;" v-if="brandName">
|
||
<view
|
||
style="float: right;height: 140upx;width:100%;background-color:#FFFFFF;float: right; line-height: 68upx;margin-top: 16upx;margin-bottom:16upx;">
|
||
<view style="display: flex;">
|
||
<view style="margin-right:60upx ;margin-left: 20upx;">品牌</view>
|
||
<view style="font-weight: bold;">{{brandName}}</view>
|
||
</view>
|
||
<view style="display: flex;">
|
||
<view style="margin-right:60upx ;margin-left: 20upx;">店铺</view>
|
||
<image style="height: 40upx;width:40upx;margin-top: 6px;margin-right: 4upx;"
|
||
src="https://renwu.xiansqx.com/img/20210813/f51eb872013a4681826d15cd9e641b5c.png"></image>
|
||
<view style="font-weight: bold;">盛安到家自营店铺</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view style="width:100%;height: 98upx;background-color:#F2F2F2;" v-if="brandName === ''">
|
||
<view style="float: right;height: 68upx;width:100%;background-color:#FFFFFF;float: right; line-height: 68upx;margin-top: 16upx;margin-bottom:16upx;display: flex;">
|
||
<view style="margin-right:60upx ;margin-left: 20upx;">店铺</view>
|
||
<image style="height: 40upx;width:40upx;margin-top: 6px;margin-right: 4upx;"
|
||
src="https://renwu.xiansqx.com/img/20210813/f51eb872013a4681826d15cd9e641b5c.png"></image>
|
||
<view style="font-weight: bold;">盛安到家自营店铺</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view style="width: 100%;padding:30upx">
|
||
<view class="goods-info-title" style="color:#333333;width: 20%;text-align: center;float:left;">
|
||
必买理由
|
||
</view>
|
||
<view class="volume" style="font-size: 28upx;float: right;color:#333333;"><text
|
||
style="color:#05C25C;font-weight: bold;">{{ ordersList.sales }}人付款</text></view>
|
||
<view class="coupon-price s-row"></view>
|
||
<view class="goods_reco"
|
||
style="display: flex;margin-top: 20upx;background-color: #F2F2F2;width: 96%;margin:20upx auto 0;position: relative;border-radius: 8upx;">
|
||
<image src="https://renwu.xiansqx.com/img/20210813/679085c656ed463f948940bf4f7d173e.png"
|
||
style="width:14upx;height:12upx;display: block;position: absolute;top:-12upx;left:34upx">
|
||
</image>
|
||
<view class="goods_desc" style="padding-bottom: 16upx;padding-top:20upx;" @click="TklmaskShow">
|
||
<text>{{ ordersList.buyReason }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view style="margin: 20upx 0upx;border-radius: 15upx;background-color: #FFFFFF;"
|
||
v-if="pinglunList.length > 0">
|
||
<view style="padding:20upx;">
|
||
<view style="display: flex;justify-content: space-between;">
|
||
<view class="goods-info-title"
|
||
style="color: #333;font-weight: bold;width: 78%;text-align: left;float:left;">
|
||
宝贝评论({{totalElements}})</view>
|
||
<view style="color: #999999;" @tap="goPingLunList()">查看更多</view>
|
||
<image src="https://renwu.xiansqx.com/img/20210813/c6fbb650f8cd4e81bf93d8a64d9b3b8a.png"
|
||
style="width: 15rpx;height: 26rpx;margin-top: 8rpx;"></image>
|
||
</view>
|
||
|
||
<view style="display: flex;padding: 20rpx;">
|
||
<image :src="pinglunList[0].userHeader ? pinglunList[0].userHeader : '/static/logo.png'"
|
||
style="width: 80rpx;height: 80rpx;border-radius: 50rpx;"></image>
|
||
<view style="margin-top: 5rpx;margin-left: 10rpx;width: 42%;">
|
||
<view
|
||
style="margin-left: 15rpx;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;">
|
||
{{pinglunList[0].userName}}
|
||
</view>
|
||
<uni-rate style="margin-left: 15rpx;margin-top: 10rpx;" :size='15'
|
||
:value="pinglunList[0].score" />
|
||
</view>
|
||
<view style="margin-left: 20rpx;margin-top: 20rpx;color: #666666;">{{pinglunList[0].createTime}}
|
||
</view>
|
||
</view>
|
||
<!-- #ifdef MP-WEIXIN -->
|
||
<view style="padding: 0 20rpx 0 20rpx;">{{pinglunList[0].content}}</view>
|
||
<view style="display: flex;padding: 10rpx 0 0 10rpx;flex-wrap: wrap;"
|
||
v-if="pinglunList[0].img &&pinglunList[0].img.length > 0">
|
||
<view style="margin: 5rpx;" v-for="(item,index) in pinglunList[0].img">
|
||
<image :src="item" lazy-load="true"
|
||
style="width: 210rpx;height: 210rpx;border-radius: 10rpx;" @tap='selectPhoto(item)'>
|
||
</image>
|
||
</view>
|
||
</view>
|
||
<!-- #endif -->
|
||
<!-- #ifndef MP-WEIXIN -->
|
||
<view style="padding: 20rpx 20rpx 0 20rpx;">{{pinglunList[0].content}}</view>
|
||
<view style="display: flex;padding: 10rpx 0 0 10rpx;flex-wrap: wrap;"
|
||
v-if="pinglunList[0].img &&pinglunList[0].img.length > 0">
|
||
<view style="margin: 5rpx;" v-for="(item,index) in pinglunList[0].img">
|
||
<image :src="item" lazy-load="true"
|
||
style="width: 210rpx;height: 210rpx;border-radius: 10rpx;" @tap='selectPhoto(item)'>
|
||
</image>
|
||
</view>
|
||
</view>
|
||
<!-- #endif -->
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<view class="goods_reco" style="margin-top: 20rpx;border-radius: 15upx;" v-if="ordersList.descrition">
|
||
<view class="goods-info-title" style="color: #333;font-weight: bold;">宝贝详情</view>
|
||
<view class="imglist">
|
||
<!-- <uparse :content="ordersList.descrition" @navigate="navigate" class="is-response"></uparse> -->
|
||
<div v-html="ordersList.descrition"></div>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 购买按钮 -->
|
||
<view class="goods_shop_cart">
|
||
<view class="cent" style="display: flex">
|
||
<view style="text-align: center;width: 10%;margin-top: 4px;margin-bottom: 4px;display: flex">
|
||
<view style="width: 100%;text-align: center;">
|
||
<view class="iconfont icon-shouye" @tap="goBackUp()"></view>
|
||
<view style="font-size: 12px">首页</view>
|
||
</view>
|
||
<!-- <view style="width: 50%;text-align: center">
|
||
<view class="iconfont icon-shoucang" :style="collect.isCollect" @tap="clickCollect()">
|
||
</view>
|
||
<view style="font-size: 12px" :style="collect.isCollect">{{ collect.name }}</view>
|
||
</view> -->
|
||
</view>
|
||
<view style="width: 85%;display: flex;color: white">
|
||
<!-- <view style="border-radius: 32upx;width: 50%;background: #e43939;text-align: center;padding-top:8px;margin: 4px"
|
||
@tap="shopCartShare('fanxian')">{{ buyDes }}</view> -->
|
||
<!-- @tap="shopCartShare('quan')">立即购买</view> -->
|
||
<view class="getTbk"
|
||
style="border-radius: 32upx;width: 100%;background:#05C25C; text-align: center;padding-top: 8px;margin: 4px"
|
||
@tap="openPopus()">立即购买</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="navBarButtonBox">
|
||
<!-- 顶部右侧菜单 -->
|
||
<view v-if="navBarButton" class="goods_shop_cart_bg navBarButton" @tap="showShopCartBg('nav')"
|
||
@touchmove.stop.prevent="moveHandleStop"></view>
|
||
<!-- #ifdef H5 -->
|
||
<view style="margin-top: 66upx;" class="h_newlit" v-bind:class="[navBarButton ? 'active' : '', '']">
|
||
|
||
<!-- #endif -->
|
||
<!-- #ifndef H5 -->
|
||
<view style="margin-top: 66upx;" class="h_newlit" v-bind:class="[navBarButton ? 'active' : '', '']">
|
||
|
||
<!-- #endif -->
|
||
<view class="em">
|
||
<view style="font-size: 14px" @tap="navBarButtontO('home')">
|
||
<text class="iconfont icon-shouye"></text>
|
||
返回首页
|
||
</view>
|
||
<!-- <view style="font-size: 14px" @tap="navBarButtontO('search')">
|
||
<text class="iconfont icon-sousuo"></text>
|
||
超级搜索
|
||
</view>
|
||
<view style="font-size: 14px" @tap="navBarButtontO('footer')">
|
||
<text class="iconfont icon-zuji"></text>
|
||
我的足迹
|
||
</view> -->
|
||
<view style="font-size: 14px" @tap="navBarButtontO('like')">
|
||
<text class="iconfont icon-shoucang"></text>
|
||
个人中心
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 淘口令分享 -->
|
||
<simpleModal ref="simpleModalTkl" @maskClose="TklmaskClose">
|
||
<view class="buy-box-title">复制分享文案</view>
|
||
<view class="buy-box-center">
|
||
<view class="code-cent">
|
||
<div class="cente-text">
|
||
<div>
|
||
<view class="textarea">
|
||
{{ ordersList.title }}
|
||
<br />
|
||
【在售价】{{ ordersMoney }}元
|
||
<br />
|
||
【下单链接】{{ erweima }}
|
||
<br />
|
||
【必买理由】{{ ordersList.buyReason }}
|
||
<br />
|
||
</view>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
<view class="buy-btn-copy" v-bind:class="[copyTklStatus ? 'active' : '', '']" @tap="copyTklWenAns">
|
||
{{ copyTklStatus ? '已复制到剪切板' : '一键复制' }}
|
||
</view>
|
||
</view>
|
||
</simpleModal>
|
||
<!-- 淘口令分享 -->
|
||
<view class="" v-if="!loadGoods">
|
||
<view class="s-page">
|
||
<view class="is-100vh is-flex is-column is-justify-center is-align-center ">
|
||
<image src="https://renwu.xiansqx.com/img/20210809/adaf23d6b79247ac96644d13a55418f1.gif"
|
||
style="width:75px;height: 75px;" class="is-response" mode="widthFix"></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<uni-popup ref="popusshare" type="bottom">
|
||
<view
|
||
style="width: 100%;height: max-content;background: #FFFFFF;border-top-left-radius: 20upx;border-top-right-radius: 20upx;padding: 40upx;">
|
||
<view style="display: flex;flex-wrap: wrap;flex-wrap: wrap;">
|
||
<view style="width: 50%;text-align: center;" v-for='(item,index) in bottomData' :key='index'
|
||
@tap='goShare(index)'>
|
||
<button v-if="index === 0" style="text-align:center;background: #FFFFFF;" open-type='share'>
|
||
<image :src="item.icon" style="width: 80rpx;height: 80rpx;"></image>
|
||
<view style="color: #000000;">{{item.text}}</view>
|
||
</button>
|
||
<view v-if="index != 0">
|
||
<image :src="item.icon" style="width: 80rpx;height: 80rpx;"></image>
|
||
<view style="color: #000000;margin-top: 38rpx;">{{item.text}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<uni-popup ref="popus" type="bottom">
|
||
<view
|
||
style="width: 100%;height: max-content;background: #FFFFFF;border-top-left-radius: 20upx;border-top-right-radius: 20upx;padding: 40upx;">
|
||
<view style="display: flex;">
|
||
<image :src="attrValuecoverImg" style="width: 150upx;height: 150upx;"></image>
|
||
<view style="margin-top: 70upx;margin-left: 20upx;">
|
||
<view style="display: flex;">
|
||
<view style="font-size: 28upx;color: #FF4733;">¥ {{numberMoney}}</view>
|
||
<view v-if="Maxnumber != -1"
|
||
style="margin-left: 20upx;font-size: 24upx;color: #333333;">库存：{{Maxnumber}}
|
||
</view>
|
||
</view>
|
||
<view style="font-size: 28upx;color: #333333;margin-top: 10upx;">请选择产品类型</view>
|
||
</view>
|
||
</view>
|
||
<view v-for="(item,index) in attrValue" :key='index'>
|
||
<view style="margin-top: 50upx;font-size: 32upx;color: #000000;">{{item.value}}</view>
|
||
<view style="display: flex;flex-wrap: wrap;flex-wrap: wrap;">
|
||
<view style="display: flex;flex-wrap: wrap;" v-for="(de,ind) in item.detail"
|
||
@tap='checkState(de,index,ind)'>
|
||
<view
|
||
:style="item.goodsId == index && item.attrId == ind && de.state != ''?
|
||
'width: 150rpx; height: 50rpx;background: #F2F2F2;text-align: center;border-radius: 50rpx;line-height: 50rpx;margin: 20rpx 0rpx 0rpx 10rpx;border: 1rpx solid #20C675;'
|
||
: 'width: 150rpx; height: 50rpx;background: #F2F2F2;text-align: center;border-radius: 50rpx;line-height: 50rpx;margin: 20rpx 0rpx 0rpx 10rpx;'">
|
||
{{de.name}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view style="display: flex;" v-if='ordersList.isExpress === 1'>
|
||
<view style="margin-top: 50upx;font-size: 32upx;color: #000000;width: 80%;">数量</view>
|
||
<view
|
||
style="width:200upx;height: 60upx;display: flex;margin-top: 30upx;border-radius: 5upx;border:1px solid #E6E6E6">
|
||
<view
|
||
style="border-right:1px solid #E6E6E6;width: 70upx;color: #999999;text-align: center;margin-top: 15upx;"
|
||
@click="jian">-</view>
|
||
<view
|
||
style="width: 80upx;text-align: center;font-size: 24upx;color: #333333;margin-top: 15upx;">
|
||
{{number}}
|
||
</view>
|
||
<view
|
||
style="border-left:1px solid #E6E6E6;width: 70upx;color: #999999;text-align: center;margin-top: 15upx"
|
||
@click="jia">+</view>
|
||
</view>
|
||
</view>
|
||
<button style="background: #20C675;color: #FFFFFF;margin-top: 50upx;"
|
||
@tap="shopCartShare('quan')">{{ShopCartOrMoney}}</button>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import simpleModal from '@/components/simple-pro/customModal.vue';
|
||
import _app from '../../../../js_sdk/QuShe-SharerPoster/QS-SharePoster/app.js';
|
||
import getSharePoster from '../../../../js_sdk/QuShe-SharerPoster/QS-SharePoster/QS-SharePoster.js';
|
||
import wmPoster from '@/components/wm-poster/wm-posterorders.vue';
|
||
import tkiQrcode from '@/components/tki-qrcode/tki-qrcode.vue';
|
||
import uparse from '@/components/u-parse/u-parse.vue'
|
||
export default {
|
||
data() {
|
||
return {
|
||
erweima: '',
|
||
erweimapath: '',
|
||
ordersId: 0,
|
||
member: 0,
|
||
modalName: '',
|
||
ShopCartOrMoney: '',
|
||
ordersMoney: 0,
|
||
logo: '../../../../static/img/mao.png',
|
||
taobao: '../../../../static/img/taobao.png',
|
||
buyDes: '口令购买',
|
||
collect: {
|
||
name: '收藏',
|
||
isCollect: ''
|
||
},
|
||
show_share: false,
|
||
attrValuecoverImg: '',
|
||
attrValue: [],
|
||
number: 0,
|
||
Maxnumber: -1,
|
||
numberMoney: 0,
|
||
shengji: '',
|
||
pinglunList: [],
|
||
getQun: '立即领券',
|
||
follow: false,
|
||
showPage: false,
|
||
loadGoods: true,
|
||
goods: '',
|
||
relation: false,
|
||
taoBaoBuy: true,
|
||
shopCartBg: false,
|
||
scrollTop: false,
|
||
couponlist: [],
|
||
checkStateList: [],
|
||
navBarButton: false,
|
||
copyTklStatus: false,
|
||
save: false,
|
||
tkl: '',
|
||
relation_id: null,
|
||
money: 0,
|
||
grade: '',
|
||
isInvitation: 0,
|
||
showFollow: false,
|
||
isWeiXin: false,
|
||
footprintKey: 'orange-sqx-footprint-zy',
|
||
collectKey: 'orange-sqx-collect-zy',
|
||
poster: {},
|
||
imageView: [],
|
||
coupon_click_url: '',
|
||
userByinvitationId: '',
|
||
qrShow: false,
|
||
haibaoImg: null,
|
||
haibaoShow: false,
|
||
isEnable: '否',
|
||
ordersList: {},
|
||
messageList: [],
|
||
maxMoney: "0.7",
|
||
canvasId: 'default_PosterCanvasId',
|
||
XCXErweima: '',
|
||
brandName: '',
|
||
totalElements: '',
|
||
shareMessage: '',
|
||
bottomData: [{
|
||
text: '分享好友',
|
||
icon: 'https://renwu.xiansqx.com/img/20210820/cb30c10ab8a84502b0d6f96d732d1651.png',
|
||
name: 'wx'
|
||
},
|
||
{
|
||
text: '生成海报',
|
||
icon: 'https://renwu.xiansqx.com/img/20210820/b07ada1c21ce4d76b93c9e937a03911c.png',
|
||
name: 'more'
|
||
}
|
||
]
|
||
};
|
||
},
|
||
components: {
|
||
simpleModal,
|
||
tkiQrcode,
|
||
wmPoster,
|
||
uparse
|
||
},
|
||
onShow: function() {
|
||
this.copyTklStatus = false;
|
||
this.member = this.$queue.getData('member') ? this.$queue.getData('member') : 1;
|
||
|
||
let relation_id = this.$queue.getData('relation_id');
|
||
if (relation_id) {
|
||
this.relation_id = relation_id;
|
||
}
|
||
},
|
||
onLoad: function(e) {
|
||
this.$queue.showLoading("加载中...")
|
||
let a = this.$queue.getData('isEnable');
|
||
if (a) {
|
||
this.isEnable = a;
|
||
}
|
||
if (e.ordersId) {
|
||
let InvitationUser = this.$queue.getData('userByinvitationId');
|
||
if (e.userByinvitationId) {
|
||
this.userByinvitationId = e.userByinvitationId;
|
||
} else if (InvitationUser) {
|
||
this.userByinvitationId = InvitationUser;
|
||
this.$queue.remove("userByinvitationId");
|
||
}
|
||
this.ordersId = e.ordersId;
|
||
this.getCommondityList(e.ordersId);
|
||
}
|
||
// #ifdef MP-WEIXIN
|
||
if (e.scene) {
|
||
const scene = decodeURIComponent(e.scene);
|
||
var ordersId = '';
|
||
var userByinvitationId = '';
|
||
var className = '';
|
||
this.userByinvitationId = '';
|
||
let ss = scene.split(',');
|
||
for (var i = 0; i < ss.length; i++) {
|
||
console.log(ss[i])
|
||
if (i === 0) {
|
||
this.ordersId = ss[i];
|
||
} else if (i === 1) {
|
||
this.userByinvitationId = ss[i];
|
||
this.$queue.setData('userByinvitationId', ss[i]);
|
||
}
|
||
}
|
||
this.getCommondityList(this.ordersId);
|
||
}
|
||
wx.getSetting({
|
||
success(res) {
|
||
if (!res.authSetting['scope.writePhotosAlbum']) {
|
||
wx.authorize({
|
||
scope: 'scope.writePhotosAlbum',
|
||
success() {
|
||
console.log('授权成功');
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
this.shareMessage = '/package/pages/zysc/index/commoditydetail?ordersId=' + this.ordersId;
|
||
this.XCXErweima = this.$queue.publicYuMing() +
|
||
'/sqx_fast/user/getImg?page=package/pages/zysc/index/commoditydetail&scene=' + this.ordersId + '&width=200'
|
||
// #endif
|
||
|
||
//#ifdef H5
|
||
let ua = navigator.userAgent.toLowerCase();
|
||
if (ua.indexOf('micromessenger') !== -1) {
|
||
this.isWeiXin = true;
|
||
}
|
||
if (window.location.href.indexOf('&relation_id=') !== -1) {
|
||
let relation = window.location.href.split('&relation_id=')[1].split('&')[0];
|
||
this.$queue.setData('relation', relation);
|
||
}
|
||
//#endif
|
||
let relation_id = this.$queue.getData('relation_id');
|
||
this.erweima = this.$queue.publicYuMing() + '/package/pages/zysc/index/commoditydetail?ordersId=' + e
|
||
.ordersId;
|
||
this.relation = false;
|
||
this.getPingLunList();
|
||
// let userId = this.$queue.getData('userId');
|
||
// if (userId) {
|
||
// this.$Request.postT('/app/selectUserById?userId=' + userId).then(res => {
|
||
// if (res.status === 0) {
|
||
// if (res.data.isInvitation) {
|
||
// this.isInvitation = res.data.isInvitation;
|
||
// this.$queue.setData('isInvitation', res.data.isInvitation);
|
||
// }
|
||
// this.$queue.setData('relation', res.data.invitation);
|
||
// this.$queue.setData('grade', res.data.grade);
|
||
// this.$queue.setData('pddpid', res.data.pdd);
|
||
// this.$queue.setData('jdpid', res.data.jd);
|
||
// if (res.data.image_url) {
|
||
// this.$queue.setData('image_url', res.data.image_url);
|
||
// }
|
||
// this.$queue.setData('mobile', res.data.phone);
|
||
|
||
// this.$queue.setData('nickName', res.data.nickName);
|
||
// this.$queue.setData('relation_id', res.data.relationId);
|
||
// this.$queue.setData('gender', parseInt(res.data.gender));
|
||
// }
|
||
// });
|
||
// }
|
||
},
|
||
onPageScroll: function(e) {
|
||
this.scrollTop = e.scrollTop > 200;
|
||
},
|
||
onNavigationBarButtonTap: function() {
|
||
this.navBarButton = !this.navBarButton;
|
||
},
|
||
onShareAppMessage(res) {
|
||
return {
|
||
path: this.shareMessage, //这是为了传参 onload(data){let id=data.id;}
|
||
title: '在售价' + this.ordersMoney + ' ' + this.ordersList.title,
|
||
imageUrl: this.imageView[0]
|
||
}
|
||
},
|
||
methods: {
|
||
goPingLunList() {
|
||
uni.navigateTo({
|
||
url: './pinglunList?id=' + this.ordersId
|
||
});
|
||
},
|
||
getPingLunList() {
|
||
this.$Request.getT('/selfGoodsComment/list?page=0&size=1&scoreType=0&goodsId=' + this.ordersId).then(
|
||
res => {
|
||
if (res.status === 0) {
|
||
res.data.content.forEach(d => {
|
||
if (d.img) {
|
||
let img = d.img.split(',');
|
||
d.img = img;
|
||
}
|
||
this.pinglunList = res.data.content;
|
||
});
|
||
this.totalElements = res.data.totalElements;
|
||
}
|
||
});
|
||
},
|
||
goShare(index) {
|
||
this.$refs.popusshare.close();
|
||
//0,分享好友 1，生成海报
|
||
if (index === 1) {
|
||
this.showModal();
|
||
}
|
||
},
|
||
onShare() {
|
||
// #ifdef MP-WEIXIN
|
||
this.$refs.popusshare.open();
|
||
// #endif
|
||
// #ifndef MP-WEIXIN
|
||
this.showModal();
|
||
// #endif
|
||
},
|
||
goMaijia() {
|
||
let userId = this.$queue.getData('userId');
|
||
if (userId) {
|
||
uni.navigateTo({
|
||
url: '/package/pages/chat/chat?className=shop&title=' + this.ordersList.title +
|
||
'&ordersId=' + this
|
||
.ordersId + '&image=' + this.attrValuecoverImg +
|
||
'&money=' + this.ordersMoney + '&sales=' + this.ordersList.sales
|
||
});
|
||
} else {
|
||
this.loginS();
|
||
}
|
||
},
|
||
checkState(item, index, ind) {
|
||
this.number = 1;
|
||
this.attrValue[index].detail.forEach(d => {
|
||
d.state = '';
|
||
})
|
||
|
||
this.checkStateList[index].name = item.name;
|
||
this.attrValue[index].goodsId = index;
|
||
this.attrValue[index].attrId = ind;
|
||
this.attrValue[index].detail[ind].state = '123';
|
||
this.checkString = '';
|
||
this.checkStateList.forEach(d => {
|
||
if (d.name) {
|
||
if (this.checkString) {
|
||
this.checkString = this.checkString + ',' + d.name;
|
||
} else {
|
||
this.checkString = d.name;
|
||
}
|
||
|
||
}
|
||
});
|
||
for (var i = 0; i < this.ordersList.sku.length; i++) {
|
||
let d = this.ordersList.sku[i];
|
||
if (d.detailJson == this.checkString) {
|
||
if (d.stock > 0) {
|
||
this.numberMoney = d.skuPrice;
|
||
this.numberMoney1 = d.skuPrice;
|
||
this.Maxnumber = d.stock;
|
||
this.skuId = d.id;
|
||
this.attrValuecoverImg = d.skuImg ? d.skuImg : this.ordersList.coverImg;
|
||
this.CheckattrValue = true;
|
||
} else {
|
||
this.Maxnumber = 0;
|
||
this.CheckattrValue = false;
|
||
this.$queue.showToast('库存不足请选择其他的类型')
|
||
}
|
||
break
|
||
} else {
|
||
this.CheckattrValue = false;
|
||
}
|
||
}
|
||
},
|
||
jian() {
|
||
if (this.CheckattrValue) {
|
||
if (this.number != 1) {
|
||
let number = this.number - 1
|
||
this.number = number
|
||
this.numberMoney = parseFloat(this.numberMoney - this.numberMoney1).toFixed(2);
|
||
}
|
||
} else {
|
||
this.$queue.showToast('请先选择正确的商品规格');
|
||
}
|
||
},
|
||
jia() {
|
||
if (this.CheckattrValue) {
|
||
let number = this.number + 1
|
||
if (number <= this.Maxnumber) {
|
||
this.number = number
|
||
this.numberMoney = parseFloat(this.numberMoney1 * number).toFixed(2);
|
||
} else {
|
||
this.$queue.showToast('商品只能买这么多了');
|
||
}
|
||
} else {
|
||
this.$queue.showToast('请先选择正确的商品规格');
|
||
}
|
||
},
|
||
navigate(href, e) {
|
||
// #ifdef H5
|
||
window.location.href = href;
|
||
//#endif
|
||
|
||
//#ifdef APP-PLUS
|
||
setTimeout(function() {
|
||
plus.runtime.openURL(href);
|
||
}, 500);
|
||
// #endif
|
||
},
|
||
getCommondityList(id) {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
});
|
||
this.$Request.getT('/goods/find?id=' + id).then(res => {
|
||
if (res.status === 0) {
|
||
this.imageView = [];
|
||
this.ordersList = {};
|
||
this.ordersMoney = res.data.memberPrice;
|
||
this.numberMoney = res.data.memberPrice;
|
||
this.ordersList = res.data;
|
||
if (res.data.attr.length > 0) {
|
||
this.attrValue = [];
|
||
res.data.attr[0].attrValue.forEach(d => {
|
||
let data = {
|
||
name: ''
|
||
}
|
||
this.checkStateList.push(data);
|
||
let detail = [];
|
||
d.detail.split(',').forEach(d => {
|
||
let data = {
|
||
name: '',
|
||
state: ''
|
||
}
|
||
data.name = d;
|
||
detail.push(data);
|
||
});
|
||
d.detail = detail;
|
||
d.attrId = '';
|
||
d.goodsId = '';
|
||
this.attrValue.push(d);
|
||
});
|
||
}
|
||
console.log("this.attrValue____:" + this.attrValue)
|
||
this.attrValuecoverImg = res.data.coverImg;
|
||
this.imageView = res.data.img.split(',');
|
||
console.log(JSON.stringify(this.imageView))
|
||
// let isExists = this.$queue.isExistZy(this.collectKey, res.data.id);
|
||
// if (isExists === true) {
|
||
// this.collect.name = '已收藏';
|
||
// this.collect.isCollect = 'color: #E41F19';
|
||
// } else {
|
||
// this.collect.name = '收藏';
|
||
// this.collect.isCollect = false;
|
||
// }
|
||
if (res.data.brand) {
|
||
this.brandName = res.data.brand.brandName;
|
||
}
|
||
this.loadGoods = true;
|
||
// if (res.data.commissionPrice != 0) {
|
||
// if (this.member == 1) {
|
||
// this.money = ((parseFloat(res.data.helpRateList[0].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// this.shengji = ((parseFloat(res.data.helpRateList[1].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// } else if (this.member == 2) {
|
||
// this.money = ((parseFloat(res.data.helpRateList[1].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// this.shengji = ((parseFloat(res.data.helpRateList[2].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// } else if (this.member == 3) {
|
||
// this.money = ((parseFloat(res.data.helpRateList[2].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// this.shengji = ((parseFloat(res.data.helpRateList[3].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// } else if (this.member == 4) {
|
||
// this.money = ((parseFloat(res.data.helpRateList[3].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// this.shengji = ((parseFloat(res.data.helpRateList[3].rate) * parseFloat(res.data
|
||
// .commissionPrice))).toFixed(2);
|
||
// }
|
||
// this.buyDes = '分享给好友';
|
||
// }
|
||
}
|
||
uni.hideLoading();
|
||
this.showPage = true;
|
||
});
|
||
},
|
||
|
||
posterSuccess(haibaoImg) {
|
||
this.haibaoImg = haibaoImg;
|
||
this.modalName = 'Image';
|
||
},
|
||
showModal() {
|
||
if (!this.haibaoImg) {
|
||
this.haibaoShow = true;
|
||
this.$queue.showLoading('海报生成中...');
|
||
} else {
|
||
this.modalName = 'Image';
|
||
}
|
||
},
|
||
hideModal() {
|
||
this.modalName = null;
|
||
},
|
||
TklmaskClose: function(e) {
|
||
this.$refs.simpleModalTkl.hide();
|
||
this.copyTklStatus = false;
|
||
},
|
||
TklmaskShow: function(e) {
|
||
this.$refs.simpleModalTkl.show({
|
||
showConfirmButton: false
|
||
});
|
||
},
|
||
shengJiMethod() {
|
||
let relation_id = this.$queue.getData('relation_id');
|
||
if (relation_id) {
|
||
uni.navigateTo({
|
||
url: '/pages/member/yao'
|
||
});
|
||
} else {
|
||
let token = this.$queue.getData('token');
|
||
let userId = this.$queue.getData('userId');
|
||
uni.navigateTo({
|
||
url: '/pages/invitation/invitationUser'
|
||
});
|
||
}
|
||
},
|
||
qrR(path) {
|
||
this.erweimapath = path;
|
||
},
|
||
/* 预览照片 */
|
||
previewPhoto(index) {
|
||
uni.previewImage({
|
||
current: this.imageView[index],
|
||
urls: this.imageView,
|
||
longPressActions: {
|
||
itemList: ['保存图片'],
|
||
success: function(res) {
|
||
uni.getImageInfo({
|
||
src: this.imageView[res.index],
|
||
success: function(image) {
|
||
console.log('图片信息：', JSON.stringify(image));
|
||
uni.saveImageToPhotosAlbum({
|
||
filePath: image.path,
|
||
success: function() {
|
||
uni.showToast({
|
||
title: '图片保存成功',
|
||
icon: 'none',
|
||
duration: 3000
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
openPopus() {
|
||
let token = this.$queue.getData('token');
|
||
let userId = this.$queue.getData('userId');
|
||
if (token) {
|
||
this.ShopCartOrMoney = '立即购买';
|
||
if (this.ordersList.attr.length === 0) {
|
||
this.shopCartShare('quan');
|
||
} else {
|
||
this.$refs.popus.open();
|
||
}
|
||
} else {
|
||
this.loginS();
|
||
}
|
||
},
|
||
shopCartShare: function(type) {
|
||
this.$queue.setData('href', '/pages/zysc/index/commonditydetail?ordersId=' + this.ordersId);
|
||
let token = this.$queue.getData('token');
|
||
let userId = this.$queue.getData('userId');
|
||
if (token) {
|
||
|
||
if (this.ordersList.attr.length > 0) {
|
||
if (this.checkString == '' || !this.CheckattrValue) {
|
||
this.$queue.showToast('请选择正确的商品规格');
|
||
return;
|
||
}
|
||
// this.hindPopus();
|
||
uni.navigateTo({
|
||
url: '../member/order?id=' + this.ordersId + '&userByinvitationId=' +
|
||
this.userByinvitationId +
|
||
'&numberMoney=' + this.numberMoney1 + '&checkString=' + this
|
||
.checkString + '&number=' + this.number +
|
||
'&money=' + this.numberMoney + '&skuId=' + this.skuId +
|
||
'&attrValuecoverImg=' + this.attrValuecoverImg
|
||
});
|
||
} else {
|
||
if (this.ordersList.sku.length > 0 && this.ordersList.sku[0].stock < 1) {
|
||
this.$queue.showToast('库存不足，请稍后在来购买吧！');
|
||
return;
|
||
}
|
||
var money = '';
|
||
var stock = '';
|
||
if (this.ordersList.sku && this.ordersList.sku.length > 0) {
|
||
money = this.ordersList.sku[0].memberPrice;
|
||
stock = this.ordersList.sku[0].stock;
|
||
} else {
|
||
money = this.ordersList.memberPrice;
|
||
stock = 1;
|
||
}
|
||
uni.navigateTo({
|
||
url: '../member/order?id=' + this.ordersId + '&userByinvitationId=' +
|
||
this.userByinvitationId + '&money=' +
|
||
money + '&maxNumber=' + stock
|
||
|
||
});
|
||
}
|
||
|
||
// if (this.ordersList.isExpress === 2) {
|
||
// if (this.ordersList.virtualCount > 0) {
|
||
// uni.navigateTo({
|
||
// url: '/pages/zysc/member/order?id=' + this.ordersId +
|
||
// '&userByinvitationId=' + this.userByinvitationId
|
||
// });
|
||
// } else {
|
||
// this.$queue.showToast('商品库存不足无法购买！');
|
||
// }
|
||
// } else {
|
||
// uni.navigateTo({
|
||
// url: '/pages/zysc/member/order?id=' + this.ordersId + '&userByinvitationId=' +
|
||
// this.userByinvitationId
|
||
// });
|
||
// }
|
||
|
||
} else {
|
||
this.loginS();
|
||
}
|
||
},
|
||
copyTklWenAns: function() {
|
||
uni.setClipboardData({
|
||
data: this.ordersList.title +
|
||
'\n【在售价】' +
|
||
this.ordersMoney +
|
||
'元\n【必买理由】' +
|
||
this.ordersList.buyReason +
|
||
'\n下单链接：' +
|
||
this.erweima,
|
||
success: r => {
|
||
this.$queue.showToast('复制成功')
|
||
this.copyTklStatus = true;
|
||
}
|
||
});
|
||
},
|
||
goPublisher() {
|
||
let token = this.$queue.getData('token');
|
||
let userId = this.$queue.getData('userId');
|
||
if (token) {
|
||
uni.navigateTo({
|
||
url: '/pages/invitation/invitationUser'
|
||
});
|
||
} else {
|
||
this.loginS();
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 保存图片
|
||
* @param url
|
||
*/
|
||
toSave(url) {
|
||
//#ifndef H5
|
||
uni.getImageInfo({
|
||
src: url,
|
||
success: function(image) {
|
||
console.log('图片信息：', JSON.stringify(image));
|
||
uni.saveImageToPhotosAlbum({
|
||
filePath: image.path,
|
||
success: function() {
|
||
console.log('save success');
|
||
uni.showToast({
|
||
title: '图片保存成功',
|
||
icon: 'none',
|
||
duration: 3000
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
|
||
//#endif
|
||
},
|
||
/**
|
||
* 返回
|
||
*/
|
||
goBackUp() {
|
||
uni.redirectTo({
|
||
url: '/package/pages/zysc/index/index'
|
||
});
|
||
},
|
||
haibao: function() {
|
||
uni.navigateTo({
|
||
url: '/pages/detail/share'
|
||
});
|
||
},
|
||
topScrollTap: function() {
|
||
uni.pageScrollTo({
|
||
scrollTop: 0,
|
||
duration: 300
|
||
});
|
||
},
|
||
navBarButtontO: function(type) {
|
||
if (type === 'home') {
|
||
uni.switchTab({
|
||
url: '/pages/zysc/index/index'
|
||
});
|
||
} else if (type === 'like') {
|
||
uni.switchTab({
|
||
url: '/pages/my/index'
|
||
});
|
||
}
|
||
},
|
||
loginS() {
|
||
this.$queue.setData('href', '/pages/zysc/index/index');
|
||
//#ifdef H5
|
||
uni.navigateTo({
|
||
url: '/pages/public/login'
|
||
});
|
||
//#endif
|
||
//#ifndef H5
|
||
uni.navigateTo({
|
||
url: '/pages/public/login'
|
||
});
|
||
//#endif
|
||
},
|
||
copyTitle: function() {
|
||
uni.setClipboardData({
|
||
data: this.goods.title,
|
||
success: r => {
|
||
this.$queue.showToast('复制成功');
|
||
}
|
||
});
|
||
},
|
||
clickCollect() {
|
||
//收藏
|
||
let isExist = this.$queue.isExistZy(this.collectKey, this.ordersList.id);
|
||
console.log(isExist);
|
||
if (isExist) {
|
||
let items = [];
|
||
items.push(this.ordersList.id);
|
||
this.$queue.removeItemId(this.collectKey, items);
|
||
this.collect.name = "收藏";
|
||
this.collect.isCollect = "";
|
||
} else {
|
||
this.$queue.insert({
|
||
key: this.collectKey,
|
||
value: this.ordersList,
|
||
});
|
||
this.collect.name = "已收藏";
|
||
this.collect.isCollect = "color: #FC3F78";
|
||
}
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
@import '../../../../static/css/index.css';
|
||
|
||
page {
|
||
background: #f8f8f8;
|
||
}
|
||
|
||
.view_button {
|
||
margin-bottom: 10upx;
|
||
padding-left: 20upx;
|
||
float: right;
|
||
margin-right: 20upx;
|
||
line-height: 46upx;
|
||
font-size: 24upx;
|
||
color: #333333;
|
||
width: 150upx;
|
||
height: 45upx;
|
||
box-shadow: rgba(183, 183, 183, 0.3) 1px 1px 10px 1px;
|
||
border-radius: 100upx;
|
||
border: 1upx solid #bababa;
|
||
}
|
||
|
||
.swiper-container {
|
||
min-height: 100vw;
|
||
}
|
||
|
||
.hideCanvasView {
|
||
position: relative;
|
||
}
|
||
|
||
.hideCanvas {
|
||
position: fixed;
|
||
top: -99999 upx;
|
||
left: -99999 upx;
|
||
z-index: -99999;
|
||
}
|
||
|
||
.flex_row_c_c {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.modalView {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
opacity: 0;
|
||
outline: 0;
|
||
transform: scale(3);
|
||
perspective: 2500 upx;
|
||
background: rgba(0, 0, 0, 0.6);
|
||
transition: all 0.3s ease-in-out;
|
||
pointer-events: none;
|
||
backface-visibility: hidden;
|
||
z-index: 999;
|
||
}
|
||
|
||
.modalView.show {
|
||
opacity: 1;
|
||
transform: scale(1);
|
||
pointer-events: auto;
|
||
}
|
||
|
||
.flex_column {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.backgroundColor-white {
|
||
background-color: white;
|
||
}
|
||
|
||
.border_radius_10px {
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.padding1vh {
|
||
padding: 1vh;
|
||
}
|
||
|
||
.posterImage {
|
||
width: 60vw;
|
||
}
|
||
|
||
.flex_row {
|
||
display: flex;
|
||
flex-direction: row;
|
||
}
|
||
|
||
.marginTop2vh {
|
||
margin-top: 2vh;
|
||
}
|
||
|
||
.shareInfos {
|
||
color: #FF2638;
|
||
}
|
||
|
||
.shareInfo::after {
|
||
border: none;
|
||
}
|
||
|
||
button {
|
||
font-size: 14px;
|
||
}
|
||
|
||
#shareit {
|
||
-webkit-user-select: none;
|
||
position: fixed;
|
||
width: 100%;
|
||
height: 2000px;
|
||
background: rgba(0, 0, 0, 0.85);
|
||
text-align: center;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 999;
|
||
}
|
||
|
||
#shareit img {
|
||
max-width: 100%;
|
||
}
|
||
|
||
.arrow {
|
||
width: 100px;
|
||
height: 150px;
|
||
position: absolute;
|
||
right: 5%;
|
||
top: 1%;
|
||
}
|
||
|
||
|
||
.b-btn {
|
||
right: 10px;
|
||
top: 16px;
|
||
width: 80px;
|
||
text-align: center;
|
||
font-size: 14px;
|
||
padding: 4px 1px 4px 6px;
|
||
color: #FCDFB8;
|
||
z-index: 1;
|
||
}
|
||
|
||
#follow {
|
||
width: 100%;
|
||
height: 50px;
|
||
line-height: 50px;
|
||
text-align: center;
|
||
text-decoration: none;
|
||
font-size: 18px;
|
||
color: white;
|
||
float: left;
|
||
margin-top: 160px;
|
||
}
|
||
|
||
#follow1 {
|
||
width: 100%;
|
||
height: 50px;
|
||
line-height: 50px;
|
||
text-align: center;
|
||
text-decoration: none;
|
||
font-size: 18px;
|
||
color: white;
|
||
float: left;
|
||
margin-top: 170px;
|
||
}
|
||
|
||
button::after {
|
||
border: none;
|
||
}
|
||
|
||
.swiper-wrapper {
|
||
width: 100%;
|
||
}
|
||
|
||
/* 星星 */
|
||
@font-face {
|
||
font-family: uniicons;
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
|
||
}
|
||
|
||
.ping-view2 {
|
||
font-size: 24upx;
|
||
color: #999999;
|
||
margin-top: 20upx;
|
||
}
|
||
|
||
.feedback-star {
|
||
font-family: uniicons;
|
||
margin-left: 18upx;
|
||
color: #999999;
|
||
}
|
||
|
||
.feedback-star-view {
|
||
margin-left: 0upx;
|
||
margin-top: -2upx;
|
||
}
|
||
|
||
.feedback-star:after {
|
||
content: '\e408';
|
||
}
|
||
|
||
.feedback-star.active {
|
||
color: #FF440C;
|
||
}
|
||
|
||
.feedback-star.active:after {
|
||
content: '\e438';
|
||
}
|
||
|
||
/* 星星 */
|
||
</style> |