<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>查看费用管理</title>
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
    <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<form class="layui-form" action="" lay-filter="formDemo">
    <div class="layui-tab layui-tab-card">
        <ul class="layui-tab-title">
            <li class="layui-this">常规</li>
            <li>转移记录</li>
            <li>项目信息</li>
        </ul>
        <div class="layui-tab-content">
            <!--常规开始-->
            <div class="layui-tab-item layui-show" style="min-height: 550px">
                <form class="layui-form" action="" lay-filter="formDemo">
                    <div class="layui-form layuimini-form" style="padding-bottom: 100px">
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">费用名称</label>
                            <div class="layui-input-inline" style="width: 725px">
                                <input type="text" id="fymc" name="fymc" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">年预算</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="nfy" name="nfy" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">编码</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="bm" name="bm" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">父级</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="number" id="fj" name="fj" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">排序</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="px" name="px" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">合计编码</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="hjbm" name="hjbm" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">备注</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="bz" name="bz" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">系统计算已执行</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="xtjsyzx" name="xtjsyzx" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">实际已执行</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="sjyzx" name="sjyzx" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">任务书预算</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="rwsys" name="rwsys" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">项目总预算</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="xmzys" name="xmzys" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">预算金额</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="ysje" name="ysje" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">项目组</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="xmz" name="xmz" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">转出金额</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="zcje" name="zcje" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">转入金额</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="zrje" name="zrje" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">已申请金额</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="ysqje" name="ysqje" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">已报账金额</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="ybzje" name="ybzje" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label " style="width: 100px">备用金</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="byj" name="byj" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">转出备用金</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="zcbyj" name="zcbyj" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">转入备用金</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="zrbyj" name="zrbyj" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">备用金已申请</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="byjysq" name="byjysq" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 100px">备用金已报账</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="byjybz" name="byjybz" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 85px">当年转移支付</label>
                            <div class="layui-input-inline" style="width: 300px">
                                <input type="text" id="dnzyzf" name="dnzyzf" class="layui-input" readonly>
                            </div>
                        </div>

                        <!-- 右侧悬浮按钮 -->
                        <div class="right-bottom-btn">
                            <button class="layui-btn" lay-filter="cancleBtn">
                                <i class="layui-icon layui-icon-close"></i>关闭
                            </button>
                        </div>
                    </div>
                </form>
            </div>
            <!--常规结束-->
            <!--转移记录开始-->
            <div class="layui-tab-item" style="height: 550px; margin-left: 30px; margin-right: 30px">
                <form class="layui-form" action="" lay-filter="formDemo">
                    <div class="layui-form layuimini-form" style="padding-bottom: 100px">
                        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
                        <!-- 右侧悬浮按钮 -->
                        <div class="right-bottom-btn">
                            <button class="layui-btn" lay-filter="cancleBtn">
                                <i class="layui-icon layui-icon-close"></i>关闭
                            </button>
                        </div>
                    </div>
                </form>
            </div>
            <!--转移记录结束-->
            <!--项目信息开始-->
            <div class="layui-tab-item" style="height: 550px">
                <form class="layui-form" action="" lay-filter="formDemo">
                    <div class="layui-form layuimini-form" style="padding-bottom: 100px">
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 80px">项目名称</label>
                            <div class="layui-input-inline" style="width: 760px">
                                <input type="text" id="xmmc" name="xmmc" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 80px">ERP编号</label>
                            <div class="layui-input-inline" style="width: 330px">
                                <input type="text" id="erpbh" name="erpbh" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 60px">项目类型</label>
                            <div class="layui-input-inline" style="width: 330px">
                                <input type="text" id="xmlxmc" name="xmlxmc" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 80px">项目负责人</label>
                            <div class="layui-input-inline" style="width: 330px">
                                <input type="text" id="xmfzrxm" name="xmfzrxm" class="layui-input" readonly>
                            </div>
                            <label class="layui-form-label" style="width: 60px">所属部门</label>
                            <div class="layui-input-inline" style="width: 330px">
                                <input type="text" id="ssbmmc" name="ssbmmc" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 80px">项目</label>
                            <div class="layui-input-inline" style="width: 760px">
                                <input type="text" id="xm" name="xm" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline" style="width: 100%">
                            <label class="layui-form-label" style="width: 80px">年度预算</label>
                            <div class="layui-input-inline" style="width: 330px">
                                <input type="text" id="ndys" name="ndys" class="layui-input" readonly>
                            </div>
                        </div>
                        <!-- 右侧悬浮按钮 -->
                        <div class="right-bottom-btn">
                            <button class="layui-btn" lay-filter="cancleBtn">
                                <i class="layui-icon layui-icon-close"></i>关闭
                            </button>
                        </div>
                    </div>
                </form>
            </div>
            <!--项目信息结束-->
        </div>
    </div>
</form>

<script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" charset="utf-8"></script>
<script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
<script th:src="@{/lib/coco-message/coco-message.js}" charset="utf-8"></script>
<script th:src="@{/lib/xm-select-v1.2.2/xm-select.js}" charset="utf-8"></script>
<script th:src="@{/js/lay-config.js}" charset="utf-8"></script>

<script type="text/javascript" th:inline="javascript">
    AjaxUtil.ctx = /*[[@{/}]]*/'';

    layui.use(['form', 'table'], function () {
        var form = layui.form,
            table = layui.table,
            layer = layui.layer;

        //转移记录
        var dataRecord = new Array();
        // $.ajax({
        //     url: AjaxUtil.ctx + 'staTravelexpenses/list/' + fyApproval.id,
        //     type: "post",
        //     async: false,
        //     dataType: "json",
        //     success: function(result) {
        //         dataRecord = result.data.rows;
        //     }
        // });
        var currTable = table.render({
            elem: '#currentTableId',
            data: dataRecord,
            cols: [
                [
                    {type: 'numbers', align: 'center'},
                    {field: 'lx', title: '类型', width: '20%'},
                    {field: 'nys', title: '年预算', width: '20%'},
                    {field: 'lymx', title: '来源明细', width: '15%'},
                    {field: 'mbmx', title: '目标明细', width: '15%'},
                    {field: 'je', title: '金额(万元)', width: '10%'}
                ]
            ]
        });

        //双击（转移记录）
        table.on('rowDouble(currentTableFilter)', function (obj) {
            var data = obj.data;
            layer.open({
                title: '浏览差旅费',
                type: 2,
                maxmin: true,
                shade: 0.2,
                area: [layerwidth + 'px', layerheight + 'px'],
                content: AjaxUtil.ctx + 'staTravelexpenses/forView',
                end: function (index) {
                    layer.close(index);
                }
            });
        });

        // 监听取消按钮
        $("button[lay-filter='cancleBtn']").click(function () {
            var iframeIndex = parent.layer.getFrameIndex(window.name);
            parent.layer.close(iframeIndex);
        });
    });
</script>
</body>
</html>