<template>
    <d2-container>
        <div class="d2-table-view-full">
            <div class="d2-table-view-header">
                <el-form size="small" :inline="true" :model="filter" @keyup.enter.native="handleList" class="demo-form-inline">
                    <el-form-item label="预约单号">
                        <el-input v-model="filter.registerCode" placeholder="预约单号" clearable/>
                    </el-form-item>
                    <el-form-item label="证件号">
                        <el-input v-model="filter.identityNo" placeholder="证件号" clearable/>
                    </el-form-item>
                    <el-form-item label="手机号">
                        <el-input v-model="filter.visitorPhone" placeholder="手机号" clearable/>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="handleList('1')">查询</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <div class="d2-table-view-content">
                <d2-crud
                        title="来访人员查询"
                        :columns="columns"
                        :data="data"
                        :options="tableOptions"
                        :loading="loading"
                ></d2-crud>
            </div>
            <div class="d2-table-view-footer">
                <el-pagination
                        @current-change="handleCurrentChange"
                        @size-change="handleSizeChange"
                        :page-size="tableOptions.pageList[0]"
                        :page-sizes="tableOptions.pageList"
                        :current-page.sync="currentPage"
                        layout="total,sizes, prev, pager, next,jumper"
                        :total="pagination.total"
                ></el-pagination>
            </div>
        </div>
    </d2-container>
</template>

<script>
    import {getPageList} from "../../../../api/visitor/visitorExcel/registerExcel";
    import {tableOptions} from "../../../../assets/options";

    export default {
        name: "index",
        data(){
            return{
                loading:false,
                tableOptions,
                currentPage:1,
                pagination:{
                    total:0
                },
                filter:{
                    id:'',
                    registerCode:'',
                    identityNo:'',
                    visitorPhone:'',
                    pageNum:1,
                    pageSize:10,
                },
                columns:[
                    {
                        title:'预约单号',
                        key:'registerCode',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'访客姓名',
                        key:'visitorName',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'证件号',
                        key:'identityNo',
                        minWidth:'180',
                        showOverflowTooltip: true
                    },
                    {
                        title:'性别',
                        key:'gender',
                        minWidth:'50',
                        showOverflowTooltip: true
                    },
                    {
                        title:'随行人数',
                        key:'accompanyNum',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'手机号',
                        key:'visitorPhone',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'来访单位',
                        key:'visitorOrg',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'车牌号',
                        key:'carNumber',
                        minWidth:'150',
                        showOverflowTooltip: true
                    },
                    {
                        title:'访客事由',
                        key:'rmk',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'访客类型',
                        key:'typeName',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'被访人工号/学号',
                        key:'intervieweeNo',
                        minWidth:'130',
                        showOverflowTooltip: true
                    },
                    {
                        title:'被访人姓名',
                        key:'intervieweeName',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'被访人部门',
                        key:'depNm',
                        minWidth:'100',
                        showOverflowTooltip: true
                    },
                    {
                        title:'到访时间',
                        key:'visitTime',
                        minWidth:'150',
                        showOverflowTooltip: true
                    },
                    {
                        title:'离访时间',
                        key:'leaveTime',
                        minWidth:'150',
                        showOverflowTooltip: true
                    },
                ],
                data:[],
            }
        },
        methods:{
            handleList(val){
                if(val){
                    this.filter.pageNum = 1
                    this.currentPage = 1
                }
                this.loading = true
                getPageList(this.filter).then(res => {
                    this.loading = false
                    this.data = res.registerPage.list
                    this.pagination.total = res.registerPage.total
                }).catch(err => {
                    this.loading = false
                })
            },
            handleCurrentChange(val){
                this.filter.pageNum = val
                this.handleList()
            },
            handleSizeChange(val){
                this.filter.pageNum = 1
                this.filter.pageSize = val
                this.handleList()
            },
        },
        mounted() {
            this.filter.pageSize = this.tableOptions.pageList[0]
            this.tableOptions = this.$calcTableHeight(tableOptions,5)
            this.handleList()
        }
    }
</script>

<style scoped>

</style>
