<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改职责组')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-volunteers-edit" th:object="${smileVolunteersDetailsVo}">
        <input name="projectId" th:value="*{projectId}" type="hidden">
        <input name="uid" th:value="*{uid}" type="hidden">
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">审核状态：</label>
            <div class="col-sm-8">
                <input name="status" class="form-control" type="text" th:if="*{status==0}" th:value="待审核" readonly
                       required>
                <input name="status" class="form-control" type="text" th:if="*{status==1}" th:value="通过" readonly
                       required>
                <input name="status" class="form-control" type="text" th:if="*{status==2}" th:value="拒绝" readonly
                       required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">姓名：</label>
            <div class="col-sm-8">
                <input name="name" class="form-control" type="text" th:value="*{name}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">头像：</label>
            <div class="col-sm-8">
                <!--                <input name="img" class="form-control" type="text" th:value="*{img}" readonly required>-->
                <img class="img-details" style="height: 400px;" name="img" th:src="*{img}"
                     th:onclick="click_big([[*{img}]])">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">证件号：</label>
            <div class="col-sm-8">
                <input name="idCard" class="form-control" type="text" th:value="*{idCard}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">性别：</label>
            <div class="col-sm-8">
                <input name="sex" class="form-control" type="text" th:if="*{sex==0}" th:value="未知" readonly required>
                <input name="sex" class="form-control" type="text" th:if="*{sex==1}" th:value="男" readonly required>
                <input name="sex" class="form-control" type="text" th:if="*{sex==2}" th:value="女" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">学校：</label>
            <div class="col-sm-8">
                <input name="school" class="form-control" type="text" th:value="*{school}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">学校地址：</label>
            <div class="col-sm-8">
                <input name="schoolAddress" class="form-control" type="text" th:value="*{schoolAddress}" readonly
                       required>
            </div>
        </div>
<!--        <div class="form-group">-->
<!--            <label class="col-sm-3 control-label is-required">专长：</label>-->
<!--            <div class="col-sm-8">-->
<!--                <input name="specialty" class="form-control" type="text" th:value="*{specialty}" readonly required>-->
<!--            </div>-->
<!--        </div>-->
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">特长：</label>
            <div class="col-sm-8">
                <input name="specialty2" class="form-control" type="text" th:value="*{specialty2}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">手机号：</label>
            <div class="col-sm-8">
                <input name="phone" class="form-control" type="text" th:value="*{phone}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">项目名称：</label>
            <div class="col-sm-8">
                <input name="projectName" class="form-control" type="text" th:value="*{projectName}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">自我介绍：</label>
            <div class="col-sm-8">
                <textarea name="introduce" class="form-control" style="height: 200px; font-size: 14px;" type="text" th:text="*{introduce}" readonly required></textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">申请时间：</label>
            <div class="col-sm-8">
                <input name="createdAt" class="form-control" type="text" th:value="*{createdAt}" readonly required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">用户申请/分配职责组：</label>
            <table id="team-table_user" class="table table-condensed table-sm" th:border="1">
                <tr>
                    <td>名称</td>
                    <td>介绍</td>
                <tr/>
                <div th:each="item : ${smileVolunteersDetailsVo.teamArray}">
                    <tr class="content-tr">
                        <td th:value="${item.name}" th:text="${item.name}">
                        </td>
                        <td th:text="${item.introduce}">
                        </td>
                    </tr>
                </div>
            </table>
        </div>
        <div class="form-group" th:if="*{status==0}">
            <label class="col-sm-3 control-label is-required">可分配申请职责组：</label>
            <table id="team-table" class="table table-condensed table-sm" th:border="1">
                <tr>
                    <td>名称</td>
                    <td>介绍</td>
                    <td>选中</td>
                <tr/>
                <div th:each="item : ${listData}">
                    <tr class="content-tr">
                        <td th:value="${item.name}" th:text="${item.name}">
                        </td>
                        <td th:text="${item.introduce}">
                        </td>
                        <td>
                            <input name="teamCheck" type="radio" th:value="${item.teamId}"> 选中</label>
                        </td>
                    </tr>
                </div>
            </table>
        </div>
        <button type="button" class="btn btn-w-m btn-success" onclick="submitHandler(1)" th:if="*{status==0}">
            通过
        </button>
        <button type="button" class="btn btn-w-m btn-warning" onclick="submitHandler(2)" th:if="*{status==0}">
            拒绝
        </button>
    </form>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var smilePrefix = ctx + "smile/volunteers";

    $("#form-roadShow-edit").validate({
        focusCleanup: true
    });

    // 点击图片放大
    function click_big(url) {
        var img_url = url
        if (url.indexOf("x-oss-process") != "-1") {
            img_url = url.split("?")[0]
        }
        var json = {
            "data": [   //相册包含的图片，数组格式
                {
                    "alt": "图片",
                    "src": img_url, //原图地址
                }
            ]
        };
        layer.photos({
            photos: json,
            closeBtn: 1, //右上角按钮，可通过配置1和2来展示，如果不显示，则closeBtn: 0
            anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
        });
    }

    function submitHandler(status) {
        var teamIds = $("input[name^='teamCheck']:checked").val()
        var uid = $("input[name^='uid']").val()
        var projectId = $("input[name^='projectId']").val()
        if (status === 1 && typeof (teamIds) == "undefined") {
            alert("请分配职责组");
        } else {
            $.operate.post(smilePrefix + "/audit",
                {
                    "projectId": projectId,
                    "uid": uid,
                    "teamId": teamIds,
                    "status": status
                }, function (res) {
                    location.reload();
                });
        }

    }
</script>
</body>
</html>