diff --git a/src/pages/mediation-page/components/contactPerson.vue b/src/pages/mediation-page/components/contactPerson.vue
index 2d9f558..df166c2 100644
--- a/src/pages/mediation-page/components/contactPerson.vue
+++ b/src/pages/mediation-page/components/contactPerson.vue
@@ -2,7 +2,7 @@
   <div>
     <div class="mb-16 flex-row justify-content-between">
       <span class="f-weight500 f18">联系人信息</span>
-      <span class="cursor-pointer color-274ea4" @click="handleContactAdd">
+      <span class="cursor-pointer color-274ea4" v-if="personnelTypeActive !== '申请人'" @click="handleContactAdd">
         <i class="el-icon-plus"></i> 添加联系人
       </span>
     </div>
@@ -11,44 +11,44 @@
       <span class="contact-person-type"
             v-for="(item, index) in personnelType" :key="index"
             :class="{'contact-person-active' : item === personnelTypeActive}"
-            @click="personnelTypeActive = item">{{item}}</span>
+            @click="handleTab(item)">{{item}}</span>
     </div>
-    <el-card class="mb-16">
+<!--    <el-card class="mb-16">-->
+<!--      <div class="personnel-list">-->
+<!--        <div class="flex-row justify-content-between">-->
+<!--          <div class="personnel-surname">李</div>-->
+<!--          <div class="personnel-info">-->
+<!--            <div class="f16"><span class="f20 f-weight600">李四</span> 18336524833</div>-->
+<!--            <div class="case-lable">-->
+<!--              <a class="case-status0">本人</a>-->
+<!--              <a class="case-status1">空号</a>-->
+<!--            </div>-->
+<!--          </div>-->
+<!--          <div class="flex-row personnel-btn">-->
+<!--            <a class="cursor-pointer" @click="handleEdit">编辑</a>-->
+<!--            <a class="cursor-pointer ml-8" @click="handleDelete">删除</a>-->
+<!--          </div>-->
+<!--        </div>-->
+<!--        <div class="color-86909C mt-8 ml-8 f16">-->
+<!--          <a class="mr-24 cursor-pointer"><i class="el-icon-phone"></i> 电话</a>-->
+<!--          <a class="ml-8 cursor-pointer"><i class="el-icon-message"></i> 短信</a>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--    </el-card>-->
+    <el-card class="mb-16" v-for="(item, index) in tableData" :key="index">
       <div class="personnel-list">
         <div class="flex-row justify-content-between">
-          <div class="personnel-surname">李</div>
-          <div class="personnel-info">
-            <div class="f16"><span class="f20 f-weight600">李四</span> 18336524833</div>
+          <div class="personnel-surname">{{item.surname}}</div>
+          <div class="personnel-info pt-6">
+            <div class="f16"><span class="f20 f-weight600">{{item.name}}</span> {{item.phone}}</div>
             <div class="case-lable">
-              <a class="case-status0">本人</a>
-              <a class="case-status1">空号</a>
+              <a class="case-status0">{{item.type}}</a>
+<!--              <a class="case-status1">空号</a>-->
             </div>
           </div>
           <div class="flex-row personnel-btn">
-            <a class="cursor-pointer" @click="handleEdit">编辑</a>
-            <a class="cursor-pointer ml-8" @click="handleDelete">删除</a>
-          </div>
-        </div>
-        <div class="color-86909C mt-8 ml-8 f16">
-          <a class="mr-24 cursor-pointer"><i class="el-icon-phone"></i> 电话</a>
-          <a class="ml-8 cursor-pointer"><i class="el-icon-message"></i> 短信</a>
-        </div>
-      </div>
-    </el-card>
-    <el-card class="mb-16">
-      <div class="personnel-list">
-        <div class="flex-row justify-content-between">
-          <div class="personnel-surname">李</div>
-          <div class="personnel-info">
-            <div class="f16"><span class="f20 f-weight600">李四</span> 18336524833</div>
-            <div class="case-lable">
-              <a class="case-status0">本人</a>
-              <a class="case-status1">空号</a>
-            </div>
-          </div>
-          <div class="flex-row personnel-btn">
-            <a class="cursor-pointer">编辑</a>
-            <a class="cursor-pointer ml-8">删除</a>
+            <a class="cursor-pointer" v-if="personnelTypeActive !== '申请人'" @click="handleEdit(item)">编辑</a>
+            <a class="cursor-pointer ml-8" v-if="personnelTypeActive !== '申请人'" @click="handleDelete(item)">删除</a>
           </div>
         </div>
         <div class="color-86909C mt-8 ml-8 f16">
@@ -63,6 +63,7 @@
 </template>
 
 <script>
+import contactPerson from "@/services/contactPerson";
 export default {
   components: {
     contactPersonDialog: () => import('./contactPersonDialog.vue'),//联系人弹窗
@@ -85,20 +86,41 @@ export default {
       total: 0
     }
   },
+  mounted() {
+    this.handleTab('申请人')
+  },
   methods: {
+    handleTab(item) {
+      this.personnelTypeActive = item;
+      this.getList();
+    },
     // 列表数据
     getList() {
-      // let dataJson = {
-      //   size: 9999,
-      //   current: 1,
-      //   caseId: this.caseId
-      // }
-      // caseMaterial.getCaseFileList(dataJson).then(res => {
-      //   if (!res.code) {
-      //     this.tableData = res.records;
-      //     this.total = res.total;
-      //   }
-      // })
+      let dataJson = {
+        size: 9999,
+        current: 1,
+        caseId: this.caseId
+      }
+      let apiUrl = '';
+      if (this.personnelTypeActive === '申请人'){
+        apiUrl = contactPerson.creditorPage;
+      }else if (this.personnelTypeActive === '被申请人'){
+        apiUrl = contactPerson.debtorPage;
+      }else {
+        apiUrl = contactPerson.agentPage;
+      }
+      apiUrl(dataJson).then(res => {
+        if (!res.code) {
+          this.tableData = res.records.map((item) => {
+            let surname = item.name.split('')[0];
+            return {
+              ...item,
+              surname: surname
+            }
+          });
+          this.total = res.total;
+        }
+      })
     },
     handleContactAdd() {
       if (this.personnelTypeActive === '申请人'){
@@ -106,17 +128,19 @@ export default {
       }else {
         this.contactAddObj = {
           caseId: this.caseId,
-          personId: '',
-          type: this.personnelTypeActive
+          personId: null,
+          rowData: null,
+          personnelType: this.personnelTypeActive
         }
       }
     },
     handleEdit(item) {
-      // this.contactAddObj = {
-      //   caseId: this.caseId,
-      //   personId: item.id,
-      //   type: this.personnelTypeActive
-      // }
+      this.contactAddObj = {
+        caseId: this.caseId,
+        personId: item.id,
+        rowData: item,
+        personnelType: this.personnelTypeActive
+      }
     },
     handleDelete(item) {
       this.$confirm("确定删除?", "提示", {
@@ -125,10 +149,10 @@ export default {
         type: "warning",
       }).then(() => {
         if(!this.$clickThrottle()) { return }//防止重复点击
-        // basicManage.deleteDictById({ id: scope.row.id }).then((res) => {
-        //   this.$message.success("成功");
-        //   this.getDictList(1)
-        // });
+        contactPerson.contactPersonDelete(item.id).then((res) => {
+          this.$message.success("成功");
+          this.getList()
+        });
       }).catch(() => {});
     },
     makeCall(item) {},
@@ -166,10 +190,10 @@ export default {
     background-color: rgb(188, 111, 96);
     font-size: 32px;
     text-align: center;
-    line-height: 70px;
+    line-height: 66px;
   }
   .personnel-info{
-    width: 50%;
+    width: 55%;
     .case-lable{
       margin-top: 12px;
       .case-status0{
@@ -178,8 +202,11 @@ export default {
     }
   }
   .personnel-btn{
-    line-height: 26px;
+    //line-height: 70px;
     font-size: 15px;
+    width: 70px;
+    height: 70px;
+    padding-top: 10px;
   }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/mediation-page/components/contactPersonDialog.vue b/src/pages/mediation-page/components/contactPersonDialog.vue
index fc99ded..e770b4d 100644
--- a/src/pages/mediation-page/components/contactPersonDialog.vue
+++ b/src/pages/mediation-page/components/contactPersonDialog.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-dialog title="联系人" :visible="true" width="800px" append-to-body :close-on-click-modal="false"
+    <el-dialog :title="diglogType" :visible="true" width="800px" append-to-body :close-on-click-modal="false"
                @close="handleClose">
       <div class="dialog-content dialog-office-batch">
         <div class="p-16 pr-40" v-if="diglogType === '被申请人'">
@@ -19,8 +19,8 @@
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="与债务人关系:" prop="relation">
-                  <el-select v-model="respondentObj.relation" placeholder="请选择" class="width100">
+                <el-form-item label="与债务人关系:" prop="type">
+                  <el-select v-model="respondentObj.type" placeholder="请选择" class="width100">
                     <el-option
                         v-for="(item,index) in relationOptions"
                         :key="index"
@@ -34,7 +34,8 @@
                 <el-form-item label="电话:" prop="phone">
                   <el-input
                       v-model.trim="respondentObj.phone"
-                      placeholder="请输入" maxlength="20"
+                      placeholder="请输入"
+                      :maxlength="11"
                       clearable
                   ></el-input>
                 </el-form-item>
@@ -48,18 +49,18 @@
                    :rules="rulesRespondent"
                    label-width="110px">
             <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="代理权限:" prop="authority">
-                  <el-select v-model="agentObj.authority" placeholder="请选择" class="width100">
-                    <el-option
-                        v-for="(item,index) in authorityOptions"
-                        :key="index"
-                        :label="item.label"
-                        :value="item.value">
-                    </el-option>
-                  </el-select>
-                </el-form-item>
-              </el-col>
+<!--              <el-col :span="12">-->
+<!--                <el-form-item label="代理权限:" prop="authority">-->
+<!--                  <el-select v-model="agentObj.authority" placeholder="请选择" class="width100">-->
+<!--                    <el-option-->
+<!--                        v-for="(item,index) in authorityOptions"-->
+<!--                        :key="index"-->
+<!--                        :label="item.label"-->
+<!--                        :value="item.value">-->
+<!--                    </el-option>-->
+<!--                  </el-select>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
               <el-col :span="12">
                 <el-form-item label="姓名:" prop="name">
                   <el-input
@@ -70,10 +71,11 @@
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="身份证号:" prop="identityCard">
+                <el-form-item label="身份证号:" prop="cardNo">
                   <el-input
-                      v-model.trim="agentObj.identityCard"
-                      placeholder="请输入" maxlength="18"
+                      v-model.trim="agentObj.cardNo"
+                      placeholder="请输入"
+                      :maxlength="18"
                       clearable
                   ></el-input>
                 </el-form-item>
@@ -82,41 +84,42 @@
                 <el-form-item label="电话:" prop="phone">
                   <el-input
                       v-model.trim="agentObj.phone"
-                      placeholder="请输入" maxlength="11"
+                      placeholder="请输入"
+                      :maxlength="11"
                       clearable
                   ></el-input>
                 </el-form-item>
               </el-col>
+<!--              <el-col :span="12">-->
+<!--                <el-form-item label="单位电话:" prop="workPhone">-->
+<!--                  <el-input-->
+<!--                      v-model.trim="agentObj.workPhone"-->
+<!--                      placeholder="请输入" maxlength="11"-->
+<!--                      clearable-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
               <el-col :span="12">
-                <el-form-item label="单位电话:" prop="workPhone">
+                <el-form-item label="邮箱:" prop="mail">
                   <el-input
-                      v-model.trim="agentObj.workPhone"
-                      placeholder="请输入" maxlength="11"
-                      clearable
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="邮箱:" prop="email">
-                  <el-input
-                      v-model.trim="agentObj.email"
+                      v-model.trim="agentObj.mail"
                       placeholder="请输入"
                       clearable
                   ></el-input>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="地址:" prop="address">
+                <el-form-item label="地址:" prop="addr">
                   <el-input
-                      v-model.trim="agentObj.address"
+                      v-model.trim="agentObj.addr"
                       placeholder="请输入"
                       clearable
                   ></el-input>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="代理人类型:" prop="agentType">
-                  <el-select v-model="agentObj.agentType" placeholder="请选择" class="width100">
+                <el-form-item label="代理人类型:" prop="type">
+                  <el-select v-model="agentObj.type" placeholder="请选择" class="width100">
                     <el-option
                         v-for="(item,index) in agentTypeOptions"
                         :key="index"
@@ -139,7 +142,7 @@
   </div>
 </template>
 <script>
-import caseMaterial from "@/services/caseMaterial";
+import contactPerson from "@/services/contactPerson";
 export default {
   props: {
     eventDialog: {
@@ -166,35 +169,36 @@ export default {
       respondentObj: {
         caseId: '',
         name: '',
-        relation: '',
+        type: '',
         phone: '',
       },
 
-      authorityOptions: [
-        {label: '一般代理', value: 1}
-      ],
+      // authorityOptions: [
+      //   {label: '一般代理', value: 1}
+      // ],
       agentTypeOptions: [
-        {label: '执业律师', value: 1},
-        {label: '基层法律服务工作者', value: 2},
-        {label: '当事人的近亲属或工作人员', value: 3},
-        {label: '当事人所在社区，单位以及有关社会团体推荐的公民', value: 4},
-        {label: '经赔委员会许可的其他公民', value: 5}
+        {label: '执业律师', value: '执业律师'},
+        {label: '基层法律服务工作者', value: '基层法律服务工作者'},
+        {label: '当事人的近亲属或工作人员', value: '当事人的近亲属或工作人员'},
+        {label: '当事人所在社区，单位以及有关社会团体推荐的公民', value: '当事人所在社区，单位以及有关社会团体推荐的公民'},
+        {label: '经赔委员会许可的其他公民', value: '经赔委员会许可的其他公民'}
       ],
       agentObj: {
-        authority: '',
+        caseId: '',
+        // authority: '',
         name: '',
-        identityCard: '',
+        cardNo: '',
         phone: '',
-        workPhone: '',
-        email: '',
-        address: '',
-        agentType: '',
+        // workPhone: '',
+        mail: '',
+        addr: '',
+        type: '',
       },
       rulesRespondent: {
         name: [
           {required: true, message: '请输入', trigger: ['blur', 'change'],},
         ],
-        relation: [
+        type: [
           {required: true, message: '请选择', trigger: 'change',},
         ],
         phone: [
@@ -202,21 +206,39 @@ export default {
           { 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']}
         ],
 
-        authority: [
-          {required: true, message: '请选择', trigger: 'change',},
-        ],
-        identityCard: [
+        // authority: [
+        //   {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: false, message: '请输入邮箱地址', trigger: 'blur' },
+          { pattern: /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/, message: '请输入正确邮箱地址', trigger: ['blur', 'change']}
+        ],
       },
     };
   },
   mounted() {
     // console.log(1231)
-    this.diglogType = this.eventDialog?.type;
+    this.initDetails();
   },
   methods: {
+    initDetails() {
+      const { personnelType: diglogType, personId, rowData } = this.eventDialog || {};
+      this.diglogType = diglogType;
+      if (!personId) return;
+      const targetObj = diglogType === '被申请人' ? this.respondentObj :
+          diglogType === '申请人代理人' ? this.agentObj : null;
+      if (targetObj && rowData) {
+        Object.keys(targetObj).forEach(key => {
+          if (rowData.hasOwnProperty(key)) {
+            targetObj[key] = rowData[key];
+          }
+        });
+      }
+    },
     handleClose() {
       this.$emit('update:eventDialog', null)
     },
@@ -226,22 +248,38 @@ export default {
         this.$refs.ruleFormRespondent.validate((valid) => {
           if (valid) {
             this.respondentObj.caseId = this.eventDialog.caseId;
-            // caseMaterial.addCaseFile(this.respondentObj).then(res => {
-            //   this.$parent.getList()
-            //   this.handleClose()
-            //   this.$message.success("操作成功");
-            // })
+            if (this.eventDialog.personId){
+              contactPerson.contactPersonUpdate({...this.respondentObj, id: this.eventDialog.personId}).then(res => {
+                this.$parent.getList()
+                this.handleClose()
+                this.$message.success("操作成功");
+              })
+            }else {
+              contactPerson.debtorAdd(this.respondentObj).then(res => {
+                this.$parent.getList()
+                this.handleClose()
+                this.$message.success("操作成功");
+              })
+            }
           }
         })
       }else {
         this.$refs.ruleFormAgent.validate((valid) => {
           if (valid) {
-            this.respondentObj.caseId = this.eventDialog.caseId;
-            // caseMaterial.addCaseFile(this.respondentObj).then(res => {
-            //   this.$parent.getList()
-            //   this.handleClose()
-            //   this.$message.success("操作成功");
-            // })
+            this.agentObj.caseId = this.eventDialog.caseId;
+            if (this.eventDialog.personId){
+              contactPerson.contactPersonUpdate({...this.agentObj, id: this.eventDialog.personId}).then(res => {
+                this.$parent.getList()
+                this.handleClose()
+                this.$message.success("操作成功");
+              })
+            }else {
+              contactPerson.agentAdd(this.agentObj).then(res => {
+                this.$parent.getList()
+                this.handleClose()
+                this.$message.success("操作成功");
+              })
+            }
           }
         })
       }
diff --git a/src/services/contactPerson.js b/src/services/contactPerson.js
new file mode 100644
index 0000000..1df5ac0
--- /dev/null
+++ b/src/services/contactPerson.js
@@ -0,0 +1,39 @@
+import service from "./index";
+const api = '/mediate/cases/litigant/'
+// contactPerson
+const apiContactPerson = {
+    // 当事人
+    getLitigantByCaseId: data => {
+        return service.service.get(`${api}getLitigantByCaseId?id=${data}`)
+    },
+    // 删除
+    contactPersonDelete: data => {
+        return service.service.post(`${api}deleteById?id=${data}`)
+    },
+    // 编辑
+    contactPersonUpdate: data => {
+        return service.service.post(`${api}updateById`, data)
+    },
+    // 申请人-债券人
+    creditorPage: data => {
+        return service.service.post(`${api}creditor/page`, data)
+    },
+    creditorAdd: data => {
+        return service.service.post(`${api}creditor/add`, data)
+    },
+    // 被申请人-债务人
+    debtorPage: data => {
+        return service.service.post(`${api}debtor/page`, data)
+    },
+    debtorAdd: data => {
+        return service.service.post(`${api}debtor/add`, data)
+    },
+    // 代理人
+    agentPage: data => {
+        return service.service.post(`${api}agent/page`, data)
+    },
+    agentAdd: data => {
+        return service.service.post(`${api}agent/add`, data)
+    },
+}
+export default apiContactPerson;
\ No newline at end of file