1.效果图
2.wxml
<view class="swiper_area"> <swiper indicator-dots="{{indicatorDots}}" indicator-color="#fff" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}"> <swiper-item data-img="{{item.flower_image}}" bindtap="seeSwiperAll"> <image data-id="{{item.flower_id}}" src="{{item.flower_image}}" class="slide-image" /> </swiper-item> </block> </swiper></view><view class="goods_infor_top"> <view class="goods_title">{{good.good_name}} </view> <view class="good_description"> <text class="description_content">{{good.good_mark}}</text> </view> <view class="good_info_bottom display-flex-row" style=""> <view class="good_price"> <text class="color_ff6700 good_dis_price pdr10rpx display-ib">¥{{goodPrice}}/{{good.good_unit}}</text> <block wx:if="{{good.good_column=='100903'}}"> <text class="good_orin_price td-lt display-ib"> ¥{{goodOrinPrice}} </text> </block> </view> <view class="sale"> <text class="good_sale_count display-ib" style="">销量:{{good.good_sell}}</text> </view> </view></view><view bindtap="viewFlowerArea" class="choose_catalog_area bg_fff display-flex-row"> <view class="fl">选择花色: {{flowerNameSelect}} </view> <image class="arrow_right fr" src="../../image/icon-arrow.png"/></view><view class="commodity_screen" bindtap="hideModal" wx:if="{{showModalStatus}}"></view><view animation="{{animationData}}" class="catalog_area bg_fff {{isHidden == 1 ? 'display-block':'display-none'}}"> <view class="catalog_title"> <image class="thumbnails" src="{{flowerImgSelect}}" mode="aspectFill"></image> <view class="info_tip"> <view class="good_dis_price">¥{{goodPrice}}</view> <view class="choosed_catalog text-hidden">{{flowerNameSelect}}</view> </view> <image class="cancel" bindtap="hideModal" src="../../image/delete.png"></image> </view> <scroll-view scroll-y="true" style="height: 640rpx;margin-top:175rpx"> <view class="info_choose"> <view class="catalog_name">花型</view> <view class="catalog_items display-flex-row" > <block wx:for="{{goodflowers}}"> <text data-img="{{globalData.root}}{{item.flower_image}}" data-select="{{item.flower_id}}" data-flower-name="{{item.flower_name}}" class="{{item.flower_id == flowerSelect ? 'active':''}} catalog_item" bindtap="chooseFlower">{{item.flower_name}} </text> </block> </view> <view class="borderTop"></view> <view class="catalog_count display-flex-row" > <view class="catalog_name"> 购买数量 </view> <view class="count_control display-flex-row"> <span class="item_reduce item_btn" bindtap="{{goodNum>1?'goodReduce':''}}">-</span> <span class="item_num" bindtap="carRemove">{{goodNum}}</span> <span class="item_add item_btn" bindtap="goodAdd">+</span> </view> </view> <view class="borderTop"></view> </view> </scroll-view> <view class="btn_hidden"></view> <view class="btn_area display-flex-row" > <view bindtap="addCart" class="goods_half_half bg_09bb07 color_fff">加入购物车</view> <view bindtap="saveOrder" class="goods_half_half bg_ff6700 color_fff">立即购买</view> </view></view><view class="container width100 "> <view class="tab bg_fff"> <view class="tab-content mgb10rpx"> <view class="btn right_btn {{select==0?'active':''}}" data-area="0" bindtap="changeArea">商品详情</view> <view class="btn left_btn {{select==1?'active':''}}" data-area="1" bindtap="changeArea">商品参数</view> </view> </view> <view wx:if="{{0==select}}"> </view> <view wx:if="{{1==select}}" class="param_area"></view></view><view class="{{isHidden == 0 ? 'display-block':'display-none'}}"> <view class="goods_bottom"></view> <view class="goods_bottom_btn display-flex-row"> <view bindtap="addCart" class="goods_half_half bg_09bb07 color_fff">加入购物车</view> <view bindtap="saveOrder" class="goods_half_half bg_ff6700 color_fff">立即购买</view> </view></view>
3.js
Page({ data: { orinGoodMsg: { "good": { "visible": "101", "tourist_dis_price": 510, "good_identity": "00204", "good_sell": "100", "good_brand": "", "last_modify_time": "2017-08-08 20:10:05", "good_place": "101", "good_type": "2", "good_display_img": "../../image/swiper.jpg", "dealer_price": 0, "last_modify_id": "1", "good_id": "17", "good_fill": "", "good_number": 35, "good_status": "9001", "good_unit": "套", "good_format": "", "good_column": "100902", "wholesaler_dis_price": 255, "dealer_dis_price": 265, "tourist_price": 0, "good_name": "绚彩活性棉提花四件套", "wholesaler_price": 0, "good_mark": "床单270x270cm被套200x230cm枕套48x74+6cm" }, "goodflowers": [{ "flower_name": "朝花夕拾", "flower_id": "11d75c6a560a4345b232706f7642de22", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "美丽相约", "flower_id": "3994afdb0427425d93bbba6e881601c3", "flower_image": "../../image/flower.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "清水佳人", "flower_id": "3ebc1032eb5d477b9e2bf508918f3d2b", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "意境幽蓝", "flower_id": "425cc030c0574344a62be9674c854ee6", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "出水芙蓉", "flower_id": "4ea02d08e2464ba681e4861451a7a2f7", "flower_image": "../../image/flower.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "国色天香", "flower_id": "5501ed259aa6476eafff940e9cf16e5a", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "春日畅想", "flower_id": "85d540c79c244e40bb88744cdd1aa5ce", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "花叶细雨", "flower_id": "877e01699f30449ebf99bfe689711159", "flower_image": "../../image/flower.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "琪花摇曳", "flower_id": "979e579413ea467fb363a1c85f36f092", "flower_image": "../../image/swiper.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "絮语飘香", "flower_id": "ba7ef47a8fec4ec192d958d3c400bf7b", "flower_image": "../../image/flower.jpg", "good_id": "17", "flower_identity": "" }, { "flower_name": "凝香雨露", "flower_id": "d24fa5772f754cfbb6650df587167c2f", "flower_image": "../../image/sw
