|
@@ -1,433 +1,450 @@
|
|
|
<template>
|
|
|
- <view>
|
|
|
- <view class="banner_box">
|
|
|
- <image class="banner_img" :src="activeInfo.banner_img" ></image>
|
|
|
- </view>
|
|
|
- <view class="active_info">
|
|
|
- <view class="active_name">{{activeInfo.name}}</view>
|
|
|
- <view class="active_time">活动时间:{{activeInfo.start_date}} ~ {{activeInfo.end_date}}</view>
|
|
|
- <view class="active_citys" v-if="activeInfo.city_ids">活动范围:{{activeInfo.city_ids}}</view>
|
|
|
- </view>
|
|
|
- <view class="active_coupon">
|
|
|
- <view class="active_subtitle">优惠券</view>
|
|
|
- <view class="coupon_list">
|
|
|
- <view class="coupon_item" v-for="(item,index) in activeInfo.coupon_list" :key="index">
|
|
|
- <view class="left_box">
|
|
|
- <view class="rebate" v-if="item.rebate_type == 1" > ¥{{item.rebate}}</view>
|
|
|
- <view class="rebate" v-if="item.rebate_type == 2" > 打 {{item.rebate}} 折</view>
|
|
|
- <view class="rebate" v-if="item.rebate_type == 3" > 赠 <text v-if="item.rebate_scope.length">{{item.rebate_scope[0].product_name}}</text> </view>
|
|
|
- <view class="std_pay">满 ¥{{item.std_pay}} 可用</view>
|
|
|
- <view class="coupon_exp">有效期:{{item.exp_time}}</view>
|
|
|
- </view>
|
|
|
- <view class="right_box">
|
|
|
- <button class="get_btn" v-if="item.is_have == 0" @click="getCoupon(index)">立即领取</button>
|
|
|
- <button class="get_btn" v-if="item.is_have == 1" @click="toUse(item)">去使用</button>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="active_product" v-if="activeInfo.product_list.length" >
|
|
|
- <view class="active_subtitle">活动商品</view>
|
|
|
- <view class="product_list" :class="show_more_product?'more':''">
|
|
|
- <view class="product_item" v-for="(item,index) in activeInfo.product_list" :key="index" >
|
|
|
- <image class="product_image" :src="item.thumb" mode=""></image>
|
|
|
- <view class="product_name"><text>{{item.product_name}}</text></view>
|
|
|
- <view class="stock_price">
|
|
|
- <view class="product_price" >
|
|
|
- <text >¥ {{item.price}} </text>
|
|
|
- </view>
|
|
|
- <view class="product_stock">剩{{item.stock}}个</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="more_product" v-if="!show_more_product" @click.stop="show_more_product = true">
|
|
|
- <uni-icons type="down" size="20" ></uni-icons>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="active_rule" v-if="activeInfo.active_rule">
|
|
|
- <view class="active_subtitle">活动规则</view>
|
|
|
- <view class="active_rule_info">
|
|
|
- <rich-text class="rich_text" :nodes="activeInfo.active_rule"></rich-text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="" style="height: 10rpx;"></view>
|
|
|
- </view>
|
|
|
+ <view>
|
|
|
+ <view class="banner_box">
|
|
|
+ <image class="banner_img" :src="activeInfo.banner_img"></image>
|
|
|
+ </view>
|
|
|
+ <view class="active_info">
|
|
|
+ <view class="active_name">{{ activeInfo.name }}</view>
|
|
|
+ <view class="active_time">活动时间:{{ activeInfo.start_date }} ~ {{ activeInfo.end_date }}</view>
|
|
|
+ <view class="active_citys" v-if="activeInfo.city_ids">活动范围:{{ activeInfo.city_ids }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="active_coupon">
|
|
|
+ <view class="active_subtitle">优惠券</view>
|
|
|
+ <view class="coupon_list">
|
|
|
+ <view class="coupon_item" v-for="(item, index) in activeInfo.coupon_list" :key="index">
|
|
|
+ <view class="left_box">
|
|
|
+ <view class="rebate" v-if="item.rebate_type == 1"> ¥{{ item.rebate }}</view>
|
|
|
+ <view class="rebate" v-if="item.rebate_type == 2"> 打 {{ item.rebate }} 折</view>
|
|
|
+ <view class="rebate" v-if="item.rebate_type == 3">
|
|
|
+ 赠 <text v-if="item.rebate_scope.length">{{ item.rebate_scope[0].product_name }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="std_pay">满 ¥{{ item.std_pay }} 可用</view>
|
|
|
+ <view class="coupon_exp">有效期:{{ item.exp_time }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="right_box">
|
|
|
+ <button class="get_btn" v-if="item.is_have == 0" @click="getCoupon(index)">立即领取</button>
|
|
|
+ <button class="get_btn" v-if="item.is_have == 1" @click="toUse(item)">去使用</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="active_product" v-if="activeInfo.product_list.length">
|
|
|
+ <view class="active_subtitle">活动商品</view>
|
|
|
+ <view class="product_list" :class="show_more_product ? 'more' : ''">
|
|
|
+ <view class="product_item" v-for="(item, index) in activeInfo.product_list" :key="index">
|
|
|
+ <image class="product_image" :src="item.thumb" mode=""></image>
|
|
|
+ <view class="product_name"
|
|
|
+ ><text>{{ item.product_name }}</text></view
|
|
|
+ >
|
|
|
+ <view class="stock_price">
|
|
|
+ <view class="product_price">
|
|
|
+ <text>¥ {{ item.price }} </text>
|
|
|
+ </view>
|
|
|
+ <view class="product_stock">剩{{ item.stock }}个</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="more_product" v-if="!show_more_product" @click.stop="show_more_product = true">
|
|
|
+ <uni-icons type="down" size="20"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="active_rule" v-if="activeInfo.active_rule">
|
|
|
+ <view class="active_subtitle">活动规则</view>
|
|
|
+ <view class="active_rule_info">
|
|
|
+ <rich-text class="rich_text" :nodes="activeInfo.active_rule"></rich-text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="" style="height: 10rpx"></view>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- // 是否显示更多的产品
|
|
|
- show_more_product:false,
|
|
|
- // 活动信息
|
|
|
- activeInfo:{
|
|
|
- id:0,
|
|
|
- name:"",
|
|
|
- banner_img:"",
|
|
|
- active_rule:"",
|
|
|
- status:0,
|
|
|
- start_time:0,
|
|
|
- end_time:0,
|
|
|
- city_ids:"",
|
|
|
- allow_join:0,
|
|
|
- start_date:"",
|
|
|
- end_date:"",
|
|
|
- coupon_list:[],
|
|
|
- product_list:[],
|
|
|
- },
|
|
|
- // 请求参数
|
|
|
- requestParam:{
|
|
|
- id:0
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad(param) {
|
|
|
- this.requestParam.id = param.id;
|
|
|
- // 如果有scene参数的话,获取其中的ID
|
|
|
- if( param.scene ) {
|
|
|
- // 转键值对参数
|
|
|
- let scene = this.$http.strToParam(param.scene);
|
|
|
- // 如果没有传入ID,但是传入了场景ID,获取场景ID
|
|
|
- if( !param.id && scene.id ) this.requestParam.id = scene.id;
|
|
|
- }
|
|
|
- // #ifdef MP-WEIXIN
|
|
|
- //分享按钮
|
|
|
- uni.showShareMenu({
|
|
|
- withShareTicket: true,
|
|
|
- menus: ['shareAppMessage', 'shareTimeline']
|
|
|
- })
|
|
|
- // #endif
|
|
|
- },
|
|
|
- onShareAppMessage(obj) {
|
|
|
- return {
|
|
|
- title: this.activeInfo.name,
|
|
|
- path: '/pages/coupon/active?id='+this.requestParam.id,
|
|
|
- }
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- // 登录提示
|
|
|
- if( !this.$checkAccess.alterLogin() ) return ;
|
|
|
- // 如果存在产品ID的话
|
|
|
- if( this.requestParam.id > 0) {
|
|
|
- // 请求详情
|
|
|
- this.$http.request('api/coupon_active/get_detail',this.requestParam).then((re)=>{
|
|
|
- // 成功渲染数据
|
|
|
- if( re.code == 'success' ) {
|
|
|
- // 刷新数据
|
|
|
- this.activeInfo = re.data;
|
|
|
- // 列表大于2.显示
|
|
|
- if( re.data.product_list.length <= 2 ) this.show_more_product = true;
|
|
|
- }else{
|
|
|
- if( re.code != 'no_login' ){
|
|
|
- uni.showModal({
|
|
|
- content:re.msg,
|
|
|
- showCancel:false,
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- }else{
|
|
|
- uni.showModal({
|
|
|
- content:"未知的活动ID",
|
|
|
- showCancel:false,
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- toUse(item){
|
|
|
- // 没有范围
|
|
|
- if( item.type_id == 2 ){
|
|
|
- uni.switchTab({url:"/pages/index/index"});
|
|
|
- return;
|
|
|
- }
|
|
|
- // 只有一个商品,直接跳转到对应商品
|
|
|
- if( item.product_scope.length == 1 ){
|
|
|
- uni.navigateTo({
|
|
|
- url:"/pages/product/index?product_id="+item.product_scope[0]
|
|
|
- })
|
|
|
- return;
|
|
|
- }
|
|
|
- // 没有范围
|
|
|
- if( item.product_scope.length > 1 ){
|
|
|
- uni.navigateTo({
|
|
|
- url:"/pages/coupon/product?coupon_id="+item.coupon_id
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- },
|
|
|
- getCoupon(index){
|
|
|
- // 获取对应的数据
|
|
|
- let couponId = this.activeInfo.coupon_list[index].coupon_id;
|
|
|
- // 如果不能参与
|
|
|
- if( !this.activeInfo.allow_join ) {
|
|
|
- uni.showModal({
|
|
|
- content:"暂不可参与活动",
|
|
|
- showCancel:false,
|
|
|
- })
|
|
|
- return;
|
|
|
- }
|
|
|
- // 如果存在优惠券
|
|
|
- if( couponId > 0) {
|
|
|
- // 请求详情
|
|
|
- this.$http.request('api/custom_coupon/get_coupon',{coupon_id:couponId}).then((re)=>{
|
|
|
- // 成功渲染数据
|
|
|
- if( re.code == 'success' ) {
|
|
|
- this.activeInfo.coupon_list[index].is_have = 1;
|
|
|
- }else{
|
|
|
- uni.showModal({
|
|
|
- content:re.msg,
|
|
|
- showCancel:false,
|
|
|
- })
|
|
|
- }
|
|
|
- });
|
|
|
- }else{
|
|
|
- uni.showModal({
|
|
|
- content:"请选择要领取的优惠券",
|
|
|
- showCancel:false,
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // 是否显示更多的产品
|
|
|
+ show_more_product: false,
|
|
|
+ // 活动信息
|
|
|
+ activeInfo: {
|
|
|
+ id: 0,
|
|
|
+ name: "",
|
|
|
+ banner_img: "",
|
|
|
+ active_rule: "",
|
|
|
+ status: 0,
|
|
|
+ start_time: 0,
|
|
|
+ end_time: 0,
|
|
|
+ city_ids: "",
|
|
|
+ allow_join: 0,
|
|
|
+ start_date: "",
|
|
|
+ end_date: "",
|
|
|
+ coupon_list: [],
|
|
|
+ product_list: [],
|
|
|
+ },
|
|
|
+ // 请求参数
|
|
|
+ requestParam: {
|
|
|
+ id: 0,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(param) {
|
|
|
+ this.requestParam.id = param.id;
|
|
|
+ // 如果有scene参数的话,获取其中的ID
|
|
|
+ if (param.scene) {
|
|
|
+ // 转键值对参数
|
|
|
+ let scene = this.$http.strToParam(param.scene);
|
|
|
+ // 如果没有传入ID,但是传入了场景ID,获取场景ID
|
|
|
+ if (!param.id && scene.id) this.requestParam.id = scene.id;
|
|
|
+ }
|
|
|
+ // #ifdef MP-WEIXIN
|
|
|
+ //分享按钮
|
|
|
+ uni.showShareMenu({
|
|
|
+ withShareTicket: true,
|
|
|
+ menus: ["shareAppMessage", "shareTimeline"],
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ onShareAppMessage(obj) {
|
|
|
+ return {
|
|
|
+ title: `999智控终端平台\n${this.activeInfo.name}`,
|
|
|
+ path: "/pages/coupon/active?id=" + this.requestParam.id,
|
|
|
+ promise: new Promise((resolve, reject) => {
|
|
|
+ this.$http.request("api/share_message/get_item", { item_id: this.requestParam.id, pages: "/pages/coupon/active" }).then((callback) => {
|
|
|
+ console.log(callback, "api/share_message/get_item");
|
|
|
+ let obj = {
|
|
|
+ title: callback.data?.title == "" ? `999智控终端平台\n${this.activeInfo.name}` : callback.data.title,
|
|
|
+ path: "/pages/coupon/active?id=" + this.requestParam.id,
|
|
|
+ };
|
|
|
+ if (callback.data?.image_url !== "") {
|
|
|
+ obj.imageUrl = callback.data.image_url;
|
|
|
+ }
|
|
|
+ resolve(obj);
|
|
|
+ });
|
|
|
+ }),
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ // 登录提示
|
|
|
+ if (!this.$checkAccess.alterLogin()) return;
|
|
|
+ // 如果存在产品ID的话
|
|
|
+ if (this.requestParam.id > 0) {
|
|
|
+ // 请求详情
|
|
|
+ this.$http.request("api/coupon_active/get_detail", this.requestParam).then((re) => {
|
|
|
+ // 成功渲染数据
|
|
|
+ if (re.code == "success") {
|
|
|
+ // 刷新数据
|
|
|
+ this.activeInfo = re.data;
|
|
|
+ // 列表大于2.显示
|
|
|
+ if (re.data.product_list.length <= 2) this.show_more_product = true;
|
|
|
+ } else {
|
|
|
+ if (re.code != "no_login") {
|
|
|
+ uni.showModal({
|
|
|
+ content: re.msg,
|
|
|
+ showCancel: false,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.showModal({
|
|
|
+ content: "未知的活动ID",
|
|
|
+ showCancel: false,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ toUse(item) {
|
|
|
+ // 没有范围
|
|
|
+ if (item.type_id == 2) {
|
|
|
+ uni.switchTab({ url: "/pages/index/index" });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 只有一个商品,直接跳转到对应商品
|
|
|
+ if (item.product_scope.length == 1) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/product/index?product_id=" + item.product_scope[0],
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 没有范围
|
|
|
+ if (item.product_scope.length > 1) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/coupon/product?coupon_id=" + item.coupon_id,
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getCoupon(index) {
|
|
|
+ // 获取对应的数据
|
|
|
+ let couponId = this.activeInfo.coupon_list[index].coupon_id;
|
|
|
+ // 如果不能参与
|
|
|
+ if (!this.activeInfo.allow_join) {
|
|
|
+ uni.showModal({
|
|
|
+ content: "暂不可参与活动",
|
|
|
+ showCancel: false,
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 如果存在优惠券
|
|
|
+ if (couponId > 0) {
|
|
|
+ // 请求详情
|
|
|
+ this.$http.request("api/custom_coupon/get_coupon", { coupon_id: couponId }).then((re) => {
|
|
|
+ // 成功渲染数据
|
|
|
+ if (re.code == "success") {
|
|
|
+ this.activeInfo.coupon_list[index].is_have = 1;
|
|
|
+ } else {
|
|
|
+ uni.showModal({
|
|
|
+ content: re.msg,
|
|
|
+ showCancel: false,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.showModal({
|
|
|
+ content: "请选择要领取的优惠券",
|
|
|
+ showCancel: false,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
- .banner_box{
|
|
|
- width: 750rpx;
|
|
|
- height: 240rpx;
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin: 0rpx auto;
|
|
|
- .banner_img{
|
|
|
- width: 750rpx;
|
|
|
- height: 240rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .active_info{
|
|
|
- width: 750rpx;
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin: 0rpx auto;
|
|
|
- padding: 10rpx 35rpx;
|
|
|
- background-color: #FFFFFF;
|
|
|
- .active_name{
|
|
|
- display: block;
|
|
|
- height: 60rpx;
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 60rpx;
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- .active_time{
|
|
|
- display: block;
|
|
|
- height: 40rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- .active_citys{
|
|
|
- display: block;
|
|
|
- max-height: 80rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- }
|
|
|
- .active_coupon{
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 0rpx 35rpx;
|
|
|
- .active_subtitle{
|
|
|
- display: block;
|
|
|
- height: 80rpx;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 80rpx;
|
|
|
- }
|
|
|
- .coupon_list{
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- .coupon_item{
|
|
|
- display: block;
|
|
|
- height: 140rpx;
|
|
|
- overflow: hidden;
|
|
|
- padding: 10rpx 25rpx;
|
|
|
- border-radius: 15rpx;
|
|
|
- margin-bottom: 10rpx;
|
|
|
- background-color: #FFFFFF;
|
|
|
- .left_box{
|
|
|
- float: left;
|
|
|
- width: 400rpx;
|
|
|
- height: 140rpx;
|
|
|
- display: block;
|
|
|
- .rebate{
|
|
|
- color: #E03519;
|
|
|
- height: 60rpx;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 36rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- font-weight: bold;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- .std_pay{
|
|
|
- color: #666666;
|
|
|
- height: 40rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- }
|
|
|
- .coupon_exp{
|
|
|
- color: #666666;
|
|
|
- height: 40rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .right_box{
|
|
|
- float: right;
|
|
|
- width: 160rpx;
|
|
|
- height: 60rpx;
|
|
|
- display: block;
|
|
|
- margin-top: 40rpx;
|
|
|
- .get_btn{
|
|
|
- display: block;
|
|
|
- width: 160rpx;
|
|
|
- height: 60rpx;
|
|
|
- color: #FFFFFF;
|
|
|
- font-size: 26rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- text-align: center;
|
|
|
- padding: 0rpx 0rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- background-color: #E03519;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .active_product{
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin-top: 10rpx;
|
|
|
- padding: 0rpx 35rpx;
|
|
|
- .active_subtitle{
|
|
|
- display: block;
|
|
|
- height: 80rpx;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 80rpx;
|
|
|
- }
|
|
|
- .product_list{
|
|
|
- display: block;
|
|
|
- height: 520rpx;
|
|
|
- overflow: hidden;
|
|
|
- .product_item{
|
|
|
- float: left;
|
|
|
- width: 320rpx;
|
|
|
- height: 480rpx;
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin-top: 20rpx;
|
|
|
- margin-right: 40rpx;
|
|
|
- background-color: #FFFFFF;
|
|
|
- border-radius: 20rpx;
|
|
|
- .product_image{
|
|
|
- width: 320rpx;
|
|
|
- height: 320rpx;
|
|
|
- }
|
|
|
- .product_name{
|
|
|
- height: 80rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- overflow: hidden;
|
|
|
- margin: 0rpx 0rpx;
|
|
|
- padding: 0rpx 10rpx;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- .stock_price{
|
|
|
- color: #dddddd;
|
|
|
- font-size: 20rpx;
|
|
|
- overflow: hidden;
|
|
|
- line-height: 30rpx;
|
|
|
- padding: 0rpx 10rpx;
|
|
|
- .product_price{
|
|
|
- float: left;
|
|
|
- color: red;
|
|
|
- font-size: 30rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- .product_market{
|
|
|
- font-size: 24rpx;
|
|
|
- color: #999999;
|
|
|
- line-height: 30rpx;
|
|
|
- vertical-align: top;
|
|
|
- text-decoration: line-through;
|
|
|
- }
|
|
|
- }
|
|
|
- .product_stock{
|
|
|
- float: right;
|
|
|
- font-size: 20rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .product_item:nth-child(even){
|
|
|
- margin-right: 0rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .product_list.more{
|
|
|
- height: auto !important;
|
|
|
- }
|
|
|
- .more_product{
|
|
|
- z-index: 8;
|
|
|
- left: 0rpx;
|
|
|
- top: -10rpx;
|
|
|
- height: 40rpx;
|
|
|
- display: block;
|
|
|
- font-size: 20rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- text-align: center;
|
|
|
- position: relative;
|
|
|
- border-radius: 5rpx;
|
|
|
- background-color: rgba(0, 0, 0, 0.1);
|
|
|
- }
|
|
|
- }
|
|
|
- .active_rule{
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- margin-top: 10rpx;
|
|
|
- padding: 0rpx 35rpx;
|
|
|
- margin-bottom: 160rpx;
|
|
|
- .active_subtitle{
|
|
|
- display: block;
|
|
|
- height: 80rpx;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 80rpx;
|
|
|
- }
|
|
|
- .active_rule_info{
|
|
|
- display: block;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 24rpx;
|
|
|
- min-height: 500rpx;
|
|
|
- line-height: 40rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- padding: 20rpx 20rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- background-color: #FFFFFF;
|
|
|
- .rich_text{
|
|
|
- white-space: break-spaces;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+.banner_box {
|
|
|
+ width: 750rpx;
|
|
|
+ height: 240rpx;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0rpx auto;
|
|
|
+ .banner_img {
|
|
|
+ width: 750rpx;
|
|
|
+ height: 240rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.active_info {
|
|
|
+ width: 750rpx;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0rpx auto;
|
|
|
+ padding: 10rpx 35rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .active_name {
|
|
|
+ display: block;
|
|
|
+ height: 60rpx;
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 60rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .active_time {
|
|
|
+ display: block;
|
|
|
+ height: 40rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .active_citys {
|
|
|
+ display: block;
|
|
|
+ max-height: 80rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+}
|
|
|
+.active_coupon {
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 0rpx 35rpx;
|
|
|
+ .active_subtitle {
|
|
|
+ display: block;
|
|
|
+ height: 80rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 80rpx;
|
|
|
+ }
|
|
|
+ .coupon_list {
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ .coupon_item {
|
|
|
+ display: block;
|
|
|
+ height: 140rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 10rpx 25rpx;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .left_box {
|
|
|
+ float: left;
|
|
|
+ width: 400rpx;
|
|
|
+ height: 140rpx;
|
|
|
+ display: block;
|
|
|
+ .rebate {
|
|
|
+ color: #e03519;
|
|
|
+ height: 60rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 36rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .std_pay {
|
|
|
+ color: #666666;
|
|
|
+ height: 40rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ .coupon_exp {
|
|
|
+ color: #666666;
|
|
|
+ height: 40rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right_box {
|
|
|
+ float: right;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ display: block;
|
|
|
+ margin-top: 40rpx;
|
|
|
+ .get_btn {
|
|
|
+ display: block;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0rpx 0rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ background-color: #e03519;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.active_product {
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ padding: 0rpx 35rpx;
|
|
|
+ .active_subtitle {
|
|
|
+ display: block;
|
|
|
+ height: 80rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 80rpx;
|
|
|
+ }
|
|
|
+ .product_list {
|
|
|
+ display: block;
|
|
|
+ height: 520rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ .product_item {
|
|
|
+ float: left;
|
|
|
+ width: 320rpx;
|
|
|
+ height: 480rpx;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ margin-right: 40rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ .product_image {
|
|
|
+ width: 320rpx;
|
|
|
+ height: 320rpx;
|
|
|
+ }
|
|
|
+ .product_name {
|
|
|
+ height: 80rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0rpx 0rpx;
|
|
|
+ padding: 0rpx 10rpx;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .stock_price {
|
|
|
+ color: #dddddd;
|
|
|
+ font-size: 20rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ line-height: 30rpx;
|
|
|
+ padding: 0rpx 10rpx;
|
|
|
+ .product_price {
|
|
|
+ float: left;
|
|
|
+ color: red;
|
|
|
+ font-size: 30rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ .product_market {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999999;
|
|
|
+ line-height: 30rpx;
|
|
|
+ vertical-align: top;
|
|
|
+ text-decoration: line-through;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .product_stock {
|
|
|
+ float: right;
|
|
|
+ font-size: 20rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .product_item:nth-child(even) {
|
|
|
+ margin-right: 0rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .product_list.more {
|
|
|
+ height: auto !important;
|
|
|
+ }
|
|
|
+ .more_product {
|
|
|
+ z-index: 8;
|
|
|
+ left: 0rpx;
|
|
|
+ top: -10rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ display: block;
|
|
|
+ font-size: 20rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 5rpx;
|
|
|
+ background-color: rgba(0, 0, 0, 0.1);
|
|
|
+ }
|
|
|
+}
|
|
|
+.active_rule {
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ padding: 0rpx 35rpx;
|
|
|
+ margin-bottom: 160rpx;
|
|
|
+ .active_subtitle {
|
|
|
+ display: block;
|
|
|
+ height: 80rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 80rpx;
|
|
|
+ }
|
|
|
+ .active_rule_info {
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 24rpx;
|
|
|
+ min-height: 500rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding: 20rpx 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .rich_text {
|
|
|
+ white-space: break-spaces;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|