| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183 | <!doctype html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
</head>
<body>
<div id="name"></div>
<div id="kv"></div>
<div id="email"></div>
<div id="tel"></div>
<div id="item_name"></div>
<div id="is_ide"></div>
<div id="id_acc"></div>
<div id="hr1"></div>
<div id="form_ida"></div>
<div id="form_idb"></div>
<div id="form_acc"></div>
<div id="form_main"></div>
<div id="pdf"></div>
<script>
    $(document).ready(function () {
        (function () {
            var hash = getUrlParameter('h');
            $.ajax({
                url: '/api2021/getinfo/' + hash,
                type: 'GET',
                async: false,
                timeout: 1000,
                success: function (data) {
                    if (data.succ == true) {
                        // 渲染活動
                        $("#name").html('活動名稱: ' + data.info.name);
                        $("#kv").html('活動主視覺: ' + '<img src="/' + data.info.kv + '" width="100">');
                        $("#email").html('聯絡人信箱: ' + data.info.email);
                        $("#tel").html('聯絡人電話: ' + data.info.tel);
                        $("#item_name").html('獎項名稱: ' + data.info.item_name);
                        $("#is_ide").html('是否要身分證: ' + data.info.is_ide);
                        $("#id_acc").html('是否要存摺: ' + data.info.id_acc);
                        $("#hr1").html('<hr>');
                        // 渲染輸入物件
                        $("#form_main").html('<hr>基本資料: <form id="main" enctype="application/x-www-form-urlencoded">' +
                            '姓名: <input name="name" type="text" maxlength="50" /> <br>' +
                            '身分證號: <input name="identity" type="text" maxlength="10" /> <br>' +
                            '戶籍地址: <input name="add_host" type="text" maxlength="200" /> <br>' +
                            '通訊地址: <input name="add_contact" type="text" maxlength="200" /> <br>' +
                            '電話: <input name="tel" type="text" maxlength="20" /> <br>' +
                            '<input id="ida_url" type="hidden" name="ida" />' +
                            '<input id="idb_url" type="hidden" name="idb" />' +
                            '<input id="acc_url" type="hidden" name="acc" />' +
                            '<input type="submit" value="最後提交"/>' +
                            '</form>');
                        $('#main').on('submit', (function (e) {
                            e.preventDefault();
                            var formData = new FormData(this);
                            $.ajax({
                                type: 'POST',
                                url: '/api2021/savedata/' + hash,
                                data: formData,
                                cache: false,
                                contentType: false,
                                processData: false,
                                success: function (data) {
                                    if (data.succ == true) {
                                        $("#pdf").html('申報資料: ' + '<a href="/' + data.url + '" target="_blank">下載</a>');
                                    } else {
                                        alert(data.err);
                                    }
                                },
                                error: function (data) {
                                }
                            });
                        }));
                        // 渲染聯動物件
                        if (data.info.is_ide == 'Y') {
                            // 身分證正面
                            $("#form_ida").html('身分證正面: <div id="ida_preview"></div><form id="ida" enctype="multipart/form-data"><input type="file" name="img" /><input type="hidden" name="type" value="ida" /><input type="submit" value="Upload"/></form>');
                            $('#ida').on('submit', (function (e) {
                                e.preventDefault();
                                var formData = new FormData(this);
                                $.ajax({
                                    type: 'POST',
                                    url: '/api2021/saveimg/' + hash,
                                    data: formData,
                                    cache: false,
                                    contentType: false,
                                    processData: false,
                                    success: function (data) {
                                        if (data.succ == true) {
                                            $("#ida_url").val(data.url);
                                            $("#ida_preview").html('預覽: ' + '<img src="/' + data.url + '" width="100">');
                                        } else {
                                            alert(data.err);
                                        }
                                    },
                                    error: function (data) {
                                    }
                                });
                            }));
                            // 身分證反面
                            $("#form_idb").html('身分證反面: <div id="idb_preview"></div><form id="idb" enctype="multipart/form-data"><input type="file" name="img" /><input type="hidden" name="type" value="idb" /><input type="submit" value="Upload"/></form>');
                            $('#idb').on('submit', (function (e) {
                                e.preventDefault();
                                var formData = new FormData(this);
                                $.ajax({
                                    type: 'POST',
                                    url: '/api2021/saveimg/' + hash,
                                    data: formData,
                                    cache: false,
                                    contentType: false,
                                    processData: false,
                                    success: function (data) {
                                        if (data.succ == true) {
                                            $("#idb_url").val(data.url);
                                            $("#idb_preview").html('預覽: ' + '<img src="/' + data.url + '" width="100">');
                                        } else {
                                            alert(data.err);
                                        }
                                    },
                                    error: function (data) {
                                    }
                                });
                            }));
                        }
                        if (data.info.id_acc == 'Y') {
                            // 存摺
                            $("#form_acc").html('存摺: <div id="acc_preview"></div><form id="acc" enctype="multipart/form-data"><input type="file" name="img" /><input type="hidden" name="type" value="acc" /><input type="submit" value="Upload"/></form>');
                            $('#ACC').on('submit', (function (e) {
                                e.preventDefault();
                                var formData = new FormData(this);
                                $.ajax({
                                    type: 'POST',
                                    url: '/api2021/saveimg/' + hash,
                                    data: formData,
                                    cache: false,
                                    contentType: false,
                                    processData: false,
                                    success: function (data) {
                                        if (data.succ == true) {
                                            $("#acc_url").val(data.url);
                                            $("#acc_preview").html('預覽: ' + '<img src="/' + data.url + '" width="100">');
                                        } else {
                                            alert(data.err);
                                        }
                                    },
                                    error: function (data) {
                                    }
                                });
                            }));
                        }
                    } else {
                        alert(data.err);
                    }
                },
                error: function (xhr) {
                }
            });
        })();
    });
    // 取得網址參
    var getUrlParameter = function getUrlParameter(sParam) {
        var sPageURL = window.location.search.substring(1),
            sURLVariables = sPageURL.split('&'),
            sParameterName,
            i;
        for (i = 0; i < sURLVariables.length; i++) {
            sParameterName = sURLVariables[i].split('=');
            if (sParameterName[0] === sParam) {
                return typeof sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
            }
        }
        return false;
    }
</script>
</body>
</html>
 |