require('admin/user.page.css');
require('bootpag/lib/jquery.bootpag.min');

const _ = require('lodash');
const moment = require('moment');

function bind_delete_user() {
    const deleteFn = function() {
        const userId = $(this).data('id');

        $.ajax({
            method: 'post',
            url: '/admin/api/user/deleteInfoUser',
            data: {
                userId
            }
        })
        .then(() => {
            location.reload();
        });
    };

    $(document).on('click', '.btn-delete-user', deleteFn);
}

function bind_export_user_list() {
    const exportFn = function() {
        window.open('/admin/api/user/exportInfoUserList', '_blank');
    };

    $('.btn-export-user-list').on('click', exportFn);
}

function bind_table_pagination() {
    const $ul = $('.user-list');
    const $up = $('.user-pagination');

    const fetchRender = (pageNo, pageSize) => {
        $.ajax({
            url: '/admin/api/user/users_list',
            data: {
                pageNo,
                pageSize
            }
        })
            .then(result => {
                console.log(result);
                const list = result.data;
                const totalPage = result.totalPage;

                let html = '';

                _.each(list, item => {
                    item.userBirthday = moment(item.userBirthday).format('YYYY-MM-DD');
                    item.userGender = ['男', '女'][item.userGender];
                    html += `
                    <tr class="even pointer">
                        <td class="">${item.id}</td>
                        <td class="">${item.userName}</td>
                        <td class="">${item.userPhone}</td>
                        <td class="">${item.userEmail}</td>
                        <td class="">${item.userProvince}-${item.userCity}</td>
                        <td class="">${item.userBirthday}</td>
                        <td class="">${item.userGender}</td>
                        <td class="">
                            <button class="btn btn-danger btn-delete-user" data-id="${item.id}">删除用户
                            </button>
                        </td>
                    </tr>`;
                });

                $ul.html(html);

                if (pageNo === 1) {
                    $up.bootpag({
                        total: totalPage,
                        page: 1,
                        maxVisible: 10,
                    }).on('page', function(event, num) {
                        fetchRender(num, 20);
                    });
                }
            });
    };

    fetchRender(1, 20);
}

(function() {
    bind_delete_user();
    bind_export_user_list();
    bind_table_pagination();
}());