<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <!--Content S-->
    <div class="" role="tabpanel" data-example-id="togglable-tabs">
        <ul id="myTab" class="nav nav-tabs bar_tabs" role="tablist">
            <li><a :href="'edit?id=' + store.id">基本資料</a></li>
            <li class="active"><a :href="'userlist?sid=' + store.id">門市帳號</a></li>
            <li><a :href="'pricelist?sid=' + store.id">價格</a></li>
            <li><a :href="'freightlist?sid=' + store.id">運費</a></li>
            <li><a :href="'orderlist?sid=' + store.id">租賃記錄</a></li>
            <li><a :href="'stocklist?sid=' + store.id">輔具動態</a></li>
            <li><a href="list">回列表</a></li>
        </ul>
    </div>
    <div class="col-md-12 col-sm-12 col-xs-12"></div>
    <div class="col-md-4 col-sm-4 col-xs-12">
        <ul class="info">
            <li>
                <span class="title">通路</span>
                <span>{{store.marketName}}</span>
            </li>
            <li>
                <span class="title">門市</span>
                <span>{{store.name}} ({{store.shortName}})</span>
                <a :href="'@printqrcode?id=' + store.id" class="iframe alignright"><i class="fas fa-qrcode fa-lg"></i></a>
            </li>
            <li>
                <span class="title">佳醫代收</span>
                <label class="label label-info" v-if="store.isCodConsumableFee == 1">耗材費</label>
                <label class="label label-default" v-if="store.isCodFreight == 1">運費</label>
                <span v-if="store.isCodConsumableFee == 0 && store.isCodFreight == 0">--</span>
            </li>
        </ul>
    </div>
    <div class="col-md-8 col-sm-8 col-xs-12">
        <a :href="editUrl(-1)" class="btn btn-success iframe">新增帳號</a>
    </div>
    <div class="col-md-12 col-sm-12 col-xs-12"></div>
    <div v-if="pager != null" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
        <div class="row">
            <div class="col-sm-4">
                <div class="dataTables_info">總筆數 {{pager.totalRecord}} 筆, 第 {{pager.startItemIndex}} ~ {{pager.endItemIndex}} 筆</div>
            </div>
            <div class="col-sm-8">
                <div class="dataTables_paginate paging_simple_numbers">
                    <ul class="pagination">
                        <li class="paginate_button previous" v-if="pager.currentPage > 1"><a @click="goPage(1);"><i class="fas fa-angle-double-left"></i></a></li>
                        <li class="paginate_button previous" v-if="pager.currentPage > 1"><a @click="goPage(pager.currentPage - 1 );"><i class="fas fa-angle-left"></i></a></li>

                        <li class="paginate_button" :class="{ active: n == pager.currentPage }" v-for="n in pager.endPage" v-if="n >= pager.startPage">
                            <a @click="goPage(n);">{{n}}</a>
                        </li>

                        <li class="paginate_button next" v-if="pager.totalPage > pager.currentPage"><a @click="goPage(pager.currentPage + 1 );"><i class="fas fa-angle-right"></i></a></li>
                        <li class="paginate_button next" v-if="pager.totalPage > pager.currentPage"><a @click="goPage(pager.totalPage);"><i class="fas fa-angle-double-right"></i></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <table border="0" cellpadding="5" cellspacing="1" class="table table-striped jambo_table">
        <thead>
            <tr>
                <td></td>
                <td>帳號</td>
                <td>姓名</td>
                <td class="text-center">狀態</td>
                <td class="text-center">最後登入</td>
                <td class="text-right">登入次數</td>
            </tr>
        </thead>
        <tbody>
            <tr v-for="(item, index) in list">
                <td class="text-center">
                    <a :href="editUrl(item.id)" class="btn btn-success btn-sm iframe"><i class="fas fa-edit"></i></a>
                </td>
                <td><a :href="editUrl(item.id)" class="iframe">{{item.username}}</a></td>
                <td><a :href="editUrl(item.id)" class="iframe">{{item.name}}</a></td>
                <td class="text-center" :class="'status' + item.status"><span v-if="item.status == 1">正常</span><span v-else>鎖定</span></td>
                <td class="text-center small">{{item.lastLoginDate}}</td>
                <td class="text-right">{{item.loginCount}}</td>
            </tr>
        </tbody>
    </table>
    <div v-if="pager != null" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
        <div class="row">
            <div class="col-sm-4">
                <div class="dataTables_info">總筆數 {{pager.totalRecord}} 筆, 第 {{pager.startItemIndex}} ~ {{pager.endItemIndex}} 筆</div>
            </div>
            <div class="col-sm-8">
                <div class="dataTables_paginate paging_simple_numbers">
                    <ul class="pagination">
                        <li class="paginate_button previous" v-if="pager.currentPage > 1"><a @click="goPage(1);"><i class="fas fa-angle-double-left"></i></a></li>
                        <li class="paginate_button previous" v-if="pager.currentPage > 1"><a @click="goPage(pager.currentPage - 1 );"><i class="fas fa-angle-left"></i></a></li>

                        <li class="paginate_button" :class="{ active: n == pager.currentPage }" v-for="n in pager.endPage" v-if="n >= pager.startPage">
                            <a @click="goPage(n);">{{n}}</a>
                        </li>

                        <li class="paginate_button next" v-if="pager.totalPage > pager.currentPage"><a @click="goPage(pager.currentPage + 1 );"><i class="fas fa-angle-right"></i></a></li>
                        <li class="paginate_button next" v-if="pager.totalPage > pager.currentPage"><a @click="goPage(pager.totalPage);"><i class="fas fa-angle-double-right"></i></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--Content E-->
    <!--FinalScript S-->
    <script src="userlist.js" type="module"></script>
    <!--FinalScript E-->
</body>
</html>