<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>交易记录查询</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/css/common.css}">
    <!-- 引入组件库 -->
    <script th:src="@{/layui/jquery-3.4.1.min.js}"></script>
    <script th:src="@{/layui/layui.js}"></script>
    <script th:src="@{/layui/lay/xmSelect/xm-select.js}"></script>
    <script th:src="@{/js/common.js}"></script>

    <style>
        body {
            background: #f2f2f2
        }

        #boxDiv {
            background: #ffffff
        }

        #titleDiv {
            overflow: visible;
        }

        .content {
            padding: 0 8px;
        }

        .tableTitle {
            height: 20px;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .tableTitle > * {
            height: 20px;
            line-height: 20px;
            display: inline-block;
            margin-right: 5px;
        }

        .tableName {
            border-left: 3px solid #0000FF;
            padding-left: 5px;
            font-size: 16px;
            font-weight: bold;
        }

        .selectDate {
            font-size: 14px;
            color: rgba(0, 0, 0, 0.65)
        }

        .layui-table-page {
            height: 81px;
        }
    </style>
</head>
<body class="layui-layout-body">
<div id="boxDiv" style="left:8px;right: 8px;bottom:8px;top:8px;position:absolute;">
    <div class="toolbar" id="titleDiv">
        <div style="display: inline-block;">
            <form class="layui-form">
                <div class="layui-inline">
                    <label class="layui-form-label">支付方式</label>
                    <div class="layui-input-inline formWidthTwo">
                        <select id="jyly" class="">
                            <option value="">请选择支付方式</option>
                            <option th:each="payTypeObj : ${tra_types}" th:value="${payTypeObj.dicvalue}"
                                    th:text="${payTypeObj.dicname}"></option>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">日期选择</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input formWidthTwo" id="searchDate" placeholder=" ~ "
                               th:value="${startTime+' ~ '+endTime}">
                    </div>
                </div>
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" style="width: 240px;" id="likeFiled"
                               placeholder="请输入平台交易号">
                    </div>
                </div>
            </form>
        </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-sm layui-btn-normal" data-type="search" id="search" onclick="search()"><i
                    class="layui-icon layui-icon-search"></i>查询
            </button>
            <!--            <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="exportExcel()"><i class="layui-icon">&#xe67d;</i>导出-->
            <!--            </button>-->
        </div>
    </div>
    <div class="content">
        <div class="tableTitle">
            <span class="tableName">交易记录</span>
            <span class="selectDate">&nbsp;</span>
        </div>
        <table id="demo" lay-filter="test"></table>
    </div>
</div>
<!-- 表格操作栏 -->
<!--<script type="text/html" id="barDemo">-->
<!--    <a class="layui-btn layui-btn-xs" lay-event="refundMoney">退款</a>-->
<!--</script>-->
</body>
<script th:inline="javascript">
    let tra_types = [[${tra_types}]];
    let serChs = [[${serChs}]];

    let payLogs = [[${payLogs}]];
    let paySous = [[${paySous}]];
    let reStates = [[${reStates}]];
    let layer, laydate, table, tree, form;
    layui.use(['element', 'table', 'laydate', 'layer', 'form', 'tree'], function () {
        layer = layui.layer;
        table = layui.table;
        laydate = layui.laydate;
        tree = layui.tree;
        form = layui.form;

        //表格加载
        table.render({
            elem: '#demo',
            height: 'full-' + ($(".toolbar").height() + 60),
            title: '交易明细',
            page: true,//开启分页
            limit: 20,
            limits: [20, 30, 50],
            //toolbar: '', //开启工具栏，此处显示默认图标，可以自定义模板
            defaultToolbar: [],
            id: 'test',
            //skin:'line',
            even: 'true',
            //size:'lg', 默认普通尺寸 sm 小 lg 大
            cols: [
                [
                    {
                        field: 'PAY_SOURCE', align: 'center', title: '支付来源', width: 180, sort: false,
                        templet: function (d) {
                            let result = "";
                            for (let i = 0; i < tra_types.length; i++) {
                                let obj = tra_types[i];
                                console.log("tra_types obj is :" + obj)
                                console.log(obj)
                                console.log(obj.dicvalue)
                                console.log(d.PAY_SOURCE)
                                console.log(d.PAY_SOURCE === obj.dicvalue)
                                if (d.PAY_SOURCE.toString() === obj.dicvalue) {
                                    result = obj.dicname;
                                    break;
                                }
                            }
                            console.log("result is :" + result)
                            console.log(result)
                            return result;
                        }
                    },
                    {
                        field: 'SERVER_CHANNEL',
                        align: 'center',
                        title: '服务渠道',
                        width: 180,
                        sort: false,
                        templet: function (d) {
                            let result = "";
                            for (let i = 0; i < serChs.length; i++) {
                                let obj = serChs[i];
                                if (d.SERVER_CHANNEL.toString() === obj.dicvalue) {
                                    result = obj.dicname;
                                    break;
                                }
                            }
                            return result;
                        }
                    },
                    {field: 'PATIENT_ID', align: 'center', title: '患者ID', width: 120, sort: false},
                    {field: 'PAY_CHANNEL', align: 'center', title: '支付通道', width: 120, sort: false},
                    {field: 'SICK_NAME', align: 'center', title: '患者姓名', width: 180, sort: false},
                    {field: 'MOBILE_PHONE', align: 'center', title: '联系电话', width: 180, sort: false},
                    {field: 'CARD_NO', align: 'center', title: '患者卡号', width: 180, sort: false},
                    {field: 'ID_NO', align: 'center', title: '患者身份证号', width: 180, sort: false},
                    {field: 'VISIT_NO', align: 'center', title: '就诊号', width: 180, sort: false},
                    {field: 'COST', align: 'center', title: '充值金额', width: 180, sort: false},
                    {field: 'HOSPITAL_NO', align: 'center', title: '医院流水号', width: 180, sort: false},
                    {
                        field: 'AGGREGATED_PAY_FLAG',
                        align: 'center',
                        title: '聚合支付标志',
                        width: 180,
                        sort: false,
                        templet: function (d) {
                            let result = "";
                            for (let i = 0; i < payLogs.length; i++) {
                                let obj = payLogs[i];
                                if (d.AGGREGATED_PAY_FLAG === obj.dicvalue) {
                                    result = obj.dicname;
                                    break;
                                }
                            }
                            return result;
                        }
                    },
                    {field: 'AUTH_CODE', align: 'center', title: '条码付下为用户的支付码', width: 180, sort: false},
                    {field: 'OPERATOR', align: 'center', title: '操作人代码', width: 180, sort: false},
                    {field: 'OPERATOR_NAME', align: 'center', title: '操作人名称', width: 180, sort: false},
                    {field: 'ORDER_STATE', align: 'center', title: '订单状态', width: 180, sort: false},
                    {field: 'PLATFORM_NO', align: 'center', title: '支付平台流水号', width: 180, sort: false},
                    {field: 'THRIDPLATFORM_NO', align: 'center', title: '第三方支付流水号', width: 180, sort: false},
                    {
                        field: 'PAY_WAY',
                        align: 'center',
                        title: '支付方式',
                        width: 180,
                        sort: false,
                        templet: function (d) {
                            let result = "";
                            for (let i = 0; i < paySous.length; i++) {
                                let obj = paySous[i];
                                if (d.PAY_WAY === obj.dicvalue) {
                                    result = obj.dicname;
                                    break;
                                }
                            }
                            return result;
                        }
                    },
                    {field: 'PAYSTATUS_INFO', align: 'center', title: '支付状态说明', width: 180, sort: false},
                    {field: 'REFUND_COST', align: 'center', title: '退款金额', width: 180, sort: false},
                    {field: 'CAN_REFUND_COST', align: 'center', title: '可退金额', width: 180, sort: false},
                    {
                        field: 'REFUND_STATE', align: 'center', title: '退款状态', width: 180, sort: false,
                        templet: function (d) {
                            let result = "";
                            for (let i = 0; i < reStates.length; i++) {
                                let obj = reStates[i];
                                if (d.REFUND_STATE === obj.dicvalue) {
                                    result = obj.dicname;
                                    break;
                                }
                            }
                            return result;
                        }
                    },
                    {field: 'ORG_CODE', align: 'center', title: '机构代码', width: 180, sort: false},
                    {field: 'APP_CODE', align: 'center', title: '应用代码', width: 180, sort: false},
                    {field: 'TERMINAL_CODE', align: 'center', title: '终端代码', width: 180, sort: false},
                    {field: 'TIME_STAMP', align: 'center', title: '时间戳', width: 180, sort: false},
                    {field: 'OTHER_INFO', align: 'center', title: '其他信息', width: 180, sort: false},
                    // {title: '操作', align: 'center', width: 150, toolbar: '#barDemo'},

                ]
            ],
            data: []
        });


        //时间控件
        laydate.render({
            elem: '#searchDate'
            , type: 'date'
            , range: '~'
        });

        search();
    });

    //查询
    function search(num) {
        num = num === null ? 1 : num;
        let url = "/transcationsLog/findTradeRecords";
        let param = {};

        let jyly = $("#jyly").val();
        param.jyly = jyly;
        param.likeFiled = $("#likeFiled").val();
        let date = $("#searchDate").val();
        if (date !== '') {
            let time = date.split("~");
            let startTime = time[0].trim();
            let endTime = time[1].trim();

            param.startTime = startTime;
            param.endTime = endTime;

            $(".selectDate").text(startTime + " ~ " + endTime);
        }

        table.reload('test', {
            method: 'get',
            url: url,
            where: param,
            page: {
                curr: num
            }
        });

        // 表格操作
        // table.on('tool(test)', function (obj) {
        //     selectData = obj.data;
        //     let data = obj.data;
        //
        //     if (obj.event === 'refundMoney') {
        //         layer.confirm("确定核实无误，需要退款？", function (index) {
        //             refundMoney(data);
        //             layer.close(index);
        //         });
        //
        //     }
        // });

        // function refundMoney(data) {

        //调用退款接口
        // let url="/hisBillLog/restartGetBill";
        // let param={};
        // param.trade_date=data.TRADE_DATE;
        // let load = layer.load();
        // AjaxPostJson(url,param,function (resultDate) {
        //     layer.close(load);
        //     if (resultDate.errCode==="0"){
        //         layer.alert("重新获取成功");
        //     }else{
        //         layer.alert(resultDate.errMsg);
        //     }
        // });
        // }

        // let url2 = "/thirdDetail/findThirdCountData"
        // AjaxPostJson(url2, param, function (data) {
        //     if (data.errCode === '0') {
        //         let thirdNum = data.num;
        //         let thirdMoney = data.money;
        //         let htmlStr = "<div style='height: 40px;width: 100%;font-size: 14px;'>" +
        //             "交易笔数共" + thirdNum + "笔,汇总金额" + thirdMoney + "元"
        //         "</div>";
        //         $(".layui-table-page").prepend(htmlStr);
        //     } else {
        //
        //     }
        // }
        // )
    }

    //导出
    // function exportExcel() {
    //     let url = "/thirdDetail/exportThirdDetail";
    //     let param = {};
    //
    //     param.payType = $("#searchPayType").val();
    //     param.likeFiled = $("#likeFiled").val();
    //     let date = $("#searchDate").val();
    //     if (date !== '') {
    //         let time = date.split("~");
    //         let startTime = time[0].trim();
    //         let endTime = time[1].trim();
    //
    //         param.startTime = startTime;
    //         param.endTime = endTime;
    //
    //     }
    //
    //     let dowloadName = "三方账单明细";
    //     param.dowloadName = dowloadName;
    //     let load = layer.load();
    //     AjaxPostJson(url, param, function (data) {
    //         layer.close(load);
    //         if (data.errCode === "0") {
    //             let fileName = data.dlName;
    //             location.href = '/download?fileName=' + fileName + '&dowloadName=' + dowloadName;
    //         } else {
    //             layer.alert(data.errMsg);
    //         }
    //     });
    // }
</script>
</html>