<div id="app" class="card-body p-1" data-config='{{ config|json_encode }}'> <div style="position: relative" v-cloak> <!-- Filtre --> <form class="row gy-2 gx-3 m-0" method="POST"> <div class="col-auto mt-0"> <label for="yil" class="form-label m-0 small">Yıl</label><br> <input type="number" class="form-control form-control-sm" min="2019" max="2050" name="yil" id="yil" v-model="filter.yil"/> </div> <div class="col-auto mt-0"> <label for="ay" class="form-label m-0 small">Ay</label><br> <select class="form-select form-select-sm" name="ay" id="ay" v-model="filter.ay" style="width: 100px"> <option v-for="ay in aylar" :value="ay.value">${ ay.text }</option> </select> </div> <div class="col-auto mt-0"> <label for="ogun" class="form-label m-0 small">Öğün</label><br> <select class="form-select form-select-sm" name="ogun" id="ogun" v-model="filter.ogun" style="width: 80px"> <option v-for="ogun in ogunler" :value="ogun.value">${ ogun.text }</option> </select> </div> <div class="col-auto mt-0"> <label for="turu" class="form-label m-0 small">Türü</label><br> <select class="form-select form-select-sm" name="turu" id="turu" v-model="filter.turu" style="width: 120px"> <option v-for="tur in turler" :value="tur">${ tur }</option> </select> </div> <div class="col mt-3"> <a class="btn btn-primary mx-1 shadow-sm" :disabled="isLoading" @click.prevent="getMenu"> <i class="fas fa-filter"></i> Listele </a> <a class="btn btn-primary mx-1 shadow-sm" :disabled="isLoading" @click.prevent="exportMenu2Excel"> <i class="fas fa-file-excel"></i> Excel </a> <button class="btn btn-success mx-1 shadow-sm" :disabled="isLoading || !filter.canEdit" @click.prevent="menuKaydet"> <i class="fas fa-save"></i> Menüyü Kaydet </button> </div> </form> <!--/ Filtre --> <div v-show="isLoading" style="background-color: #fff; padding: 30px 0"> <div class="loader"></div> </div> <!-- Aylık Menü --> <div v-for="(satir, ix_satir) in menu" :key="ix_satir" class="row p-2 py-1" style="padding: 3px 0;min-height:70px;opacity:0.8; font-size: 80%"> <div v-for="(gun, ix_gun) in satir" :key="ix_gun" class="card menu-gun col p-0 m-1"> <div :disabled="gun.length==1" class="card-header m-0 p-0 bg-primary text-white font-weight-light"> <p class="text-center p-0 m-0 w-100">${ gun[0].GUN }</p> </div> <div v-for="yemek in gun" :key="yemek.RECKODU" class="row m-0 p-1" :class="{'hata': filter.canEdit && (grupLimit[yemek.CINSI]) && (grupLimit[yemek.CINSI].MAXADET < grupLimit[yemek.CINSI].TOPLAM) }"> <div class="col m-0 p-0 overflow-hidden text-truncate"> <span v-if="!(yemek.ALTERNATIF) || yemek.ALTERNATIF.length==1" class="" :title="parseInt(yemek.KALORI) + ` kalori`">${ yemek.RECADI }</span> <select v-else class="form-select-sm m-0 p-0 w-100" v-model="yemek.RECKODU" style="font-size: 90%" @change="grupToplamiGuncelle(ix_satir, ix_gun, yemek.RECKODU, yemek.CINSI2)"> <option v-for="alternatif in yemek.ALTERNATIF" :value="alternatif.RECKODU">${alternatif.RECADI} </option> </select> </div> <div class="col-3 text-end m-0 p-0" v-if="yemek.ORAN!=null && filter.canEdit"> <input type="number" min="0" max="150" step="5" v-model="yemek.ORAN" class="form-control form-control-sm px-1 text-end" style="min-height: auto; height: 1.5rem"> </div> </div> </div> </div> <!--/ Aylık Menü --> <!-- Yemek Grubu Limitleri --> <div class="container ozet shadow-lg bg-success text-white p-0" :value="true" v-if="filter.canEdit && showLimit && grupLimit.length>0" :class="{ 'ozet-left': limitLeft }"> <div class="row bg-warning p-2 font-weight-bold m-0"> <div class="col text-danger" v-if="!limitLeft"> <button class="btn btn-dark text-white me-1" small @click="limitLeft = !limitLeft" v-bind="attrs" v-on="on" title="Pencereyi sola taşı"><i class="fas fa-angle-double-left"></i> </button> </div> <h6 class="col mt-2 text-black">Yemek Grubu Limitleri</h6> <div class="col col-auto text-danger" v-if="limitLeft"> <button class="btn btn-dark text-white me-1" small @click="limitLeft = !limitLeft" v-bind="attrs" v-on="on" title="Pencereyi sağa taşı"><i class="fas fa-angle-double-right"></i> </button> </div> </div> <div class="mt-0"> <table class="table table-sm text-white"> <thead> <tr> <th class="text-left">Yemek Grubu</th> <th>Aylık<br>Limit</th> <th>Menüdeki<br>Adet</th> </tr> </thead> <tbody class="text-sm-caption"> <tr v-for="grup in grupLimit" :key="grup.GRUPKODU"> <td>${ grup.GRUPADI }</td> <td class="text-center">${ grup.MAXADET }</td> <td class="text-center">${ grup.TOPLAM }</td> </tr> </tbody> </table> <!-- <v-row v-for="grup in grupLimit">--> <!-- <v-col class="bg-info p-1">${ grup.GRUPADI }</v-col>--> <!-- <v-col class="bg-info p-1">${ grup.MAXADET }</v-col>--> <!-- <v-col class="bg-info p-1">${ grup.TOPLAM }</v-col>--> <!-- </v-row>--> </div> </div> <!--/ Yemek Grubu Limitleri --> </div></div>