<style>
    p {
        font-size: 15px;
        margin: 20px 0;
    }
</style>
<h2>我的设置</h2>
<form action="" method="POST" enctype="multipart/form-data">
    <p>
        <label for="time">入职时间：</label>
        <input type="date" name="time" value="{{ result.time }}">
    </p>
    <p>
        <label for="introduction" style="vertical-align: top;">诚信宣言：</label>
        <textarea name="introduction" placeholder="请输入诚信宣言" rows="10" cols="50" style="resize: none;">{{ result.introduction }}</textarea>
    </p>
    <table class="form-table">
        <tbody id="QRcodeTable" >
            {% if result.QRcodeImg %}
            <tr>
                <td>
                    <img src=" {{siteUrl}}{{result.QRcodeImg}}"  height="90" width="140" >
                    <input type="hidden" name="oldImg" value="1">
                </td>
            </tr>
            {% endif %}
        </tbody>
    </table>
    <p>
        <button type="button" id="QRcode" class="button action" data-toggle="modal" style="margin-top: 10px">
            微信二维码
        </button>
    </p>
    <p>
        <input type="hidden" name="user_id" value="{{ user_id }}">
        <input type="hidden" name="type" value="1">
        <input type="submit"  class="button">
    </p>
</form>
<script>
    (function ($) {
        $(document).ready(function () {
//            $('#submit').click(function () {
//                var introduction = $('#introduction').val();
//                var time = $('#time').val();
//                var user_id = $('#user_id').val();
//                $.ajax({
//                    type: 'POST',
//                    url: '{{ url }}/wp-admin/admin-ajax.php/',
//                    data: 'action=submit_introduction&time=' + time + '&introduction=' + introduction + '&user_id=' + user_id,
//                    success: function (data) {
//                        if (data) {
//                            alert('提交成功');
//                        }
//                    }
//                });
//            });

            $("#QRcode").click(function(){
                if($("#QRcodeTable > tr").length > 0){
                    $("#QRcodeTable").find("tr").remove();
                }
                var tr = $("<tr>");
                var td = $("<td>");
                var file = $("<input>").attr({"type":"file","name":"files"}).addClass("picFiles form-control").css("width","20%");
                var td2 = td.clone().css("width","30%").append(file);
                tr.append(td2);
                $("#QRcodeTable").append(tr);
            });

            $("#QRcodeTable").on("change",".picFiles",function(){
                var that = this;
                if (this.files && this.files[0]){
                    var reader = new FileReader();
                    reader.onload = function (e){
                        var img = $("<img>").attr({"src":e.target.result,"heghit":90,"width":140});
                        $(that).before(img);
                        $(that).hide();
                    }
                    reader.readAsDataURL(this.files[0]);
                }
            });
        });
    })(jQuery);
</script>