Mr.Shi

MrShi

2024-01-24 617bbcea64a2e81fc4543250648725debfc1db3c

Mr.Shi

 company/.env.development

@@ -1,6 +1,6 @@
# å¼€å‘环境配置
NODE_ENV = 'development'

VUE_APP_API = 'http://192.168.0.156:10023/'
VUE_APP_API = 'http://192.168.0.104:10023/'

# VUE_APP_API = 'http://192.168.0.134:10023/'

 company/src/components/business/OperaPolicyListWindow.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,449 @@
<template>
    <GlobalWindow
        :title="title"
        width="80%"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="desc">
            <div class="desc_item">
                <div class="desc_item_label">
                    <div class="desc_item_label_left">
                        <span>投保企业：安徽平安人力资源有限公司</span>
                        <span>保单状态：待出单</span>
                        <span>提交时间：2023-09-11 00:00:00</span>
                    </div>
                    <div class="desc_item_label_right">
                        <el-button type="primary" @click="$refs.policyListDetails.open('投保详情单')">导出详单</el-button>
                        <el-button type="primary">查看投保单</el-button>
                        <el-button type="primary">查看保险单</el-button>
                        <el-button type="danger" @click="visible4 = true">修改保险单</el-button>
                    </div>
                </div>
                <div class="desc_item_from">
                    <el-table
                            :data="tableData"
                            border
                            style="width: 100%">
                        <el-table-column
                                prop="date"
                                label="保单号">
                        </el-table-column>
                        <el-table-column
                                prop="name"
                                label="保险方案"
                                width="180">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="保险生效起期">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="保险生效止期">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="投保人数">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="在保时长（天）">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="当前费用">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="总费用">
                        </el-table-column>
                    </el-table>
                </div>
                <div class="desc_item_cate">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="在保人员" name="first"></el-tab-pane>
                        <el-tab-pane label="加/减保记录" name="second"></el-tab-pane>
                        <el-tab-pane label="换厂记录" name="third"></el-tab-pane>
                    </el-tabs>
                </div>
                <div class="desc_item_search">
                    <el-form :inline="true" :model="formInline" class="demo-form-inline">
                        <el-form-item label="在保状态" prop="region">
                            <el-select v-model="formInline.region" placeholder="请选择">
                                <el-option label="保障中" value="1"></el-option>
                                <el-option label="不在保" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="派遣单位" prop="region">
                            <el-select v-model="formInline.region" placeholder="请选择">
                                <el-option label="保障中" value="1"></el-option>
                                <el-option label="不在保" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="所属工种" prop="region">
                            <el-select v-model="formInline.region" placeholder="请选择">
                                <el-option label="保障中" value="1"></el-option>
                                <el-option label="不在保" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="员工姓名" prop="user">
                            <el-input v-model="formInline.user" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="保险生效起期" prop="user">
                            <el-date-picker
                                    v-model="formInline.user"
                                    type="daterange"
                                    range-separator="至"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期">
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="保险生效起期" prop="user">
                            <el-date-picker
                                    v-model="formInline.user"
                                    type="daterange"
                                    range-separator="至"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期">
                            </el-date-picker>
                        </el-form-item>
                        <section>
                            <el-button type="primary" @click="onSubmit">查询</el-button>
                            <el-button>重置</el-button>
                            <el-button type="primary">导出名单</el-button>
                        </section>
                    </el-form>
                </div>
                <div class="desc_item_from">
                    <el-table
                            :data="tableData"
                            border
                            style="width: 100%">
                        <el-table-column label="序号">
                            <template slot-scope="scope">
                                <span>{{scope.$index + 1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="date"
                                label="员工姓名">
                        </el-table-column>
                        <el-table-column
                                prop="name"
                                label="性别"
                                width="180">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="身份证号">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="派遣单位">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="所属工种">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="保险生效起期">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="保险生效止期">
                        </el-table-column>
                        <el-table-column
                                prop="address"
                                label="产生费用（元）">
                        </el-table-column>
                    </el-table>
                    <div class="desc_item_from_page">
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="currentPage"
                                :page-sizes="[100, 200, 300, 400]"
                                :page-size="100"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="400">
                        </el-pagination>
                    </div>
                </div>
                <div class="desc_item_review">
                    <div class="desc_item_review_label">审核流程</div>
                    <el-timeline :reverse="reverse">
                        <el-timeline-item
                                v-for="(activity, index) in activities"
                                :key="index"
                                :timestamp="activity.timestamp">
                            {{activity.content}}
                        </el-timeline-item>
                    </el-timeline>
                </div>
            </div>
        </div>
        <policyListDetails ref="policyListDetails" @success="successEvent" />
        <!--    ä¿®æ”¹ä¿é™©å•    -->
        <el-dialog
                title="修改保险单"
                :visible.sync="visible4"
                :show-close="false"
                :close-on-click-modal="false"
                width="30%"
                center>
            <div class="form">
                <div class="form_item">
                    <div class="form_item_label"><span>*</span>保险生效起期：</div>
                    <div class="form_item_val">
                        <el-date-picker
                                v-model="value1"
                                type="date"
                                placeholder="选择日期">
                        </el-date-picker>
                    </div>
                </div>
                <div class="form_item">
                    <div class="form_item_label"><span>*</span>保单号：</div>
                    <div class="form_item_val">
                        <el-input placeholder="请输入"></el-input>
                    </div>
                </div>
                <div class="form_item">
                    <div class="form_item_label"><span>*</span>上传保险单：</div>
                    <div class="form_item_val">
                        <el-upload
                                class="upload-demo"
                                action="https://jsonplaceholder.typicode.com/posts/"
                                :on-preview="handlePreview"
                                :on-remove="handleRemove"
                                :before-remove="beforeRemove"
                                multiple
                                :limit="1"
                                :on-exceed="handleExceed"
                                :file-list="fileList">
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">只能上传pdf文件，且不超过5mb</div>
                        </el-upload>
                    </div>
                </div>
                <div class="form_item">
                    <div class="form_item_label"><span>*</span>修改原因：</div>
                    <div class="form_item_val">
                        <el-input placeholder="请输入"></el-input>
                    </div>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible4 = false">取 æ¶ˆ</el-button>
                <el-button type="primary" @click="visible4 = false">ç¡® å®š</el-button>
            </span>
        </el-dialog>
    </GlobalWindow>
</template>

<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    import policyListDetails from '@/components/business/policyListDetails'
    export default {
        name: 'OperaPolicyListWindow',
        extends: BaseOpera,
        components: { GlobalWindow, policyListDetails },
        data () {
            return {
                // è¡¨å•æ•°æ®
                form: {
                    id: null,
                    editDate: ''
                },
                // éªŒè¯è§„则
                rules: {
                },
                formInline: {
                    user: '',
                    region: ''
                },
                visible1: false,
                visible2: false,
                visible3: false,
                visible4: false,
                visible5: false,
                reverse: true,
                radio: 0,
                fileList: [
                    {name: 'food.pdf', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}
                ],
                activities: [{
                    content: '活动按期开始',
                    timestamp: '2018-04-15'
                }, {
                    content: '通过审核',
                    timestamp: '2018-04-13'
                }, {
                    content: '创建成功',
                    timestamp: '2018-04-11'
                }],
                tableData: [],
                activeName: 'first',
                currentPage: 1
            }
        },
        created () {
            this.config({
                api: '/business/insuranceApply',
                'field.id': 'id'
            })
        },
        methods: {
            handleRemove(file, fileList) {
                console.log(file, fileList);
            },
            handlePreview(file) {
                console.log(file);
            },
            handleExceed(files, fileList) {
                this.$message.warning(`当前限制选择 3 ä¸ªæ–‡ä»¶ï¼Œæœ¬æ¬¡é€‰æ‹©äº† ${files.length} ä¸ªæ–‡ä»¶ï¼Œå…±é€‰æ‹©äº† ${files.length + fileList.length} ä¸ªæ–‡ä»¶`);
            },
            beforeRemove(file, fileList) {
                return this.$confirm(`确定移除 ${ file.name }？`);
            },
            successEvent() {

            },
            handleSizeChange(val) {
                console.log(`每页 ${val} æ¡`);
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
            },
            handleClick(tab, event) {
                console.log(tab, event);
            },
            onSubmit() {

            }
        }
    }
</script>
<style>
    .v-modal {
        z-index: 2000 !important;
    }
</style>
<style lang="scss" scoped>
    .form {
        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
        .form_span {
            width: 100%;
            display: flex;
            align-items: start;
            flex-direction: column;
            margin-bottom: 20px;
            span {
                font-size: 14px;
                &:nth-child(1) {
                    color: black;
                    margin-bottom: 5px;
                }
                &:nth-child(2) {
                    color: #8c939d;
                }
            }
        }
        .form_item {
            width: 100%;
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin: 0 !important;
            }
            .form_item_label {
                flex-shrink: 0;
                width: 170px;
                color: black;
                font-size: 14px;
                span {
                    color: red;
                    font-size: 14px;
                }
            }
            .form_item_val {
                flex: 1;
                /*height: 40px;*/
                margin-left: 20px;
                textarea {
                    width: 100%;
                    height: 70px;
                    border: 1px solid #cbcbcb;
                    padding: 10px;
                    outline: none;
                    box-sizing: border-box;
                }
                input {
                    width: 100%;
                    height: 40px;
                    outline: none;
                    border-radius: 5px;
                    border: 1px solid #cbcbcb;
                    padding: 0 20px;
                    box-sizing: border-box;
                }
            }
        }
    }
    .desc {
        width: 100%;
        .desc_item {
            width: 100%;
            display: flex;
            flex-direction: column;
            .desc_item_label {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 10px;
                span {
                    font-size: 14px;
                    color: black;
                    margin-right: 30px;
                }
            }
            .desc_item_from {
                width: 100%;
                margin-bottom: 10px;
                .desc_item_from_page {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: end;
                    margin-top: 10px;
                }
            }
            .desc_item_cate {
                width: 100%;
                margin-bottom: 10px;
            }
            .desc_item_search {
                width: 100%;
                margin-bottom: 20px;
            }
            .desc_item_review {
                width: 100%;
                .desc_item_review_label {
                    font-size: 20px;
                    color: black;
                    font-weight: bold;
                    margin-bottom: 15px;
                }
            }
        }
    }
</style>

 company/src/components/business/dispatchReview.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,163 @@
<template>
    <GlobalWindow
        :title="title"
        width="50%"
        :visible.sync="visible"
        :confirm-working="isWorking"
    >
        <div class="box">
            <div class="box_label">保险方案：平安保险雇主责任险B版</div>
            <el-table
                :data="tableData"
                border
                style="width: 100%">
                <el-table-column
                    prop="date"
                    label="日期">
                </el-table-column>
                <el-table-column
                    prop="name"
                    label="姓名">
                </el-table-column>
                <el-table-column
                    prop="address"
                    label="地址">
                </el-table-column>
            </el-table>
        </div>
        <!--    é©³å›žé€€å›žç”³è¯·    -->
        <el-dialog
            title="审核确认"
            :visible.sync="visible5"
            :show-close="false"
            :close-on-click-modal="false"
            width="30%"
            center>
            <div class="form">
                <div class="form_item">
                    <div class="form_item_label"><span>*</span>审核说明：</div>
                    <div class="form_item_val">
                        <el-input type="textarea" :rows="2" placeholder="请输入"></el-input>
                    </div>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible5 = false">取 æ¶ˆ</el-button>
                <el-button type="primary" @click="visible5 = false">ç¡® å®š</el-button>
            </span>
        </el-dialog>
        <template v-slot:footer>
            <el-button type="primary" @click="visible5 = true">审核通过</el-button>
            <el-button @click="visible5 = true">审核退回</el-button>
        </template>
    </GlobalWindow>
</template>

<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    export default {
        name: 'dispatchReview',
        extends: BaseOpera,
        components: { GlobalWindow },
        data () {
            return {
                // è¡¨å•æ•°æ®
                form: {
                    id: null,
                    editDate: ''
                },
                // éªŒè¯è§„则
                rules: {
                },
                tableData: [],
                visible5: false
            }
        },
        created () {
            this.config({
                api: '/business/insuranceApply',
                'field.id': 'id'
            })
        },
        methods: {

        }
    }
</script>

<style lang="scss" scoped>
    .box {
        width: 100%;
        .box_label {
            width: 100%;
            color: black;
            font-size: 14px;
            margin-bottom: 15px;
        }
    }
    .form {
        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
        .form_span {
            width: 100%;
            display: flex;
            align-items: start;
            flex-direction: column;
            margin-bottom: 20px;
            span {
                font-size: 14px;
                &:nth-child(1) {
                    color: black;
                    margin-bottom: 5px;
                }
                &:nth-child(2) {
                    color: #8c939d;
                }
            }
        }
        .form_item {
            width: 100%;
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin: 0 !important;
            }
            .form_item_label {
                flex-shrink: 0;
                width: 170px;
                color: black;
                font-size: 14px;
                span {
                    color: red;
                    font-size: 14px;
                }
            }
            .form_item_val {
                flex: 1;
                /*height: 40px;*/
                margin-left: 20px;
                textarea {
                    width: 100%;
                    height: 70px;
                    border: 1px solid #cbcbcb;
                    padding: 10px;
                    outline: none;
                    box-sizing: border-box;
                }
                input {
                    width: 100%;
                    height: 40px;
                    outline: none;
                    border-radius: 5px;
                    border: 1px solid #cbcbcb;
                    padding: 0 20px;
                    box-sizing: border-box;
                }
            }
        }
    }
</style>

 company/src/components/business/dispatchUnitReviewDetails.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,296 @@
<template>
    <GlobalWindow
        :title="title"
        width="80%"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="info">
            <div class="info_head">
                <span>所属企业：芜湖格力精密制造有限公司</span>
                <el-button type="primary" @click="visible5 = true">审核</el-button>
                <el-button type="primary" @click="$refs.dispatchReview.open('审核工种')">审核工种</el-button>
            </div>
            <div class="info_list">
                <div class="info_list_item">派遣单位：芜湖格力精密制造有限公司</div>
                <div class="info_list_item">派遣单位信用代码：913401000900000001</div>
                <div class="info_list_item">派遣单位状态：待审核</div>
                <div class="info_list_item">派遣单位详述：无</div>
            </div>
            <div class="info_x"></div>
            <div class="info_form">
                <div class="info_form_label">保险方案：平安保险雇主责任险B版</div>
                <el-table
                    :data="tableData"
                    border
                    style="width: 100%">
                    <el-table-column
                        prop="date"
                        label="日期">
                    </el-table-column>
                    <el-table-column
                        prop="name"
                        label="姓名">
                    </el-table-column>
                    <el-table-column
                        prop="address"
                        label="地址">
                    </el-table-column>
                </el-table>
            </div>
            <div class="info_form">
                <div class="info_form_label">保险方案：平安保险雇主责任险B版</div>
                <el-table
                    :data="tableData"
                    border
                    style="width: 100%">
                    <el-table-column
                        prop="date"
                        label="日期">
                    </el-table-column>
                    <el-table-column
                        prop="name"
                        label="姓名">
                    </el-table-column>
                    <el-table-column
                        prop="address"
                        label="地址">
                    </el-table-column>
                </el-table>
            </div>
            <div class="desc_label">
                <div class="desc_label_left">
                    <span class="desc_label_left_title">
                        æ¡ˆä»¶è¿›åº¦
                    </span>
                </div>
            </div>
            <div class="desc_times">
                <el-timeline :reverse="reverse">
                    <el-timeline-item
                        v-for="(activity, index) in activities"
                        :key="index"
                        :timestamp="activity.timestamp">
                        {{activity.content}}
                    </el-timeline-item>
                </el-timeline>
            </div>
            <!--    é©³å›žé€€å›žç”³è¯·    -->
            <el-dialog
                title="审核确认"
                :visible.sync="visible5"
                :show-close="false"
                :close-on-click-modal="false"
                width="30%"
                center>
                <div class="form">
                    <div class="form_item">
                        <div class="form_item_label"><span>*</span>审核说明：</div>
                        <div class="form_item_val">
                            <el-input type="textarea" :rows="2" placeholder="请输入"></el-input>
                        </div>
                    </div>
                </div>
                <span slot="footer" class="dialog-footer">
                <el-button @click="visible5 = false">取 æ¶ˆ</el-button>
                <el-button type="primary" @click="visible5 = false">ç¡® å®š</el-button>
            </span>
            </el-dialog>
            <!--      å®¡æ ¸      -->
            <dispatchReview ref="dispatchReview" />
        </div>
    </GlobalWindow>
</template>

<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    import dispatchReview from '@/components/business/dispatchReview'
    export default {
        name: 'dispatchUnitReviewDetails',
        extends: BaseOpera,
        components: { GlobalWindow, dispatchReview },
        data () {
            return {
                // è¡¨å•æ•°æ®
                form: {
                    id: null,
                    editDate: ''
                },
                // éªŒè¯è§„则
                rules: {
                },
                tableData: [],
                visible5: false,
                reverse: true,
                activities: [{
                    content: '活动按期开始',
                    timestamp: '2018-04-15'
                }, {
                    content: '通过审核',
                    timestamp: '2018-04-13'
                }, {
                    content: '创建成功',
                    timestamp: '2018-04-11'
                }],
            }
        },
        created () {
            this.config({
                api: '/business/insuranceApply',
                'field.id': 'id'
            })
        },
        methods: {

        }
    }
</script>

<style>
    .v-modal {
        z-index: 2000 !important;
    }
</style>

<style lang="scss" scoped>
    .info {
        width: 100%;
        .form {
            width: 100%;
            display: flex;
            align-items: center;
            flex-direction: column;
            .form_span {
                width: 100%;
                display: flex;
                align-items: start;
                flex-direction: column;
                margin-bottom: 20px;
                span {
                    font-size: 14px;
                    &:nth-child(1) {
                        color: black;
                        margin-bottom: 5px;
                    }
                    &:nth-child(2) {
                        color: #8c939d;
                    }
                }
            }
            .form_item {
                width: 100%;
                display: flex;
                align-items: center;
                margin-bottom: 20px;
                &:last-child {
                    margin: 0 !important;
                }
                .form_item_label {
                    flex-shrink: 0;
                    width: 170px;
                    color: black;
                    font-size: 14px;
                    span {
                        color: red;
                        font-size: 14px;
                    }
                }
                .form_item_val {
                    flex: 1;
                    /*height: 40px;*/
                    margin-left: 20px;
                    textarea {
                        width: 100%;
                        height: 70px;
                        border: 1px solid #cbcbcb;
                        padding: 10px;
                        outline: none;
                        box-sizing: border-box;
                    }
                    input {
                        width: 100%;
                        height: 40px;
                        outline: none;
                        border-radius: 5px;
                        border: 1px solid #cbcbcb;
                        padding: 0 20px;
                        box-sizing: border-box;
                    }
                }
            }
        }
        .info_head {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            span {
                color: black;
                font-size: 14px;
            }
        }
        .info_list {
            width: 100%;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            margin-top: 15px;
            .info_list_item {
                width: 33.3%;
                color: black;
                font-size: 14px;
                margin-bottom: 15px;
            }
        }
        .info_x {
            width: 100%;
            height: 1px;
            background: #eeeeee;
            margin-bottom: 15px;
        }
        .info_form {
            width: 100%;
            margin-bottom: 15px;
            .info_form_label {
                color: black;
                font-size: 14px;
                margin-bottom: 15px;
            }
        }
        .desc_label {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .desc_label_left {
                flex: 1;
                display: flex;
                align-items: center;
                .desc_label_left_title {
                    font-size: 20px;
                    font-weight: bold;
                    color: black;
                }
                .desc_label_left_time {
                    font-size: 14px;
                    color: rgba(249, 86, 1, 0.996);
                    margin-left: 10px;
                }
                .desc_label_left_code {
                    font-size: 15px;
                    color: black;
                    margin-left: 30px;
                }
            }
            .desc_label_right {
                flex-shrink: 0;
            }
        }
        .desc_times {
            width: 100%;
            margin-top: 20px;
        }
    }
</style>

 company/src/components/business/policyListDetails.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,242 @@
<template>
    <GlobalWindow
        :title="title"
        width="50%"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="box">
            <div class="box_header">
                <div class="box_header_item">
                    <div class="box_header_item_label">投保企业</div>
                    <div class="box_header_item_val">安徽格力机械制造厂</div>
                </div>
                <div class="box_header_item">
                    <div class="box_header_item_label">保险方案</div>
                    <div class="box_header_item_val">平安保险雇主责任险A版</div>
                </div>
                <div class="box_header_item">
                    <div class="box_header_item_label">保险生效起期</div>
                    <div class="box_header_item_val">2023-09-11 00:00:00</div>
                </div>
                <div class="box_header_item">
                    <div class="box_header_item_label">保险生效止期</div>
                    <div class="box_header_item_val">2023-10-11 23:59:59</div>
                </div>
                <div class="box_header_item">
                    <div class="box_header_item_label">投保人数</div>
                    <div class="box_header_item_val">50</div>
                </div>
                <div class="box_header_item">
                    <div class="box_header_item_label">总费用</div>
                    <div class="box_header_item_val">15000</div>
                </div>
            </div>
            <div class="box_table">
                <div class="box_table_head">
                    <div class="box_table_head_item">序号</div>
                    <div class="box_table_head_item">员工姓名</div>
                    <div class="box_table_head_item">身份证号</div>
                    <div class="box_table_head_item">派遣单位</div>
                    <div class="box_table_head_item">所属工种</div>
                </div>
                <div class="box_table_content" v-for="(item, index) in 6" :key="index">
                    <div class="box_table_content_item">{{index + 1}}</div>
                    <div class="box_table_content_item">王某某</div>
                    <div class="box_table_content_item">340411190001010011</div>
                    <div class="box_table_content_item">安徽格力机械制造厂</div>
                    <div class="box_table_content_item">4ç±» æœºæ¢°åŠ å·¥/制造</div>
                </div>
            </div>
            <div class="box_footer">
                <div class="box_footer_label">备注</div>
                <div class="box_footer_val">
                    <el-input placeholder="请输入"></el-input>
                </div>
            </div>
        </div>
        <template v-slot:footer>
            <el-button type="primary">企业证件</el-button>
            <el-button type="primary">导出详单</el-button>
            <el-button @click="visible = false">取消</el-button>
        </template>
    </GlobalWindow>
</template>

<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    export default {
        name: 'policyListDetails',
        extends: BaseOpera,
        components: { GlobalWindow },
        data () {
            return {
                // è¡¨å•æ•°æ®
                form: {
                    id: null,
                    editDate: ''
                },
                // éªŒè¯è§„则
                rules: {
                },
                formInline: {
                    user: '',
                    region: ''
                },
                reverse: true,
                activities: [{
                    content: '活动按期开始',
                    timestamp: '2018-04-15'
                }, {
                    content: '通过审核',
                    timestamp: '2018-04-13'
                }, {
                    content: '创建成功',
                    timestamp: '2018-04-11'
                }],
                tableData: [],
                activeName: 'first',
                currentPage: 1
            }
        },
        created () {
            this.config({
                api: '/business/insuranceApply',
                'field.id': 'id'
            })
        },
        methods: {
            handleSizeChange(val) {
                console.log(`每页 ${val} æ¡`);
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
            },
            handleClick(tab, event) {
                console.log(tab, event);
            },
            onSubmit() {

            }
        }
    }
</script>

<style lang="scss" scoped>
    .box {
        width: 100%;
        .box_header {
            width: 100%;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            border-top: 1px solid #b4bbc5;
            border-left: 1px solid #b4bbc5;
            .box_header_item {
                width: 50%;
                height: 50px;
                display: flex;
                align-items: center;
                border-right: 1px solid #b4bbc5;
                border-bottom: 1px solid #b4bbc5;
                box-sizing: border-box;
                .box_header_item_label {
                    flex: 1;
                    height: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 14px;
                    color: black;
                    background: #f2f2f2;
                    border-right: 1px solid #b4bbc5;
                }
                .box_header_item_val {
                    flex: 1;
                    height: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 14px;
                    color: black;
                }
            }
        }
        .box_table {
            width: 100%;
            border-left: 1px solid #b4bbc5;
            box-sizing: border-box;
            .box_table_head {
                width: 100%;
                display: flex;
                align-items: center;
                .box_table_head_item {
                    flex: 1;
                    height: 50px;
                    background: #f2f2f2;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 14px;
                    color: black;
                    border-right: 1px solid #b4bbc5;
                    border-bottom: 1px solid #b4bbc5;
                    box-sizing: border-box;
                    &:nth-child(1) {
                        flex: 0.5;
                    }
                }
            }
            .box_table_content {
                width: 100%;
                display: flex;
                align-items: center;
                .box_table_content_item {
                    flex: 1;
                    height: 50px;
                    background: #ffffff;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 14px;
                    color: black;
                    border-right: 1px solid #b4bbc5;
                    border-bottom: 1px solid #b4bbc5;
                    box-sizing: border-box;
                    &:nth-child(1) {
                        flex: 0.5;
                    }
                }
            }
        }
        .box_footer {
            width: 100%;
            height: 50px;
            border-left: 1px solid #b4bbc5;
            border-bottom: 1px solid #b4bbc5;
            border-right: 1px solid #b4bbc5;
            display: flex;
            align-items: center;
            .box_footer_label {
                width: 200px;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 14px;
                color: black;
                background: #f2f2f2;
            }
            .box_footer_val /deep/ {
                width: calc(100% - 200px);
                height: 100%;
                input {
                    width: 100%;
                    height: 50px;
                }
            }
        }
    }
</style>

 company/src/components/common/Menu.vue

@@ -5,13 +5,14 @@
      <h1 :class="{ hidden: menuData.collapse }">云易保</h1>
    </div>
    <scrollbar>
<!--      :default-openeds="defaultOpeneds"-->
      <el-menu
        ref="menu"
        :unique-opened="true"
        :default-active="activeIndex"
        text-color="#fff"
        active-text-color="#fff"
        :collapse="menuData.collapse"
        :default-openeds="defaultOpeneds"
        :collapse-transition="false"
        @select="handleSelect"
      >

 company/src/views/business/dispatchUnitReview.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,104 @@
<template>
    <TableLayout :permissions="['business:dispatchunit:query']">
        <!-- æœç´¢è¡¨å• -->
        <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
            <el-form-item label="所属企业" prop="companyId">
                <el-select v-model="searchForm.companyId" placeholder="请选择" @change="search">
                    <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="name">
                <el-select v-model="searchForm.name" placeholder="请选择" @change="search">
                    <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>
                <el-button @click="$refs.dispatchUnitReviewDetails.open('派遣单位详情')">详情</el-button>
            </section>
        </el-form>
        <!-- è¡¨æ ¼å’Œåˆ†é¡µ -->
        <template v-slot:table-wrap>
            <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="name" label="派遣单位" min-width="100px"></el-table-column>
                <el-table-column label="派遣单位状态" min-width="100px">
                    <template slot-scope="{row}">
                        <span v-if="row.unitStatus === 0">待审核</span>
                        <span v-if="row.unitStatus === 1">审核通过</span>
                        <span v-if="row.unitStatus === 2">审核不通过</span>
                    </template>
                </el-table-column>
                <el-table-column prop="createDate" label="提交日期" min-width="100px"></el-table-column>
                <el-table-column
                    v-if="containPermissions(['business:dispatchunit:update', 'business:dispatchunit:delete'])"
                    label="操作"
                    min-width="120"
                    fixed="right"
                >
                    <template slot-scope="{row}">
                        <el-button type="text" @click="$refs.operaDispatchUnitWindow.open('编辑派遣单位信息表', row)" icon="el-icon-edit" v-permissions="['business:dispatchunit:update']">查看详情</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination
                @size-change="handleSizeChange"
                @current-change="handlePageChange"
                :pagination="tableData.pagination"
            >
            </pagination>
        </template>
        <!-- æ–°å»º/修改 -->
        <dispatchUnitReviewDetails ref="dispatchUnitReviewDetails" @success="handlePageChange"/>
    </TableLayout>
</template>

<script>
    import BaseTable from '@/components/base/BaseTable'
    import TableLayout from '@/layouts/TableLayout'
    import Pagination from '@/components/common/Pagination'
    import dispatchUnitReviewDetails from '@/components/business/dispatchUnitReviewDetails'
    export default {
        name: 'dispatchUnitReview',
        extends: BaseTable,
        components: { TableLayout, Pagination, dispatchUnitReviewDetails },
        data () {
            return {
                // æœç´¢
                searchForm: {
                    name: '',
                    companyId: ''
                }
            }
        },
        created () {
            this.config({
                module: '派遣单位信息表',
                api: '/business/dispatchUnit',
                'field.id': 'id',
                'field.main': 'id'
            })
            this.search()
        }
    }
</script>

 company/src/views/business/policyList.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,122 @@
<template>
    <TableLayout :permissions="['business:insuranceapply:query']">
        <!-- æœç´¢è¡¨å• -->
        <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
            <el-form-item label="保单号" prop="status">
                <el-input v-model="searchForm.status" placeholder="请输入"></el-input>
            </el-form-item>
            <el-form-item label="保险方案" prop="solutionId">
                <el-select v-model="searchForm.solutionId" placeholder="请选择" @change="search">
                    <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="status">
                <el-select v-model="searchForm.status" placeholder="请选择" @keypress.enter.native="search">
                    <el-option label="保障中" value="5"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="投保企业" prop="companyId">
                <el-select v-model="searchForm.companyId" placeholder="请选择" @change="search">
                    <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>
                <el-button @click="$refs.OperaPolicyListWindow.open('投保详情')">投保详情</el-button>
            </section>
        </el-form>
        <!-- è¡¨æ ¼å’Œåˆ†é¡µ -->
        <template v-slot:table-wrap>
            <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="status" label="投保状态" min-width="100px">
                    <template slot-scope="{row}">
                        <span v-if="row.status === 0">待审核</span>
                        <span v-if="row.status === 3">待出单</span>
                        <span v-if="row.status === 5">保障中</span>
                        <span v-if="row.status === 8">已过期</span>
                        <span v-if="row.status === 7">已退回</span>
                    </template>
                </el-table-column>
                <el-table-column prop="companyId" label="投保企业" min-width="100px"></el-table-column>
                <el-table-column prop="solutionId" label="保险方案" min-width="100px"></el-table-column>
                <el-table-column prop="solutionId" label="保单号" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="投保人数" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="在保时长（天）" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="产生费用（元）" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="总费用（元）" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="保险生效起期" min-width="100px"></el-table-column>
                <el-table-column prop="createDate" label="保险生效止期" min-width="100px"></el-table-column>
                <el-table-column
                    v-if="containPermissions(['business:insuranceapply:update', 'business:insuranceapply:delete'])"
                    label="操作"
                    min-width="120"
                    fixed="right"
                >
                    <template slot-scope="{row}">
                        <el-button type="text" @click="$refs.operaInsuranceApplyWindow.open('编辑投保申请信息表', row)" icon="el-icon-edit" v-permissions="['business:insuranceapply:update']">查看详情</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination
                @size-change="handleSizeChange"
                @current-change="handlePageChange"
                :pagination="tableData.pagination"
            >
            </pagination>
        </template>
        <!-- æ–°å»º/修改 -->
        <OperaPolicyListWindow ref="OperaPolicyListWindow" @success="handlePageChange"/>
    </TableLayout>
</template>

<script>
    import BaseTable from '@/components/base/BaseTable'
    import TableLayout from '@/layouts/TableLayout'
    import Pagination from '@/components/common/Pagination'
    import OperaPolicyListWindow from '@/components/business/OperaPolicyListWindow'
    export default {
        name: 'policyList',
        extends: BaseTable,
        components: { TableLayout, Pagination, OperaPolicyListWindow },
        data () {
            return {
                // æœç´¢
                searchForm: {
                    createDate: '',
                    solutionId: '',
                    companyId: '',
                    status: ''
                }
            }
        },
        created () {
            this.config({
                module: '投保申请信息表',
                api: '/business/insuranceApply',
                'field.id': 'id',
                'field.main': 'id'
            })
            this.search()
        }
    }
</script>