<template> 
 | 
    <TableLayout :permissions="['business:member:query']"> 
 | 
        <!-- 搜索表单 --> 
 | 
        <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> 
 | 
            <el-form-item label="员工姓名" prop="duId"> 
 | 
                <el-input v-model="searchForm.duId" placeholder="请输入" @keypress.enter.native="search"></el-input> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="身份证号" prop="duId"> 
 | 
                <el-input v-model="searchForm.duId" placeholder="请输入" @keypress.enter.native="search"></el-input> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="保险方案" prop="duId"> 
 | 
                <el-select v-model="searchForm.duId" placeholder="请选择"> 
 | 
                    <el-option 
 | 
                        v-for="item in options" 
 | 
                        :key="item.value" 
 | 
                        :label="item.label" 
 | 
                        :value="item.value"> 
 | 
                    </el-option> 
 | 
                </el-select> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="保险状态" prop="duId"> 
 | 
                <el-select v-model="searchForm.duId" placeholder="请选择"> 
 | 
                    <el-option 
 | 
                        v-for="item in options" 
 | 
                        :key="item.value" 
 | 
                        :label="item.label" 
 | 
                        :value="item.value"> 
 | 
                    </el-option> 
 | 
                </el-select> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="派遣单位" prop="duId"> 
 | 
                <el-select v-model="searchForm.duId" placeholder="请选择"> 
 | 
                    <el-option 
 | 
                        v-for="item in options" 
 | 
                        :key="item.value" 
 | 
                        :label="item.label" 
 | 
                        :value="item.value"> 
 | 
                    </el-option> 
 | 
                </el-select> 
 | 
            </el-form-item> 
 | 
            <section> 
 | 
                <el-button type="primary" @click="search">搜索</el-button> 
 | 
                <el-button @click="reset">重置</el-button> 
 | 
            </section> 
 | 
        </el-form> 
 | 
        <!-- 表格和分页 --> 
 | 
        <template v-slot:table-wrap> 
 | 
            <ul class="toolbar" v-permissions="['business:member:create']"> 
 | 
                <li><el-button type="primary" @click="$refs.operaMemberWindow.open('投保记录')">导入人员名单</el-button></li> 
 | 
            </ul> 
 | 
            <el-table 
 | 
                v-loading="isWorking.search" 
 | 
                :data="tableData.list" 
 | 
                stripe 
 | 
            > 
 | 
                <el-table-column label="序号" width="80px"> 
 | 
                    <template slot-scope="scope"> 
 | 
                        <span>{{scope.$index + 1}}</span> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
                <el-table-column prop="companyId" label="保险状态" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="companyId" label="所属企业" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="companyId" label="员工姓名" min-width="100px"></el-table-column> 
 | 
                <el-table-column label="性别" min-width="100px"> 
 | 
                    <template slot-scope="{row}"> 
 | 
                        <span v-if="row.sex === 0">男</span> 
 | 
                        <span v-else>女</span> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
                <el-table-column prop="companyId" label="年龄" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="companyId" label="保险方案" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="duId" label="派遣单位" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="worktypeId" label="所属工种" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="startTime" label="实际保险生效起期" min-width="100px"></el-table-column> 
 | 
                <el-table-column prop="endTime" label="实际保险生效止期" min-width="100px"></el-table-column> 
 | 
                <el-table-column label="操作" min-width="100px"> 
 | 
                    <template slot-scope="{row}"> 
 | 
                        <el-button type="text">投保记录</el-button> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
            </el-table> 
 | 
            <pagination 
 | 
                @size-change="handleSizeChange" 
 | 
                @current-change="handlePageChange" 
 | 
                :pagination="tableData.pagination" 
 | 
            > 
 | 
            </pagination> 
 | 
        </template> 
 | 
        <!-- 新建/修改 --> 
 | 
        <OperaMemberWindow ref="operaMemberWindow" @success="handlePageChange"/> 
 | 
    </TableLayout> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    import BaseTable from '@/components/base/BaseTable' 
 | 
    import TableLayout from '@/layouts/TableLayout' 
 | 
    import Pagination from '@/components/common/Pagination' 
 | 
    import OperaMemberWindow from '@/components/business/OperaMemberWindow' 
 | 
    export default { 
 | 
        name: 'Member', 
 | 
        extends: BaseTable, 
 | 
        components: { TableLayout, Pagination, OperaMemberWindow }, 
 | 
        data () { 
 | 
            return { 
 | 
                // 搜索 
 | 
                searchForm: { 
 | 
                    duId: '' 
 | 
                }, 
 | 
                options: [] 
 | 
            } 
 | 
        }, 
 | 
        created () { 
 | 
            this.config({ 
 | 
                module: '用工信息表', 
 | 
                api: '/business/member', 
 | 
                'field.id': 'id', 
 | 
                'field.main': 'id' 
 | 
            }) 
 | 
            this.search() 
 | 
        } 
 | 
    } 
 | 
</script> 
 |