From 40e56560785a12961fe6b835f3db53e313b92ec7 Mon Sep 17 00:00:00 2001
From: liuxi <357439530@qq.com>
Date: Wed, 4 Dec 2024 11:53:49 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A1=88=E4=BB=B6=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/style/common.scss                  |   3 +
 .../components/addCaseDialog.vue              | 750 ++++++++++++++++
 .../components/caseAllocationDialog.vue       | 432 +++++++++
 .../components/editCaseDrawer.vue             | 836 ++++++++++++++++++
 .../components/importCaseDialog.vue           | 101 +++
 src/pages/case-management-old/index.vue       | 651 ++++++++++++++
 src/pages/case-management/index.vue           | 620 +++++++------
 .../components/caseAllocationDialog.vue       |   3 +-
 src/pages/case-package/index.vue              |  17 +-
 src/services/caseManagement.js                |   6 +-
 src/services/casePackageManagement.js         |   9 +-
 11 files changed, 3096 insertions(+), 332 deletions(-)
 create mode 100644 src/pages/case-management-old/components/addCaseDialog.vue
 create mode 100644 src/pages/case-management-old/components/caseAllocationDialog.vue
 create mode 100644 src/pages/case-management-old/components/editCaseDrawer.vue
 create mode 100644 src/pages/case-management-old/components/importCaseDialog.vue
 create mode 100644 src/pages/case-management-old/index.vue

diff --git a/src/assets/style/common.scss b/src/assets/style/common.scss
index 0cfb9f2..87ea1cc 100644
--- a/src/assets/style/common.scss
+++ b/src/assets/style/common.scss
@@ -105,6 +105,9 @@ html{
 .color-86909C{
     color: #86909C;
 }
+.color-274ea4{
+    color: #274ea4;
+}
 
 .color-text-primary{
     color: $color-text-primary;
diff --git a/src/pages/case-management-old/components/addCaseDialog.vue b/src/pages/case-management-old/components/addCaseDialog.vue
new file mode 100644
index 0000000..9f799a2
--- /dev/null
+++ b/src/pages/case-management-old/components/addCaseDialog.vue
@@ -0,0 +1,750 @@
+<template>
+    <div>
+        <el-dialog
+            :title="addCaseDialog.title"
+            :visible="true"
+            width="880px"
+            append-to-body
+            :close-on-click-modal="false"
+            @close="handleClose"
+        >
+        
+            <div >
+
+                <el-steps :active="presentStep" align-center>
+                    <el-step v-for="(item,inx) in transferStep" :key="inx" :title="item.title" :description="item.description"></el-step>
+                </el-steps>
+
+                <!-- 基本信息 -->
+                <div v-if="presentStep === 1">
+                   
+                    <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">基本信息</div> 
+                            <div class="p-h-24">
+                                <el-form ref="ruleFormBase" 
+                                        :model="baseInfo" 
+                                        :rules="rulesClient" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="金融机构名称" prop="financialOrgName">
+                                                    <el-input
+                                                    v-model.trim="baseInfo.financialOrgName"
+                                                    placeholder="请输入金融机构名称"
+                                                    clearable
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="社会统一信用代码" prop="financialOrgCode">
+                                                    <el-input
+                                                    v-model.trim="baseInfo.financialOrgCode"
+                                                    placeholder="请输入社会统一信用代码"
+                                                    clearable
+                                                    maxlength="18"
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="案件名称" prop="caseName">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入案件名称"
+                                                        v-model="baseInfo.caseName">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="案件编号" prop="caseNo">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入案件编号"
+                                                        v-model="baseInfo.caseNo">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>   
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="金融产品类型" prop="productTypeId">
+                                                    <el-select v-model="baseInfo.productTypeId"
+                                                            clearable placeholder="请选择金融产品类型"
+                                                            class="width100">
+                                                        <el-option
+                                                                v-for="item in financialProductsTypeOptions"
+                                                                :key="item.code"
+                                                                :label="item.codeName"
+                                                                :value="item.code">
+                                                        </el-option>
+                                                    </el-select>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="标的金额" prop="moneyAmount">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入内容"
+                                                        v-model="baseInfo.moneyAmount">
+                                                        <template slot="append">元</template>
+                                                    </el-input>
+                                                    
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="逾期次数" prop="overdueTimes">
+                                                    <!-- <el-select v-model="baseInfo.overdueTimes"
+                                                            clearable placeholder="请选择逾期次数"
+                                                            class="width100">
+                                                        <el-option
+                                                                v-for="item in operateMethodOptions"
+                                                                :key="item"
+                                                                :label="item"
+                                                                :value="item">
+                                                        </el-option>
+                                                    </el-select> -->
+                                                    <el-input-number v-model="baseInfo.overdueTimes" :min="0" :max="100" class="width100"></el-input-number>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="案件描述" prop="caseDescr">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入内容"
+                                                        v-model="baseInfo.caseDescr">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>                        
+                                    
+                                </el-form>
+                            </div>
+                        </div>  
+                </div>
+                <!-- 当事人信息 -->
+                <div v-else-if="presentStep === 2">
+                    
+                    <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">案件当事人</div> 
+                            <div class="p-h-24">
+                                <div class="border-solid-lighter-1 p-h-24 mb-16">
+                                    <div class="flex-row justify-content-between height-48 line-height-48 f14 border-b-solid-lighter-1 mb-16">
+                                        <div class="color-000">债权人</div>
+                                        <div class="color-text-regular cursor-pointer" @click="handleReset">清空<i class="el-icon-close"></i></div>
+                                    </div>
+                                    <el-form ref="ruleFormCreditor" 
+                                        :model="creditorInfo" 
+                                        :rules="rulesClientCreditor" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="债权人" prop="creditorName">
+                                                    <el-input
+                                                    v-model.trim="creditorInfo.creditorName"
+                                                    placeholder="请输入债权人"
+                                                    clearable
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="社会统一信用代码" prop="creditorOrgCode">
+                                                    <el-input
+                                                    v-model.trim="creditorInfo.creditorOrgCode"
+                                                    placeholder="请输入社会统一信用代码"
+                                                    clearable
+                                                    maxlength="18"
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="法人姓名" prop="creditorLegal">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人姓名"
+                                                        v-model="creditorInfo.creditorLegal">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="法人身份证号" prop="creditorIdcard">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人身份证号"
+                                                        v-model="creditorInfo.creditorIdcard"
+                                                        maxlength="18">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>   
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="法人手机号" prop="creditorPhone">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人手机号"
+                                                        v-model="creditorInfo.creditorPhone"
+                                                        maxlength="11"
+                                                        >
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="公司地址" prop="creditorAddr">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入公司地址"
+                                                        v-model="creditorInfo.creditorAddr">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="邮编" prop="creditorMail">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入邮编"
+                                                        v-model="creditorInfo.creditorMail"
+                                                        maxlength="6"
+                                                        >
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="代理人" prop="creditorAgent">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入代理人"
+                                                        v-model="creditorInfo.creditorAgent">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>                        
+                                    
+                                    </el-form>
+                                </div>
+                                <div class="border-solid-lighter-1 p-h-24">
+                                    <div class="flex-row justify-content-between f14 border-b-solid-lighter-1 mb-8 p-v-8 align-items-center">
+                                        <div class="color-000">债务人</div>
+                                        <el-button size="small" type="primary" @click="handleAdd">新增债务人<i class="el-icon-plus"></i></el-button>
+                                    </div>
+    
+                                    <div>
+                                        <el-form ref="ruleFormObligor" 
+                                        :model="obligorInfoForm" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <div v-for="(item,inx) in obligorInfoForm.debtorEntityList" :key="inx">
+                                            <div class="flex-row justify-content-between align-items-center height-40 f14 mb-16">
+                                                <div class="color-text-primary">债务人{{inx+1}}</div>
+                                                <div class="color-text-regular cursor-pointer" @click="handleRemoveDomain(item)">删除<i class="el-icon-close"></i></div>
+                                            </div>
+
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="债务人姓名"  :prop="'debtorEntityList.' + inx + '.name'" :rules="{required: true, message: '请输入债权人姓名', trigger: 'blur'}">
+                                                        <el-input
+                                                        v-model.trim="obligorInfoForm.debtorEntityList[inx].name"
+                                                        placeholder="请输入债务人姓名"
+                                                        clearable
+                                                        ></el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="证件类型" :prop="'debtorEntityList.' + inx + '.cardTypeId'" :rules="{required: true, message: '请选择证件类型', trigger: 'blur'}">
+                                                        <el-select v-model="obligorInfoForm.debtorEntityList[inx].cardTypeId"
+                                                                clearable placeholder="请选择证件类型"
+                                                                class="width100">
+                                                            <el-option
+                                                                    v-for="item in idTypeOptions"
+                                                                    :key="item.code"
+                                                                    :label="item.codeName"
+                                                                    :value="item.code">
+                                                            </el-option>
+                                                        </el-select>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="证件号码" :prop="'debtorEntityList.' + inx + '.cardNo'"
+                                                    :rules=" [
+                                                        { required: true, message: '请输入证件号', trigger: 'change',},
+                                                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号', trigger: ['blur', 'change']}
+                                                    ]">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入证件号码"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].cardNo"
+                                                            maxlength="18"
+                                                            >
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="手机号码" :prop="'debtorEntityList.' + inx + '.phone'" :rules="[
+                                                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                                                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                                                    ]">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入手机号码"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].phone"
+                                                            maxlength="11"
+                                                            >
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>   
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="地址" :prop="'debtorEntityList.' + inx + '.addr'" :rules="{ required: true, message: '请输入地址', trigger: 'change',}">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入地址"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].addr">
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="邮编" :prop="'debtorEntityList.' + inx + '.mail'" :rules="{ required: true, message: '请输入邮编', trigger: 'change',}">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入邮编"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].mail"
+                                                            maxlength="6">
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>
+                                        </div>
+                                        </el-form>
+                                    </div>
+                                    
+                                    
+                                </div>    
+                                
+                            </div>  
+                        </div>
+                </div>
+                <!-- 模板选择 -->
+                <div v-else-if="presentStep === 3">
+                   
+                    <el-form ref="ruleFormTemplate" 
+                        :model="queryParam" 
+                        :rules="rulesClientTemplate" 
+                        label-width="150px" 
+                        class="demo-ruleForm">
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">模板话术</div>
+                            <el-row  type="flex" align="middle">
+                                <el-col :span="12">
+                                    <el-form-item label="话术模板" prop="tpSpeechcraftId">
+                                        <el-select v-model="queryParam.tpSpeechcraftId"
+                                            clearable placeholder="请选择模板话术"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in speechcraftTemplateOptions"
+                                                :key="item.id"
+                                                :label="item.name"
+                                                :value="item.id">
+                                        </el-option>
+                                    </el-select>
+                                    </el-form-item>
+                                </el-col>
+                            </el-row>    
+                        </div>
+                        
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">调解模板</div>
+                            <el-row  type="flex" align="middle">
+                                <el-col :span="12">
+                                    <el-form-item label="调解模板" prop="tpMediateId">
+                                        <el-select v-model="queryParam.tpMediateId"
+                                            clearable placeholder="请选择调解模板"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in mediationTemplateOptions"
+                                                :key="item.id"
+                                                :label="item.name"
+                                                :value="item.id">
+                                        </el-option>
+                                    </el-select>
+                                    </el-form-item>
+                                </el-col>
+                            </el-row>
+                        </div>
+                    </el-form>
+                      
+                </div>
+                <!-- 材料上传 -->
+                <div v-else-if="presentStep === 4">
+                    <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">证据材料</div>
+                    <div class="p-h-24">
+                        <upload-file-name :file-list="fileList" :max-count="20"
+                                    :show-file-name="true"
+                                    @handleUploadFile="handleUploadFile">
+                        </upload-file-name>
+                    </div>
+                </div>
+                <!-- 完成 -->
+                <div v-else-if="presentStep === 5">
+                    <el-result icon="success" title="案件创建完成" subTitle="案件创建完成，继续处理其他案件">
+                        <template slot="extra">
+                            <el-button type="primary" size="medium" @click="handleClose">好的</el-button>
+                        </template>
+                    </el-result>
+                </div>
+            </div>
+        
+        <span slot="footer" class="dialog-footer" v-if="presentStep<5">
+            <el-button @click="handleClose">取消</el-button>
+            <el-button
+                v-if="presentStep > 1 "
+                type="primary"
+                @click="presentStep--">上一步</el-button>
+            
+            <el-button
+                type="primary"
+                v-show="presentStep<4"
+                @click="handleNextStep">下一步</el-button>
+            <el-button
+                type="primary"
+                v-show="presentStep === 4"
+                @click="handleSubmit">确认
+            </el-button>
+        </span>
+        </el-dialog>
+        
+    </div>
+</template>
+<script>
+import api from "@/services/caseManagement";
+    export default {
+        components: {
+            uploadFileName: () => import('@/components/uploadFileName.vue'),//上传
+        },
+        props: {
+            addCaseDialog: {
+                type: Object,
+                default: () => {
+                    return {}
+                },
+            },
+        },
+        data() {
+            const moneyAmountValidate = (rule,value,callback)=>{
+                if (!value){
+                    callback(new Error('请输入标的金额'));
+                }else if (!/^[1-9]\d*(,\d{3})*(\.\d{1,2})?$|^0.\d{1,2}$/.test(value)){
+                    callback(new Error('只能输入两位小数的金额!'));
+                }else if(!(0<parseInt(value)&&parseInt(value)<100000000)){
+                    callback(new Error('只能输入大于1小于1亿的金额!'));
+                }else{
+                    callback()
+                }
+            };
+            return {
+                
+                transferStep:[
+                    {id:1,title:'基本信息',description:'录入案件基本信息'},
+                    {id:2,title:'当事人信息',description:'录入当事人信息'},
+                    {id:3,title:'模板选择',description:'选择模板'},
+                    {id:4,title:'材料上传',description:'上传案件材料'},
+                    {id:5,title:'完成',description:'完成案件创建'},
+                ],
+                presentStep:1,
+
+                //-----------------------------基本信息-------------------------
+                baseInfo:{
+                    financialOrgName:'',//金融机构名称
+                    financialOrgCode:'',//社会统一信用代码
+                    caseName:'',//案件名称
+                    caseNo:'',//案件编号
+                    productTypeId:'',//金融产品类型
+                    moneyAmount:'',//标的金额
+                    overdueTimes:0,//逾期次数
+                    caseDescr:'',//案件描述
+                },
+                rulesClient: {
+                    financialOrgName: [
+                        { required: true, message: '请输入机构名称', trigger: 'change',},
+                    ],
+                    financialOrgCode: [
+                        { required: true, message: '请输入社会统一信用代码', trigger: 'change',},
+                    ],
+                    caseName: [
+                        { required: true, message: '请输入案件名称', trigger: 'change',},
+                    ],
+                    caseNo: [
+                        { required: true, message: '请输入案件编号', trigger: 'change',},
+                    ],
+                    productTypeId: [
+                        { required: true, message: '请选择金融产品类型', trigger: 'change',},
+                    ],
+                    moneyAmount: [
+                        { required: true, validator: moneyAmountValidate, trigger: 'change',},
+                    ], 
+                    caseDescr:[
+                         { required: true, message: '请输入案件描述', trigger: 'change',},
+                    ]
+                },
+                financialProductsTypeOptions:[],//金融产品类型
+
+                //----------------------------案件当事人-------------------
+                // 债权人
+                creditorInfo:{
+                    creditorName:'',//债权人
+                    creditorOrgCode:'',//债权人机构代码	
+                    creditorLegal:'',//法人	
+                    creditorIdcard:'',//法人身份证	
+                    creditorPhone:'',//法人手机	
+                    creditorAddr:'',//公司地址	
+                    creditorMail:'',//邮编	
+                    creditorAgent:'',//代理人
+                },
+                rulesClientCreditor: {
+                    creditorName: [
+                        { required: true, message: '请输入债权人', trigger: 'change',},
+                    ], 
+                    creditorOrgCode: [
+                        { required: true, message: '请输入债权人机构代码', trigger: 'change',},
+                    ], 
+                    creditorLegal: [
+                        { required: true, message: '请输入法人', trigger: 'change',},
+                    ],                  
+                    creditorIdcard: [
+                        { required: true, message: '请输入法人身份证号', trigger: 'change',},
+                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号', trigger: ['blur', 'change']}
+                    ], 
+                    creditorPhone: [
+                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                    ], 
+                    creditorAddr: [
+                        { required: true, message: '请输入公司地址', trigger: 'change',},
+                    ], 
+                    // creditorAgent: [
+                    //     { required: true, message: '请输入代理人', trigger: 'change',},
+                    // ], 
+                },    
+                // 债务人
+                idTypeOptions:[],
+                obligorInfoForm:{
+                    debtorEntityList:[
+                        {
+                            name:'',//债务人姓名
+                            phone:'',//债务人电话
+                            cardTypeId:'',//证件类型	
+                            addr:'',//地址	
+                            cardNo:'',//证件号
+                            mail:'',//邮编
+                            
+                        }
+                    ],
+                },
+                
+                obligorRulesClient:{
+                    name: [
+                        { required: true, message: '请输入债务人姓名', trigger: 'change',},
+                    ], 
+                    phone: [
+                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                    ], 
+                    cardTypeId: [
+                        { required: true, message: '请选择证件类型', trigger: 'change',},
+                    ], 
+                    addr: [
+                        { required: true, message: '请输入地址', trigger: 'change',},
+                    ], 
+                    cardNo: [
+                        { required: true, message: '请输入证件号', trigger: 'change',},
+                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号', trigger: ['blur', 'change']}
+                    ], 
+                    mail: [
+                        { required: true, message: '请输入邮编', trigger: 'change',},
+                        { pattern: /^\d{6}$/, message: '请输入正确的邮编', trigger: ['blur', 'change']}
+                    ], 
+                },
+
+                //--------------------------调解模板----------------------------------
+                queryParam:{
+                   tpMediateId:'',//调解模板id
+                   tpSpeechcraftId:'',//话术模板
+                },
+                rulesClientTemplate:{
+                    tpMediateId: [
+                        { required: true, message: '请选择调解模板', trigger: 'change',},
+                    ], 
+                    tpSpeechcraftId: [
+                        { required: true, message: '请选择话术模板', trigger: 'change',},
+                    ],
+                },
+                fileList:[],//证据材料
+                speechcraftTemplateOptions:[],//话术模板
+                mediationTemplateOptions:[],//调解模板
+                
+            };
+        },
+        mounted () {
+            this.getDict();//获取金融产品类型
+            this.getDictIdType();
+            this.getSpeechcraftTemplateList(),//话术模板
+            this.getTemplateList();//调解模板
+        },
+        methods: {
+
+            // 获取金融产品类型
+            getDict(){
+                let data = {
+                    type:'financial'
+                }
+                api.getDict(data).then(res => {
+                    if (!res.code) {
+                        this.financialProductsTypeOptions = res;
+                    }
+                })
+            },
+            // 获取证件类型
+            getDictIdType(){
+                let data = {
+                    type:'certificates'
+                }
+                api.getDict(data).then(res => {
+                    if (!res.code) {
+                        this.idTypeOptions = res;
+                    }
+                })
+            },
+            // 新增
+            handleAdd(){
+                this.obligorInfoForm.debtorEntityList.push({
+                    name:'',//债务人姓名
+                    phone:'',//债务人电话
+                    cardTypeId:'',//证件类型	
+                    addr:'',//地址	
+                    cardNo:'',//证件号
+                    mail:'',//邮编
+                });
+            },
+            // 删除
+            handleRemoveDomain(item) {
+                var index = this.obligorInfoForm.debtorEntityList.indexOf(item)
+                if (index !== -1) {
+                  this.obligorInfoForm.debtorEntityList.splice(index, 1)
+                }
+            },
+            // 清空
+            handleReset(){
+                for (let key in this.creditorInfo) {
+                    this.creditorInfo[key] = ''
+                }
+            },
+
+
+
+
+            // 模板话术
+            getSpeechcraftTemplateList(){
+                let data = {
+                    current: 1,
+                    name: "",
+                    size: 300,
+                    type: 2,
+                }
+                api.getTemplateList(data).then(res => {
+                    if (!res.code) {
+                        this.speechcraftTemplateOptions = res.records;
+                    }
+                })
+            },
+            // 调解模板
+            getTemplateList(){
+                let data = {
+                    current: 1,
+                    name: "",
+                    size: 300,
+                    type: 1,
+                }
+                api.getTemplateList(data).then(res => {
+                    if (!res.code) {
+                        this.mediationTemplateOptions = res.records;
+                    }
+                })
+            },
+            
+            // 下一步
+            handleNextStep(){
+                if(this.presentStep === 1){
+                    this.$refs.ruleFormBase.validate((valid) => {
+                        if (valid){this.presentStep++}
+                    })
+                }else if(this.presentStep === 2){
+                    this.$refs.ruleFormCreditor.validate((valid) => {
+                        if (valid){
+                            this.$refs.ruleFormObligor.validate((valid) => {
+                                if (valid){this.presentStep++}
+                            })
+                           
+                        }
+                    })
+                }else if(this.presentStep === 3){
+                    this.$refs.ruleFormTemplate.validate((valid) => {
+                        if (valid){this.presentStep++}
+                    })
+                }else{
+                    this.presentStep++
+                }
+            },
+            handleSubmit(){
+                 
+                if(!this.$clickThrottle()) { return }//防止重复点击
+
+                let data = {
+                    ...this.baseInfo,//基本信息
+                    ...this.creditorInfo,//债权人信息
+                    ...this.obligorInfoForm,//债务人
+                    ...this.queryParam,//模板选择
+                    caseFileEntityList:this.fileList//证据材料
+                }
+                console.log('获取传给后台的信息',data)
+                api.addCaseInfo(data).then(res => {
+                    this.presentStep++
+                    this.$parent.getCaseInfoList(1)
+                    this.$parent.getCaseCount()     
+                })
+
+            },
+            // 上传
+            handleUploadFile(fileList){
+                console.log('获取上传文件信息',fileList)
+                fileList = JSON.parse(JSON.stringify(fileList))
+                this.fileList = fileList.map((item,i) => {
+                    return {
+                        url: item.url,
+                        fileName:item.fileName,
+                        name:item.fileName
+                    }
+                })
+            },
+            handleClose() {
+                this.$emit('update:addCaseDialog', null)
+            },
+        }
+    };
+</script>
+<style scoped lang="scss">
+.dialog-content{
+    padding: 16px 24px;
+    // max-height:500px
+}
+
+</style>
\ No newline at end of file
diff --git a/src/pages/case-management-old/components/caseAllocationDialog.vue b/src/pages/case-management-old/components/caseAllocationDialog.vue
new file mode 100644
index 0000000..a37b3fe
--- /dev/null
+++ b/src/pages/case-management-old/components/caseAllocationDialog.vue
@@ -0,0 +1,432 @@
+<template>
+    <div>
+        <el-dialog
+            :title="caseAllocationDialog.title"
+            :visible="true"
+            width="880px"
+            append-to-body
+            :close-on-click-modal="false"
+            @close="handleClose"
+        >
+        
+            <div class="dialog-content">
+                <div class="pb-16">
+                    <el-row :gutter="20" type="flex" align="middle">
+                        <el-col :span="24">
+
+                            <div class="flex-row align-items-center">
+                                <div class="mr-8 flex-shrink-0">区域</div> 
+                                <div class="width100">
+                                    <el-select v-model="deptIds" 
+                                            size="medium"
+                                            multiple 
+                                            clearable placeholder="请选择区域"
+                                            @change="handleChangeDept"
+                                            class="width100">
+                                        <el-option
+                                            v-for="item in departmentOptions"
+                                            :key="item.id"
+                                            :label="item.name"
+                                            :value="item.id"
+                                            class="width100"
+                                            >
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                                
+                            </div>
+                        </el-col>
+                    </el-row>
+                </div> 
+                <el-scrollbar class="bor bg-color-light min-height250">   
+                    <div class="department-wrap">
+                        <div v-for="(item,inx) in peopleList" :key="inx" class="department-wrap-list">
+                            <div class="department-dept">
+                                <el-checkbox v-model="checkedAll" :label="item.deptId"  @change="handleCheckChange(1,inx,item,item.deptId,$event)">{{item.name}}({{item.count}}人)</el-checkbox>
+                            </div>
+                            <div class="flex-row justify-content-start flex-flow-wrap ">
+                                <div v-for="(v,i) in item.values" :key="i" class="pt-16" style="flex:0 0 25%">
+                                    <el-checkbox v-model="checkedAll" :label="v.id" @change="handleCheckChange(2,inx,v,item.deptId,$event)">{{v.realName}}</el-checkbox>
+                                </div>
+
+                            </div>
+                        </div>
+                    </div>
+                </el-scrollbar>
+                <div class="p-v-24">
+                    <el-form ref="ruleForm" 
+                            :model="queryParam" 
+                            :rules="rulesClient" 
+                            label-width="120px" 
+                            class="demo-ruleForm">
+                            <el-row :gutter="20" type="flex" align="middle">
+                                <el-col :span="12">
+                                <el-form-item label="选择开始日期" prop="planStartTime">
+                                    <el-date-picker
+                                        v-model="queryParam.planStartTime"
+                                        type="date"
+                                        placeholder="选择日期"
+                                        @change="handleChangeDate"
+                                        >
+                                    </el-date-picker>
+                                </el-form-item>
+                                </el-col>
+                                <el-col :span="12">
+                                <el-form-item label="选择结束日期" prop="planEndTime">
+                                    <el-date-picker
+                                        v-model="queryParam.planEndTime"
+                                        type="date"
+                                        placeholder="选择日期"
+                                        @change="handleChangeDate"
+                                        >
+                                    </el-date-picker>
+                                </el-form-item>
+                                </el-col>
+                            </el-row>
+                    </el-form>
+                </div>
+
+            </div>
+        
+        <span slot="footer" class="dialog-footer">
+            <el-button @click="handleClose()">取消</el-button>
+            <el-button type="primary" @click="handleSubmit()">确认</el-button>
+        </span>
+        </el-dialog>
+        
+    </div>
+</template>
+<script>
+import api from "@/services/caseManagement";
+    export default {
+        components: {
+            
+        },
+        props: {
+            caseAllocationDialog: {
+                type: Object,
+                default: () => {
+                    return {}
+                },
+            },
+        },
+        data() {
+            return {
+                deptIds:[],//获取区域id集合
+                queryParam:{
+                    planStartTime:'',
+                    planEndTime:'',
+                },
+                userList:[],
+                rulesClient: {
+                    planStartTime: [
+                        { required: true, message: '请选择开始日期', trigger: 'change',},
+                    ],
+                    planEndTime: [
+                        { required: true, message: '请选择结束日期', trigger: 'change',},
+                    ],
+                   
+                },
+                peopleList:[
+                    {departmentId:1,departmentName:'调解一部（12人）',
+                        child:[
+                            {id:1,name:'张三' },
+                            {id:2,name:'张三' },
+                            {id:3,name:'张三' },
+                            {id:4,name:'张三' },
+                            {id:5,name:'里面' },
+                        ]
+                    },
+                    {departmentId:2,departmentName:'调解二部（12人）',
+                        child:[
+                            {id:1,name:'张三' },
+                            {id:2,name:'张三' },
+                            {id:3,name:'张三' },
+                            {id:4,name:'张三' },
+                            {id:5,name:'里面' },
+                        ]
+                    },
+                ],
+                departmentOptions:[],//区域
+                isIndeterminate:true,
+
+                checkedAll:[],
+                chooseChecked:[],
+            };
+        },
+        mounted () {
+            this.getDeptList();//获取区域
+        },
+        methods: {
+            // 获取区域
+            getDeptList(){
+                let data = {
+                    companyId: this.$store.state.userinfo.companyId,
+                    current: 1,
+                    size: 500,
+                }
+                api.getDeptList(data).then(res => {
+                    if (!res.code) {
+                        this.departmentOptions = res.records;
+                        this.deptIds = [this.departmentOptions[0].id]
+                        this.getUserByDeptList()
+                    }
+                })
+            },
+            handleChangeDept(e){
+                this.checkedAll=[]
+                this.chooseChecked=[]
+                // console.log(this.deptIds,'this.deptIds')
+                if(this.deptIds.length>0)this.getUserByDeptList()
+                this.peopleList=[]
+                
+            },
+            // 根据区域id列表查看用户列表
+            getUserByDeptList(){
+                let data = {
+                    ids:this.deptIds
+                }
+                api.getUserByDeptList(data).then(res => {
+                    if (!res.code) {
+                        // this.peopleList = res;
+                        let selectDept=[];
+                        this.deptIds.forEach((dept)=>{
+                            this.departmentOptions.forEach((item)=>{
+                                if(item.id == dept){
+                                    selectDept.push(item)
+                                }
+                            })
+                        })
+                        // console.log('selectDept',selectDept)
+                        this.peopleList =[];
+                        let list = []
+                        selectDept.forEach((opt)=>{
+                            let values= [];
+                            res.forEach((item)=>{
+                                if(item.deptId == opt.id){
+                                     values.push({
+                                        id:item.id,
+                                        realName:item.realName,
+                                        checked:false
+                                     })   
+                                    
+                                }
+                            })
+                            list.push({
+                                deptId:opt.id,
+                                name:opt.name,
+                                count:opt.count,
+                                checked:false,
+                                values:values
+                            })
+                        })
+                        this.peopleList = list
+                        // console.log('获取区域人员',this.peopleList)
+                    }
+                })
+            },
+             handleCheckChange(type,a=0,chooseItem,deptId,event){
+                // console.log(chooseItem,event,a,'this.peopleList')
+                 let self = this
+                 if(type==2){//二级菜单
+                    let index = 0;
+                    self.peopleList[a].values.map((item)=>{
+                        if(self.checkedAll.indexOf(item.id)>-1){
+                            index+=1
+                        }
+                    })
+                    if(index>0){
+                        if(self.checkedAll.indexOf(self.peopleList[a].deptId)<0){
+                            self.checkedAll.push(self.peopleList[a].deptId)
+                        }
+                    }else{
+                        if(self.checkedAll.indexOf(self.peopleList[a].deptId)>0){
+                            self.checkedAll.splice(self.checkedAll.indexOf(self.peopleList[a].deptId),1)
+                        }
+                    }
+
+                    if(event)
+                    {
+                        if(this.chooseChecked.length==0){self.chooseChecked.push({deptId:deptId,child:[]})}
+                        this.chooseChecked.forEach((item,index) => {
+                            let haveDeptId = self.chooseChecked.find(citem=>{
+                                return citem.deptId===deptId
+                            })
+                            if(haveDeptId != undefined)
+                            {
+                                if(item.deptId==deptId)
+                                {
+                                    item.child.push({deptId:deptId,id:chooseItem.id,realName:chooseItem.realName})
+                                }
+                            }
+                            else
+                            {
+                                self.chooseChecked.push({deptId:deptId,child:[{deptId:deptId,id:chooseItem.id,realName:chooseItem.realName}]})
+                            }
+                        });
+                    }
+                    else
+                    {
+                        this.chooseChecked.forEach((item,index) => {
+                            item.child.forEach((itemchild,index) => {
+                                if(itemchild.id==chooseItem.id)
+                                {
+                                    item.child.splice(index,1)
+                                }
+                            });
+                        });
+                    }
+                    
+                    let childnum = this.chooseChecked.find(item=>{
+                        return item.deptId === deptId
+                    }).child.length;
+
+                    let allchildnum = this.peopleList.find(item=>{
+                        return item.deptId === deptId
+                    }).values.length;
+                    if(childnum != allchildnum)
+                    {
+                        if(self.checkedAll.indexOf(deptId)>-1){
+                            self.checkedAll.splice(self.checkedAll.indexOf(deptId),1)
+                        }
+                    }
+                    else
+                    {
+                        if(self.checkedAll.indexOf(deptId)<0){
+                            self.checkedAll.push(deptId)
+                        }
+                    }
+
+                 }else{
+                     if(self.checkedAll.indexOf(self.peopleList[a].deptId)>-1){
+                         self.peopleList[a].values.map((item)=>{
+                             if(self.checkedAll.findIndex((n)=> n==item.id)<0){
+                                 self.checkedAll.push(item.id)
+                                //  self.checkedAll.push({id:item.id,realName:item.realName,deptId:self.peopleList[a].deptId})
+                             }
+                         })
+                     }else{
+                         self.peopleList[a].values.map((item)=>{
+                             if(self.checkedAll.findIndex((n)=> n==item.id)>-1){
+                                 self.checkedAll.splice(self.checkedAll.findIndex((n)=> n==item.id),1)
+                             }
+                         })
+                     }
+
+
+                    let haveDeptId=self.chooseChecked.find(citem=>{
+                        return citem.deptId === deptId
+                    })
+                    if(event)
+                    {
+                        if(haveDeptId == undefined)
+                        {
+                            let addchild=[]
+                            self.peopleList.forEach((item,index) => {
+                                if(item.deptId==deptId)
+                                {
+                                    item.values.forEach((item,index) => {
+                                        addchild.push({deptId:deptId,id:item.id,realName:item.realName})
+                                    });
+                                }
+                            });
+                            self.chooseChecked.push({deptId:deptId,child:addchild})
+                        }
+                    }
+                    else
+                    {
+                        if(haveDeptId != undefined)
+                        {
+                            self.chooseChecked.forEach((item,index) => {
+                                if(item.deptId==deptId)
+                                {
+                                    self.chooseChecked.splice(index,1)
+                                }
+                            });
+                        }
+                    }
+                 }
+                //  console.log(this.checkedAll,self.chooseChecked,'checkedAll')
+             },  
+            
+            handleCheckedCitiesChange(){
+
+            },
+            handleSubmit(){
+                if(!this.$clickThrottle()) { return }//防止重复点击
+                let chooseUser=[]
+                this.chooseChecked.forEach((item,index) => {
+                    item.child.forEach((item,index) => {
+                        chooseUser.push({deptId:item.deptId,id:item.id,realName:item.realName})
+                    });
+                });
+
+                if(chooseUser.length==0)
+                {
+                    this.$message({
+                        showClose: true,
+                        message: '请先选择调解员！',
+                        type: 'warning'
+                    });
+                }
+
+                this.$refs.ruleForm.validate((valid) => {
+                    if(valid) {
+                        
+                        
+                        let data = {
+                            ...this.queryParam,
+                            userList:chooseUser
+                        }
+                        
+                        api.dispatchCase(data).then(res => {
+                            this.$message({
+                                showClose: true,
+                                message: '调解案件分配成功！',
+                                type: 'success'
+                            });
+                            this.$parent.getCaseInfoList()
+                            this.handleClose()
+                        })
+                    }
+                })
+            },
+            handleSearch(){
+
+            },
+            handleChangeDate(){
+                let planStart = new Date(this.queryParam.planStartTime);
+                let planEnd = new Date(this.queryParam.planEndTime);
+                if (planEnd < planStart) {
+                    this.$message({
+                        showClose: true,
+                        message: '开始日期不能大于结束日期！',
+                        type: 'warning'
+                    });
+                    this.queryParam.planEndTime=''
+                } 
+            },
+            handleClose() {
+                this.$emit('update:caseAllocationDialog', null)
+            },
+        }
+    };
+</script>
+<style scoped lang="scss">
+.dialog-content{
+    padding: 16px 24px;
+    max-height:500px
+}
+.department-wrap{
+    padding: 16px 24px;
+    max-height: 250px;
+    .department-wrap-list{
+        margin-bottom:32px;
+    }
+    .department-wrap-list:last-child{
+        margin-bottom:0;
+    }
+}
+.min-height250{min-height: 250px;}
+.department-dept ::v-deep .el-checkbox__label {color: $color-000000}
+</style>
\ No newline at end of file
diff --git a/src/pages/case-management-old/components/editCaseDrawer.vue b/src/pages/case-management-old/components/editCaseDrawer.vue
new file mode 100644
index 0000000..d31c9e2
--- /dev/null
+++ b/src/pages/case-management-old/components/editCaseDrawer.vue
@@ -0,0 +1,836 @@
+<template>
+    <el-drawer
+      :title="editCaseDrawer.title"
+      :visible="true"
+      direction="rtl"
+      size="50%"
+      :before-close="handleClose"
+      >
+      <div class="">
+        <el-tabs v-model="activeName" @tab-click="handleClick" class="zd-el-tabs-custom zd-el-tabs-custom__left_padding">
+            <el-tab-pane label="基本信息" name="baseInfo">
+                <el-scrollbar class="bor">
+                    <div class="" :style="{'height': `${drawerContentHeight}px`}">
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">基本信息</div> 
+                            <div class="p-h-24">
+                                <el-form ref="ruleFormBase" 
+                                        :model="baseInfo" 
+                                        :rules="rulesClient" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="金融机构名称" prop="financialOrgName">
+                                                    <el-input
+                                                    v-model.trim="baseInfo.financialOrgName"
+                                                    placeholder="请输入金融机构名称"
+                                                    clearable
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="社会统一信用代码" prop="financialOrgCode">
+                                                    <el-input
+                                                    v-model.trim="baseInfo.financialOrgCode"
+                                                    placeholder="请输入社会统一信用代码"
+                                                    clearable
+                                                    maxlength="18"
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="案件名称" prop="caseName">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入案件名称"
+                                                        v-model="baseInfo.caseName" :disabled="caseStatus != 0">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="案件编号" prop="caseNo">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入案件编号"
+                                                         :disabled="caseStatus != 0"
+                                                        v-model="baseInfo.caseNo">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>   
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="金融产品类型" prop="productTypeId">
+                                                    <el-select v-model="baseInfo.productTypeId"
+                                                            clearable placeholder="请选择金融产品类型"
+                                                            class="width100">
+                                                        <el-option
+                                                                v-for="item in financialProductsTypeOptions"
+                                                                :key="item.code"
+                                                                :label="item.codeName"
+                                                                :value="item.code">
+                                                        </el-option>
+                                                    </el-select>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="标的金额" prop="moneyAmount">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入内容"
+                                                        v-model="baseInfo.moneyAmount">
+                                                        <template slot="append">元</template>
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="逾期次数" prop="overdueTimes">
+                                                    <!-- <el-select v-model="baseInfo.overdueTimes"
+                                                            clearable placeholder="请选择逾期次数"
+                                                            class="width100">
+                                                        <el-option
+                                                                v-for="item in operateMethodOptions"
+                                                                :key="item"
+                                                                :label="item"
+                                                                :value="item">
+                                                        </el-option>
+                                                    </el-select> -->
+                                                    <el-input-number v-model="baseInfo.overdueTimes" :min="0" :max="100" class="width100"></el-input-number>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="案件描述" prop="caseDescr">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入内容"
+                                                        v-model="baseInfo.caseDescr">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>                        
+                                    
+                                </el-form>
+                            </div>
+                        </div>   
+                    </div>
+                </el-scrollbar>
+            </el-tab-pane>
+            <el-tab-pane label="案件当事人" name="caseParty">
+                <el-scrollbar class="bor">
+                    <div  :style="{'height': `${drawerContentHeight}px`}">
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">案件当事人</div> 
+                            <div class="p-h-24">
+                                <div class="border-solid-lighter-1 p-h-24 mb-16">
+                                    <div class="flex-row justify-content-between height-48 line-height-48 f14 border-b-solid-lighter-1 mb-16">
+                                        <div class="color-000">债权人</div>
+                                        <div class="color-text-regular cursor-pointer" @click="handleReset">清空<i class="el-icon-close"></i></div>
+                                    </div>
+                                    <el-form ref="ruleFormCreditor" 
+                                        :model="creditorInfo" 
+                                        :rules="rulesClientCreditor" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="债权人" prop="creditorName">
+                                                    <el-input
+                                                    v-model.trim="creditorInfo.creditorName"
+                                                    placeholder="请输入债权人"
+                                                    clearable
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="社会统一信用代码" prop="creditorOrgCode">
+                                                    <el-input
+                                                    v-model.trim="creditorInfo.creditorOrgCode"
+                                                    placeholder="请输入社会统一信用代码"
+                                                    clearable
+                                                    maxlength="18"
+                                                    ></el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="法人姓名" prop="creditorLegal">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人姓名"
+                                                        v-model="creditorInfo.creditorLegal">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="法人身份证号" prop="creditorIdcard">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人身份证号"
+                                                        v-model="creditorInfo.creditorIdcard"
+                                                        maxlength="18">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>   
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="法人手机号" prop="creditorPhone">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入法人手机号"
+                                                        v-model="creditorInfo.creditorPhone"
+                                                        maxlength="11"
+                                                        >
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="公司地址" prop="creditorAddr">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入公司地址"
+                                                        v-model="creditorInfo.creditorAddr">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>
+                                        <el-row  type="flex" align="middle">
+                                            <el-col :span="12">
+                                                <el-form-item label="邮编" prop="creditorMail">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入邮编"
+                                                        v-model="creditorInfo.creditorMail"
+                                                        maxlength="6"
+                                                        >
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                            <el-col :span="12">
+                                                <el-form-item label="代理人" prop="creditorAgent">
+                                                    <el-input
+                                                        clearable
+                                                        placeholder="请输入代理人"
+                                                        v-model="creditorInfo.creditorAgent">
+                                                    </el-input>
+                                                </el-form-item>
+                                            </el-col>
+                                        </el-row>                        
+                                    
+                                    </el-form>
+                                </div>
+                                <div class="border-solid-lighter-1 p-h-24">
+                                    <div class="flex-row justify-content-between f14 border-b-solid-lighter-1 mb-8 p-v-8 align-items-center">
+                                        <div class="color-000">债务人</div>
+                                        <el-button size="small" type="primary" @click="handleAdd">新增债务人<i class="el-icon-plus"></i></el-button>
+                                    </div>
+    
+                                    <div>
+                                        <el-form ref="ruleFormObligor" 
+                                        :model="obligorInfoForm" 
+                                        label-width="150px" 
+                                        class="demo-ruleForm">
+                                        <div v-for="(item,inx) in obligorInfoForm.debtorEntityList" :key="inx">
+                                            <div class="flex-row justify-content-between align-items-center height-40 f14 mb-16">
+                                                <div class="color-text-primary">债务人{{inx+1}}</div>
+                                                <div class="color-text-regular cursor-pointer" @click="handleRemoveDomain(item)">删除<i class="el-icon-close"></i></div>
+                                            </div>
+
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="债务人姓名"  :prop="'debtorEntityList.' + inx + '.name'" :rules="{required: true, message: '请输入债权人姓名', trigger: 'blur'}">
+                                                        <el-input
+                                                        v-model.trim="obligorInfoForm.debtorEntityList[inx].name"
+                                                        placeholder="请输入债务人姓名"
+                                                        clearable
+                                                        ></el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="证件类型" :prop="'debtorEntityList.' + inx + '.cardTypeId'" :rules="{required: true, message: '请选择证件类型', trigger: 'change'}">
+                                                        <el-select v-model="obligorInfoForm.debtorEntityList[inx].cardTypeId"
+                                                                clearable placeholder="请选择证件类型"
+                                                                class="width100">
+                                                            <el-option
+                                                                    v-for="item in idTypeOptions"
+                                                                    :key="item.code"
+                                                                    :label="item.codeName"
+                                                                    :value="item.code">
+                                                            </el-option>
+                                                        </el-select>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="证件号码" :prop="'debtorEntityList.' + inx + '.cardNo'"
+                                                    :rules=" [
+                                                        { required: true, message: '请输入证件号', trigger: 'change',},
+                                                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的证件号', trigger: ['blur', 'change']}
+                                                    ]">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入证件号码"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].cardNo"
+                                                            maxlength="18"
+                                                            >
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="手机号码" :prop="'debtorEntityList.' + inx + '.phone'" :rules="[
+                                                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                                                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                                                    ]">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入手机号码"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].phone"
+                                                            maxlength="11"
+                                                            >
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>   
+                                            <el-row  type="flex" align="middle">
+                                                <el-col :span="12">
+                                                    <el-form-item label="地址" :prop="'debtorEntityList.' + inx + '.addr'" :rules="{ required: true, message: '请输入地址', trigger: 'change',}">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入地址"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].addr">
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                                <el-col :span="12">
+                                                    <el-form-item label="邮编" :prop="'debtorEntityList.' + inx + '.mail'" :rules="{ required: true, message: '请输入邮编', trigger: 'change',}">
+                                                        <el-input
+                                                            clearable
+                                                            placeholder="请输入邮编"
+                                                            v-model="obligorInfoForm.debtorEntityList[inx].mail"
+                                                            maxlength="6">
+                                                        </el-input>
+                                                    </el-form-item>
+                                                </el-col>
+                                            </el-row>
+                                        </div>
+                                        </el-form>
+                                    </div>
+                                    
+                                    
+                                </div>    
+                                
+                            </div>  
+                        </div>
+                    </div>
+                </el-scrollbar>
+            </el-tab-pane>
+            <el-tab-pane label="模板选择" name="templateSelection">
+                <div :style="{'height': `${drawerContentHeight}px`}">
+                        <el-form ref="ruleFormTemplate" 
+                        :model="queryParam" 
+                        :rules="rulesClientTemplate" 
+                        label-width="150px" 
+                        class="demo-ruleForm">
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">模板话术</div>
+                            <el-row  type="flex" align="middle">
+                                <el-col :span="12">
+                                    <el-form-item label="话术模板" prop="tpSpeechcraftId">
+                                        <el-select v-model="queryParam.tpSpeechcraftId"
+                                            clearable placeholder="请选择模板话术"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in speechcraftTemplateOptions"
+                                                :key="item.id"
+                                                :label="item.name"
+                                                :value="item.id">
+                                        </el-option>
+                                    </el-select>
+                                    </el-form-item>
+                                </el-col>
+                            </el-row>    
+                        </div>
+                        
+                        <div>
+                            <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">调解模板</div>
+                            <el-row  type="flex" align="middle">
+                                <el-col :span="12">
+                                    <el-form-item label="调解模板" prop="tpMediateId">
+                                        <el-select v-model="queryParam.tpMediateId"
+                                            clearable placeholder="请选择调解模板"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in mediationTemplateOptions"
+                                                :key="item.id"
+                                                :label="item.name"
+                                                :value="item.id">
+                                        </el-option>
+                                    </el-select>
+                                    </el-form-item>
+                                </el-col>
+                            </el-row>
+                        </div>
+                    </el-form>
+                </div>
+            </el-tab-pane>
+            <el-tab-pane label="材料上传" name="materialUpload">
+                <div :style="{'height': `${drawerContentHeight}px`}">
+                    <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">证据材料</div>
+                    <div class="p-h-24">
+                        <upload-file-name :file-list="fileList" :max-count="20"
+                                    :show-file-name="true"
+                                    @handleUploadFile="handleUploadFile">
+                        </upload-file-name>
+                    </div>
+                </div>
+                
+            </el-tab-pane>
+            <el-tab-pane label="调解记录" name="mediationRecord">
+                <el-scrollbar class="bor">
+                <div :style="{'height': `${drawerContentHeight}px`}">
+                    <div class="height-48 line-height-48 f18 color-000 m-v-16 p-h-24">调解记录</div>
+                    <div class="p-h-24">
+                        <div v-if="mediationRecord.length>0">
+                            <div class="bg-color-light border-radius-4 p-24 mb-16" v-for="(item,inx) in mediationRecord" :key="inx">
+                                <div class="f16 color-text-primary">{{item.createAt}}</div>
+                                <div class="m-v-16" v-if="item.type==1">
+                                    {{item.content}}
+                                </div>
+                                <div class="audio_wrap m-v-16" v-else>
+                                    <audio :src="item.content.url" controls="controls" class="audio"></audio>
+                                </div>
+                                
+                                <!-- <div class="color-text-primary f14"><span class="color-text-regular">备注：</span>继任人</div> -->
+                            </div>
+                        </div>
+                        <el-empty description="暂无调解记录" v-else></el-empty>
+                    </div>
+                </div>
+                </el-scrollbar>
+            </el-tab-pane>
+        </el-tabs>
+        <div class="flex-row justify-content-end  p-16 border-t-solid-lighter-1">
+            <div>
+                <el-button @click="handleClose">取 消</el-button>
+                <el-button type="primary" @click="handleSubmit">保存</el-button>
+            </div>
+            
+        </div>
+      </div>
+    </el-drawer>
+</template>
+<script>
+import api from "@/services/caseManagement";
+    export default {
+        components: {
+             uploadFileName: () => import('@/components/uploadFileName.vue'),//上传
+        },
+        props: {
+            editCaseDrawer: {
+                type: Object,
+                default: () => {
+                    return {}
+                },
+            },
+        },
+        
+        data() {
+            const moneyAmountValidate = (rule,value,callback)=>{
+                if (!value){
+                    callback(new Error('请输入标的金额'));
+                }else if (!/^[1-9]\d*(,\d{3})*(\.\d{1,2})?$|^0.\d{1,2}$/.test(value)){
+                    callback(new Error('只能输入两位小数的金额!'));
+                }else if(!(0<parseInt(value)&&parseInt(value)<100000000)){
+                    callback(new Error('只能输入大于1小于1亿的金额!'));
+                }else{
+                    callback()
+                }
+            };
+            return {
+                caseStatus:0,
+                activeName:'baseInfo',
+                //-----------------------------基本信息-------------------------
+                baseInfo:{
+                    financialOrgName:'',//金融机构名称
+                    financialOrgCode:'',//社会统一信用代码
+                    caseName:'',//案件名称
+                    caseNo:'',//案件编号
+                    productTypeId:'',//金融产品类型
+                    moneyAmount:'',//标的金额
+                    overdueTimes:0,//逾期次数
+                    caseDescr:'',//案件描述
+                },
+                rulesClient: {
+                    financialOrgName: [
+                        { required: true, message: '请输入机构名称', trigger: 'change',},
+                    ],
+                    financialOrgCode: [
+                        { required: true, message: '请输入社会统一信用代码', trigger: 'change',},
+                    ],
+                    caseName: [
+                        { required: true, message: '请输入案件名称', trigger: 'change',},
+                    ],
+                    caseNo: [
+                        { required: true, message: '请输入案件编号', trigger: 'change',},
+                    ],
+                    productTypeId: [
+                        { required: true, message: '请选择金融产品类型', trigger: 'change',},
+                    ],
+                    moneyAmount: [
+                        { required: true, validator: moneyAmountValidate, trigger: 'change',},
+                    ], 
+                    caseDescr:[
+                         { required: true, message: '请输入案件描述', trigger: 'change',},
+                    ]
+                },
+                financialProductsTypeOptions:[],//金融产品类型
+
+                //----------------------------案件当事人-------------------
+                // 债权人
+                creditorInfo:{
+                    creditorName:'',//债权人
+                    creditorOrgCode:'',//债权人机构代码	
+                    creditorLegal:'',//法人	
+                    creditorIdcard:'',//法人身份证	
+                    creditorPhone:'',//法人手机	
+                    creditorAddr:'',//公司地址	
+                    creditorMail:'',//邮编	
+                    creditorAgent:'',//代理人
+                },
+                rulesClientCreditor: {
+                    creditorName: [
+                        { required: true, message: '请输入债权人', trigger: 'change',},
+                    ], 
+                    creditorOrgCode: [
+                        { required: true, message: '请输入债权人机构代码', trigger: 'change',},
+                    ], 
+                    creditorLegal: [
+                        { required: true, message: '请输入法人', trigger: 'change',},
+                    ],                  
+                    creditorIdcard: [
+                        { required: true, message: '请输入法人身份证号', trigger: 'change',},
+                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号', trigger: ['blur', 'change']}
+                    ], 
+                    creditorPhone: [
+                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                    ], 
+                    creditorAddr: [
+                        { required: true, message: '请输入公司地址', trigger: 'change',},
+                    ], 
+                    // creditorAgent: [
+                    //     { required: true, message: '请输入代理人', trigger: 'change',},
+                    // ], 
+                },    
+                // 债务人
+                idTypeOptions:[],
+                obligorInfoForm:{
+                    debtorEntityList:[
+                        {
+                            name:'',//债务人姓名
+                            phone:'',//债务人电话
+                            cardTypeId:'',//证件类型	
+                            addr:'',//地址	
+                            cardNo:'',//证件号
+                            mail:'',//邮编
+                            
+                        }
+                    ],
+                },
+                
+                obligorRulesClient:{
+                    name: [
+                        { required: true, message: '请输入债务人姓名', trigger: 'change',},
+                    ], 
+                    phone: [
+                        { required: true, message: '请输入法人手机号', trigger: 'change',},
+                        { pattern: /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})|(19[0-9]{9})$/, message: '请输入正确的手机号码', trigger: ['blur', 'change']}
+                    ], 
+                    cardTypeId: [
+                        { required: true, message: '请选择证件类型', trigger: 'change',},
+                    ], 
+                    addr: [
+                        { required: true, message: '请输入地址', trigger: 'change',},
+                    ], 
+                    cardNo: [
+                        { required: true, message: '请输入证件号', trigger: 'change',},
+                        { pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号', trigger: ['blur', 'change']}
+                    ], 
+                    mail: [
+                        { required: true, message: '请输入邮编', trigger: 'change',},
+                        { pattern: /^\d{6}$/, message: '请输入正确的邮编', trigger: ['blur', 'change']}
+                    ], 
+                },
+
+
+
+
+                fileList:[],//证据材料
+                //-------------------------模板选择-----------------------------
+                speechcraftTemplateOptions:[],//话术模板
+                mediationTemplateOptions:[],//调解模板
+                queryParam:{
+                   tpMediateId:'',//调解模板id
+                   tpSpeechcraftId:'',//话术模板
+                },
+                rulesClientTemplate:{
+                    tpMediateId: [
+                        { required: true, message: '请选择调解模板', trigger: 'change',},
+                    ], 
+                    tpSpeechcraftId: [
+                        { required: true, message: '请选择话术模板', trigger: 'change',},
+                    ],
+                },
+
+                caseId:'',//案件id
+                mediationRecord:[],//调解记录
+                currentPage:'',//父级页面当前页数
+                
+            };
+        },
+        async created() {
+
+            this.getDict();//获取金融产品类型
+            this.getDictIdType();//获取证件类型
+            this.getTemplateList();//调解模板
+            this.getSpeechcraftTemplateList(),//话术模板
+            this.currentPage = this.editCaseDrawer.currentPage
+            console.log('父级页面当前页数',this.currentPage)
+            this.caseId = this.editCaseDrawer.data.id
+            this.getCaseInfoById();//获取详情
+            console.log('获取基本信息',this.baseInfo)
+            
+        },
+        computed:{
+            // 获取抽屉drawer的内容高度
+            drawerContentHeight(){
+                let oh = document.documentElement.clientHeight;
+                return oh-200
+            }
+            
+        },
+        methods: {
+            
+            
+            // 获取金融产品类型
+            getDict(){
+                let data = {
+                    type:'financial'
+                }
+                api.getDict(data).then(res => {
+                    if (!res.code) {
+                        this.financialProductsTypeOptions = res;
+                    }
+                })
+            },
+
+            // 获取证件类型
+            getDictIdType(){
+                let data = {
+                    type:'certificates'
+                }
+                api.getDict(data).then(res => {
+                    if (!res.code) {
+                        this.idTypeOptions = res;
+                    }
+                })
+            },
+            // 新增
+            handleAdd(){
+                this.obligorInfoForm.debtorEntityList.push({
+                    name:'',//债务人姓名
+                    phone:'',//债务人电话
+                    cardTypeId:'',//证件类型	
+                    addr:'',//地址	
+                    cardNo:'',//证件号
+                    mail:'',//邮编
+                });
+            },
+            // 删除
+            handleRemoveDomain(item) {
+                var index = this.obligorInfoForm.debtorEntityList.indexOf(item)
+                if (index !== -1) {
+                  this.obligorInfoForm.debtorEntityList.splice(index, 1)
+                }
+            },
+            // 清空
+            handleReset(){
+                for (let key in this.creditorInfo) {
+                    this.creditorInfo[key] = ''
+                }
+            },
+            // 切换tab
+            handleClick(tab, event) {
+                // console.log(tab, event);
+                // 为机构状态时，不显示确认按钮
+                // if(tab.name ==='mediationRecord'){
+                //      this.showButton = false   
+                // }else{
+                //     this.showButton = true
+                // }
+            },   
+            // 模板话术
+            getSpeechcraftTemplateList(){
+                let data = {
+                    current: 1,
+                    name: "",
+                    size: 300,
+                    type: 2,
+                }
+                api.getTemplateList(data).then(res => {
+                    if (!res.code) {
+                        this.speechcraftTemplateOptions = res.records;
+                    }
+                })
+            },
+            // 调解模板
+            getTemplateList(){
+                let data = {
+                    current: 1,
+                    name: "",
+                    size: 300,
+                    type: 1,
+                }
+                api.getTemplateList(data).then(res => {
+                    if (!res.code) {
+                        this.mediationTemplateOptions = res.records;
+                        // console.log('1111',this.mediationTemplateOptions)
+                    }
+                })
+            },
+            
+            submitFormData(type){
+                
+            },
+            handleUploadFile(fileList){
+                fileList = JSON.parse(JSON.stringify(fileList))
+                this.fileList = fileList.map((item,i) => {
+                    return {
+                        url: item.url,
+                        fileName:item.fileName,
+                        name:item.fileName
+                    }
+                })
+                
+                // console.log('文件名',this.fileList)
+            },
+
+            // 获取详情
+            getCaseInfoById(){ 
+                let _that = this
+                api.getCaseInfoById(this.caseId).then(res => {
+                    if(!res.code){
+                        _that.caseStatus=res.caseStatus
+                        // 基本信息
+                        _that.baseInfo = {
+                            financialOrgName:res.financialOrgName,//金融机构名称
+                            financialOrgCode:res.financialOrgCode,//社会统一信用代码
+                            caseName:res.caseName,//案件名称
+                            caseNo:res.caseNo,//案件编号
+                            productTypeId:res.productTypeId,//金融产品类型
+                            moneyAmount:res.moneyAmount,//标的金额
+                            overdueTimes:res.overdueTimes,//逾期次数
+                            caseDescr:res.caseDescr,//案件描述
+                        };
+                        console.log('基本信息',_that.baseInfo)
+                        // 案件当事人
+                        // 债务人
+                        _that.obligorInfoForm ={
+                            debtorEntityList:res.debtorEntityList
+                        } 
+                        // this.obligorInfo = res.debtorEntityList
+                        console.log('债务人',_that.obligorInfoForm)
+                        // 债权人
+                        _that.creditorInfo = {
+                            creditorName:res.creditorName,//债权人
+                            creditorOrgCode:res.creditorOrgCode,//债权人机构代码	
+                            creditorLegal:res.creditorLegal,//法人	
+                            creditorIdcard:res.creditorIdcard,//法人身份证	
+                            creditorPhone:res.creditorPhone,//法人手机	
+                            creditorAddr:res.creditorAddr,//公司地址	
+                            creditorMail:res.creditorMail,//邮编	
+                            creditorAgent:res.creditorAgent,//代理人
+                        };
+                        // 调解记录
+                        this.mediationRecord = res.logEntityList
+                        // 模板选择
+                        _that.queryParam = {
+                            tpMediateId:String(res.tpMediateId),//调解模板id
+                            tpSpeechcraftId:String(res.tpSpeechcraftId),//话术模板
+                        };
+                        // 材料
+                        // console.log('获取图片',res.caseFileEntityList)
+                        let caseFileEntityList = []
+                        res.caseFileEntityList.forEach((item)=>{
+                            caseFileEntityList.push({name:item.name,fileName:item.name,url:item.url})
+                        })
+                        _that.fileList = caseFileEntityList
+
+                    }
+                    
+                })
+            },
+            // 保存
+            handleSubmit(){
+                let data = {
+                    id:this.caseId,
+                    ...this.baseInfo,//基本信息
+                    ...this.creditorInfo,//债权人信息
+                    ...this.obligorInfoForm,//债务人
+                    ...this.queryParam,//模板选择
+                    caseFileEntityList:this.fileList//证据材料
+                }
+                let formValidates = [
+                    this.$refs["ruleFormBase"].validate(),
+                    this.$refs["ruleFormCreditor"].validate(),
+                    this.$refs["ruleFormObligor"].validate(),
+                    this.$refs["ruleFormTemplate"].validate(),
+                ]
+                if(!this.$clickThrottle()) { return }//防止重复点击
+                Promise.all(formValidates).then(()=>{
+                    
+                    api.updateCaseInfoById(data).then(res => {
+                        this.$message.success("编辑成功");
+                        this.$parent.getCaseInfoList(this.currentPage)
+                        this.handleClose()     
+                    })
+                }).catch(()=>{
+                    this.$message({ message: '请检查必填项是否填完', type: "warning",customClass:'messageZindex'});
+                    // console.log('请检查必填项是否填完')
+                })
+                
+            },
+                
+            checkForm(formName) {
+                return new Promise((resolve, reject) => {
+                    this.$refs[formName].validate(valid => {
+                    if (valid) {
+                        resolve();
+                    } else reject();
+                    });
+                });
+            },
+            
+            handleClose() {
+                this.$emit('update:editCaseDrawer', null)
+            },
+        }
+    };
+</script>
+<style scoped lang="scss">
+.audio_wrap{
+	width: 330px;
+	height: 40px;
+    .audio{
+        width: 100%;
+        height: 100%;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/pages/case-management-old/components/importCaseDialog.vue b/src/pages/case-management-old/components/importCaseDialog.vue
new file mode 100644
index 0000000..1d38b71
--- /dev/null
+++ b/src/pages/case-management-old/components/importCaseDialog.vue
@@ -0,0 +1,101 @@
+<template>
+    <div>
+        <el-dialog
+            :title="importCaseDialog.title"
+            :visible="true"
+            width="480px"
+            append-to-body
+            :close-on-click-modal="false"
+            @close="handleClose"
+        >
+        
+            <div class="dialog-content">
+              <upload-import :file-list="fileList" :max-count="1"
+                            :show-file-name="true"
+                            accept=".xls,.xlsx"
+                            @handleUploadFile="handleUploadFile"
+                            @handleImport="handleImport">
+              </upload-import>
+            </div>
+        
+        <span slot="footer" class="dialog-footer">
+            <el-button @click="handleClose()">取消</el-button>
+            <el-button @click="handleDownload()">下载</el-button>
+            <el-button type="primary" @click="handleSubmit()">确认</el-button>
+        </span>
+        </el-dialog>
+        
+    </div>
+</template>
+<script>
+import api from "@/services/caseManagement";
+    export default {
+        components: {
+            uploadImport:() => import('@/components/uploadImport.vue'),//导入上传
+        },
+        props: {
+            importCaseDialog: {
+                type: Object,
+                default: () => {
+                    return {}
+                },
+            },
+        },
+        data() {
+            return {
+            
+                fileList:[],
+
+            };
+        },
+        mounted () {
+            
+        },
+        methods: {
+            handleUploadFile(fileList){
+                console.log('获取上传文件信息',fileList)
+                fileList = JSON.parse(JSON.stringify(fileList))
+                this.fileList = fileList.map((item,i) => {
+                    let time = this.$util.getTimestamp()
+                    let fileType = this.$util.getFileExtension(item.url)
+                    let fileName = `${time}.${fileType}`
+                    return {
+                        url: item.url,
+                        fileName:fileName,
+                    }
+                })
+            },
+            handleImport(file){
+                let formdata = new FormData();
+                formdata.append("file", file)
+                console.log(formdata)
+                api.getImportCase(formdata).then(res => {
+                    this.$parent.getCaseInfoList(1)
+                    this.$message.success("导入成功");    
+                })   
+          
+            },
+            handleSubmit(){  
+                if(!this.$clickThrottle()) { return }//防止重复点击
+                this.handleClose()  
+            },
+            // 下载
+            handleDownload(){
+                if(!this.$clickThrottle()) { return }//防止重复点击        
+                api.getExportTemplate({}).then(res => {
+                    this.$util.downloadFileByBlob(res.data, '案件.xlsx')
+                })
+            },
+            handleClose() {
+                this.$emit('update:importCaseDialog', null)
+            },
+        }
+    };
+</script>
+<style scoped lang="scss">
+.dialog-content{
+    padding: 16px 64px;
+    max-height:500px
+}
+
+</style>
\ No newline at end of file
diff --git a/src/pages/case-management-old/index.vue b/src/pages/case-management-old/index.vue
new file mode 100644
index 0000000..17120e5
--- /dev/null
+++ b/src/pages/case-management-old/index.vue
@@ -0,0 +1,651 @@
+<template>
+    <div class="layout-content-wrap">
+        <el-tabs class="zd-el-tabs-custom zd-el-tabs-custom__left_padding"  v-model="activeName" @tab-click="handleTabClick">
+            <el-tab-pane name="all">
+                <span slot="label"><span>全部</span> <el-badge :value="caseStatusNum.total" :max="99" class="item"></el-badge></span>
+            </el-tab-pane>
+            <el-tab-pane name="mediate">
+                <span slot="label"><span>待调解</span> <el-badge :value="caseStatusNum.not" :max="99" class="item"></el-badge></span>
+            </el-tab-pane>
+            <el-tab-pane name="mediation">
+                <span slot="label"><span>调解中</span> <el-badge :value="caseStatusNum.ing" :max="99" class="item"></el-badge></span>
+            </el-tab-pane>
+            <el-tab-pane name="mediated">
+                <span slot="label"><span>已结束</span> <el-badge :value="caseStatusNum.end" :max="99" class="item"></el-badge></span>
+            </el-tab-pane>
+        </el-tabs>
+        <div class="layout-tabs-content-box">
+            <div class="pt-8 border-b-solid-lighter-1">
+                <div class="height-30 flex-row align-items-center justify-content-between mb-24">
+                    <div class="f22 color-text-primary">筛选</div>
+                    <div class="flex-row align-items-center color-text-regular cursor-pointer"
+                         @click="handleToggleSearch">
+                        <span class="f14 pr-8">{{showSearch?'展开':'收起'}}</span>
+                        <i :class="['f14 el-icon-arrow-down transform-time-default', {
+                        'rotate--180': showSearch
+                    }]"></i>
+                    </div>
+                </div>
+                <el-collapse-transition>
+                    <div v-show="showSearch">
+                        <el-row :gutter="56">
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">金融机构名称</span>
+                                    <el-input v-model.trim="queryParam.financialOrgName"
+                                              clearable placeholder="请输入金融机构名称"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件编号</span>
+                                    <el-input v-model.trim="queryParam.caseNo"
+                                              clearable placeholder="请输入案件编号"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">金融产品类型</span>
+                                    <el-select v-model="queryParam.productTypeId"
+                                           clearable placeholder="请选择金融产品类型"
+                                           @keydown.enter.native="handleSearch"
+                                           class="width100">
+                                    <el-option
+                                            v-for="item in financialProductsTypeOptions"
+                                            :key="item.code"
+                                            :label="item.codeName"
+                                            :value="item.code">
+                                    </el-option>
+                                </el-select>
+                                </div>
+                            </el-col>
+                        </el-row>
+                        <el-row :gutter="56">
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">区域</span>
+                                    <el-select v-model="queryParam.deptId"
+                                            clearable placeholder="请选择区域"
+                                            @keydown.enter.native="handleSearch"
+                                            :disabled="deptDisabled"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in departmentOptions"
+                                                :key="item.id"
+                                                :label="item.name"
+                                                :value="item.id">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">债务人姓名</span>
+                                    <el-input v-model.trim="queryParam.creditorName"
+                                              clearable placeholder="请输入债务人姓名"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">债务人电话</span>
+                                    <el-input v-model.trim="queryParam.creditorPhone"
+                                              clearable placeholder="请输入债务人电话"
+                                              @keydown.enter.native="handleSearch"
+                                              maxlength="11"
+                                              >
+                                    </el-input>
+                                </div>
+                            </el-col>
+                        </el-row>
+                        <el-row :gutter="56" v-if="caseStatusShow">
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件状态</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件状态"
+                                            @keydown.enter.native="handleSearch"
+                                            :disabled="deptDisabled"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in caseStatusData"
+                                                :key="item.code"
+                                                :label="item.desc"
+                                                :value="item.code">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                        </el-row>
+                        <el-row :gutter="56">
+                            <el-col :span="18">
+                                <div class="flex-row align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">创建时间</span>
+                                    <span :class="['f14 pr-24 cursor-pointer', i === 0 ? 'pl-8' : '',
+                                    activeUsage === item ?'color-primary' : 'color-text-regular']"
+                                          v-for="(item, i) in usageOption" :key="i"
+                                          @click="handleClickUsage(item)">{{item}}</span>
+
+                                    <el-date-picker
+                                            v-model="queryDate"
+                                            type="daterange"
+                                            clearable
+                                            range-separator="至"
+                                            start-placeholder="开始日期"
+                                            end-placeholder="结束日期"
+                                            @change="handleChangeDate">
+                                    </el-date-picker>
+                                </div>
+                            </el-col>
+                            <el-col :span="4" :offset="2">
+                                <div class="flex-row align-items-center justify-content-end">
+                                    <el-button @click="hanldeReset">重置</el-button>
+                                    <el-button type="primary" @click="handleSearch">搜索</el-button>
+                                </div>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-collapse-transition>
+            </div>
+            <!-- table -->
+            <div class="pt-8">
+                <div class="height-56 flex-row align-items-center justify-content-between">
+                    <div class="f22 color-text-primary">案件列表</div>
+                    <div class="flex-row">
+                        <el-button size="small" @click="handleImport">导入</el-button>
+                        <el-button size="small" @click="handleBatchDelete">删除</el-button>
+                        <el-button size="small" @click="handleAddForm">新增</el-button>
+                        <el-button size="small" type="primary" @click="handleCaseAllocation">案件分配</el-button>
+                    </div>
+                </div>
+                
+                <div >
+                    <el-table :data="tableData" :height="`${contentHeight}`" 
+                    @selection-change="handleSelectionChange"
+                    >
+                        <el-table-column
+                            type="selection"
+                            width="55" :selectable="checkSelectable">
+                        </el-table-column>
+
+                        <el-table-column
+                            v-for="(item, i) in tableHead"
+                            :key="i"
+                            :prop="item.prop"
+                            :label="item.label"
+                            :show-overflow-tooltip="item.showOverflowTooltip"
+                            :width="item.width"
+                            :sortable="item.sortable"
+                            :formatter="item.formatter"
+                        ></el-table-column>
+                        <el-table-column
+                            prop="resultStatus"
+                            label="案件状态"
+                            show-overflow-tooltip
+                            :formatter="formatResultStatusEnum"
+                            v-if="caseStatusShow"
+                            >
+                        </el-table-column>
+                        <el-table-column  label="操作" width="150">
+                            <template slot-scope="scope">
+                                <div class="flex-row align-items-center">
+                                    <el-button size="mini" @click="handleEdit(scope)">编辑</el-button>
+                                    <div v-if="scope.row.caseStatus == 0" class="f12 cursor-pointer color-text-regular ml-16" @click="handleDelete(scope)">删除</div>
+                                </div>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                
+                <div class="text-center pt-16">
+                    <el-pagination
+                        @size-change="getCaseInfoList"
+                        @current-change="getCaseInfoList"
+                        :current-page="queryParam.current"
+                        :page-size="queryParam.size"
+                        layout="total, prev, pager, next, jumper"
+                        :total="total">
+                    </el-pagination>
+                </div>
+
+            </div>
+        </div>
+        <!-- 导入 -->
+        <importCaseDialog v-if="importCaseDialog" :importCaseDialog.sync="importCaseDialog" />
+        <!-- 新增 -->
+        <addCaseDialog v-if="addCaseDialog" :addCaseDialog.sync="addCaseDialog" />
+        <!-- 编辑 -->
+        <editCaseDrawer v-if="editCaseDrawer" :editCaseDrawer.sync="editCaseDrawer"/>
+        <!-- 案件分配-->
+        <caseAllocationDialog v-if="caseAllocationDialog" :caseAllocationDialog.sync="caseAllocationDialog" />
+    </div>
+</template>
+<script>
+import api from "@/services/caseManagement";
+    export default {
+        components: {
+            importCaseDialog: () => import('./components/importCaseDialog'),//导入
+            addCaseDialog: () => import('./components/addCaseDialog'),//新增
+            editCaseDrawer: () => import('./components/editCaseDrawer'),//编辑
+            caseAllocationDialog: () => import('./components/caseAllocationDialog'),//案件分配
+        },
+        data() {
+            return {
+                activeName:'all',
+                showSearch: true,
+                queryDate: '',
+                activeUsage: '',
+                caseStatusNum:{
+                    end: 0,
+                    ing: 0,
+                    not: 0,
+                    total:0
+                },
+                mediateStatusData:[],//所有案件状态枚举
+                financialProductsTypeOptions:[],//金融产品类型
+                departmentOptions:[],//区域
+                queryParam: {
+                    financialOrgName:'',//金融机构名称
+                    caseNo: '',//案件编号
+                    productTypeId: '',//产品类型id
+                    caseStatus: '',//案件状态
+                    creditorName:'',//债券人姓名
+                    creditorPhone:'',//债务人手机号
+                    endTime: '',//结束时间
+                    beginTime:'',//开始时间
+                    deptId:'',//区域id
+                    current:1,
+                    size:10,
+
+                    caseName:'',//案件名称
+                    dataAuthUserId:'',//当前登录用户所拥有权限的用户id
+                    dataAuthDeptId:'',//当前登录用户所拥有权限的区域id
+                    mediatorId:'',//调解员id
+                    resultStatus:'',//结果状态
+
+                },
+                usageOption: ['今日','昨日', '近一周', '近一月', '近半年', '近一年'],
+                tableHead: [
+                    {
+                        prop: "caseName",
+                        label: "案件名称",
+                        showOverflowTooltip: true,
+                        formatter: this.formatTable,
+                    },
+                    {
+                        prop: "caseNo",
+                        label: "案件编号",
+                        showOverflowTooltip: true,
+                        formatter:this.formatTable,
+                    },
+                    {
+                        prop: "productTypeId",
+                        label: "金融产品类型",
+                        showOverflowTooltip: true,
+                        formatter: this.formatProductType,
+                    },
+                    {
+                        prop: "deptId",
+                        label: "归属区域",
+                        showOverflowTooltip: true,
+                        formatter: this.formatdeptName,
+                    },
+                    {
+                        prop: "mediatorName",
+                        label: "归属人",
+                        showOverflowTooltip: true,
+                         formatter:this.formatTable,
+                    },
+                    {
+                        prop: "createAt",
+                        label: "创建时间",
+                        showOverflowTooltip: true,
+                        formatter: this.formatTable,
+                    },
+                    {
+                        prop: "caseStatus",
+                        label: "调解状态",
+                        showOverflowTooltip: true,
+                        formatter: this.formatMediateStatusEnum,
+                    },
+                    // {
+                    //     prop: "resultStatus",
+                    //     label: "案件状态",
+                    //     showOverflowTooltip: true,
+                    //     formatter: this.formatResultStatusEnum,
+                    // },
+                ],
+                tableData: [],
+                total:0,
+                uniqueSelection:[],
+                caseAllocationDialog:null,//案件分配弹框
+                importCaseDialog:null,//导入
+                addCaseDialog:null,//新增
+                editCaseDrawer:null,//编辑
+                deptDisabled:false,//区域下拉设置是否可选
+                caseStatusData:[],//获取调解中状态枚举
+                caseStatusShow:true,//显示案件状态枚举 全部，调解中
+
+
+
+            }
+        },
+        created() {
+            this.getCaseCount();//获取各案件状态数量
+            this.getMediateStatusEnum();//获取所有状态枚举
+            this.getDict();//获取金融产品类型
+            this.getDeptList();//获取区域
+            // 判断当前登录人角色，如果是普通调解员，则默认展示区域且不可选择
+            let identifier = this.$store.state.userinfo.identifier
+            if(identifier=='mediator'){
+                this.deptDisabled = true
+                this.queryParam.deptId = this.$store.state.userinfo.deptId
+            }else{
+                this.deptDisabled = false
+            }
+            // this.setDateFast()
+            this.getCaseStatusEnum();//获取调解中状态枚举
+            this.getCaseInfoList(1)
+        },
+        computed:{
+            // 获取抽屉drawer的内容高度
+            contentHeight(){
+                let oh = document.documentElement.clientHeight;
+                if(this.showSearch){
+                    if(this.caseStatusShow){
+                        return oh-56-48-430-32
+                    }else{
+                        return oh-56-48-366-32
+                    }
+                    
+                }else{
+                    return oh-56-48-175-32
+                }
+            }  
+        },
+        methods: {
+            checkSelectable(row) {
+                if (row.caseStatus == 0) {
+                    return true
+                }
+                else
+                {
+                    return false
+                }
+            },
+            // tab切换
+            handleTabClick(tab,event){
+                console.log('获取e==',tab)
+                if(tab.name == 'mediate'){
+                    this.queryParam.caseStatus = 0//待调解
+                    this.caseStatusShow = false
+                }else if(tab.name == 'mediation'){
+                    this.queryParam.caseStatus = 1//调解中
+                    this.caseStatusShow = true
+                }else if(tab.name == 'mediated'){
+                    this.queryParam.caseStatus = 2//已结束
+                    this.caseStatusShow = false
+                }else{
+                    this.queryParam.caseStatus = ''
+                    this.caseStatusShow = true
+                }
+                this.getCaseInfoList(1)
+            },
+            // 导入
+            handleImport(){
+                this.importCaseDialog={
+                    title:'导入案件',
+                }
+            },
+            // 批量删除
+            handleBatchDelete(){
+                if(this.uniqueSelection.length==0){
+                    this.$message.warning("请先选择你要删除的列表数据");
+                    return
+                }
+                this.$confirm("请确定是否删除这些数据?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                }).then(() => {
+                    if(!this.$clickThrottle()) { return }//防止重复点击
+                    
+                    let data = {
+                        ids:this.uniqueSelection
+                    }
+                    api.deleteCaseBatch(data).then((res) => {
+                        
+                        this.$message.success("成功");
+                        this.getCaseInfoList(1)
+                       
+                    });
+                }).catch(() => {});
+            },
+            // 单条删除
+            handleDelete(scope){
+                this.$confirm("请确定是否删除此条数据?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                }).then(() => {
+                    if(!this.$clickThrottle()) { return }//防止重复点击
+                    api.deleteCaseInfoById(scope.row.id).then((res) => {
+                        
+                        this.$message.success("成功");
+                        this.getCaseInfoList(1)
+                       
+                    });
+                }).catch(() => {});
+            },
+            // 新增
+            handleAddForm(){
+                this.addCaseDialog={
+                    title:'新增案件',
+                }
+            },
+            // 案件分配
+            handleCaseAllocation(){
+                this.caseAllocationDialog={
+                    title:'案件分配',
+                }
+            },
+            // 编辑
+            handleEdit(scope){
+                this.editCaseDrawer={
+                    title:'编辑案件',
+                    data:scope.row,
+                    currentPage:this.queryParam.current
+                }
+            },
+            // 获取各案件状态数量
+            getCaseCount(){
+                api.getCaseCount({}).then(res => {
+                    if (!res.code) {
+                        this.caseStatusNum = res;
+                    }
+                })
+            },
+            // 获取金融产品类型
+            getDict(){
+                let data = {
+                    type:'financial'
+                }
+                api.getDict(data).then(res => {
+                    if (!res.code) {
+                        this.financialProductsTypeOptions = res;
+                    }
+                })
+            },
+            // 获取区域
+            getDeptList(){
+                let data = {
+                    companyId: this.$store.state.userinfo.companyId,
+                    current: 1,
+                    size: 500,
+                }
+                api.getDeptList(data).then(res => {
+                    if (!res.code) {
+                        this.departmentOptions = res.records;
+                        
+                    }
+                })
+            },
+            // 列表数据
+            getCaseInfoList(val){
+                this.queryParam.current = val
+                api.getCaseInfoList(this.queryParam).then(res => {
+                    if (!res.code) {
+                        this.tableData = res.records;
+                        this.total = res.total;
+                    }
+                })
+            },
+            // 根据id获取区域名称
+            formatdeptName(row, column, cellValue, index){
+                let obj = this.departmentOptions.find((item) => {
+                    return item.id == row.deptId
+                })
+                return row.deptId != null ? <div>{obj?obj.name:'-'}</div> : '-'
+            },
+            formatProductType(row, column, cellValue, index){
+                // console.log('row',row)
+                let obj = this.financialProductsTypeOptions.find((item) => {
+                    return item.code == row.productTypeId
+                })
+                return row.productTypeId != null ? <div>{obj?obj.codeName:'-'}</div> : '-'
+            },
+            handleToggleSearch() {
+                this.showSearch = !this.showSearch
+            },
+            // 重置
+            hanldeReset() {
+                for (let key in this.queryParam) {
+                this.queryParam[key] = ''
+                }
+                this.queryParam.current = 1
+                this.queryParam.size = 10
+            },
+            handleSearch() {
+                this.queryParam.size = 10;
+                this.queryParam.current = 1;
+                this.getCaseInfoList(1)
+            },
+            handleClickUsage(item) {
+                this.activeUsage = item
+                this.setDateFast()
+            },
+            handleChangeDate() {
+                this.activeUsage = ''
+                if(this.queryDate === null) {
+                    this.setDateFast()
+                }else {
+                    this.queryParam.beginTime = this.$util.getDayStart(this.queryDate[0])
+                    this.queryParam.endTime = this.$util.getDayEnd(this.queryDate[1])
+                }
+
+            },
+            setDateFast() {
+                switch (this.activeUsage) {
+                    case "今日":
+                        let todayObj = this.$util.getToday()
+                        this.queryParam.beginTime = todayObj.todayStart
+                        this.queryParam.endTime = todayObj.todayEnd
+                        break
+                    case "昨日":
+                        let yesterdayObj = this.$util.getYesterday()
+                        this.queryParam.beginTime = yesterdayObj.beginTime
+                        this.queryParam.endTime = yesterdayObj.endTime
+                        break
+                    case "近一周":
+                        let rangeWeek = this.$util.getRecentWeeks()
+                        this.queryParam.beginTime = rangeWeek.recentWeekStart
+                        this.queryParam.endTime = rangeWeek.todayEnd
+                        break
+                    case "近一月":
+                        let rangeMonth = this.$util.getRecentMonths()
+                        this.queryParam.beginTime = rangeMonth.recentMonthStart
+                        this.queryParam.endTime = rangeMonth.todayEnd
+                        break
+                    case "近半年":
+                        let rangeMonths = this.$util.getRecentMonths(6)
+                        console.log('近半年：', rangeMonths)
+                        this.queryParam.beginTime = rangeMonths.recentMonthStart
+                        this.queryParam.endTime = rangeMonths.todayEnd
+                        break
+                    case "近一年":
+                        let rangeYear = this.$util.getRecentYears()
+                        this.queryParam.beginTime = rangeYear.recentYearStart
+                        this.queryParam.endTime = rangeYear.todayEnd
+                        break
+                    default:
+                        this.queryParam.beginTime = ''
+                        this.queryParam.endTime = ''
+                        this.queryDate = ''
+                        break
+                }
+                if(this.queryParam.beginTime && this.queryParam.endTime) {
+                    this.queryDate = [this.queryParam.beginTime, this.queryParam.endTime]
+                }
+
+            },
+
+            handleSelectionChange(val){
+                console.log('获取val',val)
+                this.uniqueSelection = []
+                val.forEach((row)=>{
+                    this.uniqueSelection.push(row.id)
+                })
+                console.log('uniqueSelection',this.uniqueSelection)
+
+            },
+            
+            // 获取案件状态枚举-调解状态
+            getMediateStatusEnum(){
+                api.getMediateStatusEnum({}).then(res => {
+                    if (!res.code) {
+                        this.mediateStatusData = res;
+                    }
+                })
+            },
+            // 案件状态
+            formatMediateStatusEnum(row, column, cellValue, index){
+                // console.log('row',row)
+                let className = `status-btn case-status${row.caseStatus}`
+                let obj = this.mediateStatusData.find((item) => {
+                    return item.code == row.caseStatus
+                })
+                return row.caseStatus != null ? <div class={className}>{obj.desc}</div> : '-'
+                
+            },
+
+            // 获取调解中案件状态枚举
+            getCaseStatusEnum(){
+                api.getCaseStatusEnum({}).then(res => {
+                    if (!res.code) {
+                        this.caseStatusData = res;
+                    }
+                })
+            },
+            formatResultStatusEnum(row, column, cellValue, index){
+                // console.log('row',row)
+                let className = `status-btn result-status${row.resultStatus}`
+                let obj = this.caseStatusData.find((item) => {
+                    return item.code == row.resultStatus
+                })
+                return row.resultStatus != null ? <div class={className}>{obj.desc}</div> : '-'
+                
+            },
+            
+        }
+    }
+</script>
+<style scoped >
+.el-badge{
+    top: 3px;
+}
+</style>
\ No newline at end of file
diff --git a/src/pages/case-management/index.vue b/src/pages/case-management/index.vue
index ddc83c7..7a00bbf 100644
--- a/src/pages/case-management/index.vue
+++ b/src/pages/case-management/index.vue
@@ -1,20 +1,12 @@
 <template>
     <div class="layout-content-wrap">
-        <el-tabs class="zd-el-tabs-custom zd-el-tabs-custom__left_padding"  v-model="activeName" @tab-click="handleTabClick">
-            <el-tab-pane name="all">
-                <span slot="label"><span>全部</span> <el-badge :value="caseStatusNum.total" :max="99" class="item"></el-badge></span>
-            </el-tab-pane>
-            <el-tab-pane name="mediate">
-                <span slot="label"><span>待调解</span> <el-badge :value="caseStatusNum.not" :max="99" class="item"></el-badge></span>
-            </el-tab-pane>
-            <el-tab-pane name="mediation">
-                <span slot="label"><span>调解中</span> <el-badge :value="caseStatusNum.ing" :max="99" class="item"></el-badge></span>
-            </el-tab-pane>
-            <el-tab-pane name="mediated">
-                <span slot="label"><span>已结束</span> <el-badge :value="caseStatusNum.end" :max="99" class="item"></el-badge></span>
-            </el-tab-pane>
-        </el-tabs>
-        <div class="layout-tabs-content-box">
+        <div class="navigation-bar flex-row mb-16">
+            <img src="../../assets/image/Link.png"  height="22" alt="">
+            <a>/</a>
+            <a>案件包列表</a><a>/</a>
+            <a>案件列表</a>
+        </div>
+        <div class="layout-tabs-content-box  background-color-fff border-radius-4">
             <div class="pt-8 border-b-solid-lighter-1">
                 <div class="height-30 flex-row align-items-center justify-content-between mb-24">
                     <div class="f22 color-text-primary">筛选</div>
@@ -29,7 +21,16 @@
                 <el-collapse-transition>
                     <div v-show="showSearch">
                         <el-row :gutter="56">
-                            <el-col :span="8">
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件包名称</span>
+                                    <el-input v-model.trim="queryParam.financialOrgName"
+                                              clearable placeholder="请输入案件包名称"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
                                 <div class="flex-row-center align-items-center height-40 mb-24">
                                     <span class="tabs__search-criteria-title flex-shrink-0 pr-16">金融机构名称</span>
                                     <el-input v-model.trim="queryParam.financialOrgName"
@@ -38,7 +39,7 @@
                                     </el-input>
                                 </div>
                             </el-col>
-                            <el-col :span="8">
+                            <el-col :span="6">
                                 <div class="flex-row-center align-items-center height-40 mb-24">
                                     <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件编号</span>
                                     <el-input v-model.trim="queryParam.caseNo"
@@ -47,70 +48,12 @@
                                     </el-input>
                                 </div>
                             </el-col>
-                            <el-col :span="8">
+                            <el-col :span="6">
                                 <div class="flex-row-center align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">金融产品类型</span>
-                                    <el-select v-model="queryParam.productTypeId"
-                                           clearable placeholder="请选择金融产品类型"
-                                           @keydown.enter.native="handleSearch"
-                                           class="width100">
-                                    <el-option
-                                            v-for="item in financialProductsTypeOptions"
-                                            :key="item.code"
-                                            :label="item.codeName"
-                                            :value="item.code">
-                                    </el-option>
-                                </el-select>
-                                </div>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="56">
-                            <el-col :span="8">
-                                <div class="flex-row-center align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">区域</span>
-                                    <el-select v-model="queryParam.deptId"
-                                            clearable placeholder="请选择区域"
-                                            @keydown.enter.native="handleSearch"
-                                            :disabled="deptDisabled"
-                                            class="width100">
-                                        <el-option
-                                                v-for="item in departmentOptions"
-                                                :key="item.id"
-                                                :label="item.name"
-                                                :value="item.id">
-                                        </el-option>
-                                    </el-select>
-                                </div>
-                            </el-col>
-                            <el-col :span="8">
-                                <div class="flex-row-center align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">债务人姓名</span>
-                                    <el-input v-model.trim="queryParam.creditorName"
-                                              clearable placeholder="请输入债务人姓名"
-                                              @keydown.enter.native="handleSearch">
-                                    </el-input>
-                                </div>
-                            </el-col>
-                            <el-col :span="8">
-                                <div class="flex-row-center align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">债务人电话</span>
-                                    <el-input v-model.trim="queryParam.creditorPhone"
-                                              clearable placeholder="请输入债务人电话"
-                                              @keydown.enter.native="handleSearch"
-                                              maxlength="11"
-                                              >
-                                    </el-input>
-                                </div>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="56" v-if="caseStatusShow">
-                            <el-col :span="8">
-                                <div class="flex-row-center align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件状态</span>
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">所属调解员</span>
                                     <el-select v-model="queryParam.resultStatus"
                                             clearable placeholder="请选择案件状态"
                                             @keydown.enter.native="handleSearch"
-                                            :disabled="deptDisabled"
                                             class="width100">
                                         <el-option
                                                 v-for="item in caseStatusData"
@@ -120,12 +63,115 @@
                                         </el-option>
                                     </el-select>
                                 </div>
+                                
+                            </el-col>
+                        </el-row>
+                        <el-row :gutter="56">
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件状态</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件状态"
+                                            @keydown.enter.native="handleSearch"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in CaseStatusEnum"
+                                                :key="item.label"
+                                                :label="item.label"
+                                                :value="item.value">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">分案状态</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件状态"
+                                            @keydown.enter.native="handleSearch"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in PartCaseStatusEnum"
+                                                :key="item.label"
+                                                :label="item.label"
+                                                :value="item.value">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">调解进度</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件状态"
+                                            @keydown.enter.native="handleSearch"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in MediateProgEnum"
+                                                :key="item.label"
+                                                :label="item.label"
+                                                :value="item.value">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">调解状态</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件状态"
+                                            @keydown.enter.native="handleSearch"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in MediateStatusEnum"
+                                                :key="item.label"
+                                                :label="item.label"
+                                                :value="item.value">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+
+                                
+                            </el-col>
+                            
+                        </el-row>
+                        <el-row :gutter="56">
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">被申请人姓名</span>
+                                    <el-input v-model.trim="queryParam.creditorName"
+                                              clearable placeholder="请输入债务人姓名"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">被申请人电话</span>
+                                    <el-input v-model.trim="queryParam.creditorPhone"
+                                              clearable placeholder="请输入债务人电话"
+                                              @keydown.enter.native="handleSearch"
+                                              maxlength="11"
+                                              >
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="6">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">被申请人证件号</span>
+                                    <el-input v-model.trim="queryParam.creditorPhone"
+                                              clearable placeholder="请输入债务人电话"
+                                              @keydown.enter.native="handleSearch"
+                                              maxlength="11"
+                                              >
+                                    </el-input>
+                                </div>
                             </el-col>
                         </el-row>
                         <el-row :gutter="56">
                             <el-col :span="18">
                                 <div class="flex-row align-items-center height-40 mb-24">
-                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">创建时间</span>
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">最新跟进时间</span>
                                     <span :class="['f14 pr-24 cursor-pointer', i === 0 ? 'pl-8' : '',
                                     activeUsage === item ?'color-primary' : 'color-text-regular']"
                                           v-for="(item, i) in usageOption" :key="i"
@@ -157,47 +203,111 @@
                 <div class="height-56 flex-row align-items-center justify-content-between">
                     <div class="f22 color-text-primary">案件列表</div>
                     <div class="flex-row">
-                        <el-button size="small" @click="handleImport">导入</el-button>
-                        <el-button size="small" @click="handleBatchDelete">删除</el-button>
-                        <el-button size="small" @click="handleAddForm">新增</el-button>
-                        <el-button size="small" type="primary" @click="handleCaseAllocation">案件分配</el-button>
+                        
+                            <el-button size="small" @click="handleImport">导入</el-button>
+                            <el-button size="small" @click="handleBatchDelete">删除</el-button>
+                            <el-button size="small" @click="handleAddForm">新增</el-button>
+                            <el-button size="small" type="primary" @click="handleCaseAllocation">案件分配</el-button>
+                        
+                        
                     </div>
                 </div>
+                <div class="height-56 flex-row align-items-center justify-content-between" style="height: 22px;margin-left: 10px;margin-top: -10px;margin-bottom: 5px">
+                    <div class="f22 color-text-primary"><el-checkbox  :indeterminate="indeterminate" @change="handleCheckAllChange">全选</el-checkbox></div>
+                </div>
                 
-                <div >
-                    <el-table :data="tableData" :height="`${contentHeight}`" 
-                    @selection-change="handleSelectionChange"
-                    >
-                        <el-table-column
-                            type="selection"
-                            width="55" :selectable="checkSelectable">
-                        </el-table-column>
+                <div class="case-table">
+                    <el-table :data="tableData" :height="`${contentHeight}`"  @selection-change="handleSelectionChange" :show-header="false">
+                        <!-- <el-table-column type="selection" width="55"></el-table-column> -->
+                        <!-- <el-table-column align="center" width="85">
+                            <template slot="header">
+                            <div>
+                                <el-checkbox  :indeterminate="indeterminate" @change="handleCheckAllChange">全选</el-checkbox>
+                            </div>
+                            </template>
+                        </el-table-column> -->
 
-                        <el-table-column
-                            v-for="(item, i) in tableHead"
-                            :key="i"
-                            :prop="item.prop"
-                            :label="item.label"
-                            :show-overflow-tooltip="item.showOverflowTooltip"
-                            :width="item.width"
-                            :sortable="item.sortable"
-                            :formatter="item.formatter"
-                        ></el-table-column>
-                        <el-table-column
-                            prop="resultStatus"
-                            label="案件状态"
-                            show-overflow-tooltip
-                            :formatter="formatResultStatusEnum"
-                            v-if="caseStatusShow"
-                            >
-                        </el-table-column>
-                        <el-table-column  label="操作" width="150">
+                        <el-table-column prop="pkgName" label="操作"  show-overflow-tooltip >
                             <template slot-scope="scope">
-                                <div class="flex-row align-items-center">
-                                    <el-button size="mini" @click="handleEdit(scope)">编辑</el-button>
-                                    <div v-if="scope.row.caseStatus == 0" class="f12 cursor-pointer color-text-regular ml-16" @click="handleDelete(scope)">删除</div>
+                                <div class="table-row flex-column justify-content-between">
+                                    <div class="flex-row">
+                                        <span>
+                                            <el-checkbox-group v-model="selectionData">
+                                                <!-- 此处的label是复选框右边显示的值，也是选中后的值。如果要一行的数据，直接使用row即可 -->
+                                                <!-- label的内容会显示在页面上，需要配合css把label的内容隐藏掉 -->
+                                                <el-checkbox :disabled="scope.row.disabled" :key="scope.row.id" :label="scope.row.id"></el-checkbox>
+                                            </el-checkbox-group>
+                                        </span>
+                                        <span class="f-weight500">被申请人：{{scope.row.name}}</span>
+                                    </div>
+                                    <div class="flex-row justify-content-between table-span-one">
+                                        <span class="">
+                                            <p>案件号：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                        <span>
+                                            <p>申请人：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                        <span>
+                                            <p>最新跟进时间：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                        <span>
+                                            <p>逾期金额：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                        <span>
+                                            <p>委案日期：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                        <span>
+                                            <p>所属调解员：</p>
+                                            <p class="color-000">2321312313131</p>
+                                        </span>
+                                    </div>
+                                    <div class="flex-row justify-content-between case-bg">
+                                        <span>
+                                            <p>短信</p>
+                                            <p class="color-000"><a class="color-274ea4">成功1</a>/发送1</p>
+                                        </span>
+                                        <span>
+                                            <p>外呼</p>
+                                            <p class="color-000"><a class="color-274ea4">接通0</a>/外呼0</p>
+                                        </span>
+                                        <span>
+                                            <p>调解视频</p>
+                                            <p class="color-000"><a class="color-274ea4">结束0</a>/预约0</p>
+                                        </span>
+                                        <span>
+                                            <p>文书</p>
+                                            <p class="color-000">0</p>
+                                        </span>
+                                        <span>
+                                            <p>文书签署</p>
+                                            <p class="color-000"><a class="color-274ea4">成功0</a>/发起0</p>
+                                        </span>
+                                        <span>
+                                            <p>文书送达</p>
+                                            <p class="color-000">0</p>
+                                        </span>
+                                        <span>
+                                            <p>还款计划</p>
+                                            <p class="color-000"><a class="color-274ea4">已设置</a></p>
+                                        </span>
+                                        <span>
+                                            <p>还款凭证</p>
+                                            <p class="color-000"><a class="color-274ea4">已填0</a></p>
+                                        </span>
+                                    </div>
+                                    <div class="flex-row justify-content-end">
+                                        <span><el-button size="mini" class="case-btn" @click="handleEdit(scope)">查看详情</el-button></span>
+                                        <span><el-button size="mini" class="case-btn" @click="handleEdit(scope)">删除</el-button></span>
+                                    </div>
+                                    
                                 </div>
                             </template>
+
                         </el-table-column>
                     </el-table>
                 </div>
@@ -216,39 +326,48 @@
             </div>
         </div>
         <!-- 导入 -->
-        <importCaseDialog v-if="importCaseDialog" :importCaseDialog.sync="importCaseDialog" />
+        <!-- <importCaseDialog v-if="importCaseDialog" :importCaseDialog.sync="importCaseDialog" /> -->
         <!-- 新增 -->
-        <addCaseDialog v-if="addCaseDialog" :addCaseDialog.sync="addCaseDialog" />
+        <!-- <addCaseDialog v-if="addCaseDialog" :addCaseDialog.sync="addCaseDialog" /> -->
         <!-- 编辑 -->
-        <editCaseDrawer v-if="editCaseDrawer" :editCaseDrawer.sync="editCaseDrawer"/>
+        <!-- <editCaseDrawer v-if="editCaseDrawer" :editCaseDrawer.sync="editCaseDrawer"/> -->
         <!-- 案件分配-->
-        <caseAllocationDialog v-if="caseAllocationDialog" :caseAllocationDialog.sync="caseAllocationDialog" />
+        <!-- <caseAllocationDialog v-if="caseAllocationDialog" :caseAllocationDialog.sync="caseAllocationDialog" /> -->
     </div>
 </template>
 <script>
 import api from "@/services/caseManagement";
+import { values } from "lodash";
     export default {
         components: {
-            importCaseDialog: () => import('./components/importCaseDialog'),//导入
-            addCaseDialog: () => import('./components/addCaseDialog'),//新增
-            editCaseDrawer: () => import('./components/editCaseDrawer'),//编辑
-            caseAllocationDialog: () => import('./components/caseAllocationDialog'),//案件分配
+            // importCaseDialog: () => import('./components/importCaseDialog'),//导入
+            // addCaseDialog: () => import('./components/addCaseDialog'),//新增
+            // editCaseDrawer: () => import('./components/editCaseDrawer'),//编辑
+            // caseAllocationDialog: () => import('./components/caseAllocationDialog'),//案件分配
         },
         data() {
             return {
-                activeName:'all',
+                isCheck: false,//全选按钮绑定值
+                indeterminate: false,//全选按钮的不确定状态，选中数据selectionData的长度length符合  0 < selectionData.length < enabledDataList.length ，值为true
+                selectionData: [],//表格多选选中的数据
+                enabledDataList: [],//这个指表格中没有被禁用的行数据，进来组件的时候需要自己处理下
+
+                //案件状态
+                CaseStatusEnum:[{label:'在办',value:'在办'},{label:'办结',value:'办结'}],
+                //分案状态
+                PartCaseStatusEnum:[{label:'待分案',value:'待分案'},{label:'已分案',value:'已分案'}],
+                //调解进度
+                MediateProgEnum:[{label:'承诺账户',value:''},{label:'重点账户',value:''},{label:'已结清客户',value:''},
+                {label:'疑难账户',value:''},{label:'失联账户',value:''},{label:'半失联账户',value:''},{label:'部分还款账户',value:''},
+                {label:'适诉案件',value:''},{label:'可联账户',value:''},{label:'投诉倾向客户',value:''},{label:'分期客户',value:''},
+                {label:'其他/无标签',value:''}
+                ],
+                //调解状态
+                MediateStatusEnum:[{label:'未触达',value:''},{label:'调解中',value:''},{label:'已达成方案',value:''},
+                {label:'已签署协议',value:''},{label:'调解失败',value:''},{label:'调解成功',value:''}],
                 showSearch: true,
                 queryDate: '',
                 activeUsage: '',
-                caseStatusNum:{
-                    end: 0,
-                    ing: 0,
-                    not: 0,
-                    total:0
-                },
-                mediateStatusData:[],//所有案件状态枚举
-                financialProductsTypeOptions:[],//金融产品类型
-                departmentOptions:[],//区域
                 queryParam: {
                     financialOrgName:'',//金融机构名称
                     caseNo: '',//案件编号
@@ -270,56 +389,6 @@ import api from "@/services/caseManagement";
 
                 },
                 usageOption: ['今日','昨日', '近一周', '近一月', '近半年', '近一年'],
-                tableHead: [
-                    {
-                        prop: "caseName",
-                        label: "案件名称",
-                        showOverflowTooltip: true,
-                        formatter: this.formatTable,
-                    },
-                    {
-                        prop: "caseNo",
-                        label: "案件编号",
-                        showOverflowTooltip: true,
-                        formatter:this.formatTable,
-                    },
-                    {
-                        prop: "productTypeId",
-                        label: "金融产品类型",
-                        showOverflowTooltip: true,
-                        formatter: this.formatProductType,
-                    },
-                    {
-                        prop: "deptId",
-                        label: "归属区域",
-                        showOverflowTooltip: true,
-                        formatter: this.formatdeptName,
-                    },
-                    {
-                        prop: "mediatorName",
-                        label: "归属人",
-                        showOverflowTooltip: true,
-                         formatter:this.formatTable,
-                    },
-                    {
-                        prop: "createAt",
-                        label: "创建时间",
-                        showOverflowTooltip: true,
-                        formatter: this.formatTable,
-                    },
-                    {
-                        prop: "caseStatus",
-                        label: "调解状态",
-                        showOverflowTooltip: true,
-                        formatter: this.formatMediateStatusEnum,
-                    },
-                    // {
-                    //     prop: "resultStatus",
-                    //     label: "案件状态",
-                    //     showOverflowTooltip: true,
-                    //     formatter: this.formatResultStatusEnum,
-                    // },
-                ],
                 tableData: [],
                 total:0,
                 uniqueSelection:[],
@@ -327,29 +396,26 @@ import api from "@/services/caseManagement";
                 importCaseDialog:null,//导入
                 addCaseDialog:null,//新增
                 editCaseDrawer:null,//编辑
-                deptDisabled:false,//区域下拉设置是否可选
-                caseStatusData:[],//获取调解中状态枚举
-                caseStatusShow:true,//显示案件状态枚举 全部，调解中
-
-
+                caseStatusData:[],
 
             }
         },
-        created() {
-            this.getCaseCount();//获取各案件状态数量
-            this.getMediateStatusEnum();//获取所有状态枚举
-            this.getDict();//获取金融产品类型
-            this.getDeptList();//获取区域
-            // 判断当前登录人角色，如果是普通调解员，则默认展示区域且不可选择
-            let identifier = this.$store.state.userinfo.identifier
-            if(identifier=='mediator'){
-                this.deptDisabled = true
-                this.queryParam.deptId = this.$store.state.userinfo.deptId
-            }else{
-                this.deptDisabled = false
+        watch: {
+            // 监听选中的数据，选中的数据发生变化，通过判断长度给多选按钮赋值
+            selectionData: {
+                handler(v) {
+                    if (this.enabledDataList.length) {
+                    let checkedCount = v.length;
+                    this.isCheck = checkedCount === this.enabledDataList.length;
+                    this.indeterminate = checkedCount > 0 && checkedCount < this.enabledDataList.length;
+                    }
+                },
+                immediate: true
             }
-            // this.setDateFast()
-            this.getCaseStatusEnum();//获取调解中状态枚举
+        },
+
+        created() {
+            
             this.getCaseInfoList(1)
         },
         computed:{
@@ -357,45 +423,21 @@ import api from "@/services/caseManagement";
             contentHeight(){
                 let oh = document.documentElement.clientHeight;
                 if(this.showSearch){
-                    if(this.caseStatusShow){
-                        return oh-56-48-430-32
-                    }else{
-                        return oh-56-48-366-32
-                    }
+                    return oh-56-48-366-145
                     
                 }else{
-                    return oh-56-48-175-32
+                    return oh-56-48-175-75
                 }
             }  
         },
         methods: {
-            checkSelectable(row) {
-                if (row.caseStatus == 0) {
-                    return true
-                }
-                else
-                {
-                    return false
-                }
-            },
-            // tab切换
-            handleTabClick(tab,event){
-                console.log('获取e==',tab)
-                if(tab.name == 'mediate'){
-                    this.queryParam.caseStatus = 0//待调解
-                    this.caseStatusShow = false
-                }else if(tab.name == 'mediation'){
-                    this.queryParam.caseStatus = 1//调解中
-                    this.caseStatusShow = true
-                }else if(tab.name == 'mediated'){
-                    this.queryParam.caseStatus = 2//已结束
-                    this.caseStatusShow = false
-                }else{
-                    this.queryParam.caseStatus = ''
-                    this.caseStatusShow = true
-                }
-                this.getCaseInfoList(1)
+            // 全选
+            handleCheckAllChange(value){
+
+                this.selectionData = value ? this.enabledDataList.map(el=>el.id) : [];
+                this.indeterminate = false;
             },
+
             // 导入
             handleImport(){
                 this.importCaseDialog={
@@ -462,39 +504,6 @@ import api from "@/services/caseManagement";
                     currentPage:this.queryParam.current
                 }
             },
-            // 获取各案件状态数量
-            getCaseCount(){
-                api.getCaseCount({}).then(res => {
-                    if (!res.code) {
-                        this.caseStatusNum = res;
-                    }
-                })
-            },
-            // 获取金融产品类型
-            getDict(){
-                let data = {
-                    type:'financial'
-                }
-                api.getDict(data).then(res => {
-                    if (!res.code) {
-                        this.financialProductsTypeOptions = res;
-                    }
-                })
-            },
-            // 获取区域
-            getDeptList(){
-                let data = {
-                    companyId: this.$store.state.userinfo.companyId,
-                    current: 1,
-                    size: 500,
-                }
-                api.getDeptList(data).then(res => {
-                    if (!res.code) {
-                        this.departmentOptions = res.records;
-                        
-                    }
-                })
-            },
             // 列表数据
             getCaseInfoList(val){
                 this.queryParam.current = val
@@ -502,23 +511,12 @@ import api from "@/services/caseManagement";
                     if (!res.code) {
                         this.tableData = res.records;
                         this.total = res.total;
+
+                        // 给enabledDataList赋值，需要去掉被禁用的数据
+                        this.enabledDataList = this.tableData.filter(v=>!v.disabled)
                     }
                 })
             },
-            // 根据id获取区域名称
-            formatdeptName(row, column, cellValue, index){
-                let obj = this.departmentOptions.find((item) => {
-                    return item.id == row.deptId
-                })
-                return row.deptId != null ? <div>{obj?obj.name:'-'}</div> : '-'
-            },
-            formatProductType(row, column, cellValue, index){
-                // console.log('row',row)
-                let obj = this.financialProductsTypeOptions.find((item) => {
-                    return item.code == row.productTypeId
-                })
-                return row.productTypeId != null ? <div>{obj?obj.codeName:'-'}</div> : '-'
-            },
             handleToggleSearch() {
                 this.showSearch = !this.showSearch
             },
@@ -603,49 +601,37 @@ import api from "@/services/caseManagement";
                 console.log('uniqueSelection',this.uniqueSelection)
 
             },
-            
-            // 获取案件状态枚举-调解状态
-            getMediateStatusEnum(){
-                api.getMediateStatusEnum({}).then(res => {
-                    if (!res.code) {
-                        this.mediateStatusData = res;
-                    }
-                })
-            },
-            // 案件状态
-            formatMediateStatusEnum(row, column, cellValue, index){
-                // console.log('row',row)
-                let className = `status-btn case-status${row.caseStatus}`
-                let obj = this.mediateStatusData.find((item) => {
-                    return item.code == row.caseStatus
-                })
-                return row.caseStatus != null ? <div class={className}>{obj.desc}</div> : '-'
-                
-            },
-
-            // 获取调解中案件状态枚举
-            getCaseStatusEnum(){
-                api.getCaseStatusEnum({}).then(res => {
-                    if (!res.code) {
-                        this.caseStatusData = res;
-                    }
-                })
-            },
-            formatResultStatusEnum(row, column, cellValue, index){
-                // console.log('row',row)
-                let className = `status-btn result-status${row.resultStatus}`
-                let obj = this.caseStatusData.find((item) => {
-                    return item.code == row.resultStatus
-                })
-                return row.resultStatus != null ? <div class={className}>{obj.desc}</div> : '-'
-                
-            },
-            
         }
     }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .el-badge{
     top: 3px;
 }
+.case-table{
+    .table-row{
+        color: #86909C;
+        p{padding: 0;margin: 0;}
+        .case-bg{
+            background-color: #eceef1d1;
+            padding: 10px 20px;
+            margin: 5px 0 10px 0;
+        }
+        .table-span-one span{width: 180px;}
+        .case-btn{
+            color: #C66A5B;
+            border-color: #C66A5B;
+            margin: 0 5px;
+        }
+    }
+   
+}
+
+</style>
+<style lang="scss">
+.case-table{
+    .el-table tr {
+        background-color: #f7f8fa63 !important;
+    }
+}
 </style>
\ No newline at end of file
diff --git a/src/pages/case-package/components/caseAllocationDialog.vue b/src/pages/case-package/components/caseAllocationDialog.vue
index 04fd5b0..79cd7b3 100644
--- a/src/pages/case-package/components/caseAllocationDialog.vue
+++ b/src/pages/case-package/components/caseAllocationDialog.vue
@@ -87,6 +87,7 @@
 </template>
 <script>
 import api from "@/services/caseManagement";
+import apipack from "@/services/casePackageManagement";
     export default {
         components: {
             
@@ -338,7 +339,7 @@ import api from "@/services/caseManagement";
                             userList:chooseUser
                         }
                         
-                        api.postpkgdispatchCase(data).then(res => {
+                        apipack.postpkgdispatchCase(data).then(res => {
                             this.$message({
                                 showClose: true,
                                 message: '调解案件分配成功！',
diff --git a/src/pages/case-package/index.vue b/src/pages/case-package/index.vue
index 2e1595b..7506135 100644
--- a/src/pages/case-package/index.vue
+++ b/src/pages/case-package/index.vue
@@ -105,7 +105,8 @@
                 <div >
                     <el-table :data="tableData" :height="`${contentHeight}`" 
                     @selection-change="handleSelectionChange">
-                        <el-table-column type="selection" width="55" ></el-table-column>
+                        <el-table-column type="index" label="序号" width="55"></el-table-column>
+                        <!-- <el-table-column type="selection" width="55" ></el-table-column> -->
                         <el-table-column prop="pkgName" label="案件包名称" show-overflow-tooltip ></el-table-column>
                         <el-table-column prop="entrustingAgencyName" label="委案机构" show-overflow-tooltip ></el-table-column>
                         <!-- <el-table-column prop="resultStatus" label="产品类别" show-overflow-tooltip ></el-table-column> -->
@@ -129,7 +130,7 @@
                                     <el-button size="mini" @click="handleCaseAllocation(scope)">案件分配</el-button>
                                     <el-button size="mini" @click="handleEdit(scope)">预设还款方案</el-button>
                                     <el-button size="mini" v-if="scope.row.assignTotal == 0" @click="handleDelete(scope)">删除</el-button>
-                                    <el-button size="mini" v-if="scope.row.assignTotal > 0" @click="handleBack(scope)">撤回分案</el-button>
+                                    <el-button size="mini" v-if="scope.row.assignTotal > 0" @click="handleBackCase(scope)">撤回分案</el-button>
                                 </div>
                             </template>
                         </el-table-column>
@@ -225,7 +226,6 @@ import api from "@/services/casePackageManagement";
             }  
         },
         methods: {
-            
             // 导入
             handleImport(){
                 this.importCaseDialog={
@@ -273,19 +273,18 @@ import api from "@/services/casePackageManagement";
                 }).catch(() => {});
             },
             //撤回分案
-            handleBack(scope){
+            handleBackCase(scope){
                 this.$confirm("请确定是否撤回分案?", "提示", {
                     confirmButtonText: "确定",
                     cancelButtonText: "取消",
                     type: "warning",
                 }).then(() => {
                     if(!this.$clickThrottle()) { return }//防止重复点击
-                    // api.CasePkgdeleteById({id:scope.row.id}).then((res) => {
-                        
-                    //     this.$message.success("撤回分案成功");
-                    //     this.getCaseInfoList(1)
+                    api.postpkgquash({id:scope.row.id}).then((res) => {
+                        this.$message.success("撤回分案成功");
+                        this.getCaseInfoList(1)
                        
-                    // });
+                    });
                 }).catch(() => {});
             },
             // 新增
diff --git a/src/services/caseManagement.js b/src/services/caseManagement.js
index da2afc9..6facd75 100644
--- a/src/services/caseManagement.js
+++ b/src/services/caseManagement.js
@@ -100,10 +100,8 @@ const caseManagementApi = {
         return service.service.post(`${apiMediate}cases/caseInfo/getNextCaseById`, data)
     },
 
-    // 案件包手动分案
-    postpkgdispatchCase: data => {
-        return service.service.post(`${apiMediate}api/case_pkg/dispatchCase`, data)
-    },
+    
+    
 
     //========================end::案件管理======================================
 }
diff --git a/src/services/casePackageManagement.js b/src/services/casePackageManagement.js
index 0c55d48..c0b99f6 100644
--- a/src/services/casePackageManagement.js
+++ b/src/services/casePackageManagement.js
@@ -16,7 +16,14 @@ const caseManagementApi = {
     CasePkgimport: data => {
         return service.service.post(`${apiMediate}case_pkg/import`, data)
     },
-    
+    // 分案撤回
+    postpkgquash: data => {
+        return service.service.post(`${apiMediate}case_pkg/quash`, data)
+    },
+    // 案件包手动分案
+    postpkgdispatchCase: data => {
+        return service.service.post(`${apiMediate}case_pkg/dispatchCase`, data)
+    },
 
     //========================end::案件包管理======================================
 }