jili2/application/h5/view/wx_book_dinner/tc.html

{include file="../application/h5/view/wx_book_dinner/header.html"}
<script src="/static/elementui2.15.5/vue-2.6.14.js"></script>
<style type="text/css">
    .icon-center{
        display: block;
        font-size:20px;
        text-align: center;
    }
    .weui-header .weui-header-left, .weui-header .weui-header-right {
        position: absolute;
        top: 14px;
        display: block;
        font-size: 12px;
        line-height: 21px;
        color: #FFF;
    }
    .weui_tab_bd{
        /*-webkit-overflow-scrolling: touch;*/
    }
    .weui-navigator-list2{
        background-color: #ffffff;
        border: 1px solid #6eb7ff;
        border-radius: 1vw;
    }
    .weui-navigator-list2 li{
        width: 45vw;
        background-color: #ffffff;
        border-radius: 1vw;
    }
    .weui-navigator-list2 li.weui-state-active1{
        background-color: #6eb7ff;
        color: #ffffff !important;
    }
    .weui-navigator-list2 li.weui-state-hover, .weui-navigator-list2 li.weui-state-active a:after {
        display: none;
    }
    .weui-navigator-list2 li.weui-state-hover, .weui-navigator-list2 li.weui-state-active a {
        color: #ffffff!important;
    }
    .wsss a{
        color: #ffffff !important;
    }

</style>
<style>
    .weui_tab_bd{
        background-color: #ffffff;
        position: relative;
    }
    .leftbox{
        position: absolute;
        z-index: 10;
        left: 0;
        top: 0;
        bottom: 10vh;
        width: 25vw;
        height: auto;
        background-color: #eee;
    }
    .leftbox .leftbox-nav{
        width: 100%;
        height: 50px;
        line-height: 50px;
        text-align: center;
    }
    .leftbox .leftbox-nav.cur{
        background-color: #ffffff;
    }
    .leftbox .leftbox-nav:hover{
        background-color: #ffffff;
    }
    .mainbox{
        position: absolute;
        z-index: 10;
        left: 25vw;
        top: 0;
        bottom: 10vh;
        width: 75vw;
        overflow: auto;
        margin-bottom: 100px;
        padding: 10px;
        padding-top: 8vh;
    }

    .tcbox{
        margin-bottom: 10px;
    }
    .tcbox .tcheader{
        font-size: 16px;
        font-weight: bold;
    }
    .tcbox .tclist{
        position: relative;
        padding: 10px 0;
        overflow: auto;
        border-bottom:1px solid #eeeeee;
    }
    .tcbox .tclist .tcimg{
        width: 15vw;
        height: 15vw;
        object-fit: cover;
        float: left;
    }
    .tcbox .tclist .tcbody{
        width: 56vw;
        height: auto;
        float: left;
        padding: 0 2vw;
    }
    .tcbox .tclist .tctitle{
        font-size: 16px;
        font-weight: 500;
    }
    .tcbox .tclist .tcdesc{
        font-size: 14px;
        vertical-align: middle;
    }
    .tcbox .tclist .tcdesc{
        vertical-align: middle;
    }
    .tcbox .tclist .tcdesc img{
        width: 26px;
        height: 26px;
        margin-right: 30px;
        /*margin-top: 5px;*/
        cursor: pointer;
        vertical-align: middle;
    }
    .tcbox .tclist .tcdesc img.tcmins{
        margin-right: 0;
    }
    .tcbox .tclist .tcdesc img.tcplus{
        margin-right: 20px;
    }

    .tcbox .tclist .tcdesc .tcbtn .tcnums{
        display: inline-block;
        padding: 0 5px;
        height: 31px;
        line-height: 31px;
        vertical-align: middle;
    }

    .tcbox .tclist .tcdesc .tcbtn{
        position: absolute;
        z-index: 11;
        right: 0px;
        bottom: 5px;
        display: inline-block;
        width: 200px;
        height: 31px;
        vertical-align: middle;
        text-align: right;
        /*font-size: 18px;*/
        /*margin-bottom: 10px;*/
    }
    .bottombox{
        position: fixed;
        z-index: 20;
        height: 10vh;
        line-height: 10vh;
        bottom: 0;
        left: 0;
        right: 0;
        border-top: 1px solid #eeeeee;
        background-color: #ffffff;
        padding-left: 3vw;
    }
    .bottombox .bottombox-btn{
        position: fixed;
        z-index: 21;
        bottom: 0;
        right: 0;
        width: 30vw;
        height: 10vh;
        background-color: #6eb7ff;
        color: #ffffff;
        text-align: center;
    }

    .sgroup{
        position: absolute;
        top: 0;
        left: 25vw;
        right: 0;
        height: 7vh;
        line-height: 7vh;
        background-color: #ffffff;
        font-size: 18px;
        font-weight: bold;
        z-index: 1000;
        padding: 0 10px;
        border-bottom: 1px solid #e5e5e5;
    }

    .groupbox{
        width: 100%;
        height: auto;
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5;
    }
    .groupbox .groupbox-list{
        padding: 10px 20px;
        border-bottom: 1px solid #e5e5e5;
        font-size: 18px;
        text-align: center;
    }
</style>
<div id="vueapp" class="weui_tab tab-bottom">
    <div class="weui-header">
        <div class="bg-blue">
            <div class="weui-header-left"></div>
            <h1 class="weui-header-title"><a href="javascript:;">{$user.HospitalName}<span class="icon icon-74"></span></a></h1>
            <div class="weui-header-left">
                <a style="color:#fff;" href="{:url('order')}">我的</a>
            </div>
            <div class="weui-header-right">
                <a style="color:#fff;" href="{:url('index')}">普通点餐</a>
            </div>
        </div>
        <div id="tagnav1" class="weui-navigator weui-navigator-wrapper" style="margin-top: 10px;margin-bottom: 10px;background-color: transparent;">
            <ul class="weui-navigator-list weui-navigator-list2">
                <li {if $week == 0}class="weui-state-active1 wsss"{/if}>
                    <a href="{:url('tc',['week'=>0])}">本周</a>
                </li>
                <li {if $week == 1}class="weui-state-active1 wsss"{/if}>
                    <a href="{:url('tc',['week'=>1])}">下周</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="weui_tab_bd" v-if="groupid === 0">
        <div style="padding: 10px 20px; font-size: 14px;">
            请选择套餐,每周只能选择一种套餐 <span style="color: red;">(注意：出院当天若不退伙自费84.3元)</span>
        </div>
        {if count($days) > 0 && count($groups) > 0}

        <div class="groupbox">
            <div v-for="(item,index) in groups" :key="index" @click="changeGroup(item)" class="groupbox-list" >{{item.title}}</div>
        </div>
        {else /}
        <div style="padding: 10px 20px; font-size: 14px;text-align: center;">
            暂无套餐
        </div>
        {/if}
    </div>
    <div class="weui_tab_bd" v-if="groupid > 0">
        <div class="leftbox">
            <template v-for="(item,index) in curdays">
                <div v-if="index === typeidx" :key="index" @click="changeDay(index)" class="leftbox-nav cur">{{item.text}}<span v-if="item.count > 0" class="weui-badge">{{item.count}}</span></div>
                <div v-if="index !== typeidx" :key="index" @click="changeDay(index)" class="leftbox-nav">{{item.text}}<span v-if="item.count > 0" class="weui-badge">{{item.count}}</span></div>
            </template>
        </div>
        <div class="sgroup">{{grouptitle}}  <span v-if="curdaymoney > 0" style="color: red;">￥{{curdaymoney}}</span> <a href="javascript:;" @click="rechangeGroup()" style="float:right;">切换</a></div>
        <div class="mainbox">
            <template v-for="(item,idx) in curtypes">
                <div v-if="curdinners.length > 0" :key="idx" class="tcbox">
                    <div class="tcheader" v-if="item.limit > 0">{{item.name}}（最多选{{item.limit}}种）</div>
                    <div class="tcheader" v-if="item.limit <= 0">{{item.name}}</div>


                    <template v-for="(item2,idx2) in item.dinners">
                        <div :key="idx2" class="tclist">
                            <img onerror="this.src='/img/mrbg.png'" :src="item2.imgs" class="tcimg" alt="" />
                            <div class="tcbody">
                                <div class="tctitle" v-if="item2.ctitle">[{{item2.ctitle}}]{{item2.name}}</div>
                                <div class="tctitle" v-if="!item2.ctitle">{{item2.name}}</div>
                                <div class="tcdesc">
                                    <span>￥{{item2.money}} <span v-if="item2.required" class="weui-badge">必选</span></span>
                                    <div class="tcbtn">
                                        <img v-if="item2.nums > 0" src="/static/mobile/img/minus-circle.png" @click="changeDinner(item2,1)" class="tcmins" alt="">
                                        <div v-if="item2.nums > 0" class="tcnums">{{item2.nums}}</div>
                                        <img src="/static/mobile/img/add-circle.png" @click="changeDinner(item2,0)" class="tcplus" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </template>
                </div>
            </template>


            <div class="tcbox" style="display: none;">
                <div class="tcheader">套餐B</div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="tcbox" style="display: none;">
                <div class="tcheader">套餐C</div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
                <div class="tclist">
                    <img src="http://gt60.demo.com/uploads/u1/files/20230403/298184647e743f3f50352391be77783a.jpg" class="tcimg" alt="">
                    <div class="tcbody">
                        <div class="tctitle">【早餐】西红柿鸡蛋</div>
                        <div class="tcdesc">
                            <span>￥2</span>
                            <span class="tcbtn">
                                <svg t="1680501834288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3863" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#666666" p-id="3864"></path><path d="M682.666667 480h-138.666667V341.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v138.666667H341.333333c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h138.666667V682.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32v-138.666667H682.666667c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" fill="#666666" p-id="3865"></path></svg>
                                <!--                                <svg t="1680501789601" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3642" width="64" height="64"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" fill="#6eb7ff" p-id="3643"></path><path d="M701.866667 381.866667L448 637.866667 322.133333 512c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l149.333334 149.333333c6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l277.333333-277.333333c12.8-12.8 12.8-32 0-44.8-14.933333-12.8-36.266667-12.8-49.066666-2.133333z" fill="#6eb7ff" p-id="3644"></path></svg>-->
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="bottombox">
            <span>总金额：￥{{money}}  </span>
<!--            <span>实收：￥0</span>-->
            <div class="bottombox-btn" @click="settlement">去结算</div>
        </div>
    </div>

</div>


<script>
    var weeks = [];
    var groups = JSON.parse('{:json_encode($groups)}');
    var standard = {$standard};
    var standardmin = {$standardmin};
    var vm = new Vue({
        el: '#vueapp',
        data: {
            weekidx: 0,
            weeks: weeks,
            groups: groups,
            // curdays: weeks[0]['days'],
            curdays: [],
            day: '',
            curdaymoney: '',
            typeidx: 0,
            // curtypes: weeks[0]['days'][0]['types'],
            curtypes: [],
            curdinners: [], // 当前套餐的所有商品
            money: 0,
            groupid: 0,
            grouptitle: '',
            selectids: [], // 已选商品id
            selected: [], // 已选商品,信息 id,money
            standard: standard, // 餐标
            standardmin: standardmin, // 餐标
            curcombination: [], // 前套餐的所有组合
            selcombination: [], // 当前选择的组合
        },
        computed: {
            resoptions: function () {
                return JSON.parse(JSON.stringify(this.curdinners));
            }
        },
        watch: {
            selectids: function (newval, oldval) {
                // console.log(newval, oldval);
                this.formatMoney();
                this.formatDays();
            },
            resoptions: function (newval, oldval) {
                // console.log(newval, oldval);
                this.formatMoney();
                this.formatDays();
            }
        },
        created: function () {

        },
        methods: {
            changeDay(idx) {
                this.typeidx = idx;
                this.day = this.curdays[idx]['day'];
                this.curdaymoney = this.curdays[idx]['money'];
                this.curtypes =  JSON.parse(JSON.stringify(this.curdays[idx]['types']));

                this.formatTypes();
                // console.log('this.curtypes',this.curtypes,this.curdays[idx]);
            },
            changeGroup(obj){
                this.groupid = obj.id;
                this.grouptitle = obj.title;
                this.curdays = JSON.parse(JSON.stringify(obj.days));
                this.typeidx = 0;
                this.day = obj.days[0]['day'];
                this.curdaymoney = obj.days[0]['money'];
                this.curtypes = JSON.parse(JSON.stringify(obj.days[0]['types']));
                this.curdinners = JSON.parse(JSON.stringify(obj.dinners));
                this.curcombination = JSON.parse(JSON.stringify(obj.combination));

                // console.log('curdays',this.curdays);

                try{
                    let ids = [];
                    this.curdays.forEach((item) => {
                        item.types.forEach((item2) => {
                            item2.dinners.forEach((item3) => {
                                ids.push(Number(item3.id));
                            })
                        })
                    });

                    let seldinners = JSON.parse(localStorage.getItem('seldinners'));
                    if(seldinners.length > 0){
                        this.curdinners.forEach((item) => {
                            seldinners.forEach((item2) => {
                                if(ids.includes(Number(item2.id)) && item.id == item2.id){
                                    item.nums = item2.nums;
                                }
                            })
                        })

                        this.formatTypes();
                    }
                }catch (e) {

                }

                // console.log('curdinners',this.curtypes,this.curcombination);
            },
            rechangeGroup(){
                this.groupid = 0;
                this.grouptitle = '';
                this.curdays = [];
                this.typeidx = 0;
                this.curtypes = [];
                this.money = 0;
                this.selectids = [];
                this.selected = [];
            },
            changeDinner(obj,type){
                // console.log('obj',obj);
                //TODO:: 一个餐次只能选择一种套餐，添加限制，流食写成商品属性，套餐内添加流食，套餐不再分类型，订单替换时成流食时只能替换套餐内的流食商品
                if(type == 0){ //选择
                    if(obj.max > 0 && obj.max <= obj.nums){
                        obj.nums = Number(obj.nums);
                    }else{
                        obj.nums = Number(obj.nums) + 1;
                    }

                    this.curdinners.forEach((item) => {
                        if(item.id == obj.id){
                            item.nums = obj.nums;
                        }
                    });

                    // 检查同一餐是否存在流食
                    if(obj.type == 1){ // 选择流食，去掉同餐次的普通餐
                        this.curdinners.forEach((item) => {
                            if(item.day == obj.day && item.dinner_type_id == obj.dinner_type_id && item.group_id == obj.group_id && item.type == 0){
                                item.nums = 0;
                            }
                        });
                    }else{ // 选择普通餐，去掉同餐次的流食
                        this.curdinners.forEach((item) => {
                            if(item.day == obj.day && item.dinner_type_id == obj.dinner_type_id && item.group_id == obj.group_id && item.type == 1){
                                item.nums = 0;
                            }
                        });
                    }

                    // 检查互斥套餐
                    if(obj.combination2.length > 0){
                        // console.log('dddddddddd',obj.combination2);
                        this.curdinners.forEach((item) => {
                            if(item.day == obj.day && item.dinner_type_id == obj.dinner_type_id && item.group_id == obj.group_id && obj.combination2.includes(item.id.toString())){
                                item.nums = 0;
                            }
                        });
                    }


                    if(obj.cid > 0){ // 是套餐
                        let flag = false;
                        let delcid = 0;
                        this.selcombination.forEach((item) => {
                            if(item.group_id == obj.group_id && item.day == obj.day && item.dinner_type_id == obj.dinner_type_id){
                                if(item.id != obj.cid){
                                    delcid = item.id;
                                    item.id = obj.cid;
                                }
                                flag = true;
                            }
                        });
                        if(!flag){
                            this.selcombination.push({
                                group_id: obj.group_id,
                                day: obj.day,
                                dinner_type_id: obj.dinner_type_id,
                                id: obj.cid
                            })
                        }

                        if(delcid > 0){
                            let ids = [];
                            // console.log('sssddddffff',this.curdinners);
                            this.curcombination.forEach((item) => {
                                if(delcid == item.id){
                                    ids = item.items
                                }
                            });

                            this.curdinners.forEach((item) => {
                                if(ids.includes(item.id.toString())){
                                    item.nums = 0;
                                }
                            });

                            // console.log('sssdddd',ids,this.curdinners);
                        }
                    }

                }else{ // 取消
                    if(obj.nums <= 0){
                        obj.nums = 0;
                    }else{
                        obj.nums = Number(obj.nums) - 1;
                    }

                    this.curdinners.forEach((item) => {
                        if(item.id == obj.id){
                            item.nums = obj.nums;
                        }
                    });

                    if(obj.nums == 0 && obj.cid > 0){
                        let tt = false;

                        this.curdinners.forEach((item) => {
                            if(obj.cid == item.cid && item.nums > 0){
                                tt = true;
                            }
                        });
                        if(!tt){
                            this.selcombination = this.selcombination.filter((item) => {
                                return item.id != obj.cid;
                            });
                        }
                    }
                }

                this.formatTypes();
                // console.log('sss',this.selcombination);
            },
            formatTypes(){
                this.curtypes.forEach((item) => {
                    item.dinners.forEach((item2) => {
                        this.curdinners.forEach((item3) => {
                            if(item3.id == item2.id){
                                item2.nums = item3.nums;
                            }
                        });
                    });
                });

                if(Number(this.groupid) > 0){
                    let seldinners = [];
                    this.curdinners.forEach((item3) => {
                        if(Number(item3.nums) > 0){
                            seldinners.push({
                                id: item3.id,
                                nums: item3.nums
                            });
                        }
                    });
                    localStorage.setItem('seldinners',JSON.stringify(seldinners));
                }

            },
            selectDinner(obj,type){
                //TODO:: 一个餐次只能选择一种套餐，添加限制，流食写成商品属性，套餐内添加流食，套餐不再分类型，订单替换时成流食时只能替换套餐内的流食商品
                if(type == 0){ //选择
                    if(!this.selectids.includes(obj.id)){
                        this.selectids.push(obj.id);
                        this.selected.push(obj);

                        let ids = [];
                        if(obj.type == 1){ // 选择流食，去掉同餐次的普通餐
                            this.selected.forEach((item) => {
                                if(item.day == obj.day && item.dinner_type_id == obj.dinner_type_id && item.group_id == obj.group_id && item.type == 0){
                                    ids.push(item.id);
                                }
                            });
                        }else{ // 选择普通餐，去掉同餐次的流食
                            this.selected.forEach((item) => {
                                if(item.day == obj.day && item.dinner_type_id == obj.dinner_type_id && item.group_id == obj.group_id && item.type == 1){
                                    ids.push(item.id);
                                }
                            });
                        }
                        if(ids.length > 0){
                            this.selectids = this.selectids.filter((item) => {
                                return !ids.includes(item);
                            })
                            this.selected = this.selected.filter((item) => {
                                return !ids.includes(item.id);
                            })
                        }
                    }
                }else{ // 取消
                    if(this.selectids.includes(obj.id)){
                        this.selectids = this.selectids.filter((item) => {
                            return item != obj.id;
                        });
                        this.selected = this.selected.filter((item) => {
                            return item.id != obj.id;
                        });
                    }
                }
                // console.log('sss',this.selected);
            },
            settlement(){
                let flag = false;
                let error = false;

                let curdays = JSON.parse(JSON.stringify(this.curdays));

                try{
                    curdays.forEach((item) => {
                        // console.log('sdddsd',item);
                        if(Number(item.money) > 0 && Number(item.money) > Number(this.standard)){
                            // $.toptips(item.text+"已超过餐标标准",'warning');
                            error = true;
                            throw new Error(item.text+"已超过餐标标准");
                        }
                        if(Number(item.money) > 0 && Number(item.money) < Number(this.standardmin)){
                            // $.toptips(item.text+"未达到餐标最底标准"+this.standardmin,'warning');
                            error = true;
                            // return false;
                            throw new Error(item.text+"未达到餐标最底标准");
                        }
                        item.types.forEach((item2) => {
                            let info = item2;
                            let dinners = [];
                            let cates = 0; // 种类数

                            // 选择商品，检查今天的套餐是否有选择
                            let comids = [];
                            this.curcombination.forEach((citem) => {
                                if(citem.group_id == this.groupid &&citem.day == item.day && citem.dinner_type_id ==item2.id){
                                    comids.push(citem.id);
                                }
                            });
                            if(comids.length > 0 && item.money > 0){ // 有组合，且有选择商品
                                let tt = false;
                                this.selcombination.forEach((scitem) => {
                                    if(comids.includes(scitem.id)){
                                        tt = true;
                                    }
                                });
                                // console.log('sdddddd',comids,this.selcombination);
                                if(!tt){
                                    // $.toptips("未选择"+item.text+item2.name+"套餐",'warning');
                                    error = true;
                                    // return false;
                                    throw new Error("未选择"+item.text+item2.name+"套餐必选菜品");
                                }
                            }


                            this.curdinners.forEach((item3) => {
                                if(item3.group_id == this.groupid &&item3.day == item.day && item3.dinner_type_id ==item2.id){
                                    if(item3.nums <= 0 && item3.required == 1){
                                        // $.toptips(item.text+item2.group_title+item2.name+item3.name+"必选",'warning');
                                        error = true;
                                        // return false;
                                        throw new Error(item.text+item2.group_title+item2.name+item3.name+"必选");
                                    }
                                    if(item3.nums > 0){
                                        dinners.push(JSON.parse(JSON.stringify(item3)));
                                        cates = cates + 1;
                                    }
                                }
                            });
                            if(dinners.length > 0){
                                flag = true;
                            }
                            info.dinners = dinners;

                            if(item2.limit > 0 && cates > item2.limit){
                                $.toptips(item.text+item2.group_title+item2.name+"最多选"+item2.limit+"种",'warning');
                                error = true;
                                // return false;
                                throw new Error(item.text+item2.group_title+item2.name+"最多选"+item2.limit+"种");
                            }
                        });
                    });
                }catch (e) {
                    $.toptips(e.message,'warning');
                    return  false;
                }

                if(error){
                    return false;
                }
                // console.log('flag',this.flag,curdays);
                if(!flag){
                    $.toptips("未选择菜品",'warning');
                    return false;
                }
                localStorage.setItem('userdinners',JSON.stringify(curdays));
                // console.log('settlement',this.curdays);
                window.location.href = "{:url('submitorder2')}";
            },
            formatMoney(){
                let money = 0;
                this.curdinners.forEach((item) => {
                    if(item.nums > 0){
                        money = Number(money) + Number(item.money) * item.nums;
                    }
                });
                this.money = money.toFixed(2);
            },
            formatDays(){
                this.curdaymoney = 0;
                this.curdays.forEach((item) => {
                    let count = 0;
                    let money = 0;
                    this.curdinners.forEach((item2) => {
                        if(item.day == item2.day && item2.nums > 0){
                            count += item2.nums;
                            money += Number(item2.money)*item2.nums;

                            if(this.day === item2.day){
                                this.curdaymoney += Number(item2.money)*item2.nums;
                            }
                        }

                        if(item2.cid > 0 && item.day == item2.day && item2.nums > 0){
                            let flag = false;
                            let delcid = 0;
                            this.selcombination.forEach((item3) => {
                                if(item3.group_id == item2.group_id && item3.day == item2.day && item3.dinner_type_id == item2.dinner_type_id){
                                    if(item3.id != item2.cid){
                                        delcid = item3.id;
                                        item3.id = item2.cid;
                                    }
                                    flag = true;
                                }
                            });
                            if(!flag){
                                this.selcombination.push({
                                    group_id: item2.group_id,
                                    day: item2.day,
                                    dinner_type_id: item2.dinner_type_id,
                                    id: item2.cid
                                })
                            }
                            // console.log('this.selcombination', this.selcombination);
                        }
                    });
                    item.count = count;
                    item.money = money.toFixed(2);


                });

                this.curdaymoney = this.curdaymoney.toFixed(2);
                // console.log('cdays',this.curdays);
            }
        },
    });
</script>