<?xml version="1.0" encoding="UTF-8"?>

<!--
    $Author: huangtianyang
    $Date: 2018/7/4 上午8:39
    $Revision: 1.0
    授信额度查询
-->
<a:screen xmlns:a="http://www.leaf-framework.org/application">
    <a:init-procedure/>
    <a:view template="default" package="leaf.ui.std">
        <link href="${/request/@context_path}/resource/leaf.ui.std/hap/hlscomponent/hls-component.css"
              rel="stylesheet" type="text/css"/>
        <link href="${/request/@context_path}/resource/leaf.ui.std/hap/hlscomponent/hls-all.css" rel="stylesheet"
              type="text/css"/>
        <link href="${/request/@context_path}/resource/leaf.ui.std/hap/hlscomponent/beyond.min.css" rel="stylesheet"
              type="text/css"/>
        <link href="${/request/@context_path}/css/hap/bootstrap.min.css" rel="stylesheet" type="text/css"/>
        <div></div>
        <style><![CDATA[
            html, body {
                padding: 0;
                width: 270px;
                height: 355px;
            }
            .fundContain_balance_contain .query {
                height: 86px;
                border-bottom: 1px solid rgb(204, 204, 204);
            }

            .fundContain_balance_contain .query .queryInfo {
                border: 1px solid rgb(204, 204, 204);
                width: 240px;
                height: 30px;
                margin-top: 5px;
                border-radius: 5px;
            }

            .fundContain_balance_contain .query .queryInfo img {
                width: 15px;
                height: 15px;
                display: inline-block;
                margin-top: 0px;
                margin-left: 3px;
            }

            .fundContain_balance_contain .query .queryInfo input {
                border: none;
                width: 215px;
                height: 27px;
                background: #fff;
            }

            .fundContain_balance_contain .query span {
                color: #666666;
                line-height: 30px;
            }

            .fundContain_balance_contain .query button {
                width: 70px;
                height: 30px;
                margin-left: 8px;
                border-radius: 5px;
                border: 1px solid rgb(204, 204, 204);
                background: #fff;
                color: #000;
            }

            .fundContain_balance_foot button {
                width: 70px;
                height: 30px;
                float: right;
                border-radius: 5px;
                margin-top: 10px;
                margin-right: 10px;
                background: rgb(245, 123, 105);
                border: 1px solid rgb(245, 123, 105);
                color: white;
            }

            .timesInput {
                border: 1px solid rgb(204, 204, 204);
                width: 112px;
                height: 30px;
                margin-top: 5px;
                display: inline-block;
                border-radius: 5px;
            }

            .timesInput input {
                background: #fff;
                border: none !important;
                width: 110px;
                height: 26px;
                padding: 2px;
            }

        ]]></style>
        <script><![CDATA[
        function widgetQuery() {

        }

        ]]></script>
        <a:dataSets/>
        <div id="widget513" class="hls-query-form hls-block-x1" style="">
            <div id="widget513_title" class="hls-query-form-title global-font-size13 border-bottom-blue">授信额度查询</div>
            <div class="hls-hbox-row border-bottom-1">
                <div>
                    <div class="fundContain_balance_contain">
                        <div class="query">
                            <div><span class="global-font-size13">额度类型</span></div>
                            <div style="margin-top:10px;">
                                <button class="buttonQueryFirst global-font-size12"
                                        style="margin-left:0px;width:70px;">循环
                                </button>
                                <button class="buttonQueryFirst global-font-size12" style="width:70px;">非循环
                                </button>
                                <button class="buttonQueryFirst global-font-size12" style="width:70px;">一次性
                                </button>
                            </div>
                        </div>

                        <div class="query">
                            <div><span class="global-font-size13">授信额度</span></div>
                            <div class="timesInput">
                                <input id="timesFromInfo" class="global-font-size12" type="text"
                                       placeholder="金额从"/>
                            </div>

                            <div style="margin-top: 5px;display: inline">
                                -
                            </div>
                            <div class="timesInput" style="margin-left: 0px;">
                                <input id="timesToInfo" class="global-font-size12" type="text"
                                       placeholder="金额到"/>
                            </div>
                        </div>

                        <div class="query">
                            <div><span class="global-font-size13">授信信息</span></div>
                            <div class="queryInfo">
                                <img src="${/request/@context_path}/images/lon/query.png"/>
                                <input id="firstInput" type="text" placeholder="请输入授信合同号或授信机构名称"/>
                            </div>
                        </div>
                        <div class="fundContain_balance_foot">
                            <button onclick="pages()">查询</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script><![CDATA[
            $jq("#widget513_title").append('<img onclick="widgetQuery(event,this)" id="widget513_query" class="right-img" src="${/request/@context_path}/images/lon/search_flag.png"/>');

        function pages() {
//        获取查询参数到temp
            var temp = {}
            /*根据按钮颜色确定选中的查询条件*/
            if ($(".buttonQueryFirst")[0].style.background == "rgb(0, 179, 179)") {
                temp.revolving = 1;
            }
            if ($(".buttonQueryFirst")[1].style.background == "rgb(0, 179, 179)") {
                temp.nonRevolving = 1;
            }
            if ($(".buttonQueryFirst")[2].style.background == "rgb(0, 179, 179)") {
                temp.once = 1;
            }
            if ($("#timesFromInfo").val() != "" && $("#timesFromInfo").val()) {
                temp.minAmt = $("#timesFromInfo").val()
            }
            if ($("#timesToInfo").val() != "" && $("#timesToInfo").val()) {
                temp.maxAmt = $("#timesToInfo").val()
            }
            if ($("#firstInput").val() && $("#firstInput").val() != "") {
                temp.bpName = $("#firstInput").val()
            }
            // rollTableDataSource.read(temp);
        }

        function buttonColor(buttonCheckArray, className) {

            var buttonQuery = document.getElementsByClassName(className);
            for (var i = 0; i < buttonQuery.length; i++) {
                buttonCheckArray[i] = false;
                buttonQuery[i].index = i;
                buttonQuery[i].onclick = function () {

                    if (buttonCheckArray[this.index] == false) {
                        this.style.background = "rgb(0,179,179)";
                        this.style.color = "white";

                        buttonCheckArray[this.index] = true;
                    }
                    else {
                        this.style.background = "#fff";
                        this.style.color = "black";
                        buttonCheckArray[this.index] = false;
                    }
                }
            }
        }
        function buttonOnlyOne(className) {
            var buttonQuery = document.getElementsByClassName(className);
            for (var i = 0; i < buttonQuery.length; i++) {
                buttonQuery[i].index = i;
                buttonQuery[i].onclick = function () {
                    for (var i = 0; i < buttonQuery.length; i++) {
                        buttonQuery[i].style.background = "#fff";
                        buttonQuery[i].style.color = "black";
                    }
                    buttonQuery[this.index].style.background = "rgb(0,179,179)";
                    buttonQuery[this.index].style.color = "white";
                    buttonCheckFour = this.index;
                }
            }
        }
        $jq("document").ready(function () {
            /*额度类型选择样式*/
            var buttonCheckArrayFirst = new Array();
            var buttonCheckArraySecond = new Array();
            var buttonCheckArrayFour = new Array();
            var buttonCheckArraythird = new Array();
            buttonColor(buttonCheckArrayFirst, "buttonQueryFirst");
            buttonColor(buttonCheckArraySecond, "buttonQuerySecond");
            buttonColor(buttonCheckArrayFour, "buttonQueryFour2");
            buttonColor(buttonCheckArraythird, "buttonQuery");
            buttonOnlyOne("buttonQueryFour");
        })

        ]]></script>
        <a:screenBody/>
    </a:view>
</a:screen>