<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>批量还款</title>
		<link rel="stylesheet" type="text/css" href="./css/style.css">
	    <script src="../../lib/vue/vue.min.js"></script>
		<script src="../../lib/vue/axios.min.js"></script>
		<script src="../../lib/jquery-1.11.3.min.js"></script>
	    <script src="../../_common/service_fcfg.js"></script>
	    <script src="../../_common/fy_client.js"></script>
	    <script src="../../_common/service.js"></script>
        <script src="../../_common/fql.js"></script>
	    
	</head>
	<body>
		<div id="app" v-cloak>
            <div class="basketBond">
                <!-- <div class="modalBg"></div> -->
                <div class="subscribeBond">
                    <div class="title">批量还款</div>
                    <!-- <div :class="{'progress': true, 'hasAnimation': isShowProgress}"></div> -->
                    <div class="check_box">
                        证券代码
                        <input type="number" v-model="stkcode" oninput="if(value.length>6)value=value.slice(0,6)">
                        <span @click="queryStkCode" class="search">查询</span>
                        <span class="search_result">查询结果：</span>
                        <span class="search_result">共{{resultNum}}条</span>
                    </div>
                    <div class="bondBody">
                        <!-- <div class="content"> -->
                            <table id="dataTable">
                                <thead>
                                    <tr>
                                        <th style="width:60px">操作</th>
                                        <th :class="{'default_width': index == '0' || index == '1' || index == '2'
                                        || index == '3' || index == '4' || index == '5'}" v-for="(item, index) in tableTabList" :title="item.title">{{item.title}}</th>
                                    </tr>
                                </thead>
                                <tbody id="dataTableBody">
                                    <tr v-for="item in resultArr">
                                        <td style="width:60px"><input @click="singleSelect" type="checkbox" id="checkBox"></td>
                                        <td :class="{'default_width': tableIndex == '0' || tableIndex == '1' || tableIndex == '2'
                                         || tableIndex == '3' || tableIndex == '4' || tableIndex == '5'}" style="white-space:nowrap;" v-for="(tableItem, tableIndex) in tableTabList" :key="item.sno">{{item[tableItem.key] | addZero}}
                                            <div class="td_title_name">{{item[tableItem.key] | addZero}}</div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- </div> -->
                    </div>
                    <div v-if="isShowLoading" @click="loadMoreData" class="load_more">加载更多</div>
                    <div v-if="noMoreData" class="no_more">没有更多了</div>
                    <div class="fixed_td">
                        <div class="bottom_td">
                            <input id="all_select" type="checkbox" @click="allSelect">全选
                            <div class="selected_num_batchPay">
                                <span class="selected_num">已选中{{selectedNum}}条</span>
                                <span @click="batchPay" class="pay_button">批量还款</span>
                            </div>
                        </div>
                    </div>
                    <div class="tips">{{errorMsg}}</div>
                    <div class="dialog_wrapped" v-if="isShowDiaog">
                        <div class="confirm_dialog">
                            <div class="dialog_title">
                                <div v-if="payStatus">批量还款委托确认</div>
                                <div v-else>批量还款委托提交</div>
                                <div v-if="payStatus" @click="closeDialog(0)" class="dialog_close">X</div>
                                <div v-else @click="closeDialog(1)" class="dialog_close">X</div>
                            </div>
                            <div v-if="payStatus" class="dialog_content">
                                <div class="confirm_title">确认进行以下合约的直接还款？</div>
                                <div class="bondBody dialog_bond">
                                    <table id="dataTable">
                                        <thead>
                                            <tr>
                                                <th :class="{'default_width': index == '0' || index == '1' || index == '2'
                                                || index == '3' || index == '4' || index == '5'}" v-for="(item, index) in tableTabList">{{item.title}}</th>
                                            </tr>
                                        </thead>
                                        <tbody id="dataTableBody">
                                            <tr v-for="item in selectedArr">
                                                <td :class="{'default_width': tableIndex == '0' || tableIndex == '1' || tableIndex == '2'
                                                || tableIndex == '3' || tableIndex == '4' || tableIndex == '5'}" style="white-space:nowrap" v-for="(tableItem, tableIndex) in tableTabList" :key="item.sno">{{item[tableItem.key] | addZero}}
                                                    <div class="td_title_name">{{item[tableItem.key] | addZero}}</div>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="button_content">
                                    <div @click="confirmToPay" class="confirm common_btn">确定</div>
                                    <div @click="closeDialog(0)" class="cancel common_btn">取消</div>
                                </div>
                            </div>
                            <div v-else class="dialog_content">
                                <div v-if="payFailNum" class="pay_result">
                                    <div class="limit_progress">
                                        <div :class="{'progress': true, 'hasAnimation': isShowProgress}"></div>
                                    </div>
                                    委托已提交，
                                    <span>成功{{selectedArr.length - payFailNum}}笔</span>
                                    <span>失败{{payFailNum}}笔</span>，
                                    您可前往当日资金流水查询还款结果
                                </div>
                                <div v-else class="pay_result">
                                    <div class="limit_progress">
                                        <div :class="{'progress': true, 'hasAnimation': isShowProgress}"></div>
                                    </div>
                                    委托已提交，
                                    <span>成功{{selectedArr.length}}笔</span>，
                                    您可前往当日资金流水查询还款结果
                                </div>
                                <div class="fail_wrapped">
                                    <div class="fail_reason">
                                        <div v-for="item in payFailMsg" class="item_fail_reason">失败原因：{{item}}</div>
                                    </div>
                                </div>
                                <div class="button_content">
                                    <div @click="toQuery" class="confirm common_btn">去查询</div>
                                    <div @click="closeDialog(1)" class="cancel common_btn">关闭</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="dialog_tip" v-if="isShowTipDialog">
                        <div class="tip_content">
                            <div class="tip_title">
                                <div class="tip">富易</div>
                                <div @click="closeTip" class="close">X</div>
                            </div>
                            <div class="content">
                                <img src="./res/tip.png" alt="">
                                请先选择还款合约
                            </div>
                            <div @click="closeTip" class="comfirm_btn">
                                确定
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div v-if="isShowLoadingIcon" class="loading"></div>
		</div>
        <script>
            reg('rzjzjy', '420921', '融资情况查询');
            reg('rzjzjy', '420419', '指定合约直接还款');
        </script>
        <script src="./js/index.js"></script>
	</body>
</html>