MrShi
2025-05-26 daf76fb0807550f6e49545e10603a29e414f3b84
company/src/components/business/OperaSettleClaimsWindow.vue
@@ -1,756 +1,867 @@
<template>
    <GlobalWindow
        :title="title"
        width="80%"
        width="100%"
        :withFooter="false"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="desc">
            <div class="desc_label">
                <div class="desc_label_left">
                    <span class="desc_label_left_title">
                        报案详情
                    </span>
                    <span class="desc_label_left_time">
                        报案日期:2015-10-03 10:15:22
                    </span>
                    <span class="desc_label_left_code">
                        报案号:214141241241
                    </span>
                </div>
                <div class="desc_label_right">
                    <el-button type="primary" @click="visible1 = true">添加报案号</el-button>
                    <el-button type="primary" @click="visible2 = true">理赔处理</el-button>
                    <el-button type="primary" @click="visible4 = true">结案提交</el-button>
                    <el-button type="danger" @click="visible3 = true">撤销申请</el-button>
        <div class="box" v-if="info">
            <div class="box_status">
                <div class="box_status_row" v-for="(item, index) in info.parentStatusVOList" :key="index">
                    <div v-if="info.parentStatusVOList.length - 1 !== index" :class="item.optDate ? 'box_status_row_xian statusColor1' : 'box_status_row_xian'"></div>
                    <div :class="item.optDate ? 'box_status_row_icon statusColor1' : info.parentStatusVOList[index - 1].optDate ? 'box_status_row_icon statusColor2 statusColor3' : 'box_status_row_icon'"></div>
                    <div class="box_status_row_info">
                        <div class="title">{{item.parentTitle}}</div>
                        <div class="info" v-if="item.childTitle">{{item.childTitle}}</div>
                        <div class="info" v-if="item.optDate">{{item.optDate}}</div>
                    </div>
                </div>
            </div>
            <div class="desc_list">
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        出险人姓名:
                    </div>
                    <div class="desc_list_item_val">
                        吴三万
            <div class="box_desc">
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <i class="el-icon-success"></i>
                        <span class="box_desc_title_val">理算完成</span>
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        出险人身份证号:
                    </div>
                    <div class="desc_list_item_val">
                        320224403660011111
                    </div>
                <div class="box_desc_ls">
                    <span>理算赔付金额合计:</span>
                    <span>¥{{info.claimAccount + info.otherAccount}}</span>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        事故发生时间:
                    </div>
                    <div class="desc_list_item_val">
                        2015-10-02 10:15:22
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        所属保单号:
                    </div>
                    <div class="desc_list_item_val" style="cursor: pointer; color: rgba(39, 157, 255, 0.968627450980392);">
                        11121624116241
                        <el-button type="primary" style="margin-left: 10px;">查看保险单</el-button>
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        保险生效起期:
                    </div>
                    <div class="desc_list_item_val">
                        2015-10-02 10:15:22
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        保险生效止期:
                    </div>
                    <div class="desc_list_item_val">
                        2015-10-02 10:15:22
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        派遣单位:
                    </div>
                    <div class="desc_list_item_val">
                        芜湖格力精密制造有限公司
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        所属工种:
                    </div>
                    <div class="desc_list_item_val">
                        4类机械加工
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        就诊医疗机构:
                    </div>
                    <div class="desc_list_item_val">
                        安徽省人民医院
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        事故类型:
                    </div>
                    <div class="desc_list_item_val">
                        工作期间受伤
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        是否住院:
                    </div>
                    <div class="desc_list_item_val">
                        否
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        是否有医疗保险:
                    </div>
                    <div class="desc_list_item_val">
                        否
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        出险地区:
                    </div>
                    <div class="desc_list_item_val">
                        安徽省合肥市
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        报案人姓名:
                    </div>
                    <div class="desc_list_item_val">
                        王林
                    </div>
                </div>
                <div class="desc_list_item">
                    <div class="desc_list_item_label">
                        报案人联系方式:
                    </div>
                    <div class="desc_list_item_val">
                        13355667788
                    </div>
                </div>
                <div class="desc_list_item" style="width: 100%;">
                    <div class="desc_list_item_label">
                        事故描述:
                    </div>
                    <div class="desc_list_item_val">
                        2021年01月24日凌晨03点左右,员工周光磊在苏州工业园区长宏光电科技有限公司光电生产部光学膜裁切课车间,用手动叉车搬运原材料时,原材料掉落砸到右脚,凌晨3:30左右公司派专车送往苏州工业园区星湖医院就诊,为员工伤口进行包扎止血后,凌晨05:45转送至苏州瑞华骨科医院进一步治疗。
                    </div>
                </div>
                <div class="desc_list_item" style="width: 100%;">
                    <div class="desc_list_item_label">
                        报案视频:
                    </div>
                    <div class="desc_list_item_videos">
                        <div class="desc_list_item_imgs_video">
                            <video src="blob:https://www.bilibili.com/f8718314-82c5-43d2-9b26-2c4d701b6bab"></video>
                        </div>
                        <div class="desc_list_item_imgs_video">
                            <video src="blob:https://www.bilibili.com/f8718314-82c5-43d2-9b26-2c4d701b6bab"></video>
                <div class="box_desc_lslist">
                    <div class="box_desc_lslist_title">赔付详情</div>
                    <div class="box_desc_lslist_l">
                        <div class="box_desc_lslist_l_row" v-for="(item, index) in JSON.parse(info.accountContent).filter(row => row.type === 0)" :key="index">
                            <span>{{item.name}}</span>
                            <span>{{item.fee}}</span>
                            <span>{{item.describe}}</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="desc_xian"></div>
            <div class="desc_label">
                <div class="desc_label_left">
                    <span class="desc_label_left_title">
                        理赔资料
                    </span>
                    <span class="desc_label_left_time" style="color: black">
                        资料完成日期:2015-10-03 10:15:22
                    </span>
            <div class="box_desc">
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <span class="box_desc_title_val">报案详情</span>
                        <div class="box_desc_title_zt" v-if="info.statusName">{{info.statusName}}</div>
                        <div class="box_desc_title_tips" v-if="info.isRisk === 1">
                            <i class="el-icon-warning"></i>
                            <span>风险案件</span>
                        </div>
                        <el-select v-model="info.caseType" @change="setCaseType" style="width: 100px;" placeholder="案件类型" v-if="[9,10,11].includes(info.status)">
                            <el-option label="医疗" :value="1"></el-option>
                            <el-option label="伤残" :value="2"></el-option>
                            <el-option label="死亡" :value="3"></el-option>
                        </el-select>
                    </div>
                    <div class="box_desc_btns">
                        <template v-if="userInfo.type === 1">
                            <el-button type="danger" @click="revoke()" v-if="[1,2,3,4,5,9,7,10,11].includes(info.status)">撤销报案</el-button>
                        </template>
                        <template v-if="userInfo.type === 0">
                            <el-button type="danger" @click="returnCase" v-if="[1,2].includes(info.status)">退回</el-button>
                            <el-button type="primary" @click="register" v-if="[1,2].includes(info.status)">立案</el-button>
                            <el-button type="primary" @click="$refs.acceptance.open('案件受理', info.id)" v-if="[3,5].includes(info.status)">受理</el-button>
                            <el-button type="primary" @click="addRemark" v-if="![0,1,2,4,14].includes(info.status)">备注</el-button>
                            <el-button type="primary" @click="addReport(1)" v-if="[3].includes(info.status) && info.reportNumStatus === 0">添加报案号</el-button>
                            <el-button type="primary" @click="addReport(2)" v-if="[9].includes(info.status) && info.reportNumStatus === 1">编辑报案号</el-button>
                            <el-button type="primary" @click="$refs.adjustment.open('理算', info.id, 1)" v-if="[9].includes(info.status)">理算</el-button>
                            <el-button type="primary" @click="$refs.adjustment.open('重新理算', info.id, 1)" v-if="[10].includes(info.status)">重新理算</el-button>
                            <el-button type="primary" @click="$refs.adjustment.open('核赔', info.id, 2)" v-if="[10].includes(info.status)">核赔</el-button>
                            <el-button type="primary" @click="supplementaryMaterials" v-if="[9].includes(info.status)">补充材料</el-button>
                            <el-button type="primary" @click="$refs.additionMaterial_ba.open('添加材料', info.id)" v-if="[9,10].includes(info.status)">添加材料</el-button>
                        </template>
                        <el-button icon="el-icon-refresh-left" type="primary" circle @click="$refs.caseProgress.open('案件进度', info.settleClaimsLogList)" v-if="![0,14].includes(info.status)"></el-button>
                    </div>
                </div>
                <div class="desc_label_right">
                    <el-button type="primary" @click="visible5 = true">备注标签</el-button>
                    <el-button type="primary" @click="submit">资料确认</el-button>
                    <el-button type="primary">资料下载</el-button>
                <div class="box_desc_list">
                    <div class="box_desc_list_row">
                        报案时间:{{info.createDate}}
                    </div>
                    <div class="box_desc_list_row">
                        报案号:{{info.reportNum}}
                    </div>
                    <div class="box_desc_list_row">
                        所属保单:{{info.applyCode}}
                    </div>
                    <div class="box_desc_list_row">
                        报案人:{{info.informantName}}
                    </div>
                    <div class="box_desc_list_row">
                        报案人联系方式:{{info.informantPhone}}
                    </div>
                    <div class="box_desc_list_zw"></div>
                </div>
            </div>
            <div class="desc_data">
                <div class="desc_data_label">1. 员工关系证明资料</div>
                <div class="desc_data_list">
                    <div class="desc_data_list_item" v-for="(item, index) in 2" :key="index">
                        <div class="desc_data_list_item_dele">删除</div>
                        <div class="desc_data_list_item_img">
                            <img src="@/assets/images/Galanz@2x.png" />
                        </div>
                        <div class="desc_data_list_item_info">
                            <span>考勤表.jpg</span>
                            <span>操作员-王某某</span>
                            <span>2023-05-22 10:10:11</span>
            <div class="box_fx" v-if="info.isRisk === 1">
                <div class="box_fx_left">
                    <i class="el-icon-warning"></i>
                    <span class="box_fx_left_a">注意,该案件有{{info.riskContent.length}}条风险信息</span>
                    <span class="box_fx_left_b" @click="$refs.riskCaseReminder.open('风险案件提醒', info.riskContent)">查看详情</span>
                </div>
                <i class="el-icon-close" @click="info.isRisk = 0"></i>
            </div>
            <div class="box_desc">
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <span class="box_desc_title_val">出险人信息</span>
                    </div>
<!--                    <div class="box_desc_btns">-->
<!--                        <div class="box_desc_btns_operate">-->
<!--                            <i class="el-icon-arrow-down"></i>-->
<!--                            <span>收起</span>-->
<!--                        </div>-->
<!--                    </div>-->
                </div>
                <div class="box_desc_list">
                    <div class="box_desc_list_row">
                        出险人姓名:{{info.memberName}}
                    </div>
                    <div class="box_desc_list_row">
                        出险人身份证号:{{info.memberIdcard}}
                    </div>
                    <div style="width: 33%; height: 0;"></div>
                </div>
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <span class="box_desc_title_val">保险方案</span>
                    </div>
                </div>
                <div class="box_desc_f">
                    <div class="box_desc_fa">
                        <div class="box_desc_fa_title">{{info.solutionName}}</div>
                        <div class="box_desc_fa_row">保单号:{{info.applyCode}}</div>
                        <div class="box_desc_fa_row">保障期限:{{info.baoxianStartTime}}~{{info.baoxianEndTime}}</div>
                        <div class="box_desc_fa_row">投保单位:{{info.companyName}}</div>
                        <div class="box_desc_fa_row">派遣单位:{{info.duName}}</div>
                        <div class="box_desc_fa_row">所属工种:{{info.worktypeName}}</div>
                    </div>
                </div>
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <span class="box_desc_title_val">出险信息</span>
                    </div>
                </div>
                <div class="box_desc_list">
                    <div class="box_desc_list_row">
                        出险时间:{{info.happenTime}}
                    </div>
                    <div class="box_desc_list_row">
                        就诊医疗机构:{{info.hospital}}
                    </div>
                    <div class="box_desc_list_row">
                        出险地区:{{info.areaInfo}}
                    </div>
                    <div class="box_desc_list_row" style="width: 100%;">
                        出险经过:{{info.content}}
                    </div>
                    <div class="box_desc_list_row" style="width: 100%;">
                        事故类型:{{returnType(info.type)}}
                    </div>
                    <div class="box_desc_list_row">
                        是否有医疗保险:{{returnName(info.medicalInsurance)}}
                    </div>
                    <div class="box_desc_list_row">
                        就诊类型:{{returnInHospital(info.inHospital)}}
                    </div>
                    <div class="box_desc_list_zw"></div>
                    <div class="box_desc_list_img">
                        <span>事故视频/照片:</span>
                        <div class="box_desc_list_img_files">
                            <div class="box_desc_list_img_files_row" v-for="(item, index) in info.reportFileList" :key="index">
                                <img :src="item.fileurlFull" alt="img" />
                            </div>
                        </div>
                    </div>
                    <div class="desc_data_list_item">
                        <div class="desc_data_list_item_img" style="cursor: pointer; background: #8c939d;">
                            <i class="el-icon-plus"></i>
                        </div>
                        <div class="desc_data_list_item_upload">
                            <el-button type="primary">上传</el-button>
                            <el-button>取消</el-button>
                        </div>
                    </div>
                    <div class="desc_data_list_item1"></div>
                    <div class="desc_data_list_item1"></div>
                </div>
            </div>
            <div class="desc_data">
                <div class="desc_data_label">2. 医疗资料</div>
                <div class="desc_data_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 class="box_desc">
                <div class="box_desc_head">
                    <div class="box_desc_title">
                        <span class="box_desc_title_val">理赔材料</span>
                    </div>
<!--                    <div class="box_desc_btns">-->
<!--                        <div class="box_desc_btns_operate">-->
<!--                            <i class="el-icon-arrow-down"></i>-->
<!--                            <span>收起</span>-->
<!--                        </div>-->
<!--                    </div>-->
                </div>
                <div class="desc_data_list">
                    <div class="desc_data_list_item" v-for="(item, index) in 2" :key="index">
                        <div class="desc_data_list_item_dele">删除</div>
                        <div class="desc_data_list_item_img">
                            <img src="@/assets/images/Galanz@2x.png" />
                        </div>
                        <div class="desc_data_list_item_info">
                            <span>考勤表.jpg</span>
                            <span>操作员-王某某</span>
                            <span>2023-05-22 10:10:11</span>
                <div class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>员工关系证明材料</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.relationFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                    <div class="desc_data_list_item">
                        <div class="desc_data_list_item_img" style="cursor: pointer; background: #8c939d;">
                            <i class="el-icon-plus"></i>
                        </div>
                        <div class="desc_data_list_item_upload">
                            <el-button type="primary">上传</el-button>
                            <el-button>取消</el-button>
                </div>
                <div class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>门诊</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.outpatientFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                    <div class="desc_data_list_item1"></div>
                    <div class="desc_data_list_item1"></div>
                </div>
            </div>
            <div class="desc_data">
                <div class="desc_data_label">3. 赔付结案资料</div>
                <div class="desc_data_list">
                    <div class="desc_data_list_item" v-for="(item, index) in 2" :key="index">
                        <div class="desc_data_list_item_dele">删除</div>
                        <div class="desc_data_list_item_img">
                            <img src="@/assets/images/Galanz@2x.png" />
                        </div>
                        <div class="desc_data_list_item_info">
                            <span>考勤表.jpg</span>
                            <span>操作员-王某某</span>
                            <span>2023-05-22 10:10:11</span>
                <div class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>住院</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.hospitalFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                    <div class="desc_data_list_item">
                        <div class="desc_data_list_item_img" style="cursor: pointer; background: #8c939d;">
                            <i class="el-icon-plus"></i>
                        </div>
                        <div class="desc_data_list_item_upload">
                            <el-button type="primary">上传</el-button>
                            <el-button>取消</el-button>
                </div>
                <div class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>伤残</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.disabilityFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                    <div class="desc_data_list_item1"></div>
                    <div class="desc_data_list_item1"></div>
                </div>
            </div>
            <div class="desc_label">
                <div class="desc_label_left">
                    <span class="desc_label_left_title">
                        案件进度
                    </span>
                <div class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>其他材料</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.otherFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                </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 class="box_desc_cailiao">
                    <div class="box_desc_cailiao_title">
                        <div class="box_desc_cailiao_title_x"></div>
                        <span>补充材料</span>
                    </div>
                    <div class="box_desc_cailiao_list">
                        <div class="box_desc_cailiao_list_img" v-for="(item, index) in info.supplementFileList" :key="index">
                            <img :src="item.fileurlFull" alt="img" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--    退回    -->
        <el-dialog
            title="添加报案号"
            :visible.sync="visible1"
            :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">
                        <input type="text" placeholder="请输入">
                    </div>
                </div>
            </div>
            title="退回"
            :visible.sync="show"
            width="500px">
            <span>这是一段信息</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible1 = false">取 消</el-button>
                <el-button type="primary" @click="visible1 = false">确 定</el-button>
                <el-button @click="show = false">取消</el-button>
                <el-button type="primary" @click="show = false">确定退回</el-button>
            </span>
        </el-dialog>
        <el-dialog
            title="理赔处理"
            :visible.sync="visible2"
            :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">
                        <textarea placeholder="请输入"></textarea>
                    </div>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible2 = false">取 消</el-button>
                <el-button type="primary" @click="visible2 = false">确 定</el-button>
            </span>
        </el-dialog>
        <el-dialog
            title="撤销申请"
            :visible.sync="visible3"
            :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">
                        <textarea placeholder="请输入"></textarea>
                    </div>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible3 = false">取 消</el-button>
                <el-button type="primary" @click="visible3 = false">确 定</el-button>
            </span>
        </el-dialog>
        <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">
                        <textarea placeholder="请输入"></textarea>
                    </div>
                </div>
                <div class="form_item">
                    <div class="form_item_label">
                        <span>*</span>理赔费用:
                    </div>
                    <div class="form_item_val">
                        <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-column
                                prop="address"
                                label="死亡理赔">
                            </el-table-column>
                            <el-table-column
                                prop="address"
                                label="理赔总额">
                            </el-table-column>
                        </el-table>
                    </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>
        <el-dialog
            title="备注标签"
            :visible.sync="visible5"
            :show-close="false"
            :close-on-click-modal="false"
            width="30%"
            center>
            <div class="form">
                <div class="form_span">
                    <span>理赔员-王林  2023-11-11 10:33:12</span>
                    <span>李福贤 右中指远节指骨骨折打包处理5000(含医疗误工 伤)免鉴定和认定可以吗?</span>
                </div>
                <div class="form_span">
                    <span>理赔员-李某  2023-11-11 10:33:12</span>
                    <span>理赔试着申请下 需提供检查报告单 原件寄保司</span>
                </div>
                <div class="form_item">
                    <div class="form_item_label">
                        <span>*</span>填写撤销说明:
                    </div>
                    <div class="form_item_val">
                        <textarea placeholder="请输入"></textarea>
                    </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>
        <!--    风险案件提醒    -->
        <RiskCaseReminder ref="riskCaseReminder" />
        <!--    案件进度    -->
        <CaseProgress ref="caseProgress" />
        <!--    受理    -->
        <Acceptance ref="acceptance" @success="getDetail" />
        <!--    添加材料    -->
        <AdditionMaterial_ba ref="additionMaterial_ba" @success="getDetail" />
        <!--    理算    -->
        <adjustment ref="adjustment" @success="getDetail" />
    </GlobalWindow>
</template>
<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    export default {
        name: 'OperaSettleClaimsWindow',
        extends: BaseOpera,
        components: { GlobalWindow },
        data () {
            return {
                // 表单数据
                form: {
                    id: null,
                },
                // 验证规则
                rules: {
                },
                activeName: 'first',
                reverse: true,
                activities: [
                    {
                        content: '提交报案申请\n' +
                            '\n' +
                            '\n' +
                            '提交意见:-',
                        timestamp: '操作员-张伟(安徽平安人力资源有限公司)\n' +
                            '\n' +
                            '2023-09-11 00:00:00'
                    }
                ],
                tableData: [],
                visible1: false,
                visible2: false,
                visible3: false,
                visible4: false,
                visible5: false
            }
        },
        created () {
            this.config({
                api: '/business/settleClaims',
                'field.id': 'id'
            })
        },
        methods: {
            handleClick(tab, event) {
                console.log(tab, event);
            },
            submit() {
                this.$confirm('理赔材料收集完成,请及时提交保险公司!', '资料收集完成', {
                    confirmButtonText: '提交',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '提交成功!'
                    });
                }).catch(() => {
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import { findById, returnSettle } from '@/api/business/settleClaims'
import {
    register,
    addReportNum,
    addRemark,
    saveSupplementDescribe,
    updCaseType } from '@/api/business/settleRisk'
import RiskCaseReminder from '@/components/business/riskCaseReminder'
import CaseProgress from '@/components/business/caseProgress'
import Acceptance from '@/components/business/acceptance'
import AdditionMaterial_ba from '@/components/business/additionMaterial_ba'
import adjustment from '@/components/business/adjustment'
import { mapState } from 'vuex'
                });
            }
        }
export default {
  name: 'OperaSettleClaimsWindow',
  extends: BaseOpera,
  components: { GlobalWindow, RiskCaseReminder, CaseProgress, Acceptance, AdditionMaterial_ba, adjustment },
  data () {
    return {
        show: false,
        info: null,
        id: null
    }
  },
  computed: {
    ...mapState(['userInfo'])
  },
  created () {
    this.config({
      api: '/business/settleClaims',
      'field.id': 'id'
    })
  },
  methods: {
      open (title, id) {
          this.title = title
          this.id = id
          this.getDetail()
      },
      setCaseType(e) {
          updCaseType({ id: this.id, caseType: e })
            .then(res => {
                this.getDetail()
            })
      },
      supplementaryMaterials() {
          this.$prompt('补充说明', '补充材料', {
              confirmButtonText: '提交',
              cancelButtonText: '取消',
              inputPattern: /^(?:.|\n)+$/,
              inputErrorMessage: '补充说明不能为空!',
              beforeClose: (action, instance, done) => {
                  if (action === 'confirm') {
                      instance.confirmButtonLoading = true;
                      saveSupplementDescribe({ id: this.id, describe: instance.inputValue })
                          .finally(() => {
                              done();
                              instance.confirmButtonLoading = false;
                          })
                  } else {
                      done();
                  }
              }
          }).then(({ value }) => {
              this.getDetail()
          }).catch(() => {
          });
      },
      addRemark() {
          this.$prompt('备注', '添加备注', {
              confirmButtonText: '添加',
              cancelButtonText: '取消',
              inputPattern: /^(?:.|\n)+$/,
              inputErrorMessage: '备注不能为空!',
              beforeClose: (action, instance, done) => {
                  if (action === 'confirm') {
                      instance.confirmButtonLoading = true;
                      addRemark({ id: this.id, describe: instance.inputValue })
                          .finally(() => {
                              done();
                              instance.confirmButtonLoading = false;
                          })
                  } else {
                      done();
                  }
              }
          }).then(({ value }) => {
              this.getDetail()
          }).catch(() => {
          });
      },
      addReport(type) {
          this.$prompt(`报案号`, `${type === 1 ? '添加报案号' : '编辑报案号'}`, {
              confirmButtonText: '添加',
              cancelButtonText: '取消',
              inputPattern: /^(?:.|\n)+$/,
              inputErrorMessage: '报案号不能为空!',
              beforeClose: (action, instance, done) => {
                  if (action === 'confirm') {
                      instance.confirmButtonLoading = true;
                      addReportNum({ id: this.id, reportNum: instance.inputValue })
                        .finally(() => {
                            done();
                            instance.confirmButtonLoading = false;
                        })
                  } else {
                      done();
                  }
              }
          }).then(({ value }) => {
              this.getDetail()
          }).catch(() => {
          });
      },
      register() {
          this.$prompt('立案说明', '立案', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              beforeClose: (action, instance, done) => {
                  if (action === 'confirm') {
                      instance.confirmButtonLoading = true;
                      register({ id: this.id, describe: instance.inputValue, registerStatus: 3 })
                          .finally(() => {
                              done();
                              instance.confirmButtonLoading = false;
                          })
                  } else {
                      done();
                  }
              }
          }).then(({ value }) => {
              this.getDetail()
          }).catch(() => {
          });
      },
      returnCase() {
          this.$prompt('退回说明', '退回', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              inputPattern: /^(?:.|\n)+$/,
              inputErrorMessage: '退回说明不能为空!',
              beforeClose: (action, instance, done) => {
                  if (action === 'confirm') {
                      instance.confirmButtonLoading = true;
                      register({ id: this.id, describe: instance.inputValue, registerStatus: 4 })
                          .finally(() => {
                              done();
                              instance.confirmButtonLoading = false;
                          })
                  } else {
                      done();
                  }
              }
          }).then(({ value }) => {
              this.getDetail()
          }).catch(() => {
          });
      },
      getDetail() {
          findById(this.id)
              .then(res => {
                  res.riskContent = JSON.parse(res.riskContent)
                  this.info = res
                  this.visible = true
              })
      },
      // 撤销
      revoke(id) {
          this.$confirm('撤销后,案件直接结束,无法继续进行理赔操作!', '是否撤销报案?', {
              confirmButtonText: '确定撤销',
              cancelButtonText: '我再想想',
              type: 'warning'
          }).then(() => {
              returnSettle({ id: this.info.id })
                  .then(res => {
                      this.getDetail()
                  })
          }).catch(() => {
          });
      },
      returnInHospital(type) {
          switch (type) {
              case 0:
                  return '住院'
              case 1:
                  return '门诊'
          }
      },
      returnName(type) {
          switch (type) {
              case 0:
                  return '是'
              case 1:
                  return '否'
          }
      },
      returnType(type) {
          switch (type) {
                case 0:
                    return '工作期间受伤'
              case 1:
                  return '上下班途中受伤'
              case 2:
                  return '非工作时间受伤'
              case 3:
                  return '意外受伤'
          }
      }
  }
}
</script>
<style>
    .v-modal {
        z-index: 2000 !important;
    }
</style>
<style lang="scss" scoped>
    .form {
    .box {
        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
        .form_span {
        .box_status {
            width: 100%;
            padding: 30px 0;
            box-sizing: border-box;
            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: start;
            margin-bottom: 20px;
            &:last-child {
                margin: 0 !important;
            }
            .form_item_label {
                flex-shrink: 0;
                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: 100%;
                    outline: none;
                    border-radius: 5px;
                    border: 1px solid #cbcbcb;
                    padding: 0 20px;
                    box-sizing: border-box;
                }
            }
        }
    }
    .desc {
        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
        .desc_label {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .desc_label_left {
                flex: 1;
            justify-content: center;
            margin-bottom: 30px;
            .box_status_row {
                width: 200px;
                display: flex;
                flex-direction: column;
                align-items: center;
                .desc_label_left_title {
                    font-size: 20px;
                    font-weight: bold;
                    color: black;
                justify-content: center;
                position: relative;
                .box_status_row_xian {
                    position: absolute;
                    right: -55px;
                    top: 5px;
                    width: calc(100% - 80px);
                    height: 1px;
                    background-color: #BEBEBE;
                }
                .desc_label_left_time {
                    font-size: 14px;
                    color: rgba(249, 86, 1, 0.996);
                    margin-left: 10px;
                .statusColor1 {
                    background-color: #165DFF !important;
                }
                .desc_label_left_code {
                    font-size: 15px;
                    color: black;
                    margin-left: 30px;
                .statusColor2 {
                    border: 1px solid #0052D9 !important;
                }
            }
            .desc_label_right {
                flex-shrink: 0;
                .statusColor3 {
                    span {
                        color: #ffffff !important;
                    }
                }
                .box_status_row_icon {
                    width: 8px;
                    height: 8px;
                    border: 1px solid #C5C5C5;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    span {
                        color: rgba(78,89,105,1);
                        font-size: 14px;
                    }
                    i {
                        color: #165DFF;
                    }
                }
                .box_status_row_info {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    margin-top: 10px;
                    .title {
                        color: rgba(78,89,105,1);
                        font-size: 16px;
                        font-weight: bold;
                    }
                    .info {
                        color: rgba(154,154,154,1);
                        font-size: 14px;
                        margin-top: 10px;
                    }
                }
            }
        }
        .desc_list {
        .box_desc {
            width: 100%;
            margin-top: 20px;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            .desc_list_item {
                width: 33.3%;
                display: flex;
                align-items: center;
                margin-bottom: 10px;
                .desc_list_item_label {
                    width: 130px;
                    flex-shrink: 0;
                    font-size: 15px;
                    color: black;
            margin-bottom: 15px;
            .box_desc_cailiao {
                width: 100%;
                margin-bottom: 18px;
                .box_desc_cailiao_title {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    margin-bottom: 15px;
                    .box_desc_cailiao_title_x {
                        width: 5px;
                        height: 14px;
                        background-color: #165DFF;
                    }
                    span {
                        color: rgba(16,16,16,1);
                        font-size: 14px;
                        margin-left: 5px;
                    }
                }
                .desc_list_item_val {
                    flex: 1;
                    font-size: 15px;
                    color: black;
                }
                .desc_list_item_videos {
                    flex: 1;
                .box_desc_cailiao_list {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                    .desc_list_item_imgs_video {
                        width: 150px;
                        height: 150px;
                        background: black;
                        margin-right: 10px;
                        video {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
            }
        }
        .desc_xian {
            width: 100%;
            height: 1px;
            margin: 10px 0;
            background: #ececec;
        }
        .desc_data {
            width: 100%;
            display: flex;
            flex-direction: column;
            margin-top: 20px;
            .desc_data_label {
                font-size: 16px;
                color: black;
                font-weight: 600;
                margin-bottom: 20px;
            }
            .desc_data_cate {
                width: 100%;
                margin: 0 0 10px 0;
            }
            .desc_data_list {
                width: 100%;
                display: flex;
                align-items: center;
                flex-wrap: wrap;
                justify-content: space-between;
                .desc_data_list_item1 {
                    width: 24.5%;
                }
                .desc_data_list_item {
                    width: 24.5%;
                    padding: 10px;
                    box-sizing: border-box;
                    border: 1px solid #e2e2e2;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    position: relative;
                    margin-bottom: 10px;
                    .desc_data_list_item_dele {
                        position: absolute;
                        top: 10px;
                        right: 10px;
                        font-size: 14px;
                        cursor: pointer;
                        color: rgba(249, 86, 1, 0.996078431372549);
                    }
                    .desc_data_list_item_upload {
                        flex: 1;
                        height: 80px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                    }
                    .desc_data_list_item_img {
                        flex-shrink: 0;
                        width: 80px;
                        height: 80px;
                    .box_desc_cailiao_list_img {
                        width: 100px;
                        height: 100px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        overflow: hidden;
                        .el-icon-plus {
                            font-size: 26px;
                            color: #ffffff;
                        margin-right: 15px;
                        background-color: #E5E5E5;
                        &:last-child {
                            margin: 0;
                        }
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .desc_data_list_item_info {
                        flex: 1;
                        height: 80px;
                }
            }
            .box_desc_ls {
                width: 100%;
                display: flex;
                align-items: center;
                margin-bottom: 15px;
                span {
                    &:nth-child(1) {
                        color: rgba(0,0,0,1);
                        font-size: 16px;
                    }
                    &:nth-child(2) {
                        color: rgba(255,162,63,1);
                        font-size: 16px;
                    }
                }
            }
            .box_desc_lslist {
                width: 100%;
                display: flex;
                flex-direction: column;
                margin-bottom: 40px;
                .box_desc_lslist_title {
                    color: rgba(0,0,0,1);
                    font-size: 16px;
                    margin-bottom: 15px;
                }
                .box_desc_lslist_l {
                    width: 100%;
                    display: flex;
                    flex-direction: column;
                    padding-left: 50px;
                    box-sizing: border-box;
                    .box_desc_lslist_l_row {
                        width: 100%;
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        align-items: center;
                        margin-bottom: 13px;
                        &:last-child {
                            margin: 0 !important;
                        }
                        span {
                            &:nth-child(1) {
                                color: rgba(16,16,16,1);
                                font-size: 14px;
                                color: black;
                            }
                            &:nth-child(2) {
                                color: rgba(16,16,16,1);
                                font-size: 14px;
                                color: #888888;
                                margin: 0 30px;
                            }
                            &:nth-child(3) {
                                color: rgba(108,108,108,1);
                                font-size: 14px;
                                color: #888888;
                            }
                        }
                    }
                }
            }
            .box_desc_head {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 26px;
                .box_desc_title {
                    display: flex;
                    align-items: center;
                    .el-icon-success {
                        font-size: 20px;
                        color: #34C758;
                        margin-right: 10px;
                    }
                    .box_desc_title_val {
                        color: rgba(16,16,16,1);
                        font-size: 18px;
                        margin-right: 20px;
                    }
                    .box_desc_title_zt {
                        height: 25px;
                        padding: 0 15px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        box-sizing: border-box;
                        border-radius: 15px;
                        background-color: rgba(239,239,239,1);
                        color: rgba(16,16,16,1);
                        font-size: 12px;
                        margin-right: 20px;
                    }
                    .box_desc_title_tips {
                        width: 84px;
                        height: 25px;
                        border-radius: 15px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        background-color: rgba(254,226,225,1);
                        margin-right: 20px;
                        .el-icon-warning {
                            color: #FF4D4F;
                            margin-right: 5px;
                        }
                        span {
                            color: #FF4D4F;
                            font-size: 12px;
                        }
                    }
                }
                .box_desc_btns {
                    display: flex;
                    align-items: center;
                    .box_desc_btns_operate {
                        display: flex;
                        align-items: center;
                        margin-left: 10px;
                        cursor: pointer;
                        i {
                            color: #515151;
                        }
                        span {
                            color: rgba(16,16,16,1);
                            font-size: 14px;
                            margin-left: 4px;
                        }
                    }
                }
            }
            .box_desc_list {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                flex-wrap: wrap;
                .box_desc_list_zw {
                    width: 33%;
                    height: 0;
                }
                .box_desc_list_row {
                    width: 33%;
                    color: rgba(16,16,16,1);
                    font-size: 14px;
                    margin-bottom: 24px;
                }
                .box_desc_list_img {
                    width: 100%;
                    display: flex;
                    align-items: start;
                    span {
                        color: rgba(16,16,16,1);
                        font-size: 14px;
                    }
                    .box_desc_list_img_files {
                        flex-shrink: 0;
                        display: flex;
                        align-items: center;
                        flex-wrap: wrap;
                        .box_desc_list_img_files_row {
                            width: 94px;
                            height: 94px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            overflow: hidden;
                            margin-right: 25px;
                            &:last-child {
                                margin: 0;
                            }
                            background-color: #E5E5E5;
                            img {
                                width: 100%;
                            }
                        }
                    }
                }
            }
            .box_desc_f {
                width: 100%;
                display: flex;
                align-items: center;
                flex-wrap: wrap;
                margin-bottom: 30px;
                justify-content: space-between;
                .box_desc_fa {
                    width: 32%;
                    padding: 22px 25px;
                    box-sizing: border-box;
                    border-radius: 4px;
                    background-color: rgba(239,239,239,1);
                    .box_desc_fa_title {
                        color: rgba(16,16,16,1);
                        font-size: 18px;
                        font-weight: bold;
                        text-decoration: underline;
                        margin-bottom: 10px;
                    }
                    .box_desc_fa_row {
                        color: rgba(16,16,16,1);
                        font-size: 14px;
                        margin-bottom: 10px;
                        &:last-child {
                            margin: 0;
                        }
                    }
                }
            }
        }
        .desc_times {
        .box_fx {
            width: 100%;
            margin-top: 20px;
            height: 49px;
            display: flex;
            padding: 0 17px;
            margin-bottom: 30px;
            box-sizing: border-box;
            align-items: center;
            justify-content: space-between;
            background-color: rgba(254,226,225,1);
            .box_fx_left {
                display: flex;
                align-items: center;
                i {
                    color: #FF4D4F;
                    font-size: 18px;
                }
                .box_fx_left_a {
                    color: rgba(255,77,79,1);
                    font-size: 14px;
                    margin: 0 10px;
                }
                .box_fx_left_b {
                    color: rgba(255,77,79,1);
                    font-size: 14px;
                    text-decoration: underline;
                    cursor: pointer;
                }
            }
            .el-icon-close {
                color: #101010;
                cursor: pointer;
                font-size: 18px;
            }
        }
    }
</style>