{$layout}
{$template "menu"}

<p class="comment" v-if="regions.length == 0">暂时还没有区域。</p>

<table class="ui table selectable small definition celled">
    <thead>
    <tr>
        <th style="width: 7em; border-left: 1px solid rgba(34,36,38,.15);  border-top: 1px solid rgba(34,36,38,.15)">区域\范围</th>
        <th v-for="item in items" class="center">
            {{item.name}}
            <br/>
            <span>{{item.bitsFromString}}-{{item.bitsToString}}</span>
            <br/>
            &nbsp; <a href="" title="修改" @click.prevent="updateItem(item.id)"><i class="icon pencil small"></i></a> &nbsp;
            <a href="" title="删除" @click.prevent="deleteItem(item.id)"><i class="icon remove small"></i></a>
        </th>
        <th class="width10 center">
            <a href="" @click.prevent="createItem" style="visibility: visible">[+添加价格项]</a>
        </th>
    </tr>
    </thead>
    <tr v-for="region in regions">
        <td class="">{{region.name}}</td>
        <td v-for="item in items" class="center">
            <div>
                <span v-if="region.prices[item.id.toString()] != null">¥{{region.prices[item.id.toString()]}}元/GB &nbsp;</span>
                <span v-else>&nbsp;</span>
            </div>
            <div>
                <a href="" title="修改单位价格" @click.prevent="updatePrice(region.id, item.id)">[设置]</a>
            </div>
        </td>
        <td></td>
    </tr>
</table>