report/app/admin/view/Talent/build_form.html

{extend name="layout/content"}
{block name="content"}
<style type="text/css">
    .layui-layer-btn .layui-layer-btn1 {
        border-color: #009688;
        background-color: #009688;
        color: #fff;
    }
    .base .form-check{float:left;margin:5px;}
</style>
<div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>创建表单模板</h5>
            </div>
            <div class="ibox-content">
                <div class="row row-lg">
                    <div class="col-sm-12">
                        <div class="row">                            
                            <div class="col-sm-3">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-btn">
                                        <button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
                                            选择表单类型
                                        </button>
                                    </div>
                                    <select class="form-control" name="type">
                                        <option value="1">人才认定申请</option>
                                    </select>
                                </div>
                            </div>               
                            <div class="col-sm-3">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-btn">
                                        <button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
                                            针对人才类型
                                        </button>
                                    </div>
                                    <select class="form-control" name="talentType">
                                        <option>全部人才</option>
                                        <option value="1">优秀人才</option>
                                        <option value="2">人才认定申请</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <fieldset>
                            <legend>个人信息</legend>
                            <div class="row base">               
                                <div class="col-sm-12">
                                    <div class="form-check">
                                        <label class="form-check-label">
                                            <input type="checkbox" name="name" class="form-check-input" value="" checked="" autocomplete="off">姓名
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <label class="form-check-label">
                                            <input type="checkbox" name="sex" class="form-check-input" value="" checked="" autocomplete="off">性别
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <label class="form-check-label">
                                            <input type="checkbox" name="sex" class="form-check-input" value="" checked="" autocomplete="off">单位标签
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <label class="form-check-label">
                                            <input type="checkbox" name="sex" class="form-check-input" value="" checked="" autocomplete="off">单位名称
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </fieldset>
                        <div class="hidden-xs" id="TalentInfoTableToolbar" role="group">
                            <button type="button" class="btn btn-sm btn-primary " onclick="addField()" id="">
                                <i class="fa fa-plus"></i>&nbsp;添加字典字段
                            </button>
                        </div>
                        <table id="form" class="table-condensed table table-bordered table-hover table-sm table-striped">
                            <thead>
                                <tr>
                                    <th>字段</th>
                                    <th>是否必选</th>
                                    <th>选择附件</th>
                                    <th>排序</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--<script src="${ctxPath}/static/modular/gate/talentInfo/talentInfo.js"></script>-->
<script>
    var __initialize = function () {
        var count = $(".base input[type=checkbox]").length;
        for (var i = 0; i < count; i++) {
            var chk = $(".base input[type=checkbox]").eq(i);
            if (chk.is(":checked")) {
                var value = chk.attr("name");
                var text = chk.parent().text();
                addToTable(value, text);
            }
        }
    }();
    function addField() {
        layer.open({
            type: 2,
            title: "添加字段",
            fixed: false,
            content: "/admin/talent/add_field",
            area: ['50%', '50%'],
            maxmin: true,
            success: function (layero, index) {

            }
        });
    }
    function addToTable(value, text) {
        if ($("#form").find("input[name='field[]'][value='" + value + "']").length == 0) {
            var tr = '<tr><td>' + text + '<input type="hidden" name="field[]" value="' + value + '"></td><td><input type="checkbox" name="need[]" checked=""></td><td><button class="btn btn-sm btn-primary" onclick="chooseFile(this);">选择附件</button><input type="hidden" name="file[]"></td><td><input name="order[]" value="1"></td><td><button class="btn btn-sm btn-primary" onclick="remove(this);">删除</button></td></tr>';
            $("#form tbody").append(tr);
        }
    }
    function remove(obj) {
        var tr = $(obj).parents("tr");
        var name = tr.find("input[type=checkbox]").attr("name");
        $(obj).parents("tr").remove();
        $(".base input[type=checkbox][name='" + name + "']").prop("checked", false);
    }
    $(".base input[type=checkbox]").change(function () {
        if ($(this).is(":checked")) {
            var value = $(this).attr("name");
            var text = $(this).parent().text();
            addToTable(value, text);
        }
    })
</script>
<script type="text/javascript">
    document.write('<script src="/static/modular/gate/talentInfo/talentInfo.js?v=' + (new Date()).getTime() + '"><\/script>');
    document.write('<script src="/static/modular/common/config.js?v=' + (new Date()).getTime() + '"><\/script>');
</script>
{/block}