|
@@ -1,416 +1,424 @@
|
|
-<template>
|
|
|
|
- <view class="goods-detail">
|
|
|
|
- <navbarTransparent :title="page.title"/>
|
|
|
|
- <!-- swiper -->
|
|
|
|
- <view class="home-swiper">
|
|
|
|
- <!-- <uni-swiper-dot :info="info" :current="current1" :mode="mode" :dots-styles="dotsStyles">
|
|
|
|
- <swiper class="swiper-box" @change="change1" circular>
|
|
|
|
- <swiper-item v-for="(item ,index) in info" :key="index">
|
|
|
|
- <view class="swiper-item" >
|
|
|
|
- <image style="width: 100%;height:576rpx;" :src="item.img" mode="aspectFill"></image>
|
|
|
|
- </view>
|
|
|
|
- </swiper-item>
|
|
|
|
- </swiper>
|
|
|
|
- </uni-swiper-dot> -->
|
|
|
|
- <uni-swiper-dot :mode="mode" :info="info" :current="current1" :dots-styles="dotsStyles">
|
|
|
|
- <swiper class="swiper-box" @change="change1" circular>
|
|
|
|
- <swiper-item v-for="(item ,index) in info" :key="index" v-if="resource_type == 1 ">
|
|
|
|
- <view class="swiper-item">
|
|
|
|
- <image style="width: 100vw;height:100vw;" :src="item.img" mode="aspectFill"></image>
|
|
|
|
- </view>
|
|
|
|
- </swiper-item>
|
|
|
|
- <swiper-item v-if="resource_type == 2 ">
|
|
|
|
- <view class="swiper-item">
|
|
|
|
- <video class="baner-video" id="myVideo" ref="myVideo" style="width: 100%; height: 564rpx;"
|
|
|
|
- :src="video_url" controls :enable-progress-gesture="false">
|
|
|
|
- </video>
|
|
|
|
- </view>
|
|
|
|
- </swiper-item>
|
|
|
|
- </swiper>
|
|
|
|
- </uni-swiper-dot>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view style="background-color: #f9f9f9;">
|
|
|
|
- <!-- 价格 -->
|
|
|
|
- <view class="price">
|
|
|
|
- <view class="price-top" v-if="produceType == 1">
|
|
|
|
- <text>¥</text>
|
|
|
|
- <text>{{productDetail.price}}</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="price-top" v-if="produceType == 2">
|
|
|
|
- <text>{{productDetail.price}}</text>
|
|
|
|
- <text>积分</text>
|
|
|
|
- </view>
|
|
|
|
- <text class="price-text">{{productDetail.name}}</text>
|
|
|
|
- <view @click="goOther" class="price-banner" :style="{backgroundImage:'url('+backImageUrl+')'}">
|
|
|
|
- <text>加入IHG优悦会会员享受更多福利</text>
|
|
|
|
- <image style="width: 12rpx;height: 20rpx;" src="/static/icon/right02.png" mode=""></image>
|
|
|
|
- </view>
|
|
|
|
- <!--规格-->
|
|
|
|
- <view class="price-specs" @click="Recipientopen()">
|
|
|
|
- <view class="price-specs-left">
|
|
|
|
- <text>选择</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="price-specs-main" @click="Recipientopen()">
|
|
|
|
- <text>{{showAttr||'请选择规格'}}</text>
|
|
|
|
- </view>
|
|
|
|
- <view @click="Recipientopen()">
|
|
|
|
- <image style="width: 12rpx;height: 20rpx;" src="/static/icon/right03.png" mode=""></image>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <!--酒店信息 -->
|
|
|
|
- <view class="about">
|
|
|
|
- <text class="about-title">可购买酒店信息</text>
|
|
|
|
- <text class="about-name">{{hotelDetail.name}}</text>
|
|
|
|
- <view class="about-address">
|
|
|
|
- <text style="margin-right:20rpx ;">地址:</text>
|
|
|
|
- <text>{{hotelDetail.address?hotelDetail.address:""}}</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="about-phone">
|
|
|
|
- <text style="margin-right:20rpx ;">电话:</text>
|
|
|
|
- <text>{{hotelDetail.phone?hotelDetail.phone:""}}</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="about-all">
|
|
|
|
- <text @click="goGoodsHotel(product_id)" style="margin-right: 16rpx;">全部酒店</text>
|
|
|
|
- <image @click="goGoodsHotel(product_id)" style="width: 12rpx;height: 20rpx;" src="/static/icon/right04.png"
|
|
|
|
- mode=""></image>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <!-- 产品介绍 -->
|
|
|
|
- <view class="produce">
|
|
|
|
- <view class="produce-title">
|
|
|
|
- <text>产品简介</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="produce-text" v-html="productDetail.details"></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="buy-btn">
|
|
|
|
- <view class="buy-btn-left" @click="goHome">
|
|
|
|
- <image style="width: 40rpx;height: 42rpx;" src="/static/icon/home01.png" mode=""></image>
|
|
|
|
- <text>首页</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="buy-btn-right" @click="goIntegralOrder" v-if="produceType==1">
|
|
|
|
- <text>立即购买</text>
|
|
|
|
- </view>
|
|
|
|
- <view v-if="produceType==2" class="buy-btn-right" @click="goProductChange(product_id,flavorIsActive)">
|
|
|
|
- <text>立即兑换</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view style="height: 90px;background-color: #f9f9f9;"></view>
|
|
|
|
-
|
|
|
|
- <!-- 选择规格 -->
|
|
|
|
- <uni-popup ref="Recipient" type="bottom" mask-background-color=" rgba(0,0,0,0.3);">
|
|
|
|
- <view class="pop">
|
|
|
|
- <view class="pop-price">
|
|
|
|
- <view class="pop-price-left">
|
|
|
|
- <image style="width: 180rpx;height: 136rpx; border-radius:12rpx ;"
|
|
|
|
- :src="productDetail.cover_img" mode="" ></image>
|
|
|
|
- <view class="pop-price-left-money" v-if="produceType == 1">
|
|
|
|
- <text>¥</text>
|
|
|
|
- <text>{{productDetail.price}}</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="pop-price-left-money" v-if="produceType == 2">
|
|
|
|
- <text>{{productDetail.price}}</text>
|
|
|
|
- <text>积分</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <image style="width: 52rpx;height: 52rpx;" src="/static/icon/close01.png" mode="" @click="Recipientclose"></image>
|
|
|
|
- </view>
|
|
|
|
- <view class="pop-flavor" v-for="i in attr_groups" :key="i.attr_group_id" style="margin-top: 44rpx;">
|
|
|
|
- <text>{{i.attr_group_name}}</text>
|
|
|
|
- <view class="tab_flavor">
|
|
|
|
- <view class="flavorTitle-item"
|
|
|
|
- :class="{'flavorTitle-item-active':flavorIsActive[i.attr_group_name] === item.attr_name}"
|
|
|
|
- v-for="(item,index) in i.attr_list" :key="item.attr_id"
|
|
|
|
- @click="flavorchecked(item.attr_name,i.attr_group_name)"
|
|
|
|
- >
|
|
|
|
- <view :class="{'active-flavor':flavorIsActive[i.attr_group_name] === item.attr_name}">
|
|
|
|
- {{item.attr_name}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="purchase" v-if="produceType == 1" @click="goIntegralOrder">
|
|
|
|
- <view class="purchase-btn">立即购买</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="purchase" v-if="produceType == 2" @click="selectSpecs(product_id,flavorIsActive)">
|
|
|
|
- <view class="purchase-btn">立即兑换</view>
|
|
|
|
- <!-- <view class="purchase-btn">确认</view> -->
|
|
|
|
- </view>
|
|
|
|
- </uni-popup>
|
|
|
|
- <!-- 二维码购买 -->
|
|
|
|
- <uni-popup ref="codePurchase" type="center">
|
|
|
|
- <view class="code-purchase">
|
|
|
|
- <view class="title"><text>识别下方二维码即可购买</text></view>
|
|
|
|
- <view style="margin-left:30rpx;width: 580rpx;height: 2rpx;background: #F0F0F0;"></view>
|
|
|
|
- <view class="img">
|
|
|
|
- <image src="http://t9.9026.com/imgs/Kudosbg.png"></image>
|
|
|
|
- </view>
|
|
|
|
- <view class="btn">
|
|
|
|
- <view class="cancel" @click="dialogClose"><text>取消</text></view>
|
|
|
|
- <view class="download" @click="dialogConfirm"><text>保存图片</text></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </uni-popup>
|
|
|
|
- </view>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
- import navbarTransparent from "@/components/extra/navbarTransparent.vue"
|
|
|
|
- export default {
|
|
|
|
- components:{navbarTransparent},
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- jump_type: '',
|
|
|
|
- jump_config: '',
|
|
|
|
- resource_type: '',
|
|
|
|
- //1:第三方产品2:积分兑换产品
|
|
|
|
- produceType:'',
|
|
|
|
- // 规格
|
|
|
|
- specsText:'',
|
|
|
|
- specs:{
|
|
|
|
- pack:'',
|
|
|
|
- weight:'',
|
|
|
|
- flavor:'',
|
|
|
|
- },
|
|
|
|
- // 产品详情
|
|
|
|
- productDetail:'',
|
|
|
|
- // 酒店详情
|
|
|
|
- hotelDetail:'',
|
|
|
|
- // 产品id
|
|
|
|
- product_id:'',
|
|
|
|
- //激活指定table菜单
|
|
|
|
- isActive: 0,
|
|
|
|
- flavorIsActive:{},
|
|
|
|
- weightIsActive:0,
|
|
|
|
- packIsActive:0,
|
|
|
|
- backImageUrl: require('../../../static/icon/add01.png'),
|
|
|
|
- //轮播图
|
|
|
|
- info: [{
|
|
|
|
- img: 'http://t9.9026.com/imgs/swiper01.png',
|
|
|
|
- name: '酒店预订'
|
|
|
|
- }, ],
|
|
|
|
- dotsStyles: {
|
|
|
|
- backgroundColor: 'rgba(255, 255, 255, .3)',
|
|
|
|
- border: '1px rgba(255, 255, 255, .3) solid',
|
|
|
|
- color: '#fff',
|
|
|
|
- selectedBackgroundColor: 'rgba(255, 255, 255, 1)',
|
|
|
|
- selectedBorder: '1px rgba(255, 255, 255, 1) solid'
|
|
|
|
- },
|
|
|
|
- //指示点显示位置
|
|
|
|
- current1: 0,
|
|
|
|
- //指示点模式
|
|
|
|
- mode: 'dot',
|
|
|
|
- attr_groups:[],
|
|
|
|
- page: {
|
|
|
|
- title: '产品详情'
|
|
|
|
|
|
+<template>
|
|
|
|
+ <view class="goods-detail">
|
|
|
|
+ <navbarTransparent :title="page.title" />
|
|
|
|
+ <!-- swiper -->
|
|
|
|
+ <view class="home-swiper">
|
|
|
|
+ <!-- <uni-swiper-dot :info="info" :current="current1" :mode="mode" :dots-styles="dotsStyles">
|
|
|
|
+ <swiper class="swiper-box" @change="change1" circular>
|
|
|
|
+ <swiper-item v-for="(item ,index) in info" :key="index">
|
|
|
|
+ <view class="swiper-item" >
|
|
|
|
+ <image style="width: 100%;height:576rpx;" :src="item.img" mode="aspectFill"></image>
|
|
|
|
+ </view>
|
|
|
|
+ </swiper-item>
|
|
|
|
+ </swiper>
|
|
|
|
+ </uni-swiper-dot> -->
|
|
|
|
+ <uni-swiper-dot :mode="mode" :info="info" :current="current1" :dots-styles="dotsStyles">
|
|
|
|
+ <swiper class="swiper-box" @change="change1" circular>
|
|
|
|
+ <swiper-item v-for="(item ,index) in info" :key="index" v-if="resource_type == 1 ">
|
|
|
|
+ <view class="swiper-item">
|
|
|
|
+ <image style="width: 100vw;height:100vw;" :src="item.img" mode="aspectFill"></image>
|
|
|
|
+ </view>
|
|
|
|
+ </swiper-item>
|
|
|
|
+ <swiper-item v-if="resource_type == 2 ">
|
|
|
|
+ <view class="swiper-item">
|
|
|
|
+ <video class="baner-video" id="myVideo" ref="myVideo" style="width: 100%; height: 564rpx;"
|
|
|
|
+ :src="video_url" controls :enable-progress-gesture="false">
|
|
|
|
+ </video>
|
|
|
|
+ </view>
|
|
|
|
+ </swiper-item>
|
|
|
|
+ </swiper>
|
|
|
|
+ </uni-swiper-dot>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view style="background-color: #f9f9f9;">
|
|
|
|
+ <!-- 价格 -->
|
|
|
|
+ <view class="price">
|
|
|
|
+ <view class="price-top" v-if="produceType == 1">
|
|
|
|
+ <text>¥</text>
|
|
|
|
+ <text>{{productDetail.price}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="price-top" v-if="produceType == 2">
|
|
|
|
+ <text>{{productDetail.price}}</text>
|
|
|
|
+ <text>积分</text>
|
|
|
|
+ </view>
|
|
|
|
+ <text class="price-text">{{productDetail.name}}</text>
|
|
|
|
+ <view @click="goOther" class="price-banner" :style="{backgroundImage:'url('+backImageUrl+')'}">
|
|
|
|
+ <text>加入IHG优悦会会员享受更多福利</text>
|
|
|
|
+ <image style="width: 12rpx;height: 20rpx;" src="/static/icon/right02.png" mode=""></image>
|
|
|
|
+ </view>
|
|
|
|
+ <!--规格-->
|
|
|
|
+ <view class="price-specs" @click="Recipientopen()">
|
|
|
|
+ <view class="price-specs-left">
|
|
|
|
+ <text>选择</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="price-specs-main" @click="Recipientopen()">
|
|
|
|
+ <text>{{showAttr||'请选择规格'}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view @click="Recipientopen()">
|
|
|
|
+ <image style="width: 12rpx;height: 20rpx;" src="/static/icon/right03.png" mode=""></image>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!--酒店信息 -->
|
|
|
|
+ <view class="about">
|
|
|
|
+ <text class="about-title">可购买酒店信息</text>
|
|
|
|
+ <text class="about-name">{{hotelDetail.name}}</text>
|
|
|
|
+ <view class="about-address">
|
|
|
|
+ <text style="margin-right:20rpx ;">地址:</text>
|
|
|
|
+ <text>{{hotelDetail.address?hotelDetail.address:""}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="about-phone">
|
|
|
|
+ <text style="margin-right:20rpx ;">电话:</text>
|
|
|
|
+ <text>{{hotelDetail.phone?hotelDetail.phone:""}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="about-all">
|
|
|
|
+ <text @click="goGoodsHotel(product_id)" style="margin-right: 16rpx;">全部酒店</text>
|
|
|
|
+ <image @click="goGoodsHotel(product_id)" style="width: 12rpx;height: 20rpx;"
|
|
|
|
+ src="/static/icon/right04.png" mode=""></image>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!-- 产品介绍 -->
|
|
|
|
+ <view class="produce">
|
|
|
|
+ <view class="produce-title">
|
|
|
|
+ <text>产品简介</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="produce-text">
|
|
|
|
+ <u-parse :content="productDetail.details"></u-parse>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view class="buy-btn">
|
|
|
|
+ <view class="buy-btn-left" @click="goHome">
|
|
|
|
+ <image style="width: 40rpx;height: 42rpx;" src="/static/icon/home01.png" mode=""></image>
|
|
|
|
+ <text>首页</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="buy-btn-right" @click="goIntegralOrder" v-if="produceType==1">
|
|
|
|
+ <text>立即购买</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view v-if="produceType==2" class="buy-btn-right" @click="goProductChange(product_id,flavorIsActive)">
|
|
|
|
+ <text>立即兑换</text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view style="height: 90px;background-color: #f9f9f9;"></view>
|
|
|
|
+
|
|
|
|
+ <!-- 选择规格 -->
|
|
|
|
+ <uni-popup ref="Recipient" type="bottom" mask-background-color=" rgba(0,0,0,0.3);">
|
|
|
|
+ <view class="pop">
|
|
|
|
+ <view class="pop-price">
|
|
|
|
+ <view class="pop-price-left">
|
|
|
|
+ <image style="width: 180rpx;height: 136rpx; border-radius:12rpx ;"
|
|
|
|
+ :src="productDetail.cover_img" mode=""></image>
|
|
|
|
+ <view class="pop-price-left-money" v-if="produceType == 1">
|
|
|
|
+ <text>¥</text>
|
|
|
|
+ <text>{{productDetail.price}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="pop-price-left-money" v-if="produceType == 2">
|
|
|
|
+ <text>{{productDetail.price}}</text>
|
|
|
|
+ <text>积分</text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <image style="width: 52rpx;height: 52rpx;" src="/static/icon/close01.png" mode=""
|
|
|
|
+ @click="Recipientclose"></image>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="pop-flavor" v-for="i in attr_groups" :key="i.attr_group_id" style="margin-top: 44rpx;">
|
|
|
|
+ <text>{{i.attr_group_name}}</text>
|
|
|
|
+ <view class="tab_flavor">
|
|
|
|
+ <view class="flavorTitle-item"
|
|
|
|
+ :class="{'flavorTitle-item-active':flavorIsActive[i.attr_group_name] === item.attr_name}"
|
|
|
|
+ v-for="(item,index) in i.attr_list" :key="item.attr_id"
|
|
|
|
+ @click="flavorchecked(item.attr_name,i.attr_group_name)">
|
|
|
|
+ <view :class="{'active-flavor':flavorIsActive[i.attr_group_name] === item.attr_name}">
|
|
|
|
+ {{item.attr_name}}
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="purchase" v-if="produceType == 1" @click="goIntegralOrder">
|
|
|
|
+ <view class="purchase-btn">立即购买</view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="purchase" v-if="produceType == 2" @click="selectSpecs(product_id,flavorIsActive)">
|
|
|
|
+ <view class="purchase-btn">立即兑换</view>
|
|
|
|
+ <!-- <view class="purchase-btn">确认</view> -->
|
|
|
|
+ </view>
|
|
|
|
+ </uni-popup>
|
|
|
|
+ <!-- 二维码购买 -->
|
|
|
|
+ <uni-popup ref="codePurchase" type="center">
|
|
|
|
+ <view class="code-purchase">
|
|
|
|
+ <view class="title"><text>识别下方二维码即可购买</text></view>
|
|
|
|
+ <view style="margin-left:30rpx;width: 580rpx;height: 2rpx;background: #F0F0F0;"></view>
|
|
|
|
+ <view class="img">
|
|
|
|
+ <image src="http://t9.9026.com/imgs/Kudosbg.png"></image>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="btn">
|
|
|
|
+ <view class="cancel" @click="dialogClose"><text>取消</text></view>
|
|
|
|
+ <view class="download" @click="dialogConfirm"><text>保存图片</text></view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </uni-popup>
|
|
|
|
+ </view>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+ import navbarTransparent from "@/components/extra/navbarTransparent.vue"
|
|
|
|
+ export default {
|
|
|
|
+ components: {
|
|
|
|
+ navbarTransparent
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ jump_type: '',
|
|
|
|
+ jump_config: '',
|
|
|
|
+ resource_type: '',
|
|
|
|
+ //1:第三方产品2:积分兑换产品
|
|
|
|
+ produceType: '',
|
|
|
|
+ // 规格
|
|
|
|
+ specsText: '',
|
|
|
|
+ specs: {
|
|
|
|
+ pack: '',
|
|
|
|
+ weight: '',
|
|
|
|
+ flavor: '',
|
|
|
|
+ },
|
|
|
|
+ // 产品详情
|
|
|
|
+ productDetail: '',
|
|
|
|
+ // 酒店详情
|
|
|
|
+ hotelDetail: '',
|
|
|
|
+ // 产品id
|
|
|
|
+ product_id: '',
|
|
|
|
+ //激活指定table菜单
|
|
|
|
+ isActive: 0,
|
|
|
|
+ flavorIsActive: {},
|
|
|
|
+ weightIsActive: 0,
|
|
|
|
+ packIsActive: 0,
|
|
|
|
+ backImageUrl: require('../../../static/icon/add01.png'),
|
|
|
|
+ //轮播图
|
|
|
|
+ info: [{
|
|
|
|
+ img: 'http://t9.9026.com/imgs/swiper01.png',
|
|
|
|
+ name: '酒店预订'
|
|
|
|
+ }, ],
|
|
|
|
+ dotsStyles: {
|
|
|
|
+ backgroundColor: 'rgba(255, 255, 255, .3)',
|
|
|
|
+ border: '1px rgba(255, 255, 255, .3) solid',
|
|
|
|
+ color: '#fff',
|
|
|
|
+ selectedBackgroundColor: 'rgba(255, 255, 255, 1)',
|
|
|
|
+ selectedBorder: '1px rgba(255, 255, 255, 1) solid'
|
|
|
|
+ },
|
|
|
|
+ //指示点显示位置
|
|
|
|
+ current1: 0,
|
|
|
|
+ //指示点模式
|
|
|
|
+ mode: 'dot',
|
|
|
|
+ attr_groups: [],
|
|
|
|
+ page: {
|
|
|
|
+ title: '产品详情'
|
|
},
|
|
},
|
|
- sku:{
|
|
|
|
|
|
+ sku: {
|
|
keys: [],
|
|
keys: [],
|
|
- }
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
onReady: function() {
|
|
onReady: function() {
|
|
- this.videoContext = uni.createVideoContext('myVideo')
|
|
|
|
- },
|
|
|
|
- onLoad(op) {
|
|
|
|
- const {id, type} = op;
|
|
|
|
- this.admin = this.$store.getters.userInfo
|
|
|
|
- this.product_id=id
|
|
|
|
- this.produceType = type
|
|
|
|
- this.getProductDetail(this.product_id,true)
|
|
|
|
|
|
+ this.videoContext = uni.createVideoContext('myVideo')
|
|
},
|
|
},
|
|
- computed:{
|
|
|
|
- showAttr:function(){
|
|
|
|
- if(this.flavorIsActive.length <=0) return false;
|
|
|
|
|
|
+ onLoad(op) {
|
|
|
|
+ const {
|
|
|
|
+ id,
|
|
|
|
+ type
|
|
|
|
+ } = op;
|
|
|
|
+ this.admin = this.$store.getters.userInfo
|
|
|
|
+ this.product_id = id
|
|
|
|
+ this.produceType = type
|
|
|
|
+ this.getProductDetail(this.product_id, true)
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ showAttr: function() {
|
|
|
|
+ if (this.flavorIsActive.length <= 0) return false;
|
|
let text = '';
|
|
let text = '';
|
|
- for(const k in this.flavorIsActive){
|
|
|
|
|
|
+ for (const k in this.flavorIsActive) {
|
|
text += `${k}-${this.flavorIsActive[k]},`
|
|
text += `${k}-${this.flavorIsActive[k]},`
|
|
}
|
|
}
|
|
- return text.substr(0, text.length-1);
|
|
|
|
|
|
+ return text.substr(0, text.length - 1);
|
|
},
|
|
},
|
|
- selectedHotelId:function(){
|
|
|
|
|
|
+ selectedHotelId: function() {
|
|
return this.$store.state.tab.selectedHotelId;
|
|
return this.$store.state.tab.selectedHotelId;
|
|
}
|
|
}
|
|
- },
|
|
|
|
|
|
+ },
|
|
methods: {
|
|
methods: {
|
|
//显示所选规格
|
|
//显示所选规格
|
|
-
|
|
|
|
- //获取当前页面路径
|
|
|
|
- getPageUrl() {
|
|
|
|
- const pages = getCurrentPages();
|
|
|
|
- if(pages.length==1){
|
|
|
|
- const currentPage = pages[0];
|
|
|
|
- console.log(currentPage.options,'--------->currentPage.options')
|
|
|
|
- let pageUrl = `/${currentPage.route}?type=${currentPage.options.type}`;
|
|
|
|
- return pageUrl
|
|
|
|
- console.log('当前页面url:', pageUrl);
|
|
|
|
- }else{
|
|
|
|
- const currentPage = pages[pages.length - 1];
|
|
|
|
- console.log(currentPage.options,'--------->currentPage.options')
|
|
|
|
- let pageUrl = `/${currentPage.route}?type=${currentPage.options.type}`;
|
|
|
|
- return pageUrl
|
|
|
|
- console.log('当前页面url:', pageUrl);
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- // 跳转其他小程序
|
|
|
|
- goOther() {
|
|
|
|
- let _this = this
|
|
|
|
- wx.navigateToMiniProgram({
|
|
|
|
- appId: 'wx255b58f0992b3c53', //appid
|
|
|
|
- path: 'newUIMain/enrollment/enrollment', //path
|
|
|
|
- extraData: { //参数
|
|
|
|
- foo: 'bar'
|
|
|
|
- },
|
|
|
|
- // envVersion: 'develop', //开发版develop 开发版 trial 体验版 release 正式版
|
|
|
|
- success(res) {
|
|
|
|
- let page = _this.getPageUrl()
|
|
|
|
- let user_id = ''
|
|
|
|
- if(_this.admin != null ){
|
|
|
|
- user_id = _this.admin.id
|
|
|
|
- }else{
|
|
|
|
- user_id = 0
|
|
|
|
- }
|
|
|
|
- console.log('成功',page)
|
|
|
|
- _this.$api.my.userMemberAdd({
|
|
|
|
- user_id,
|
|
|
|
- page,
|
|
|
|
- }).then(res=>{
|
|
|
|
- console.log(res.data);
|
|
|
|
- })
|
|
|
|
- // 打开成功
|
|
|
|
- },
|
|
|
|
- fail(e) {
|
|
|
|
- console.log(e, '失败')
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- //视频自动播放
|
|
|
|
- openVideoPlay() {
|
|
|
|
- this.videoContext.play()
|
|
|
|
- },
|
|
|
|
- // 获取商品详情
|
|
|
|
- getProductDetail(product_id, init=false){
|
|
|
|
- this.$api.product.getProductDetail({
|
|
|
|
- product_id:product_id
|
|
|
|
- }).then(res=>{
|
|
|
|
- if(res.code==0 && res.data){
|
|
|
|
- this.productDetail=res.data
|
|
|
|
- this.info = JSON.parse(res.data.img_urls).map(item => {
|
|
|
|
- return {
|
|
|
|
- img: item
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- //跳转h5和小程序
|
|
|
|
- this.jump_type = res.data.jump_type,
|
|
|
|
- this.jump_config = res.data.jump_config
|
|
|
|
- //banner展示视频或者图片
|
|
|
|
- this.resource_type = res.data.resource_type
|
|
|
|
- this.video_url = res.data.video_url
|
|
|
|
- //视频自动播放
|
|
|
|
- this.openVideoPlay()
|
|
|
|
- //规格对接
|
|
|
|
- this.attr_groups = JSON.parse(res.data.attr_group)
|
|
|
|
- //获取默认酒店
|
|
|
|
|
|
+
|
|
|
|
+ //获取当前页面路径
|
|
|
|
+ getPageUrl() {
|
|
|
|
+ const pages = getCurrentPages();
|
|
|
|
+ if (pages.length == 1) {
|
|
|
|
+ const currentPage = pages[0];
|
|
|
|
+ console.log(currentPage.options, '--------->currentPage.options')
|
|
|
|
+ let pageUrl = `/${currentPage.route}?type=${currentPage.options.type}`;
|
|
|
|
+ return pageUrl
|
|
|
|
+ console.log('当前页面url:', pageUrl);
|
|
|
|
+ } else {
|
|
|
|
+ const currentPage = pages[pages.length - 1];
|
|
|
|
+ console.log(currentPage.options, '--------->currentPage.options')
|
|
|
|
+ let pageUrl = `/${currentPage.route}?type=${currentPage.options.type}`;
|
|
|
|
+ return pageUrl
|
|
|
|
+ console.log('当前页面url:', pageUrl);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ // 跳转其他小程序
|
|
|
|
+ goOther() {
|
|
|
|
+ let _this = this
|
|
|
|
+ wx.navigateToMiniProgram({
|
|
|
|
+ appId: 'wx255b58f0992b3c53', //appid
|
|
|
|
+ path: 'newUIMain/enrollment/enrollment', //path
|
|
|
|
+ extraData: { //参数
|
|
|
|
+ foo: 'bar'
|
|
|
|
+ },
|
|
|
|
+ // envVersion: 'develop', //开发版develop 开发版 trial 体验版 release 正式版
|
|
|
|
+ success(res) {
|
|
|
|
+ let page = _this.getPageUrl()
|
|
|
|
+ let user_id = ''
|
|
|
|
+ if (_this.admin != null) {
|
|
|
|
+ user_id = _this.admin.id
|
|
|
|
+ } else {
|
|
|
|
+ user_id = 0
|
|
|
|
+ }
|
|
|
|
+ console.log('成功', page)
|
|
|
|
+ _this.$api.my.userMemberAdd({
|
|
|
|
+ user_id,
|
|
|
|
+ page,
|
|
|
|
+ }).then(res => {
|
|
|
|
+ console.log(res.data);
|
|
|
|
+ })
|
|
|
|
+ // 打开成功
|
|
|
|
+ },
|
|
|
|
+ fail(e) {
|
|
|
|
+ console.log(e, '失败')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ //视频自动播放
|
|
|
|
+ openVideoPlay() {
|
|
|
|
+ this.videoContext.play()
|
|
|
|
+ },
|
|
|
|
+ // 获取商品详情
|
|
|
|
+ getProductDetail(product_id, init = false) {
|
|
|
|
+ this.$api.product.getProductDetail({
|
|
|
|
+ product_id: product_id
|
|
|
|
+ }).then(res => {
|
|
|
|
+ if (res.code == 0 && res.data) {
|
|
|
|
+ this.productDetail = res.data
|
|
|
|
+ this.info = JSON.parse(res.data.img_urls).map(item => {
|
|
|
|
+ return {
|
|
|
|
+ img: item
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ //跳转h5和小程序
|
|
|
|
+ this.jump_type = res.data.jump_type,
|
|
|
|
+ this.jump_config = res.data.jump_config
|
|
|
|
+ //banner展示视频或者图片
|
|
|
|
+ this.resource_type = res.data.resource_type
|
|
|
|
+ this.video_url = res.data.video_url
|
|
|
|
+ //视频自动播放
|
|
|
|
+ this.openVideoPlay()
|
|
|
|
+ //规格对接
|
|
|
|
+ this.attr_groups = JSON.parse(res.data.attr_group)
|
|
|
|
+ //获取默认酒店
|
|
const hotel_ids = JSON.parse(res.data.hotel_ids);
|
|
const hotel_ids = JSON.parse(res.data.hotel_ids);
|
|
- if((hotel_ids.constructor == Array) && (hotel_ids.length > 0)){
|
|
|
|
|
|
+ if ((hotel_ids.constructor == Array) && (hotel_ids.length > 0)) {
|
|
this.$store.commit("tab/SET_SELECTEDHOTELId", hotel_ids[0])
|
|
this.$store.commit("tab/SET_SELECTEDHOTELId", hotel_ids[0])
|
|
- }
|
|
|
|
- //
|
|
|
|
|
|
+ }
|
|
|
|
+ //
|
|
const sku = JSON.parse(res.data.sku);
|
|
const sku = JSON.parse(res.data.sku);
|
|
this.sku.keys = Object.keys(sku.attrs);
|
|
this.sku.keys = Object.keys(sku.attrs);
|
|
this.sku.sku = sku.sku;
|
|
this.sku.sku = sku.sku;
|
|
-
|
|
|
|
|
|
+
|
|
//首次默认选中第一个规格
|
|
//首次默认选中第一个规格
|
|
- if(init){
|
|
|
|
|
|
+ if (init) {
|
|
this.attr_groups.forEach(item => {
|
|
this.attr_groups.forEach(item => {
|
|
- this.flavorchecked(item.attr_list[0]?.attr_name,item.attr_group_name)
|
|
|
|
|
|
+ this.flavorchecked(item.attr_list[0]?.attr_name, item.attr_group_name)
|
|
})
|
|
})
|
|
}
|
|
}
|
|
- }
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- // 获取酒店详情
|
|
|
|
- getHotelDetail(id){
|
|
|
|
- this.$api.hotel.getHotelDetail({
|
|
|
|
- hotel_id:id
|
|
|
|
- }).then(res=>{
|
|
|
|
- this.hotelDetail=res.data
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- //跳转酒店列表
|
|
|
|
- goGoodsHotel(id) {
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url: '/pages/goods/goods-hotel/index?product_id='+id
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- //首页
|
|
|
|
- goHome() {
|
|
|
|
- uni.switchTab({
|
|
|
|
- url: '/pages/index/index'
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- //二维码购买确认按钮
|
|
|
|
- dialogConfirm() {
|
|
|
|
- console.log('确认');
|
|
|
|
- this.codePurchaseClose()
|
|
|
|
- },
|
|
|
|
- //二维码购买取消按钮
|
|
|
|
- dialogClose() {
|
|
|
|
- console.log('取消');
|
|
|
|
- this.codePurchaseClose()
|
|
|
|
- },
|
|
|
|
- //菜单index切换
|
|
|
|
- checked(index) {
|
|
|
|
- this.isActive = index
|
|
|
|
- },
|
|
|
|
- // 口味切换
|
|
|
|
- flavorchecked(index,name) {
|
|
|
|
- this.$set(this.flavorIsActive, name, index)
|
|
|
|
- this.specs.flavor=name
|
|
|
|
- if(Object.keys(this.flavorIsActive).length < this.sku.keys.length) return;
|
|
|
|
- for(let index=0; index < this.sku.sku.length; index++){
|
|
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 获取酒店详情
|
|
|
|
+ getHotelDetail(id) {
|
|
|
|
+ this.$api.hotel.getHotelDetail({
|
|
|
|
+ hotel_id: id
|
|
|
|
+ }).then(res => {
|
|
|
|
+ this.hotelDetail = res.data
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ //跳转酒店列表
|
|
|
|
+ goGoodsHotel(id) {
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: '/pages/goods/goods-hotel/index?product_id=' + id
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ //首页
|
|
|
|
+ goHome() {
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: '/pages/index/index'
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ //二维码购买确认按钮
|
|
|
|
+ dialogConfirm() {
|
|
|
|
+ console.log('确认');
|
|
|
|
+ this.codePurchaseClose()
|
|
|
|
+ },
|
|
|
|
+ //二维码购买取消按钮
|
|
|
|
+ dialogClose() {
|
|
|
|
+ console.log('取消');
|
|
|
|
+ this.codePurchaseClose()
|
|
|
|
+ },
|
|
|
|
+ //菜单index切换
|
|
|
|
+ checked(index) {
|
|
|
|
+ this.isActive = index
|
|
|
|
+ },
|
|
|
|
+ // 口味切换
|
|
|
|
+ flavorchecked(index, name) {
|
|
|
|
+ this.$set(this.flavorIsActive, name, index)
|
|
|
|
+ this.specs.flavor = name
|
|
|
|
+ if (Object.keys(this.flavorIsActive).length < this.sku.keys.length) return;
|
|
|
|
+ for (let index = 0; index < this.sku.sku.length; index++) {
|
|
const item = this.sku.sku[index];
|
|
const item = this.sku.sku[index];
|
|
let res = true;
|
|
let res = true;
|
|
- for(const k in this.flavorIsActive){
|
|
|
|
- if(item[k] != this.flavorIsActive[k]){
|
|
|
|
|
|
+ for (const k in this.flavorIsActive) {
|
|
|
|
+ if (item[k] != this.flavorIsActive[k]) {
|
|
res = false
|
|
res = false
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- if(res){
|
|
|
|
|
|
+ if (res) {
|
|
this.productDetail.price = item.price;
|
|
this.productDetail.price = item.price;
|
|
this.productDetail.integral = item.price
|
|
this.productDetail.integral = item.price
|
|
break;
|
|
break;
|
|
}
|
|
}
|
|
- }
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- // // 重量切换
|
|
|
|
- // weightchecked(index,name) {
|
|
|
|
- // this.weightIsActive = index
|
|
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ // // 重量切换
|
|
|
|
+ // weightchecked(index,name) {
|
|
|
|
+ // this.weightIsActive = index
|
|
// this.specs.weight=name
|
|
// this.specs.weight=name
|
|
- // console.log(this.specs.weight);
|
|
|
|
- // },
|
|
|
|
- // // 包装切换
|
|
|
|
- // packchecked(index,name) {
|
|
|
|
- // this.packIsActive = index
|
|
|
|
|
|
+ // console.log(this.specs.weight);
|
|
|
|
+ // },
|
|
|
|
+ // // 包装切换
|
|
|
|
+ // packchecked(index,name) {
|
|
|
|
+ // this.packIsActive = index
|
|
// this.specs.pack=name
|
|
// this.specs.pack=name
|
|
- // console.log(this.specs.pack);
|
|
|
|
- // },
|
|
|
|
- // 立即兑换
|
|
|
|
- selectSpecs(id,flavorIsActive){
|
|
|
|
|
|
+ // console.log(this.specs.pack);
|
|
|
|
+ // },
|
|
|
|
+ // 立即兑换
|
|
|
|
+ selectSpecs(id, flavorIsActive) {
|
|
const resArr = [];
|
|
const resArr = [];
|
|
- outer: for(const k in this.flavorIsActive){
|
|
|
|
- inner: for(const i in this.attr_groups){
|
|
|
|
- if(this.attr_groups[i].attr_group_name == k){
|
|
|
|
- laster: for(const l in this.attr_groups[i].attr_list){
|
|
|
|
- if(this.attr_groups[i].attr_list[l].attr_name == this.flavorIsActive[k]){
|
|
|
|
|
|
+ outer: for (const k in this.flavorIsActive) {
|
|
|
|
+ inner: for (const i in this.attr_groups) {
|
|
|
|
+ if (this.attr_groups[i].attr_group_name == k) {
|
|
|
|
+ laster: for (const l in this.attr_groups[i].attr_list) {
|
|
|
|
+ if (this.attr_groups[i].attr_list[l].attr_name == this.flavorIsActive[k]) {
|
|
resArr.push(this.attr_groups[i].attr_list[l].attr_id);
|
|
resArr.push(this.attr_groups[i].attr_list[l].attr_id);
|
|
break inner;
|
|
break inner;
|
|
}
|
|
}
|
|
@@ -421,31 +429,31 @@
|
|
const selectedIds = resArr.join(':');
|
|
const selectedIds = resArr.join(':');
|
|
console.log(this.productDetail.integral);
|
|
console.log(this.productDetail.integral);
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
- url:`/pages/my/integral/integralOrder?product_id=${this.productDetail.id}&attr=${selectedIds}&integral=${this.productDetail.integral}`
|
|
|
|
- })
|
|
|
|
- this.Recipientclose()
|
|
|
|
- },
|
|
|
|
- Recipientopen() {
|
|
|
|
- this.$refs.Recipient.open('bottom')
|
|
|
|
- },
|
|
|
|
- Recipientclose() {
|
|
|
|
- this.$refs.Recipient.close()
|
|
|
|
- },
|
|
|
|
- codePurchaseClose(){
|
|
|
|
- this.$refs.codePurchase.close()
|
|
|
|
- },
|
|
|
|
- // 切换轮播图指示点
|
|
|
|
- change1(e) {
|
|
|
|
- this.current1 = e.detail.current;
|
|
|
|
- },
|
|
|
|
- //积分兑换
|
|
|
|
- goProductChange(id,flavorIsActive){
|
|
|
|
|
|
+ url: `/pages/my/integral/integralOrder?product_id=${this.productDetail.id}&attr=${selectedIds}&integral=${this.productDetail.integral}`
|
|
|
|
+ })
|
|
|
|
+ this.Recipientclose()
|
|
|
|
+ },
|
|
|
|
+ Recipientopen() {
|
|
|
|
+ this.$refs.Recipient.open('bottom')
|
|
|
|
+ },
|
|
|
|
+ Recipientclose() {
|
|
|
|
+ this.$refs.Recipient.close()
|
|
|
|
+ },
|
|
|
|
+ codePurchaseClose() {
|
|
|
|
+ this.$refs.codePurchase.close()
|
|
|
|
+ },
|
|
|
|
+ // 切换轮播图指示点
|
|
|
|
+ change1(e) {
|
|
|
|
+ this.current1 = e.detail.current;
|
|
|
|
+ },
|
|
|
|
+ //积分兑换
|
|
|
|
+ goProductChange(id, flavorIsActive) {
|
|
const resArr = [];
|
|
const resArr = [];
|
|
- outer: for(const k in this.flavorIsActive){
|
|
|
|
- inner: for(const i in this.attr_groups){
|
|
|
|
- if(this.attr_groups[i].attr_group_name == k){
|
|
|
|
- laster: for(const l in this.attr_groups[i].attr_list){
|
|
|
|
- if(this.attr_groups[i].attr_list[l].attr_name == this.flavorIsActive[k]){
|
|
|
|
|
|
+ outer: for (const k in this.flavorIsActive) {
|
|
|
|
+ inner: for (const i in this.attr_groups) {
|
|
|
|
+ if (this.attr_groups[i].attr_group_name == k) {
|
|
|
|
+ laster: for (const l in this.attr_groups[i].attr_list) {
|
|
|
|
+ if (this.attr_groups[i].attr_list[l].attr_name == this.flavorIsActive[k]) {
|
|
resArr.push(this.attr_groups[i].attr_list[l].attr_id);
|
|
resArr.push(this.attr_groups[i].attr_list[l].attr_id);
|
|
break inner;
|
|
break inner;
|
|
}
|
|
}
|
|
@@ -455,26 +463,32 @@
|
|
}
|
|
}
|
|
const selectedIds = resArr.join(':');
|
|
const selectedIds = resArr.join(':');
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
- url:`/pages/my/integral/integralOrder?product_id=${this.productDetail.id}&attr=${selectedIds}&integral=${this.productDetail.integral}`
|
|
|
|
|
|
+ url: `/pages/my/integral/integralOrder?product_id=${this.productDetail.id}&attr=${selectedIds}&integral=${this.productDetail.integral}`
|
|
})
|
|
})
|
|
-
|
|
|
|
- },
|
|
|
|
- // 跳转积分兑换
|
|
|
|
- goIntegralOrder(){
|
|
|
|
- this.$utils.jump({
|
|
|
|
- jump_type: this.hotelDetail.buy_jump_type,
|
|
|
|
- jump_config: this.hotelDetail.buy_jump_config,
|
|
|
|
- attr: JSON.stringify(this.flavorIsActive)
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ // 跳转积分兑换
|
|
|
|
+ goIntegralOrder() {
|
|
|
|
+ this.$utils.jump({
|
|
|
|
+ jump_type: this.hotelDetail.buy_jump_type,
|
|
|
|
+ jump_config: this.hotelDetail.buy_jump_config,
|
|
|
|
+ attr: JSON.stringify(this.flavorIsActive)
|
|
|
|
+ })
|
|
|
|
+ },
|
|
},
|
|
},
|
|
- watch:{
|
|
|
|
|
|
+ watch: {
|
|
selectedHotelId(newValue) {
|
|
selectedHotelId(newValue) {
|
|
console.log(newValue)
|
|
console.log(newValue)
|
|
this.getHotelDetail(newValue);
|
|
this.getHotelDetail(newValue);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- }
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<style lang="scss" scoped src="./index.scss"></style>
|
|
|
|
|
|
+ }
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss" scoped src="./index.scss"></style>
|
|
|
|
+<style lang="scss">
|
|
|
|
+ .produce-text img {
|
|
|
|
+ width: 100%;
|
|
|
|
+ object-fit: fill;
|
|
|
|
+ }
|
|
|
|
+</style>
|