<template>
    <section class="content">
        <div class="box box-primary">
            <section class="content-header">
                <h1 id="itemTitle"></h1>
            </section>

            <section class="content">
                <div id="table"></div>
                <div id="toolbar">
                    <div class="col-sm-12">
                        <div class="pull-left">
                            <form action="/admin/findLove/data/export" id="searchForm">
                                平台号：<input type="text" id="msNo" name="msNo" class="input-sm" placeholder="请输入平台号">

                                奖品名称：<input type="text" id="prizeName" name="prizeName" class="input-sm"
                                    placeholder="请输入奖品名称">

                                日期：<input type="text" name="startDate" id="timeBegin" class="input-sm datetime"
                                    placeholder="起始时间">
                                - <input type="text" name="endDate" id="timeEnd" class="input-sm datetime"
                                    placeholder="结束时间">

                            </form>
                        </div>

                        <div class="pull-right">
                            &nbsp;&nbsp;&nbsp;&nbsp;<button id="searchBtn" class="btn btn-primary">筛选</button>
                            <button id="exportBtn" class="btn btn-primary">导出</button>
                        </div>
                    </div>

                </div>
            </section>
        </div>
    </section>
</template>

<script>
import TableHelper from '@/utils/bootstrap-table-helper';

export default {
    name: "FindLovePrizeDrawRecordAdminView",
    setup() {
        return {};
    },
    created() {
        this.$nextTick(function () {
            this.initData();
        });
    },
    methods: {
        initData() {
            $(function () {

                $('.datetime').datetimepicker({
                    language: 'zh-CN',
                    format: 'yyyy-mm-dd hh:ii:00',
                    autoclose: true
                });

                var main = {
                    init: function () {
                        this.eventRegister();
                        this.getDataFromBack();
                    },

                    eventRegister: function () {
                        // 筛选按钮点击事件
                        $('#searchBtn').on('click', function () {
                            TableHelper.doRefresh('#table');
                        });

                        $("#exportBtn").on('click', function () {
                            $("#searchForm").submit();
                        })
                    },

                    getDataFromBack: function () {

                    }
                };
                main.init();

                $('#table').bootstrapTable('destroy');
                $('#table').bootstrapTable({
                    columns: [
                        { field: 'erbanNo', title: '平台号', align: 'center', valign: 'middle', width: '10%' },
                        { field: 'nick', title: '用户昵称', align: 'center', valign: 'middle', width: '10%' },
                        { field: 'giftName', title: '奖品名称', align: 'center', valign: 'middle', width: '10%' },
                        { field: 'num', title: '数量', align: 'center', valign: 'middle', width: '10%' },
                        {
                            field: 'createTime', title: '抽奖时间', align: 'center', valign: 'middle', width: '20%', formatter: function (val, row, index) {
                                if (val) {
                                    var date = new Date(val);
                                    return date.format('yyyy-MM-dd hh:mm:ss');
                                } else {
                                    return '-';
                                }
                            }
                        },
                        { field: 'level', title: '礼物等级', align: 'center', valign: 'middle', width: '10%' },
                        { field: 'diamonds', title: '金币单价', align: 'center', valign: 'middle', width: '10%' },
                        {
                            field: 'poolType', title: '礼物组类型', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
                                switch (row.poolType) {
                                    case 1:
                                        return '普通礼物组';
                                     
                                    case 2:
                                        return '高级礼物组';
                

                                }
                            }
                        }
                    ],
                    cache: false,
                    striped: true,
                    showRefresh: false,
                    pageSize: 20,
                    pagination: true,
                    pageList: [20, 30, 50],
                    sidePagination: 'server',
                    queryParamsType: 'undefined',
                    queryParams: function queryParams(params) {
                        var param = {
                            pageSize: params.pageSize,
                            pageNumber: params.pageNumber,
                            startDate: $('#timeBegin').val(),
                            endDate: $('#timeEnd').val(),
                            msNo: $('#msNo').val(),
                            prizeName: $("#prizeName").val()
                        };
                        return param;
                    },
                    uniqueId: 'id',
                    toolbar: '#toolbar',
                    url: '/admin/findLove/data/listDrawRecord',
                    onLOadSuccess: function () {
                        console.log('load success');
                    },
                    onLoadError: function () {
                        console.log('load fail');
                    }
                });
            })
        }
    },

};
</script>

<style scoped></style>