<template>
  <div class="retailRateList">
    <ul>
      <li>{{$t('front.board.type')}}</li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        <img src="@/assets_mobile/img/icon_rate_on.svg" alt="">{{item.codeName}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        <img src="@/assets_mobile/img/icon_rate_on.svg" alt="">{{item.codeName}}
      </li>
      <li><img src="@/assets_mobile/img/icon_rate_on.svg" alt="">{{$t('front.common.totals')}}</li>
    </ul>
    <ul>
      <li class="boardstrlt">{{$t('front.mypage.dividend')}}</li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li>{{thousand(sumBetWinAmt || 0)}}</li>
    </ul>
    <ul>
      <li class="boardstrlt">{{$t('front.mypage.winlose')}}</li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li>{{thousand(sumWlAmt || 0)}}</li>
    </ul>
    <ul>
      <li class="boardstrlt">{{$t('front.mypage.resultMoney')}}</li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li>{{thousand(sumPointAmt || 0)}}</li>
    </ul>
  </div>
  <!--div class="board" :class="className">
    <ul class="boardstr">
      <li class="boardstrlt">구분</li>
      <li>스포츠</li>
      <li v-for="item in model['minigame'].list" v-bind:key="item.codeName">
        {{item.codeName}}
      </li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{item.codeName}}
      </li>
      <li>e-스포츠</li>
      <li>합계</li>
    </ul>
    <ul class="boardstr">
      <li class="boardstrlt">배당금</li>
      <li>{{thousand(model['sport'].list[0].betWinAmt || 0)}}</li>
      <li v-for="item in model['minigame'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li v-for="item in model['fishing'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li v-for="item in model['kiron'].list" v-bind:key="item.codeName">
        {{thousand(item.betWinAmt || 0)}}
      </li>
      <li>{{thousand(model['esport'].list[0].betWinAmt || 0)}}</li>
      <li>{{thousand(sumBetWinAmt || 0)}}</li>
    </ul>
    <ul class="boardstr">
      <li class="boardstrlt">승패</li>
      <li>{{thousand(model['sport'].list[0].wlAmt || 0)}}</li>
      <li v-for="item in model['minigame'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li v-for="item in model['fishing'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li v-for="item in model['kiron'].list" v-bind:key="item.codeName">
        {{thousand(item.wlAmt || 0)}}
      </li>
      <li>{{thousand(model['esport'].list[0].wlAmt || 0)}}</li>
      <li>{{thousand(sumWlAmt || 0)}}</li>
    </ul>
    <ul class="boardstr">
      <li class="boardstrlt">정산금액</li>
      <li>{{thousand(model['sport'].list[0].pointAmt || 0)}}</li>
      <li v-for="item in list['minigame']" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li v-for="item in model['casino'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li v-for="item in model['slot'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li v-for="item in model['fishing'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li v-for="item in model['kiron'].list" v-bind:key="item.codeName">
        {{thousand(item.pointAmt || 0)}}
      </li>
      <li>{{thousand(model['esport'].list[0].pointAmt || 0)}}</li>
      <li>{{thousand(sumPointAmt || 0)}}</li>
    </ul>
  </div-->
</template>

<script>
import retailDetail from '@/components/common/retailDetail'

export default {
  name: 'retailDetailMobile',
  mixins: [retailDetail]
}
</script>

<style scoped>
.retailRateList {margin: 25px;padding-bottom: 100px;font-size: 13px;display: flex;justify-content: space-between;align-items: center;}
.retailRateList ul li {margin-bottom: 20px;}
.retailRateList ul img {margin-right: 13px;}
.retailRateList img {vertical-align: middle;}
</style>
<style scoped src="@/styles_mobile/subcommon.css"></style>
<style scoped src="@/styles_mobile/common.css"></style>
