<template> 
 | 
    <TableLayout :permissions="['business:applychange:query']"> 
 | 
        <!-- 搜索表单 --> 
 | 
        <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> 
 | 
            <el-form-item label="保单状态" prop="status"> 
 | 
                <el-select v-model="searchForm.status" clearable  @change="search"> 
 | 
                    <el-option label="待签署" value="0"></el-option> 
 | 
                    <el-option label="待审核" value="1"></el-option> 
 | 
                    <el-option label="已生效" value="2"></el-option> 
 | 
                    <el-option label="已退回" value="3"></el-option> 
 | 
                </el-select> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="保险方案" prop="solutionName"> 
 | 
                <el-input v-model="searchForm.solutionName" placeholder="请输入" @keypress.enter.native="search"></el-input> 
 | 
            </el-form-item> 
 | 
            <el-form-item label="提交日期" prop="status"> 
 | 
                <el-date-picker 
 | 
                    @change="changeTime" 
 | 
                    v-model="searchForm.time" 
 | 
                    type="daterange" 
 | 
                    value-format="yyyy-MM-dd" 
 | 
                    range-separator="至" 
 | 
                    start-placeholder="开始日期" 
 | 
                    end-placeholder="结束日期"> 
 | 
                </el-date-picker> 
 | 
            </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-if="userInfo.type==2 && " v-permissions="['business:unionchange:create']">--> 
 | 
<!--                <li><el-button type="primary" @click="$refs.OpearaUnionChange.open('加减保申请')" v-permissions="['business:unionchange:create']">提交申请</el-button></li>--> 
 | 
<!--            </ul>--> 
 | 
            <el-table 
 | 
                v-loading="isWorking.search" 
 | 
                :data="tableData.list" 
 | 
                stripe 
 | 
            > 
 | 
                 <el-table-column align="center" label="序号" width="50px"> 
 | 
                    <template slot-scope="scope"> 
 | 
                        <span>{{scope.$index + 1}}</span> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
                 <el-table-column align="center" prop="status" label="保单状态" min-width="100px"> 
 | 
                    <template slot-scope="{row}"> 
 | 
                        <span :class="'union-change-status'+row.status" v-if="row.status === 0">待签署</span> 
 | 
                        <span :class="'union-change-status'+row.status" v-if="row.status === 1">待审核</span> 
 | 
                        <span :class="'union-change-status'+row.status" v-if="row.status === 2">已生效</span> 
 | 
                        <span style="color: red;" v-if="row.status === 3">已退回</span> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
                 <el-table-column align="center" prop="applyCode" label="关联保单号" min-width="150px"></el-table-column> 
 | 
                <el-table-column prop="companyName" v-if="userInfo.type === 0" label="企业名称" align="center" min-width="150"></el-table-column> 
 | 
                 <el-table-column align="center" prop="solutionsName" label="保险方案" min-width="150px"></el-table-column> 
 | 
                 <el-table-column align="center" prop="addNum" label="加保人数" min-width="100px"> 
 | 
                   <template slot-scope="{row}"> 
 | 
                     {{row.addNum||0}} 人 
 | 
                   </template> 
 | 
                 </el-table-column> 
 | 
                 <el-table-column align="center" prop="delNum" label="减保人数" min-width="100px"> 
 | 
                   <template slot-scope="{row}"> 
 | 
                     {{row.delNum||0}} 人 
 | 
                   </template> 
 | 
                 </el-table-column> 
 | 
                 <el-table-column align="center" prop="createDate" label="提交时间" min-width="150px"></el-table-column> 
 | 
                <el-table-column 
 | 
                    label="操作" 
 | 
                    min-width="120" 
 | 
                    fixed="right" 
 | 
                > 
 | 
                    <template slot-scope="{row}"> 
 | 
                        <el-button type="text" @click="$refs.OperaUnionChangeDetailWindow.open('加减保详情', row)">查看详情</el-button> 
 | 
                    </template> 
 | 
                </el-table-column> 
 | 
            </el-table> 
 | 
            <pagination 
 | 
                @size-change="handleSizeChange" 
 | 
                @current-change="handlePageChange" 
 | 
                :pagination="tableData.pagination" 
 | 
            > 
 | 
            </pagination> 
 | 
        </template> 
 | 
        <!--    提交申请    --> 
 | 
        <OpearaUnionChange ref="OpearaUnionChange" @success="handlerSuccess"/> 
 | 
        <OperaUnionChangeDetailWindow ref="OperaUnionChangeDetailWindow" @success="handlerSuccess"/> 
 | 
    </TableLayout> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    import BaseTable from '@/components/base/BaseTable' 
 | 
    import TableLayout from '@/layouts/TableLayout' 
 | 
    import Pagination from '@/components/common/Pagination' 
 | 
    import OpearaUnionChange from '@/components/business/OpearaUnionChange' 
 | 
    import OperaUnionChangeDetailWindow from '@/components/business/OperaUnionChangeDetailWindow' 
 | 
    import { mapState } from 'vuex' 
 | 
    export default { 
 | 
        name: 'unionChange', 
 | 
        extends: BaseTable, 
 | 
        computed: { 
 | 
            ...mapState(['userInfo']) 
 | 
        }, 
 | 
        components: { TableLayout, Pagination, OpearaUnionChange ,OperaUnionChangeDetailWindow}, 
 | 
        data () { 
 | 
            return { 
 | 
                // 搜索 
 | 
                searchForm: { 
 | 
                    status: '', 
 | 
                    type: '0', 
 | 
                    solutionName: '', 
 | 
                    queryStartTime: '', 
 | 
                    queryEndTime: '', 
 | 
                    time: [] 
 | 
                } 
 | 
            } 
 | 
        }, 
 | 
        created () { 
 | 
            this.config({ 
 | 
                module: '加减保换厂合并单信息表', 
 | 
                api: '/business/unionChange', 
 | 
                'field.id': 'id', 
 | 
                'field.main': 'id' 
 | 
            }) 
 | 
            this.search() 
 | 
        }, 
 | 
        methods: { 
 | 
           handlerSuccess(){ 
 | 
             this.reset() 
 | 
           }, 
 | 
            changeTime(e) { 
 | 
                if (e.length > 0) { 
 | 
                    this.searchForm.queryStartTime = e[0] 
 | 
                    this.searchForm.queryEndTime = e[1] 
 | 
                } else { 
 | 
                    this.searchForm.queryStartTime = '' 
 | 
                    this.searchForm.queryEndTime = '' 
 | 
                } 
 | 
                this.search() 
 | 
            }, 
 | 
            reset() { 
 | 
                this.searchForm.queryStartTime = '' 
 | 
                this.searchForm.queryEndTime = '' 
 | 
                this.searchForm.time = [] 
 | 
                this.$refs.searchForm.resetFields(); 
 | 
                this.search() 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</script> 
 |