cookbook

+/**app.wxss**/
+@import "icon.wxss";
+
+
+.hidden {
+    display: none; 
+}
+
+page {
+  font-size: 16px;
+  line-height: 150%;
+  font-family: 'PingFang SC','sans-serif','Helvetica Neue','Helvetica','Arial';
+  height: 100%;
+}
+.section{ margin-left:4%;margin-right:4%; width:92%;}
+.sectionA{ margin-left:8%;margin-right:8%; width:84%; overflow: hidden; }
+.sectionW{margin-left:2%;margin-right:2%;width:96%;overflow: hidden;}
+.section_p{ padding-left:4%;padding-right:4%; width:92%; overflow: hidden; }
+.white{
+    color: #fff;
+}
+.green{
+    color: #22ab39;
+}
+.black{
+    color: #000;
+}
+.gray{
+    color:#666;
+}
+.liggray{
+    color:#9E9A9A;
+}
+.bg{
+    background-color:#efeef3;
+}
+.bg_green{
+    background-color: #1AAD19;
+}
+.bg_liggreen{
+    background-color: #ECF8EE;
+}
+.bg_red{
+    background-color: #E14553;
+}
+.bg_gray{
+    background-color: #f3f3f3;
+}
+.bg_white{
+    background-color: white;
+}
+.bg_blue{
+    background-color: #EEF2FB;
+}
+.bg_pink{
+    background-color: #FEEFF0;
+}
+.bg_ligblack{
+    background-color: #4C4E4F;
+}
+.mtop10{
+    margin-top: 10px;
+}
+.mtop12{
+    margin-top: 12px;
+}
+.mtop15{
+    margin-top: 15px;
+}
+.mtop20{
+    margin-top: 20px;
+}
+.mtop25{
+    margin-top: 25px;
+}
+.mtop30{
+    margin-top: 30px;
+}
+.mbottom5{
+    margin-bottom:5px;
+}
+.mbottom10{
+    margin-bottom: 10px;
+}
+.mbottom15{
+    margin-bottom: 15px;
+}
+.mbottom20{
+    margin-bottom: 20px;
+}
+.mbottom30{
+    margin-bottom: 30px;
+}
+.ptop5{
+    padding-top:5px;
+}
+.pbottom5{
+    padding-bottom:5px;
+}
+.ptop8{
+    padding-top:8px;
+}
+.pbottom8{
+    padding-bottom:8px;
+}
+.ptop10{
+    padding-top:10px;
+}
+.pbottom10{
+    padding-bottom:10px;
+}
+.ptop12{
+    padding-top:12px;
+}
+.pbottom12{
+    padding-bottom:12px;
+}
+.ptop13{
+    padding-top:13px;
+}
+.pbottom13{
+    padding-bottom:13px;
+}
+.ptop15{
+    padding-top:15px;
+}
+.pbottom15{
+    padding-bottom:15px;
+}
+.ptop18{
+    padding-top:18px;
+}
+.pbottom18{
+    padding-bottom:18px;
+}
+.ptop20{
+    padding-top:20px;
+}
+.pbottom20{
+    padding-bottom:20px;
+}
+.mleft{
+    margin-left:4%;
+}
+.mleft6{
+    margin-left:6px;
+}
+.mleft10{
+    margin-left: 10px;
+}
+.mleft14{
+    margin-left: 14px;
+    height: 60px;
+}
+.mleft16{
+    margin-left: 16px;
+}
+.mright20{
+    margin-right: 20px;
+}
+.strong,.bold{
+    font-weight: bold;
+}
+.overflow{
+    overflow:hidden;
+}
+.textoverflow{
+    display: block;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+.fsize11{
+    font-size: 22rpx;
+    height:11px;
+    line-height:11px;
+}
+.fsize12{
+    font-size: 24rpx;
+}
+.fsize13{
+    font-size: 26rpx;
+}
+.fsize14{
+    font-size: 28rpx;
+}
+.fsize15{
+    font-size: 30rpx;
+}
+.fsize16{
+    font-size: 32rpx;
+}
+.fsize17{
+    font-size: 34rpx;
+}
+.fsize18{
+    font-size: 36rpx;
+}
+.fsize20{
+    font-size: 40rpx;
+}
+.fsize24{
+    font-size: 48rpx;
+}
+.black-font{
+    color:#353535;
+}
+.white-font{
+    color:#fff;
+}
+.gray-light-font{
+    color:#999;
+}
+.gray-deenpen-font{
+    color:#666;
+}
+
+.hr-one{
+  background: #efeef3;
+  height: 1px;
+  width:auto;
+}
+.nowrap{white-space:nowrap;}
+
+/*水平方向左右分布*/
+.flex-lr{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: space-between;
+  align-items:center;
+  flex-direction: row;
+  -webkit-flex-direction: row;
+}
+.flex-ll{
+
+    display: flex;
+     display: -webkit-flex;
+     flex-direction:row;
+     justfy-content: flex-start;
+     align-items: center;
+     -webkit-flex-direction: row;
+}
+.flex-ll-top{
+  display: flex;
+  display: -webkit-flex;
+  flex-direction:row;
+  -webkit-flex-direction: row;
+}
+.flex-ll-bottom{
+  display: flex;
+  display: -webkit-flex;
+  flex-direction:row;
+  -webkit-flex-direction: row;
+  justfy-content: flex-end;
+  align-items: flex-end;
+}
+
+.flex-rr{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: flex-end;
+  align-items: center;
+  flex-direction: row;
+  -webkit-flex-direction: row;
+}
+/*垂直方向居中分布*/
+.flex-vc{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  -webkit-flex-direction: column;
+}
+/*垂直方向居左分布*/
+.flex-vl{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: flex-start;
+  align-items: left;
+  flex-direction: column;
+  -webkit-flex-direction: column;
+}
+/*垂直方向居右分布*/
+.flex-vr{
+    display: flex;
+    display: -webkit-flex;
+    justify-content: flex-end;
+    align-items: center;
+    flex-direction: column;
+    -webkit-flex-direction: column;
+  }
+/*水平方向居中分布*/
+.flex-cc{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: row;
+  -webkit-flex-direction: row;
+}
+/*基准线对齐*/
+.flex-bc{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: center;
+  align-items: baseline;
+  flex-direction: row;
+  -webkit-flex-direction: row;
+}
+/*流式布局*/
+.flex-auto{
+  display: flex;
+  display: -webkit-flex;
+  justify-content: space-around;
+  align-content: flex-start;
+  flex-flow:wrap;
+}
+.div-v-center {
+  -webkit-transform: translateY(-50%);
+  -moz-transform: translateY(-50%);
+  -ms-transform: translateY(-50%);
+  -o-transform: translateY(-50%);
+  transform: translateY(-50%);
+}
+.div-h-center {
+  -webkit-transform: translateX(-50%);
+  -moz-transform: translateX(-50%);
+  -ms-transform: translateX(-50%);
+  -o-transform: translateX(-50%);
+  transform: translateX(-50%);
+}
+.t-align-c{
+    text-align: center;
+}
+.t-align-r{
+    text-align: right;
+}
+.t-align-j{
+    text-align: justify;
+}
+.displaysan{
+    word-break:break-all;
+    text-overflow:ellipsis;
+    display:-webkit-box;
+    -webkit-box-orient:vertical;
+    -webkit-line-clamp:2;
+    overflow:hidden;
+}
+.linethrough{
+    text-decoration:line-through
+}
+image{
+    background-color: #f4f4f4;
+    background-repeat: no-repeat;
+    background-size: 68px 24px;
+    background-position: center;
+} 
+.opacity{
+    opacity: 0.4;
+}
+.opacity2{
+    opacity: 0.2;
+}
+.avater{width:50px;height:50px;border-radius:50%;}
+.fixed{position:fixed}
+.inline{
+    display:inline-block;
+}
+.width{
+    width:50%;
+}
+.width100{
+    width:100%;
+}
+.height100{
+    height:100px;
+}
+/*点餐人数 选择口味*/
+.choose{
+    height:32px;
+}
+.choose .normal{
+    width:76px;
+    height:30px;
+    line-height:30px;
+    text-align:center;
+    color:#E14553;
+    border:1px solid #FB848F;
+    border-radius:15px;
+}
+.mleft30{
+    margin-left:30px;
+}
+.mleft50{
+    margin-left:50px;
+}
+.choose .active{
+   background-color:#F93E85;
+   color:#fff;
+}
+.beginorder{
+    width:67%;
+    margin:0 16.5%;
+    height:40px;
+    line-height:40px;
+    border-radius:8px;
+    bottom:40px;
+}
+/* 会员卡样式调整 */
+
+.cardSection{ margin: 0 auto; width:84%; overflow: hidden; }
+.cardBox {
+    width: 100%;
+    background: #EFEEF3;
+    padding: 30rpx 0;
+}
+.innerBox {
+    position: relative;
+    width: 84%; height: 0;
+    padding-top: 48%;
+}
+.cardTitle {
+    position: absolute;
+    top:15rpx;
+}
+.cardInfo {
+    position: absolute;
+    bottom:26rpx;
+}
+.fsizeTitle{
+    font-size: 30rpx;
+}
+.fsizeInfo {
+    font-size: 26rpx;
+}
+.rightsArea {
+    padding-top: 25rpx;
+}
+.imageSize {
+    width: 44rpx;
+    height: 44rpx;
+    overflow: hidden;
+    margin-right: 15rpx;
+    float: left;
+}
+.rightsTitle {
+    margin: 0 5%;
+    margin-bottom: 50rpx;
+}
+.infoSize {
+    color: #060606;
+    font-size: 30rpx;
+}
+.rightsItem {
+    margin-bottom: 35rpx;
+    height: 100%;
+}
+.itemInfo {
+    flex: 1;
+}
+.orderSize {
+    width: 222rpx;
+    height: 71rpx;
+    line-height: 71rpx;
+    font-size: 30rpx;
+}
+.disabledSize {
+    bottom: 80rpx;
+    margin: 0 100rpx;
+}
+.btnArea {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    position: absolute;
+    bottom: 80rpx;
+}
+.page {
+    height: 100%;
+}
+.fwhite {
+    color: #fff;
+}
+.fgray {
+    color: #efedec;
+}
+.b-radius{border-radius:6px;}
+.bradius8{border-radius:8px;}
+.bradius50{border-radius:50%;}
+.smooth{
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+image{
+    display:block;
+    background:transparent;
+}
+button:after{
+    border:0;
+}
+button{
+    background:transparent;
+}
+.button-hover {
+  background-color: transparent;
+}
+.food-clear-num{
+    height:20px;
+    position:absolute;
+    right:0;
+}
+.food-clear-content{
+    height:100%;
+    font-size:22rpx;
+    padding:0 10rpx;
+    background:rgba(216,30,6,.9);
+    line-height:40rpx;
+}
+.food-clear-angel{
+    width:14rpx;
+    height:36rpx;
+    position:relative;
+    left:1rpx;
+}
+.angel-reat{
+    width:12px;
+    height:100%;
+    overflow:hidden;
+    position:relative;
+}
+.common-angle {
+    width: 0;
+    height: 0;
+    border-top: 12px solid transparent;
+    border-right: 12px solid rgba(216,30,6,.9);
+    border-bottom: 12px solid transparent;
+    position:absolute;
+}
+.top-angel{
+    top:-12px;
+    left:2px;
+}
+.bottom-angel{
+    bottom:-12px;
+    left:2px;
+}
+.font-bold,.Semibold{
+    font-weight:bold;
+}
+
+.Medium{
+  font-weight: 400;
+}

+Component({
+    properties:{
+        cooklist:Array,
+        hasListModel:{
+            type:Boolean,
+            value:false
+        },
+    },
+    data:{
+        menuHidden:true,
+        activeMenuID:'',
+    },
+    attached(){
+        let obj={
+            menuHidden:!this.data.hasListModel,
+        };
+        this.setData(obj)
+    },
+    methods:{
+       changeList:function(e){
+           var _target=e.currentTarget.dataset;
+           console.log(_target);
+           this.setData({
+               activeMenuID:_target.id
+           })
+           this.triggerEvent("changeList",_target);
+           if(!this.data.hasListModel){
+               this.close();
+           }
+       },
+       show:function(){
+           let obj={
+               menuHidden:false
+           };
+           if(!this.data.activeMenuID){
+               obj.activeMenuID=this.data.cooklist[0].id||'';
+           }
+           this.setData(obj)
+       },
+       close:function () {
+          this.setData({
+              menuHidden:true
+          })
+       }
+    }
+})

+{
+  "component": true,
+  "usingComponents": {
+    "formids": "/components/formids/formids"
+  }
+}

+<view class="cook-class {{hasListModel?'hasListModel':''}}" hidden="{{menuHidden}}">
+    <block wx:for="{{cooklist}}" wx:key="cooklist-key">
+        <view class="flex-cc">
+            <formids bindclick="changeList" data-id="{{item.id}}">
+                <view class="white fsize24 smooth cook-class-single {{item.id==activeMenuID || (!activeMenuID && index==0) ? 'cook-class-single-active' : ''}}"
+                      data-id="{{item.id}}">
+                    <view wx:if="{{hasListModel}}" class="line2more" >
+                        <view style="width: 100%;text-align: center">{{item.class_name}}</view>
+                    </view>
+                    <block wx:else="">{{item.class_name}}</block>
+                </view>
+            </formids>
+        </view>
+    </block>
+    <formids bindclick="close" class="menu-fixed">
+        <view>
+             <image src="http://qn.colorcun.com/custom/lite/image/menu-close-new.png" background-size="cover" class="menu-fixed-image-close"></image>
+        </view>
+    </formids>
+</view>
+<slot></slot>

+/* component/cook-class/cook-class.wxss */
+@import '../../app.wxss';
+.cook-class{
+    width:100%;
+    top:0;
+    left:0;
+    bottom:0;
+    background:#e14553;
+    z-index:1000;
+    padding-top:80rpx;
+    box-sizing:border-box;
+    overflow-y: auto;
+    padding-bottom: 160rpx;
+}
+.menu-list{
+    width:100%;
+    height:100%;
+}
+.cook-class-single{
+    padding:0 20rpx;
+    padding-top:40rpx;
+    padding-bottom:10rpx;
+}
+.cook-class-single-active{
+    border-bottom:2px solid #fff;
+    font-weight:bold;
+
+}
+.menu-fixed{
+    position:absolute;
+    bottom:10px;
+    left:10px;
+    width:80rpx;
+    height:80rpx;
+    padding:5rpx;
+    box-sizing:border-box;
+}
+.menu-fixed-image-close{
+    width:70rpx;
+    height:70rpx;
+    border-radius:50%;
+    position: fixed;
+    bottom: 40rpx;
+    left: 40rpx;
+}
+
+
+.hasListModel{
+    width: 180rpx;
+    padding-top:0rpx;
+    padding-left: 0;
+    background-color: #F5F5F5;
+}
+.hasListModel .cook-class-single{
+    width: 180rpx;
+    color: #999999;
+    font-size: 30rpx;
+    padding:18rpx 0rpx;
+    border-width:0 ;
+}
+.hasListModel .menu-fixed{
+    display: none;
+}
+.hasListModel .cook-class-single-active{
+    border-bottom-width:0 ;
+    background-color:#FEFEFE;
+    color:#353535;
+    font-weight: 400;
+}
+.hasListModel .cook-class-single-active:before{
+    position: absolute;
+    content: '';
+    top:0;
+    left:0;
+    width: 4rpx;
+    height: 100%;
+    background-color: #E14553;
+}
+.hasListModel .line2more{
+    height: 84rpx;
+    width:140rpx;
+    vertical-align: middle;
+    overflow: hidden;
+    text-align: center;
+    margin: auto;
+    text-overflow:ellipsis;
+    display: -webkit-box;
+    /*-webkit-box-orient: vertical;*/
+    /*-webkit-line-clamp: 2;*/
+    -webkit-box-align: center;
+}

+// component/menu/addDelete.js
+import util from '../../../utils/util';
+import App from '../../../utils/api';
+const {regeneratorRuntime} = global
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        item: {
+            type: Object,     // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
+        },
+        sellerid:{
+            type:Number
+        },
+        orderid:{
+            type:Number
+        },
+        fromSoucre:{
+            type:Number,
+            value:0
+        },
+        request_uri:{
+            type:Boolean,
+            value:false,
+        },
+        hasListModel:{
+            type:Boolean,
+            value:false,
+        },
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        item_clear_num:null,
+        hasIPhone:false,
+    },
+    attached () {
+        console.log('food-card-ready',this.data.orderid,this.data.fromSoucre)
+        let item=this.data.item;
+        let item_clear_num;
+        if(typeof item.item_clear_num!='undefined'){
+            item_clear_num=item.item_clear_num;
+        }else{
+            item_clear_num=item.clear_num;
+            if(item.spec){
+                let clear_num=null;
+                item.spec.forEach(spec=>{
+                    if(spec.clear_num==0){
+                        clear_num=0;
+                    }else{
+                        clear_num=null;
+                    }
+                })
+                if(clear_num==0){
+                    item_clear_num=0;
+                }
+            }
+        }
+
+        this.setData({
+            item_clear_num:item_clear_num,
+            hasIPhone:getApp().system.model.indexOf('iPhone')>-1
+        });
+    },
+    detached(){
+
+    },
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        //规格 增加/减少 回调
+        foodSpecCallback(e){
+            let opt=e.detail;
+            console.log('foodSpecCallback',opt);
+            if(opt.type=='specWin'){
+                return this.triggerEvent('foodCardCallback',opt);
+            }
+            let item=this.data.item;
+            let oldNum=(item.num||0);
+            item.num=(item.num||0)+opt.type;
+            let rotateFlag=(oldNum==0 || item.num==0);
+            console.log('num_rotate',rotateFlag);
+            this.setData({item:item,rotate_id:rotateFlag?item.id:''});
+            opt.num=item.num;
+            this.triggerEvent('foodCardCallback',opt);
+        },
+
+        //清除订单下某菜品所有数量
+        delOrderCook:function(){
+            this.selectComponent("#foodSpecDel").clean();
+        },
+        //triggerAdd
+        triggerAdd(e){
+            console.log('triggerAdd',e)
+            if(this.data.item_clear_num==0) return;
+            this.selectComponent("#foodSpecAddOne").addCook();
+        },
+        //viewIMage
+        viewImage(){
+            wx.previewImage({
+                current: this.data.item.image, // 当前显示图片的http链接
+                urls: [this.data.item.image], // 需要预览的图片http链接列表
+            })
+        }
+    }
+})

+{
+  "component": true,
+  "usingComponents": {
+    "foodSpec": "../food-spec/food-spec"
+  }
+}

+<view class="flex-ll-top hasListModel" style="width:100%;">
+    <view class="avatar">
+        <image mode="aspectFill" lazy-load="true" src="{{item.image}}"/>
+    </view>
+    <view class="content">
+        <view class="name Semibold">
+            {{item.name}}
+        </view>
+        <view class="desc">
+            {{item.desc||''}}
+        </view>
+        <view class="label">
+            <block wx:if="{{item.labelList}}">
+                <view class="menu-ptop-mark">
+                    <block wx:for="{{item.labelList}}" wx:for-item="son" wx:key="labelList-key">
+                        <image class="labelListImg" src="{{son.icon}}" mode="aspectFit"></image>
+                    </block>
+                </view>
+            </block>
+        </view>
+        <view class="flex-lr price">
+            <view class="flex-ll">
+                <view class="rmb">¥</view>
+                <view class="money">{{item.spec[0].price>0 ? item.spec[0].price : item.price}}</view>
+            </view>
+            <view class="opt flex-ll">
+                <block wx:if="{{item_clear_num==0}}">
+                    <image
+                            class="avater"
+                            src="http://qn.colorcun.com/custom/lite/image/clear.png"
+                            style="width:41px;height:26px;margin-top:3px;position:relative;top:-2px;float:right;"
+                            class="{{item.image?bg_white:bg_pink}}"/>
+                </block>
+                <block wx:else="">
+                    <block wx:if="{{item.num>0}}">
+                        <foodSpec item="{{item}}" type="-" id="foodSpecDel"
+                                  sellerid="{{sellerid}}" orderid="{{orderid}}"
+                                  fromSoucre="{{fromSoucre}}" request_uri="{{request_uri}}"
+                                  bindfoodSpecCallback="foodSpecCallback">
+                            <view class='jian'></view>
+                        </foodSpec>
+                        <view class="t-align-c">{{item.num}}</view>
+                    </block>
+                    <foodSpec item="{{item}}" type="+"
+                              sellerid="{{sellerid}}" orderid="{{orderid}}"
+                              fromSoucre="{{fromSoucre}}" request_uri="{{request_uri}}"
+                              bindfoodSpecCallback="foodSpecCallback">
+                        <view class='add'></view>
+                    </foodSpec>
+                </block>
+            </view>
+        </view>
+        <view  wx:if="{{item_clear_num>0}}" style="padding:0rpx 10rpx;">
+            <text class="food-clear-content">剩{{item_clear_num}}份</text>
+        </view>
+    </view>
+</view>
+

+@import '../../app.wxss';
+.cookWapper{
+  border-radius:4px;
+  position: relative;
+  transform-style: preserve-3d;
+}
+.rotate{
+  transition: transform .5s;
+}
+.true {
+  transform: rotateY(-180deg);
+}
+.fanWapper,.zhengWapper{
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  position: absolute;
+  backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  border-radius:4px;
+  overflow: hidden;
+}
+.fanWapper{
+  background-color: #FEEFF0;
+  transform: rotateY(-180deg);
+}
+.food-name-box{
+  width:100%;padding-left:8px;box-sizing:border-box;
+}
+.food-name{
+  font-weight:bold;text-overflow:ellipsis;white-space: nowrap;
+  width:100%;
+  overflow:hidden;
+}
+.food-card-opt{
+  padding:0 12px;
+  margin-top: -50px;
+  position: relative;
+  height: 50px;
+}
+
+.del-close-image{
+  width:13px;
+  height:13px;
+}
+
+.jiazhengwapper{
+  margin-left: 10rpx;
+  margin-top: 30rpx;
+  width: 250rpx;
+  padding: 5rpx 0;
+  border-radius: 40rpx;
+  border:1px solid #999;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+}
+.t-align-c{
+  padding: 0 10rpx;
+}
+
+.jian,.add{
+  width: 60rpx;
+  height: 60rpx;
+  position: relative;
+}
+.jian::after{
+  position: absolute;
+  content: '';
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  width: 60%;
+  height: 6rpx;
+  background-color: #999;
+  border-radius: 10rpx;
+}
+.add::after{
+  position: absolute;
+  content: '';
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  width: 60%;
+  height: 6rpx;
+  background-color: red;
+  border-radius: 10rpx;
+}
+.add::before{
+  position: absolute;
+  content: '';
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  width: 6rpx;
+  height: 60%;
+  background-color: red;
+  border-radius: 10rpx;
+}
+
+.ptop5 {
+  padding-top:5px;
+}
+.menu-mask-image{
+  position:absolute;
+  top:0px;
+  right:0px;
+  width:13px;
+  height:13px;
+  padding:7px 7px 10px 10px;
+  z-index:10;
+}
+
+.menu-ptop-mark{  width:100%;  height: 13px;  padding-top:0; display: flex}
+.labelListImg{
+  width: 50rpx; height: 30rpx; margin-right: 10rpx;
+}
+
+.hasListModel{
+  /*列表模式*/
+}
+.hasListModel .avatar{
+  width: 138rpx;
+  min-width: 138rpx;
+  height: 140rpx;
+  margin-right: 18rpx;
+  border-radius: 10rpx;
+  overflow: hidden;
+  background-color: #D8D8D8;
+  margin-top: 10rpx;
+}
+.hasListModel .avatar image{
+  width: 100%;
+  height: 100%;
+
+}
+
+.hasListModel .content{
+  overflow: hidden;
+  width: 100%;
+}
+.hasListModel .name{
+  height: 48rpx;
+  line-height:48rpx;
+  font-size: 34rpx;
+  overflow: hidden;
+  text-overflow:ellipsis;
+  white-space: nowrap;
+}
+.hasListModel .desc{
+  height: 34rpx;
+  line-height:34rpx;
+  font-size: 24rpx;
+  overflow: hidden;
+  text-overflow:ellipsis;
+  white-space: nowrap;
+}
+.hasListModel .label{
+  height: 22rpx;
+  line-height:22rpx;
+  overflow: hidden;
+  margin-top: 12rpx;
+  margin-bottom: 4rpx;
+}
+.hasListModel .label .menu-ptop-mark,.hasListModel .label .labelListImg{
+  height: 100%;
+  margin-right: 4rpx;
+}
+.hasListModel .price{
+  height: 40rpx;
+  overflow: hidden;
+  padding:0 10rpx;
+  line-height: 40rpx;
+  font-size: 28rpx;
+}
+.hasListModel .price .flex-ll-bottom{
+  height: 40rpx;
+}
+.hasListModel .price .rmb{
+  /*line-height:26rpx;
+  height:26rpx;
+  font-size: 24rpx;*/
+  margin-right: 10rpx;
+}
+.hasListModel .price .money{
+  /*height: 30rpx;
+  font-size: 28rpx;
+  line-height:30rpx;*/
+}
+
+.hasListModel .food-clear-content{
+  color:#DA331D;
+  background-color: #F4DCD9;
+  padding: 4rpx 10rpx;
+}
+
+.hasListModel .jian,.hasListModel .add{
+  width:36rpx;
+  height: 36rpx;
+  border-radius: 50%;
+}
+.hasListModel .jian{
+  border: 2rpx solid #B4B2B2;
+
+}
+.hasListModel .jian:after{
+  width: 75%;
+  height: 4rpx;
+  background-color: #B4B2B2;
+}
+.hasListModel .add{
+  border: 2rpx solid #E14553;
+  background-color:#E14553;
+}
+.hasListModel .add:after,.hasListModel .add:before{
+  background-color: #fff;
+}
+.hasListModel .add:after{
+  width: 75%;
+  height: 4rpx;
+}
+.hasListModel .add:before{
+  height: 75%;
+  width: 4rpx;
+}
+.hasListModel .t-align-c{
+  margin: 0 10rpx;
+  font-size: 36rpx;
+  font-weight: bold;
+  padding: 0;
+  width: 50rpx;
+  overflow: hidden;
+}

+// component/menu/addDelete.js
+import util from '../../../utils/util';
+import App from '../../../utils/api';
+const {regeneratorRuntime} = global
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        item:{
+            type:Object // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
+        },
+        type:{
+            type:String,
+            default:'+'
+        },
+        sellerid:{
+            type:Number
+        },
+        orderid:{
+            type:Number
+        },
+        fromSoucre:{
+            type:Number,
+            value:0
+        },
+        request_uri:{
+            type:Boolean,
+            value:false,
+        }
+
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        hiddenFoodSpec:true,//加菜规格
+        hiddenFoodSpecReduce:true,//减菜规格
+        selectKind:[{title:'xxxxx'},{title:'yyyyy'}],
+    },
+    ready () {
+
+    },
+    detached(){
+
+    },
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        init(){
+            console.log('food-spec init');
+            this.setData({
+                hiddenFoodSpec:false
+            })
+        },
+        //关闭规格框
+        close:function(){
+            this.setData({
+                hiddenFoodSpec:true,
+                hiddenFoodSpecReduce:true,
+            })
+            //关闭了规格窗口
+            this.triggerEvent('foodSpecCallback',{
+                type:'specWin',
+                value:'hide'
+            });
+        },
+        //构造KindMenu
+        initKindMenu(){
+            return new Promise((success,fail)=>{
+                let price=this.data.item.price;
+                let hasSpec = this.data.item.spec.length>0;
+                let hasPractice = this.data.item.practice.length>0;
+                if(hasSpec || hasPractice){
+                    var specs = this.data.item.spec//规格
+                    var practice = this.data.item.practice//做法
+                    var kind  = []
+                    var foodMenu=[]
+                    if(this.data.type=='-'){
+                        if(specs){
+                            specs.map(function(r,n){
+                                if(r.id){//某规格卖光了 就不显示 && r.clear_num>1
+                                    kind.push({id:r.id,price:r.price,title:r.specs,iskind:false})
+                                }
+                            })
+                        }
+
+                        if(practice) {
+                            practice.map(function (r, n) {
+                                if (r.id) {
+                                    foodMenu.push({id: r.id, price: r.price, title: r.name, iskind: false})
+                                }
+                            })
+                        }
+                        util.rpc(uri.CGI__USER_GETCOOKBOOKSELBYSPECSID,{
+                            sellerid:this.data.sellerid,
+                            orderid: this.data.orderid,
+                            cookbookid: this.data.item.id,
+                            status:this.data.fromSoucre!=''?2:'',//只查没有下单的
+                        }).then(res=>{
+                            this.setData({
+                                selectKind:res.data[0],
+                                hiddenFoodSpecReduce:false,
+                                kind:kind?kind:'',
+                                foodMenu:foodMenu,
+                            })
+                        })
+                    }else{
+                        specs.map(function(r,n){
+                            if ((r.id && r.clear_num > 0) || r.clear_num==null){//某规格卖光了 就不显示 && r.clear_num>1
+                                kind.push({id:r.id,price:r.price,title:r.specs,iskind:false})
+                            }
+                        })
+                        if(kind.length>0){
+                            kind[0].iskind=true;
+                            var kindPrice=kind[0].price;
+                            var specs_id=kind[0].id;
+                        }
+
+                        practice.map(function(r,n){
+                            if(r.id){
+                                foodMenu.push({id:r.id,price:price,title:r.name,iskind:false})
+                            }
+                        })
+
+                        if(foodMenu.length>0){
+                            foodMenu[0].iskind=true;
+                            var foodMenuPrice=foodMenu[0].price;
+                            var practice_id=foodMenu[0].id;
+                        }
+                        util.rpc(uri.CGI__USER_GETCOOKBOOKSELBYSPECSID,{
+                            sellerid:this.data.sellerid,
+                            orderid: this.data.orderid,
+                            cookbookid: this.data.item.id,
+                            status:this.data.fromSoucre!=''?2:'',//只查没有下单的
+                        }).then(res=>{
+                            this.setData({
+                                selectKind:res.data[0],
+                                hiddenFoodSpec:false,
+                                kind:kind,
+                                foodMenu:foodMenu,
+                                showSpecsPrice:false,
+                                cookbook_name:this.data.item.name,
+                                cookbook_id:this.data.item.id,
+                                specs_id:specs_id ? specs_id :'',
+                                practice_id:practice_id ? practice_id : '',
+                                selectPrice:kindPrice>0 ? kindPrice : foodMenuPrice,
+                                add_target:''
+                            })
+                        })
+                    }
+                    success();
+                }else{
+                    fail();
+                }
+            });
+        },
+        //选择规格
+        kindSelect: function (e) {
+            var index = e.currentTarget.dataset.key
+            var specsid = e.currentTarget.id
+            var price = e.currentTarget.dataset.price
+            for (var i = 0; i < this.data.kind.length; i++) {
+                if (i == index) {
+                    this.data.kind[i].iskind = true;
+                } else {
+                    this.data.kind[i].iskind = false;
+                }
+            }
+            var is_show = ''
+            if(this.data.foodMenu==''){
+                is_show=1
+            }else if(specsid && this.data.practice_id){
+                is_show=1
+            }
+            this.setData({
+                kind: this.data.kind,
+                selectPrice:price,
+                specs_id:specsid,
+                foodMenu:this.data.foodMenu?this.data.foodMenu:'',
+                showSpecsPrice:price?false:true,
+                showAdd:is_show?false:true//showAdd:specsid?false:true
+            });
+        },
+        //选择做法
+        menuSelect: function (e) {
+            var index = e.currentTarget.dataset.key
+            var practiceid = e.currentTarget.id
+            var price = e.currentTarget.dataset.price
+            for (var i = 0; i < this.data.foodMenu.length; i++) {
+                if (i == index) {
+                    this.data.foodMenu[i].iskind = true;
+                } else {
+                    this.data.foodMenu[i].iskind = false;
+                }
+            }
+            var is_show = ''
+            if(this.data.kind==''){
+                is_show=1
+            }else if(this.data.specs_id && practiceid){
+                is_show=1
+            }
+            this.setData({
+                foodMenu: this.data.foodMenu,
+                foodMenuPrice:price,
+                practice_id:practiceid,
+                showAdd:is_show?false:true
+            });
+        },
+        //加菜面板
+        addCook:function(e){
+            console.log('addCook',this.data.item,e);
+            var cookbookid = this.data.item.id
+            var price=this.data.item.price;
+
+            this.initKindMenu().then(res=>{
+                //打开了规格窗口
+                this.triggerEvent('foodSpecCallback',{
+                    type:'specWin',
+                    value:'show'
+                });
+            }).catch(res=>{
+                console.log('initKindMenu',res);
+                if( this.data.item.clear_num && this.data.item.clear_num>0
+                    && this.data.item.num+1 > this.data.item.clear_num){
+                    wx.showToast({
+                        title:'该菜品最多能点'+this.data.item.clear_num+'份',
+                        duration:2000,
+                        mask:true,
+                        icon:'none'
+                    });
+                    return;
+                }
+                //通知
+                this.triggerEvent('foodSpecCallback',{
+                    cookbookid:cookbookid,
+                    type:1,
+                });
+                //this.matchArray(cookbookid,1,countTotal,countPirce)
+                util.post(uri.CGI__USER_ADDCRAT,{
+                    orderid: this.data.orderid,
+                    openid:util.cache('openid'),
+                    cookbookid:cookbookid,
+                    price: price,
+                    source: 1,
+                    request_uri: this.data.request_uri == true ? 1 : '',//服务员通过消息通知进来 又加菜的标识
+                    fromSoucre:this.data.fromSoucre?this.data.fromSoucre:'',
+                    identity:util.cache('identity')
+                },uri.CGI__USER_ADDCRAT__CODE,'0','0');
+            });
+        },
+        //减菜面板
+        subtractCook(){
+            console.log('addFunction',this.data.item);
+            var cookbookid = this.data.item.id
+            var price=this.data.item.price;
+            this.initKindMenu().then(res=>{
+                //打开了规格窗口
+                this.triggerEvent('foodSpecCallback',{
+                    type:'specWin',
+                    value:'show'
+                });
+            }).catch(res=>{
+                //通知
+                this.triggerEvent('foodSpecCallback',{
+                    cookbookid:cookbookid,
+                    type:-1,
+                });
+
+                util.post(uri.CGI__USER_REDUCEORDER, {
+                    orderid: this.data.orderid,
+                    openid: getApp().openid,
+                    cookbookid: cookbookid,
+                    //specid: specid ? specid : '',
+                    //practiceid: specid ? specid : '',
+                    fromSoucre: this.data.fromSoucre ? this.data.fromSoucre : '',
+                    request_uri: this.data.request_uri == true ? 1 : '',//服务员通过消息通知进来 又加菜的标识
+                    status:this.data.fromSoucre!=''?2:'',//只查没有下单的
+                    source: 2,
+                }, uri.CGI__USER_REDUCEORDER__CODE, '0', '0');
+            });
+        },
+        //减菜面板加菜按钮
+        add:function(e){
+            console.log('add',util.attr(e,'cookbookid'),e);
+            let index=util.attr(e,'index');
+            let selectKind=this.data.selectKind;
+
+            console.log('selectKind',selectKind,index);
+            let specs=this.data.item.spec;
+            let clear_num=null;
+            specs.forEach(spec=>{
+                if(spec.id==selectKind[index].specid){
+                    clear_num=spec.clear_num;
+                }
+            })
+            if( clear_num && clear_num>0
+                && selectKind[index].foodNum+1 > clear_num){
+                wx.showToast({
+                    title:'该菜品最多能点'+clear_num+'份',
+                    duration:2000,
+                    mask:true,
+                    icon:'none'
+                });
+                return;
+            }
+
+            selectKind[index].foodNum=parseInt(selectKind[index].foodNum)+1;
+            this.setData({selectKind:selectKind});
+            this.formSubmit(e,true);
+        },
+        //减菜面板减菜按钮
+        reduce(e){
+            console.log('reduce',util.attr(e,'cookbookid'),e);
+            var cookbookid = util.attr(e,'cookbookid')
+            var specid = util.attr(e,'specid')
+            var practice_id = util.attr(e,'practiceid')
+            var price = util.attr(e,'price')
+
+            let index=util.attr(e,'index');
+            let selectKind=this.data.selectKind;
+            selectKind[index].foodNum-=1;
+            if(selectKind[index].foodNum<=0){
+                selectKind.splice(index,1);
+            }
+            this.setData({selectKind:selectKind});
+            if(selectKind.length<1){
+                this.close();
+            }
+
+            this.triggerEvent('foodSpecCallback',{
+                cookbookid:cookbookid,
+                type:-1
+            });
+
+            //执行删除操作
+            let params={
+                orderid: this.data.orderid,
+                openid: getApp().openid,
+                cookbookid: cookbookid,
+                fromSoucre: this.data.fromSoucre ? this.data.fromSoucre : '',
+                status:this.data.fromSoucre?2:'',//只查没有下单的
+                request_uri: this.data.request_uri == true ? 1 : '',//服务员通过消息通知进来 又加菜的标识
+                source: 2,
+            };
+            if(specid>0){
+                params.specid=specid;
+            }
+            if(practice_id>0){
+                params.practiceid=practice_id;
+            }
+            util.post(uri.CGI__USER_REDUCEORDER, params, uri.CGI__USER_REDUCEORDER__CODE, '0', '0');
+        },
+        /**
+         *
+         * @param e
+         * @param subtractCook 减菜面板
+         */
+        formSubmit(e,subtractCook=false){
+            if(subtractCook){//减菜面板
+                var cookbookid = util.attr(e,'cookbookid')
+                var specid = util.attr(e,'specid')
+                var practice_id = util.attr(e,'practiceid')
+                var price = util.attr(e,'price')
+            }else{
+                var cookbookid = util.val(e,'cookbookid')
+                var specid = util.val(e,'specs_id')
+                var practice_id = util.val(e,'practice_id')
+                var price = util.val(e,'price')
+                if(this.data.selectPrice){
+                    console.log(666666,this.data.selectPrice)
+                    price=this.data.selectPrice
+                }else{
+                    console.log('yyyyyy',this.data.foodMenuPrice)
+                    price=this.data.foodMenuPrice
+                }
+                this.close();
+            }
+            console.log('formSubmit',specid,practice_id,price)
+
+
+            let selectKindNum=0;
+            if(this.data.selectKind){
+                this.data.selectKind.forEach((kind)=>{
+                    if(kind.specid==specid){
+                        selectKindNum=kind.foodNum
+                    }
+                })
+            }
+            console.log('selectKindNum',this.data.selectKind,selectKindNum);
+            if(selectKindNum>0){
+                let clear_num=null;
+                let specs=this.data.item.spec;
+                specs.forEach(spec=>{
+                    if(spec.id==specid){
+                        clear_num=spec.clear_num;
+                    }
+                })
+                if( clear_num && clear_num>0
+                    && selectKindNum+1 > clear_num){
+                    wx.showToast({
+                        title:'该菜品最多能点'+clear_num+'份',
+                        duration:2000,
+                        mask:true,
+                        icon:'none'
+                    });
+                    return;
+                }
+            }
+
+
+            this.triggerEvent('foodSpecCallback',{
+                cookbookid:cookbookid,
+                type:1
+            });
+            let param={
+                orderid: this.data.orderid,
+                openid:util.cache('openid'),
+                cookbookid:this.data.item.id,
+                price: price,
+                source: 1,
+                request_uri: this.data.request_uri==true?1:'',//服务员通过消息通知进来 又加菜的标识
+                fromSoucre:this.data.fromSoucre?this.data.fromSoucre:'',
+                identity:util.cache('identity')
+            }
+            if(specid>0){
+                param.specid=specid;
+            }
+            if(practice_id>0){
+                param.practiceid=practice_id;
+            }
+            util.post(uri.CGI__USER_ADDCRAT,param,uri.CGI__USER_ADDCRAT__CODE,'0','0');
+        },
+        //清除订单下某菜品所有数量
+        clean(){
+            let cookbookid=this.data.item.id
+            this.triggerEvent('foodSpecCallback',{
+                cookbookid:cookbookid,
+                type:this.data.item.num*-1
+            });
+            util.post(uri.CGI__USER_CLEARCOOKBYID,{
+                orderid: this.data.orderid,
+                sellerid: this.data.sellerid,
+                cookbookid:cookbookid
+            },uri.CGI__USER_CLEARCOOKBYID__CODE,'0','0');
+        }
+    }
+})

+{
+  "component": true,
+  "usingComponents": {}
+}

+<view bindtap="{{type=='-'?'subtractCook':(item.clear_num==0 ? '' : 'addCook')}}">
+    <slot></slot>
+</view>
+<view hidden="{{hiddenFoodSpec}}" class="hiddenFoodSpec">
+    <view class="toast-mask"></view>
+    <view class="toast-content">
+        <form bindsubmit="formSubmit">
+            <input value="{{cookbook_id}}" name="cookbookid" hidden="true"/>
+            <view class="toast-content-title">{{cookbook_name}}</view>
+            <block wx:if="{{kind.length>0}}">
+                <view class="toast-content-kind" style="margin-bottom:{{foodMenu.length==0 ? '80rpx' : '0rpx'}}">
+                    <view class="toast-kind-title">规格</view>
+                    <view class="toast-kind-menu">
+                        <view class="toast-kind-single {{item.iskind==true?'kind-active':''}}" wx:for="{{kind}}" wx:key="kind-key" data-key="{{index}}" id="{{item.id}}" data-price="{{item.price}}" bindtap="kindSelect">{{item.title}}</view>
+                        <input value="{{specs_id}}" name="specs_id" hidden="true"/>
+                        <input value="{{selectPrice}}" name="price" hidden="true"/>
+                    </view>
+                </view>
+            </block>
+            <block wx:if="{{foodMenu.length>0}}">
+                <view class="toast-content-kind" style="margin-bottom:{{kind.length==0 ? '235rpx' : '40rpx'}};">
+                    <view class="toast-kind-title">做法</view>
+                    <view class="toast-kind-menu">
+                        <view class="toast-kind-single {{item.iskind==true?'kind-active':''}}" wx:for="{{foodMenu}}" wx:key="foodmenu-key" data-key="{{index}}" id="{{item.id}}" data-price="{{item.price}}" bindtap='menuSelect'>{{item.title}}</view>
+                        <input value="{{practice_id}}" name="practice_id" hidden="true"/>
+                    </view>
+                </view>
+            </block>
+            <block wx:else>
+                <view class="toast-content-kind" style="height:73px;">
+                </view>
+            </block>
+            <view class="toast-content-end">
+                <view class="toast-content-money" hidden="{{showSpecsPrice}}">￥{{selectPrice}}</view>
+                <button class="toast-content-add" formType="submit" hidden="{{showAdd}}">确定</button>
+            </view>
+        </form>
+        <image class="toast-content-close" bindtap="close" src="http://qn.colorcun.com/custom/lite/image/close.png" background-size="cover"></image>
+    </view>
+</view>
+<view hidden="{{hiddenFoodSpecReduce}}" class="hiddenFoodSpec">
+    <view class="reduce-mask"></view>
+    <view class="reduce-conent">
+        <view class="reduce-content-title">{{item.name}}</view>
+        <view class="reduce-content-list">
+            <view class='reduce-content-large' wx:for="{{selectKind}}" wx:key="selectKind-key" wx:for-item="kindItem">
+                <view class="reduce-list-title">{{kindItem.title?kindItem.title:''}}{{kindItem.title?':':''}}{{kindItem.ptitle?kindItem.ptitle:''}}</view>
+                <view class="reduce-list-info flex-rr">
+                    <image class="reduce-list-reduce reduce-list-first" data-index="{{index}}" data-cookbookid="{{kindItem.cookbookid}}" data-practiceid="{{kindItem.practiceid}}" data-specid="{{kindItem.specid}}" data-price="{{kindItem.price}}" bindtap="reduce" src="http://qn.colorcun.com/custom/lite/image/subtractCook.png" style="padding-right:18rpx;"></image>
+                    <view class="reduce-list-reduce">{{kindItem.foodNum}}</view>
+                    <image class="reduce-list-reduce reduce-list-last" data-index="{{index}}" data-cookbookid="{{kindItem.cookbookid}}" data-practiceid="{{kindItem.practiceid}}" data-specid="{{kindItem.specid}}" data-price="{{kindItem.price}}" bindtap='add' src="http://qn.colorcun.com/custom/lite/image/add.png"></image>
+                </view>
+            </view>
+        </view>
+        <image src="http://qn.colorcun.com/custom/lite/image/close.png" class="reduce-close" bindtap="close"></image>
+    </view>
+</view>

+@import '../../app.wxss';
+.hiddenFoodSpec{
+
+}
+.toast-mask{
+  position: fixed;
+  z-index: 9998;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.7);
+}
+.toast-content{
+  width:542rpx;
+  min-height: 300px;
+  height:auto;
+  background: #fff;
+  border-radius: 10rpx;
+  position: fixed;
+  top: 35%;
+  left:0;
+  right:0;
+  margin:0 auto;
+  margin-top:-150px;
+  z-index: 9999;
+  /* overflow: hidden; */
+}
+.toast-content-title{
+  width: 100%;
+  padding-top: 20px;
+  color:#353535;
+  font-size:16px;
+  text-align: center;
+}
+.toast-content-kind{
+  width: 100%;
+  height: auto;
+  padding:0 19rpx;
+  box-sizing: border-box;
+  padding-top: 20px;
+}
+.toast-kind-title{
+  width: 100%;
+  color:#353535;
+  font-size:16px;
+  padding-left:19rpx;
+  box-sizing:border-box;
+}
+.toast-kind-menu{
+  width: 100%;
+  height: auto;
+  box-sizing: border-box;
+  padding-bottom:10px;
+}
+.toast-kind-menu:after{
+  width:0;
+  height:0;
+  content:'';
+  display:block;
+  clear:both;
+}
+.toast-kind-single{
+  float:left;
+  width: 130rpx;
+  height: 25px;
+  border:1px solid #ccc;
+  box-sizing: border-box;
+  color:#353535;
+  font-size:14px;
+  line-height: 23px;
+  text-align: center;
+  margin:0 19rpx;
+  margin-top: 10px;
+}
+.toast-kind-single:last-child{
+  margin-right: 0;
+}
+.toast-content-end{
+  width: 100%;
+  height: 57px;
+  padding:15px 38rpx;
+  box-sizing: border-box;
+  margin-top: 22px;
+  background: #f2f2f2;
+  border-bottom-left-radius: 6px;
+  border-bottom-right-radius: 6px;
+}
+.toast-content-money{
+  float: left;
+  color: #e14553;
+  font-size:17px;
+  line-height: 28px;
+}
+.toast-content-add{
+  float: right;
+  width: 95px;
+  height: 28px;
+  background: #e14553;
+  border-radius:28px;
+  color: #fff;
+  font-size:13px;
+  line-height: 28px;
+  text-align: center;
+}
+.toast-kind-single.kind-active{
+  border:1px solid #e14553;
+  color:#e14553;
+}
+.toast-content-close{
+  width: 60rpx;
+  height: 60rpx;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom:-140rpx;
+  margin:0 auto;
+  background: transparent;
+}
+
+/*删除规格遮罩*/
+.reduce-mask{
+  position: fixed;
+  z-index: 9998;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.7);
+}
+.reduce-conent{
+  width:570rpx;
+  min-height: 430rpx;
+  height:auto;
+  background: #fff;
+  padding-bottom:40rpx;
+  border-radius: 10rpx;
+  position: fixed;
+  top: 50%;
+  left:0;
+  right:0;
+  margin:0 auto;
+  margin-top:-400rpx;
+  z-index: 9999;
+  /* overflow: hidden; */
+}
+.reduce-content-title{
+  width: 100%;
+  padding-top: 40rpx;
+  color:#353535;
+  font-size:16px;
+  text-align: center;
+}
+.reduce-content-list{
+  width: 100%;
+  height: auto;
+  padding:0 38rpx;
+  box-sizing: border-box;
+
+}
+.reduce-content-large{
+  width: 100%;
+  height: 25px;
+  padding-top: 50rpx;
+}
+.reduce-list-title{
+  float:left;
+  padding:0 26rpx;
+  height: 25px;
+  border:1rpx solid #ccc;
+  box-sizing: border-box;
+  color:#353535;
+  font-size:14px;
+  line-height: 25px;
+  text-align: center;
+}
+.reduce-list-info{
+  height: 25px;
+  line-height: 25px;
+}
+.reduce-list-reduce{
+  padding:0 10rpx;
+  font-size:32rpx;
+  line-height: 25px;
+  text-align: center;
+}
+.reduce-list-first{
+  width:15px;
+  height:2px;
+  background:#fff;
+}
+.reduce-list-last{
+  width:15px;
+  height:15px;
+  background:#fff;
+}
+.reduce-close{
+  width: 60rpx;
+  height: 60rpx;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom:-140rpx;
+  margin:0 auto;
+  background: transparent;
+}

+.icon,.icon-s,.icon-m,.icon-l{
+  background-repeat: no-repeat;
+  height: 16px;
+  width:16px;
+  display: block;
+  margin: 5px;
+  background-size: 100%;   background-repeat: no-repeat;
+}
+.icon-jiantou{
+  width:8px;
+  height:13px;
+  margin:0;
+  margin-left:5px;
+}
+.icon-12{
+  height: 12px;
+  width: 12px;
+}
+.icon14{
+  height: 14px;
+  width: 14px;
+}
+.icon15{
+  height: 15px;
+  width: 15px;
+}
+.subtractCook{
+  height: 3px;
+  width: 15px;
+}
+.icon-s{
+  height: 18px;
+  width:18px;
+}
+.icon24{
+     height: 24px;
+     width:24px;
+}
+.icon28{
+  height: 28px;
+  width:28px;
+}
+.icon-ml{
+     height: 26px;
+     width:26px;
+}
+.icon-l{
+    height: 32px;
+    width:32px;
+}
+.icon64{
+    height: 64px;
+    width:64px;
+}
+.icon-membercard{
+  background: url(http://qn.colorcun.com/wechat/app/images/icon_card.jpg);
+  background-size: 100%;   background-repeat: no-repeat;
+  height:100%;
+}

 // cookbook/index.js
 // cookbook/index.js
+import util from '../../utils/util';
+import App from '../../utils/api';
+const {regeneratorRuntime} = global
 Page({
 Page({
 
 
     /**
     /**
      * 页面的初始数据
      * 页面的初始数据
      */
      */
     data: {
     data: {
-
+      scrollTop:0,
+      isloading:true,
+      toView:"",
+      hasEnter:false,
+
+      totalWidth:getApp().system.windowWidth,
+      singleWidth:parseInt((getApp().system.windowWidth*0.92-16)/2),
+      totalHeight:getApp().system.windowHeight,
+      kindHeight:getApp().system.windowHeight-68,
+      hasListModel:true,
+
+      cookbooklist:[{},{},{},{},{},{},{},],
+      showSkeleton: true
     },
     },
 
 
     /**
     /**
      * 生命周期函数--监听页面加载
      * 生命周期函数--监听页面加载
      */
      */
     onLoad: function (options) {
     onLoad: function (options) {
-
+        this.getCookList();
     },
     },
 
 
     /**
     /**
@@ -26,7 +41,12 @@ Page({
      * 生命周期函数--监听页面显示
      * 生命周期函数--监听页面显示
      */
      */
     onShow: function () {
     onShow: function () {
-
+      this.setData({
+        totalWidth:getApp().system.windowWidth,
+        singleWidth:parseInt((getApp().system.windowWidth*0.92-16)/2),
+        totalHeight:getApp().system.windowHeight,
+        kindHeight:getApp().system.windowHeight-68
+      })
     },
     },
 
 
     /**
     /**
@@ -62,5 +82,110 @@ Page({
      */
      */
     onShareAppMessage: function () {
     onShareAppMessage: function () {
 
 
+    },
+  formatCookList(list){
+    //原栏目下显示
+    let hasShowClass=false;
+
+    //菜单中展示沽清的菜品
+    let hasClearCookbook=false;
+
+    //十道必选菜
+    let has10CaiOpen=false;
+    let flist=[];
+    if(list.length>0) {
+      has10CaiOpen=list[0].status==1;
+      list.forEach(function (cate, i) {
+        if (cate.status == 1 && cate.cookbooklist[0].length > 0) {
+          let cooks=[];
+          //let cooks_order=[];
+          cate.cookbooklist[0].forEach(function(cook,n){
+            if(cook.status==1){
+              let flag=true;
+              if(has10CaiOpen){
+                if(cate.class_type==2 && !hasShowClass && flist.length>0 && flist[0].class_type==1){
+                  for(let fi=0;fi<flist[0].cookbooklist[0].length;fi++){
+                    if(flist[0].cookbooklist[0][fi].id==cook.id){
+                      flag=false;
+                      break;
+                    }
+                  }
+                }
+              }
+              cook.item_clear_num=cook.clear_num;
+              if(!hasClearCookbook){//不显示卖光了
+                let item_clear_num=cook.clear_num;
+                if(cook.spec){
+                  let clear_num=null;
+                  cook.spec.forEach(spec=>{
+                    if(spec.clear_num==0){
+                      clear_num=0;
+                    }else{
+                      clear_num=null;
+                    }
+                  })
+                  if(clear_num==0){
+                    item_clear_num=0;
+                  }
+                }
+                cook.item_clear_num=item_clear_num;
+                if(item_clear_num==0){
+                  flag=false;
+                }
+              }
+
+              if(flag){
+                cooks.push(cook);
+                //cooks_order.push(cook.order_o);
+              }
+
+            }
+          })
+          if(cooks.length>0){
+            //cooks 排序...
+
+            cate.cookbooklist[0]=cooks;
+            flist.push(cate)
+          }
+        }
+      })
+    }
+    return flist;
+  },
+  getCookList:function(orderid){
+    let param={
+      sellerid: 80,
+      //status:this.data.fromSoucre!=''?1:'',
+      identity:1
+    };
+    if(orderid){
+      param.orderid=orderid;
     }
     }
+    App.Cookbook.GetCookbookByClass(param).then(json=>{
+      //菜单分类添加修饰
+      let cookbooklist = this.formatCookList(json.data[0].list);
+      setTimeout(()=>{
+        this.setData({
+          cookbooklist: cookbooklist,
+          countPirce:json.data[0].countPirce ? json.data[0].countPirce : 0,
+          countTotal:json.data[0].countTotal ? json.data[0].countTotal : 0,
+          isloading:false,
+          showSkeleton:false,
+        })
+      },1000)
+
+    }).catch(res=>{
+      console.log('getCookList-catch',res);
+      this.selectComponent("#network").show('网络不给力，请检查网络后重试');
+    });
+  },
+  //菜品分类操作
+  changeList: function (e) {
+    var _id=e.detail.id;
+    console.log('changeList','inToView' + _id)
+    this.setData({
+      toView: 'inToView' + _id,
+    });
+
+  },
 })
 })

-{}
+{
+  "backgroundTextStyle": "light",
+  "navigationBarBackgroundColor": "#4c4e4f",
+  "navigationBarTextStyle": "black",
+  "usingComponents": {
+    "foodCard": "../components/food-card/food-card",
+    "cookClass": "../components/cook-class/cook-class",
+    "nav":"/components/nav/nav"
+  }
+}

 <!--cookbook/index.wxml-->
 <!--cookbook/index.wxml-->
-<text>cookbook/index.wxml</text>
+<nav>提前点菜</nav>
+<loading wx:if="{{isloading}}">数据加载中</loading>
+<view class="{{hasListModel?'page-list flex-ll-top':'page'}}" wx:if="{{!isloading}}">
+    <!--第四部分  原始菜无图或有图展示-->
+    <scroll-view
+            scroll-y class = "partfour list-model"
+            style = "height:{{totalHeight}}px;width:100%;z-index:{{scrollZindex}}; position: fixed;"
+            scroll-into-view = "{{toView}}"
+            scroll-with-animation
+    >
+        <view style = "padding-left:180rpx;">
+            <view class="section" wx:for="{{cookbooklist}}" wx:key="cookbooklist-key">
+                <view id="{{'inToView'+item.id}}"></view>
+                <view class="list-model-masonry" >
+                    <view class="list-model-column">
+                        <block wx:for="{{item.cookbooklist[0]}}" wx:key="{{item.id}}" wx:for-index="itemIndex" >
+                            <view class="item">
+                                <foodCard item="{{item}}"
+                                          sellerid="{{sellerid}}" orderid="{{orderid}}"
+                                          fromSoucre="{{fromSoucre}}" request_uri="{{request_uri}}"
+                                          bindfoodCardCallback="foodCardCallback"
+                                          hasListModel="{{hasListModel}}"
+                                ></foodCard>
+                            </view>
+                        </block>
+                    </view>
+                </view>
+            </view>
+            <view style="height: 80px;width: 100%;"></view>
+        </view>
+    </scroll-view>
+    <view class="white flex-lr" style="position:fixed;bottom:0px;width:100%;padding:5px 0;z-index:2000;height:58px;">
+
+        <view class="body-view">
+
+        </view>
+        <view class="shopping-total flex-vc list-layout-buttom-opt">
+
+            <image src="http://qn.colorcun.com/custom/lite/image/cook-list-gwc.png" class="icon" />
+            <view style="color:#fff;font-size:24rpx;margin-top:-2px;text-align:center;" class="smooth">下单</view>
+            <block wx:if="{{countTotal>0}}">
+                <view class="show-num fwhite flex-cc smooth">{{countTotal}}</view>
+            </block>
+            <button bindgetuserinfo="bindChooseOk" open-type="getUserInfo" class="shop-button"></button>
+            <bubble id="bubble"></bubble>
+        </view>
+
+        <!--只有点菜后才显示点好了按钮-->
+    </view>
+</view>
+
+<cookClass id="menu" bind:changeList="changeList"
+           cooklist="{{cookbooklist}}" hasListModel="{{hasListModel}}">
+</cookClass>

-/* cookbook/index.wxss */
+/* cookbook/index.wxss */
+@import "../components/food-card/food-card.wxss";
+.page{
+  background:#4c4e4f;
+}
+
+.ptop3{
+  padding-top:3px;
+}
+.menu-operation{
+  width: 100%;
+  height: 57rpx;
+  padding:0 45rpx;
+  padding-top: 20rpx;
+  box-sizing: border-box;
+}
+/*菜品标签*/
+.menu-ptop-mark{  width:100%;  height: 13px;  padding-top:12px;}
+.menu-recommand-image{  float:left;  width:36px;  height:18px; margin-right:8rpx;}
+.menu-descration-circle{
+  width:10rpx;
+  height:10rpx;
+  border-radius:50%;
+  background:#fff;
+}
+.menu-descration-line{
+  width:65rpx;
+  height:3rpx;
+  background:#fff;
+}
+/*菜单分类*/
+.menu{
+  position: fixed;
+  top:0;
+  left:0;
+  bottom:0;
+  right:0;
+  background:#e14553;
+  z-index:1000;
+}
+.menu-active{
+  padding-bottom:10rpx;
+  border-bottom:4rpx solid #fff;
+  font-weight: bold;
+}
+
+
+.shopping-total{
+  width:110rpx;
+  height:99rpx;
+  position:relative;
+}
+.shop-button{
+  position:absolute;
+  width:100%;
+  height:100%;
+  left:0;
+  top:0;
+  background:transparent;
+}
+.show-num{
+  width:36rpx;
+  height:36rpx;
+  position:absolute;
+  right:10rpx;
+  top:2rpx;
+  background:#e14553;
+  font-size:20rpx;
+  border-radius:50%;
+}
+.menu-fixed{
+  position:fixed;
+  bottom:12px;
+  left:10px;
+  width:80rpx;
+  height:80rpx;
+  padding:5rpx;
+  box-sizing:border-box;
+  z-index:1001;
+}
+.menu-fixed-image{
+  width:48rpx;
+  height:48rpx;
+  margin-right:4%;
+}
+.menu-fixed-taomei{
+  width:68rpx;
+  height:68rpx;
+  margin-right:4%;
+}
+.menu-fixed-image-close{
+  width:70rpx;
+  height:70rpx;
+}
+.countTotal{
+  width:48rpx;
+  height:48rpx;
+  background-color:#4C4E4F;
+  margin-right:5px;
+}
+.flex-cc text{
+  font-size:32rpx;
+  color:#fff;
+}
+
+
+
+.masonry { display: flex; flex-direction: row; }
+.section:last-child{
+  margin-bottom: 60px;
+}
+.column { display: flex; flex-direction: column; width: 50%; max-width:50%;  }
+.column-space { width: 20px; }
+.column .item{margin-bottom: 20px;width:100%; overflow: hidden; border-radius: 10rpx;}
+
+/**
+ 列表模式
+ */
+.page-list{
+  background-color: #FEFEFE;
+}
+.list-model{
+  position: static;
+}
+.list-model .item{
+  border-radius: 0rpx;
+  border-bottom: 2rpx solid #F5F5F5;
+  padding-bottom: 28rpx;
+  margin-top: 14rpx;
+}
+.list-layout-buttom-opt{
+  background-color: #353535;
+  border-radius: 50%;
+  width: 120rpx;
+  height: 120rpx;
+  min-width: 120rpx;
+  margin: 0 80rpx 40rpx;
+  box-shadow: 0rpx 4rpx 8rpx #353535;
+}
+.list-layout-buttom-opt .icon{
+  width: 44rpx;
+  height: 44rpx;
+}
+
+
+/**index.wxss**/
+.skeleton .left{
+  width: 180rpx;
+}
+.skeleton .right{
+  width: 100%;
+  padding-left: 20rpx;
+}
+.skeleton .left .left-menu{
+  width: 180rpx;
+  height: 160rpx;
+  margin-bottom: 2rpx;
+}
+.skeleton .right .right-card{
+  width: 100%;
+  height: 300rpx;
+  margin-bottom: 10rpx;
+}

@@ -30,7 +30,7 @@
 			"list": []
 			"list": []
 		},
 		},
 		"miniprogram": {
 		"miniprogram": {
-			"current": 6,
+			"current": 25,
 			"list": [
 			"list": [
 				{
 				{
 					"id": 0,
 					"id": 0,
@@ -222,6 +222,11 @@
 					"pathName": "pages/book/setting/sms_buy",
 					"pathName": "pages/book/setting/sms_buy",
 					"query": "",
 					"query": "",
 					"scene": "1001"
 					"scene": "1001"
+				},
+				{
+					"id": -1,
+					"name": "pack-cookbook/pages/index",
+					"pathName": "pack-cookbook/pages/index"
 				}
 				}
 			]
 			]
 		}
 		}

@@ -95,4 +95,7 @@ export default {
       alias:'App.Pay.WxPaySub',
       alias:'App.Pay.WxPaySub',
     },
     },
 
 
+    //菜品列表
+  'App.Cookbook.GetCookbookByClass':null,
+
 }
 }