<view class="tab">
  <view class="{{tab==0?'tab-on':'tab-out'}}" data-index="0" catchtap="changeTab">经典系列</view>
  <view class="{{tab==1?'tab-on':'tab-out'}}" data-index="1" catchtap="changeTab">吉致系列</view>
</view>
<view class="tab-layer"></view>
<view wx:if="{{tab==0}}">
  <view class="item itemjd" data-pname="{{p.name}}" data-brand="0" bindtap="goDetail" wx:for="{{list}}" wx:key="name" wx:for-item="p">
    <view class="img">
      <image src="{{p.imgUrl}} " mode="aspectFit" />
    </view>
    <view class="con">
      <view class="nm">{{p.name}}</view>
      <view class="des">{{p.des}}</view>
      <view class="sub">￥
        <text>{{p.price}}</text>
      </view>
    </view>
  </view>
</view>
<view wx:if="{{tab==1}}">
  <view class="item itemjz" bindtap="goDetail" data-pname="{{p.name}}" data-brand="1" data-price="{{p.price}}" wx:for="{{listJz}}" wx:key="name" wx:for-item="p">
    <view class="img">
      <image src="{{p.imgUrl}}" mode="aspectFit" />
    </view>
    <view class="con">
      <view class="nm">{{p.name}}</view>
      <view class="des">{{p.des}}</view>
      <view class="sub">￥
        <text>{{p.price}}</text>
      </view>
    </view>
  </view>
</view>

page{padding: 55px 0 0;background-color: #f3f3f3;}
.tab{width: 720rpx; position: fixed;z-index: 100; left: 14rpx; top:10rpx;border:1px solid #576b95;height: 40px; line-height:40px;border-radius: 5px;display: flex;font-size: 13pt;}
.tab-layer{width: 750rpx;height: 50px; background: #fff;opacity: 0.9;left: 0;top: 0; position: fixed;z-index: 99; border-bottom: 1rpx solid #dedede;}
.tab .tab-on{background-color: #576b95;text-align: center; color: #fff;flex: 1;}
.tab .tab-out{text-align: center;flex: 1;}

.item{display: flex; padding: 10px 0; background-color: #fff;border-bottom: 1px solid #eee;}
.item:active{background-color: #f5f5f5;}
.item .img{width:300rpx; text-align: center;}
.itemjd .img image{width: 250rpx;height: 180rpx; }
.itemjz .img image{width:100%;height:200rpx;}
.item .con{flex: 1; padding: 0 10px 0 0;}
.con .nm{font-size: 14pt; font-weight: bold;}
.con .des{line-height: 22px; font-size: 12pt; padding: 5px 0;color: #999;}
.con .sub{color: #ff6a00;font-size: 12pt;}
.con .sub text{font-size: 15pt;}

.jzitem image{width: 720rpx; height:540rpx; }

var base = getApp();
var jzData = require('../../utils/jzData.js')
Page({
    data: {
        tab: 0,
        list: [],
        listJz: []
    },
    onLoad: function () {
        var _this = this;
        var _dic = base.cake.getCache();
        if (_dic) {
            this.setlist(_dic);
        } else {
            this.initData();
        }
        //极致系列
        var _jzlist = [];
        var dic = jzData.data;
        for (var i in dic) {
            _jzlist.push({
                name: i,
                price: dic[i].CakeType[0].CurrentPrice + ".00",
                des: dic[i].Means,
                imgUrl: base.path.res + dic[i].img
            })
        }
        this.setData({ "listJz": _jzlist });
    },
    onShow: function (e) {
        if (base.cake.tab != null) {
            this.setData({ "tab": base.cake.tab });
            base.cake.tab = null;
        }
        // if (base.version.current != base.version.getValue()) {

        //     this.initData();
        // }
    },
    initData: function () {
        var _this = this;
        // var _dic = base.cake.getCache();
        // if (_dic) {
        //     _this.setlist(_dic);
        // } else {
        base.get({ c: "Product", m: "GetAllProduct", City: "上海" }, function (d) {
            var data = d.data;
            if (data.Status == "ok") {
                base.cake.setCache(data.Tag);
                _this.setlist(data.Tag);
            }
        })
        //}

    },
    setlist: function (dic) {
        var _list = [];
        for (var i in dic) {
            _list.push({
                name: i,
                price: dic[i].CakeType[0].CurrentPrice + ".00",
                des: dic[i].Means,
                //imgUrl: base.path.res + "images/ksk/mlist/item/" + i + ".jpg"
                imgUrl: base.path.res + "/images-2/index-3/jdcake/w_240/" + encodeURI(i) + ".png"
            })
        }
        this.setData({ "list": _list });
    },
    ing: function (e) {
        var price = e.currentTarget.dataset.price;
        base.modal({
            title: '是否需要购买优惠券？',
            showCancel: true,
            confirmText: "去购买",
            success: function (res) {
                if (res.confirm) {
                    wx.navigateTo({
                        url: "../buy/buy?type=1&price=" + price
                    })
                }
            }
        })
    },
    changeTab: function (e) {
        var d = e.currentTarget.dataset.index;
        this.setData({ tab: d });
    },
    goDetail: function (e) {
        var d = e.currentTarget.dataset.pname;
        var b = e.currentTarget.dataset.brand;
        if (d) {
            wx.navigateTo({
                url: '../cakeDetail/cakeDetail?pname=' + d + "&brand=" + b
            })
        }
    }
});