<!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-form layuimini-form" style="padding-bottom: 100px">
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">任务书</label>
            <div class="layui-input-inline" style="width: 870px">
                <input type="hidden" id="id" name="id" class="layui-input" th:value="${approveInfo.id}">
                <input type="hidden" id="xmid" name="xmid" class="layui-input" th:value="${approveInfo.xmid}">
                <input type="hidden" id="tablename" name="tablename" class="layui-input"
                       th:value="${approveInfo.tablename}">
                <input type="text" id="xm" name="xm" class="layui-input" readonly th:value="${approveInfo.xm}">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">状态</label>
            <div class="layui-input-inline" style="width: 600px">
                <input type="hidden" id="spzt" name="spzt" class="layui-input" th:value="${approveInfo.zt}">
                <input type="text" id="zt" name="zt" class="layui-input" readonly th:value="${approveInfo.zt}">
            </div>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" th:value="任务书修改申请" class="layui-input" readonly>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">审批操作</label>
            <div class="layui-input-inline" style="width: 870px">
                <select id="spcz" name="spcz" class="layui-input" lay-filter="spcz">
                    <option value="审批通过">审批通过</option>
                    <option value="返回修改">返回修改</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">意见</label>
            <div class="layui-input-inline" style="width: 870px" id="jyDiv1">
                <textarea id="yj" name="yj" class="layui-textarea" th:text="同意"
                          style="width: 870px;height: 100px"></textarea>
            </div>
            <div class="layui-input-inline" style="width: 870px; display: none" id="jyDiv2">
                <textarea id="yj2" name="yj2" class="layui-textarea" style="width: 870px;height: 100px"></textarea>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 95px">选择常用语</label>
            <div class="layui-input-inline" style="width: 750px">
                <select name="xmlx" id="xmlx" lay-filter="xmlx">
                    <option value="">[无]</option>
                    <!--<option th:each="cyyList:${cyyList}" th:text="${cyyList.cyy}"
                               th:value="${cyyList. id}"></option>-->
                </select>
            </div>
            <button type="button" class="layui-btn" lay-filter="cyySaveBtn" style="width: 80px">常用语</button>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">提交人</label>
            <div class="layui-input-inline" style="width: 370px">
                <input type="hidden" id="tjr" name="tjr" class="layui-input" th:value="${approveInfo.tjr}">
                <input type="text" id="tjrxm" name="tjrxm" class="layui-input" readonly th:value="${approveInfo.tjrxm}">
            </div>
            <label class="layui-form-label" style="width: 80px">提交时间</label>
            <div class="layui-input-inline" style="width: 380px">
                <input type="text" id="tjsj" name="tjsj" class="layui-input" readonly th:value="${approveInfo.tjsj}">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 65px">审核人</label>
            <div class="layui-input-inline" style="width: 370px">
                <input type="hidden" id="userId" name="userId" class="layui-input" th:value="${userInfo.userId}">
                <input type="hidden" id="shr" name="shr" class="layui-input" th:value="${approveInfo.shr}">
                <input type="text" id="shrxm" name="shrxm" class="layui-input" th:value="${approveInfo.shrxm}" readonly>
            </div>
            <label class="layui-form-label" style="width: 80px">审核时间</label>
            <div class="layui-input-inline" style="width: 380px">
                <input type="text" id="shsj" name="shsj" class="layui-input">
            </div>
        </div>

        <!-- 右侧悬浮按钮 -->
        <div class="right-bottom-btn">
            <button type="button" class="layui-btn" lay-filter="viewRwsBtn">
                <i class="layui-icon layui-icon-file"></i>查看任务书
            </button>
            <button type="button" class="layui-btn" lay-filter="viewSplistBtn">
                <i class="layui-icon layui-icon-file"></i>审批列表
            </button>
            <button type="button" class="layui-btn" lay-submit lay-filter="saveBtn">
                <i class="layui-icon layui-icon-ok"></i>提交
            </button>
            <button class="layui-btn" lay-filter="cancleBtn">
                <i class="layui-icon layui-icon-close"></i>取消
            </button>
        </div>
    </div>
</form>
</body>
<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">
    function getInit() {
        var userId = document.getElementById('userId').value;
        //初始化常用语
        $.ajax({
            type: "get",
            url: AjaxUtil.ctx + "prjProject/init_cyy/" + userId,
            async: true,
            success: function (data) {
                var cyyList = [];
                for (var item in data) {
                    cyyList.push(data[item]);
                }

                for (var i = 0; i < cyyList.length; i++) {
                    $("#xmlx").append("<option value = '" + cyyList[i].id + "'>" + cyyList[i].cyy + "</option>");
                    //重新渲染
                    layui.form.render("select");
                }
            }
        });
        var spcz = $("#spcz").val();
        console.log("审核状态是" + spcz);

        if (spcz === "返回修改") {
            document.getElementById('yj').value = document.getElementById('yj2').value;
            alert("修改后的意见是" + document.getElementById('yj').value);
        }
    }

    AjaxUtil.ctx = /*[[@{/}]]*/'';
    layui.use(['form', 'tableSelect', 'laydate', 'element'], function () {
        var form = layui.form,
            layer = layui.layer,
            laydate = layui.laydate,
            element = layui.element;

        var xmApproval = parent.getXmApproval();

        //提交时间
        laydate.render({
            elem: '#shsj',
            type: 'datetime',
            value: new Date()
        });

        element.render('checkbox');
        form.on('select(spcz)', function (data) {
            if (data.value == "审批通过") {
                document.getElementById('jyDiv1').style.display = 'block';
                document.getElementById('jyDiv2').style.display = 'none';
            } else {
                document.getElementById('jyDiv1').style.display = 'none';
                document.getElementById('jyDiv2').style.display = 'block';
            }
        });
        // 渲染复选框元素
        element.render('checkbox');

        // 监听下拉菜单选择事件
        form.on('select(xmlx)', function () {
            // 获取选中的选项
            var selectedOption = document.getElementById('xmlx').options[document.getElementById('xmlx').selectedIndex];
            var newValue = selectedOption.text; // 获取选项文本

            // 更新元素内容和值
            var yj2 = document.getElementById('yj2');
            var yj = document.getElementById('yj');

            yj2.innerText = newValue;
            yj.innerText = newValue;
            yj2.value = newValue;
            yj.value = newValue;

            // 修改意见内容
            var modifiedValue = prompt("请输入修改后的意见内容：", newValue); // 提示用户输入修改后的内容

            // 更新元素值
            yj2.value = modifiedValue;
            yj.value = modifiedValue;

            // 最后展示修改后的意见
            console.log("修改后的意见是" + modifiedValue);
        });


        //初始化
        getInit();
        //gst ccy 监听常用语按钮
        $("button[lay-filter='cyySaveBtn']").click(function () {
            parent.layer.open({
                title: '查看常用',
                type: 2,
                shade: 0.3,
                maxmin: true,
                shadeClose: true,
                area: ['1080px', layerheight + 'px'],
                // content: AjaxUtil.ctx + '/prjProject/forCyy/' + $("#userId").val(),
                content: AjaxUtil.ctx + 'prjProject/forCyyy',
                end: function (index) {
                    $("#xmlx").empty();
                    $("#xmlx").append("<option>[无]</option>");
                    getInit();
                }
            });
        });


        // 监听查看可研报告按钮
        $("button[lay-filter='viewRwsBtn']").click(function () {
            parent.layer.open({
                title: '查看项目任务书',
                type: 2,
                shade: 0.3,
                maxmin: true,
                shadeClose: true,
                area: ['1080px', layerheight + 'px'],
                content: AjaxUtil.ctx + 'prjProject/forView/' + xmApproval.xmid,
                end: function (index) {

                }
            });
        });

        // 监听审批列表按钮
        $("button[lay-filter='viewSplistBtn']").click(function () {
            parent.layer.open({
                title: '审批列表',
                type: 2,
                shade: 0.3,
                maxmin: true,
                shadeClose: true,
                area: ['1300px', '750px'],
                content: AjaxUtil.ctx + 'prjProject/forApproveList',
                end: function (index) {

                }
            });
        });

        // 监听提交按钮
        form.on('submit(saveBtn)', function (data) {
            var zt = $("#zt").val();
            var shr = $("#shr").val();
            var userId = $("#userId").val();
            if (userId != shr)
                Message.error("您不是指定的审核人！", 1500);
            else if (zt == '数据不匹配')
                Message.error("数据不匹配，请联系管理员处理！", 1500);
            else {
                //基本信息
                layer.load(0, {shade: 0.1});
                //1.修改审批列表的状态
                AjaxUtil.post({
                    url: AjaxUtil.ctx + "prjApproverecord/doUpdateApprove",
                    data: data.field,
                    success: function (res) {
                        layer.load(0, {shade: 0.1});
                        if (spcz != '返回修改') {
                            //2.修改列表中的值
                            AjaxUtil.post({
                                url: AjaxUtil.ctx + "prjBudgetRecord/doUpdate/" + xmApproval.xmid,
                                data: data.field,
                                success: function (res) {
                                    //3.添加修改记录
                                    AjaxUtil.post({
                                        url: AjaxUtil.ctx + 'prjProject/addPrjProjectRecord/' + xmApproval.xmid,
                                        data: data.field,
                                        success: function (res) {
                                            //同步年度预算列表
                                            AjaxUtil.get({
                                                url: AjaxUtil.ctx + "updatePrj_AnnualBudgetDetail/?rws="+ xmApproval.xmid,
                                                contentType: "application/json",
                                                success: function (res) {

                                                    parent.setUpdateFlag();
                                                    var iframeIndex = parent.layer.getFrameIndex(window.name);
                                                    parent.layer.close(iframeIndex);
                                                    // 重载表格
                                                    currTable.reload();

                                                },
                                                error: function (error) {
                                                }
                                            });

                                        }
                                    });
                                },
                                error: function (error) {
                                }
                            });
                        }else {
                            var iframeIndex = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(iframeIndex);
                            setUpdateFlag()
                        }
                    },
                    error: function (error) {
                    }
                });
            }
        });

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


</script>
</html>