From 0cb4cdd854525bb16a0c070873300c78d29eac87 Mon Sep 17 00:00:00 2001
From: tdg930622 <51816549+tdg930622@users.noreply.github.com>
Date: Fri, 27 Dec 2024 09:41:38 +0800
Subject: [PATCH] =?UTF-8?q?=E8=81=94=E7=B3=BB=E4=BA=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/style/common.scss                  |   3 +
 .../components/LayoutContent.vue              | 219 ++++++++-------
 .../components/contactPerson.vue              | 185 +++++++++++++
 .../components/contactPersonDialog.vue        | 255 ++++++++++++++++++
 4 files changed, 566 insertions(+), 96 deletions(-)
 create mode 100644 src/pages/mediation-page/components/contactPerson.vue
 create mode 100644 src/pages/mediation-page/components/contactPersonDialog.vue

diff --git a/src/assets/style/common.scss b/src/assets/style/common.scss
index 045c905..3a0bbd9 100644
--- a/src/assets/style/common.scss
+++ b/src/assets/style/common.scss
@@ -111,6 +111,9 @@ html{
 .color-274ea4{
     color: #274ea4;
 }
+.color-274ea4{
+  color: rgb(188, 111, 96);
+}
 
 .color-text-primary{
     color: $color-text-primary;
diff --git a/src/pages/mediation-page/components/LayoutContent.vue b/src/pages/mediation-page/components/LayoutContent.vue
index df165dc..e48b6b0 100644
--- a/src/pages/mediation-page/components/LayoutContent.vue
+++ b/src/pages/mediation-page/components/LayoutContent.vue
@@ -33,27 +33,52 @@
                             <img src="../../../assets/image/mediate/m-info-robot.png"/>
                         </span>
             <span class="separation"></span>
-            <span class="left-img-info flex-column" :class="leftActive == 1 ?'active':''" @mouseenter="leftActive = 1">
+<!--            <span class="left-img-info flex-column" :class="leftActive == 1 ?'active':''" @mouseenter="leftActive = 1">-->
+<!--                            <img src="../../../assets/image/mediate/m-info1.png"/>-->
+<!--                            <a>案件信息</a>-->
+<!--                        </span>-->
+<!--            <span class="left-img-info flex-column" :class="leftActive == 2 ?'active':''" @mouseenter="leftActive = 2">-->
+<!--                            <img src="../../../assets/image/mediate/m-info2.png"/>-->
+<!--                            <a>联系人</a>-->
+<!--                        </span>-->
+<!--            <span class="left-img-info flex-column" :class="leftActive == 3 ?'active':''" @mouseenter="leftActive = 3">-->
+<!--                            <img src="../../../assets/image/mediate/m-info3.png"/>-->
+<!--                            <a>案件材料</a>-->
+<!--                        </span>-->
+<!--            <span class="left-img-info flex-column" :class="leftActive == 4 ?'active':''" @mouseenter="leftActive = 4">-->
+<!--                            <img src="../../../assets/image/mediate/m-info4.png"/>-->
+<!--                            <a>案件文书</a>-->
+<!--                        </span>-->
+<!--            <span class="left-img-info flex-column" :class="leftActive == 5 ?'active':''" @mouseenter="leftActive = 5">-->
+<!--                            <img src="../../../assets/image/mediate/m-info5.png"/>-->
+<!--                            <a>还款计划</a>-->
+<!--                        </span>-->
+<!--            <span class="left-img-info flex-column" :class="leftActive == 6 ?'active':''" @mouseenter="leftActive = 6">-->
+<!--                            <img src="../../../assets/image/mediate/m-info6.png"/>-->
+<!--                            <a>还款凭证</a>-->
+<!--                        </span>-->
+
+            <span class="left-img-info flex-column" :class="leftActive == 1 ?'active':''" @click="leftActive = 1">
                             <img src="../../../assets/image/mediate/m-info1.png"/>
                             <a>案件信息</a>
                         </span>
-            <span class="left-img-info flex-column" :class="leftActive == 2 ?'active':''" @mouseenter="leftActive = 2">
+            <span class="left-img-info flex-column" :class="leftActive == 2 ?'active':''" @click="leftActive = 2">
                             <img src="../../../assets/image/mediate/m-info2.png"/>
                             <a>联系人</a>
                         </span>
-            <span class="left-img-info flex-column" :class="leftActive == 3 ?'active':''" @mouseenter="leftActive = 3">
+            <span class="left-img-info flex-column" :class="leftActive == 3 ?'active':''" @click="leftActive = 3">
                             <img src="../../../assets/image/mediate/m-info3.png"/>
                             <a>案件材料</a>
                         </span>
-            <span class="left-img-info flex-column" :class="leftActive == 4 ?'active':''" @mouseenter="leftActive = 4">
+            <span class="left-img-info flex-column" :class="leftActive == 4 ?'active':''" @click="leftActive = 4">
                             <img src="../../../assets/image/mediate/m-info4.png"/>
                             <a>案件文书</a>
                         </span>
-            <span class="left-img-info flex-column" :class="leftActive == 5 ?'active':''" @mouseenter="leftActive = 5">
+            <span class="left-img-info flex-column" :class="leftActive == 5 ?'active':''" @click="leftActive = 5">
                             <img src="../../../assets/image/mediate/m-info5.png"/>
                             <a>还款计划</a>
                         </span>
-            <span class="left-img-info flex-column" :class="leftActive == 6 ?'active':''" @mouseenter="leftActive = 6">
+            <span class="left-img-info flex-column" :class="leftActive == 6 ?'active':''" @click="leftActive = 6">
                             <img src="../../../assets/image/mediate/m-info6.png"/>
                             <a>还款凭证</a>
                         </span>
@@ -118,97 +143,98 @@
 
               <!-- 联系人信息 --> 
               <div v-if="leftActive == 2" class="case-contact-person">
-                <div class="mb-16 flex-row justify-content-between">
-                  <span class="f-weight500 f18">联系人信息</span>
-                  <span class="cursor-pointer" @click="contactAddFlag = true"><i
-                      class="el-icon-plus"></i> 添加联系人</span>
-                </div>
-                <div class="mb-16 flex-row justify-content-between">
-                  <span class="f14 contact-person-type">被申请人</span>
-                  <span class="f14 contact-person-type">申请人</span>
-                  <span class="f14 contact-person-type">申请人代理人</span>
-                </div>
-                <div v-if="contactAddFlag" class="case-detail-des flex-column mb-16">
-                  <div class="flex-row justify-content-between">
-                    <div class="flex-row mb-8">
-                      <a class="f16" style="width: 130px;">
-                        <el-input v-model.trim="contactAddObj.Name"
-                                  clearable placeholder="请输入姓名" size="small">
-                        </el-input>
-                      </a>
-                      <a style="width: 140px;margin-left: 5px">
-                        <el-select v-model="contactAddObj.relation"
-                                   placeholder="与债务人关系" size="small"
-                                   class="width100">
-                          <el-option
-                              v-for="(item,index) in relationOptions"
-                              :key="index"
-                              :label="item.label"
-                              :value="item.value">
-                          </el-option>
-                        </el-select>
-                      </a>
-                    </div>
-                    <div class="flex-row">
-                      <a class="cursor-pointer pt-6">添加</a>
-                      <a class="cursor-pointer ml-8 pt-6" @click="contactAddFlag = false;contactAddObj = {}">取消</a>
-                    </div>
-                  </div>
-                  <div class="flex-row">
-                    <a style="width: 180px;">
-                      <el-input v-model.trim="contactAddObj.Phone" size="small"
-                                clearable placeholder="请输入手机号码" maxlength="11">
-                      </el-input>
-                    </a>
-                  </div>
-                </div>
+                <contactPerson :caseId="caseId" />
+<!--                <div class="mb-16 flex-row justify-content-between">-->
+<!--                  <span class="f-weight500 f18">联系人信息</span>-->
+<!--                  <span class="cursor-pointer" @click="contactAddFlag = true"><i-->
+<!--                      class="el-icon-plus"></i> 添加联系人</span>-->
+<!--                </div>-->
+<!--                <div class="mb-16 flex-row justify-content-between">-->
+<!--                  <span class="f14 contact-person-type">被申请人</span>-->
+<!--                  <span class="f14 contact-person-type">申请人</span>-->
+<!--                  <span class="f14 contact-person-type">申请人代理人</span>-->
+<!--                </div>-->
+<!--                <div v-if="contactAddFlag" class="case-detail-des flex-column mb-16">-->
+<!--                  <div class="flex-row justify-content-between">-->
+<!--                    <div class="flex-row mb-8">-->
+<!--                      <a class="f16" style="width: 130px;">-->
+<!--                        <el-input v-model.trim="contactAddObj.Name"-->
+<!--                                  clearable placeholder="请输入姓名" size="small">-->
+<!--                        </el-input>-->
+<!--                      </a>-->
+<!--                      <a style="width: 140px;margin-left: 5px">-->
+<!--                        <el-select v-model="contactAddObj.relation"-->
+<!--                                   placeholder="与债务人关系" size="small"-->
+<!--                                   class="width100">-->
+<!--                          <el-option-->
+<!--                              v-for="(item,index) in relationOptions"-->
+<!--                              :key="index"-->
+<!--                              :label="item.label"-->
+<!--                              :value="item.value">-->
+<!--                          </el-option>-->
+<!--                        </el-select>-->
+<!--                      </a>-->
+<!--                    </div>-->
+<!--                    <div class="flex-row">-->
+<!--                      <a class="cursor-pointer pt-6">添加</a>-->
+<!--                      <a class="cursor-pointer ml-8 pt-6" @click="contactAddFlag = false;contactAddObj = {}">取消</a>-->
+<!--                    </div>-->
+<!--                  </div>-->
+<!--                  <div class="flex-row">-->
+<!--                    <a style="width: 180px;">-->
+<!--                      <el-input v-model.trim="contactAddObj.Phone" size="small"-->
+<!--                                clearable placeholder="请输入手机号码" maxlength="11">-->
+<!--                      </el-input>-->
+<!--                    </a>-->
+<!--                  </div>-->
+<!--                </div>-->
 
-                <div class="case-detail-des flex-column mb-16">
-                  <div class="flex-row justify-content-between">
-                    <div v-if="!contactUpdate" class="flex-row mb-8">
-                      <a class="f16">张三</a>
-                      <div class="case-lable">
-                        <a class="case-status0">本人</a>
-                        <a class="case-status1">空号</a>
-                      </div>
-                    </div>
-                    <div v-if="contactUpdate" class="flex-row mb-8">
-                      <a class="f16" style="width: 130px;">
-                        <el-input v-model.trim="contactObj.Name"
-                                  clearable placeholder="请输入姓名" size="small">
-                        </el-input>
-                      </a>
-                      <a style="width: 140px;margin-left: 5px">
-                        <el-select v-model="contactObj.relation"
-                                   placeholder="请选择与债务人关系" size="small"
-                                   class="width100">
-                          <el-option
-                              v-for="(item,index) in relationOptions"
-                              :key="index"
-                              :label="item.label"
-                              :value="item.value">
-                          </el-option>
-                        </el-select>
-                      </a>
-                    </div>
-                    <div class="flex-row">
-                      <a v-if="contactUpdate" class="cursor-pointer pt-6">保存</a>
-                      <a v-if="contactUpdate" @click="contactUpdate = false" class="cursor-pointer ml-8 pt-6">取消</a>
-                      <a v-if="!contactUpdate" @click="contactUpdate = true" class="cursor-pointer">编辑</a>
-                      <a v-if="!contactUpdate" class="cursor-pointer ml-8">删除</a>
-                    </div>
-                  </div>
-                  <div v-if="!contactUpdate">
-                    <a>手机号码:</a><a class="ml-8">13333333333</a>
-                  </div>
-                  <div v-if="contactUpdate" class="flex-row">
-                    <a style="width: 180px;">
-                      <el-input v-model.trim="contactObj.Phone" size="small"
-                                clearable placeholder="请输入手机号码" maxlength="11">
-                      </el-input>
-                    </a>
-                  </div>
-                </div>
+<!--                <div class="case-detail-des flex-column mb-16">-->
+<!--                  <div class="flex-row justify-content-between">-->
+<!--                    <div v-if="!contactUpdate" class="flex-row mb-8">-->
+<!--                      <a class="f16">张三</a>-->
+<!--                      <div class="case-lable">-->
+<!--                        <a class="case-status0">本人</a>-->
+<!--                        <a class="case-status1">空号</a>-->
+<!--                      </div>-->
+<!--                    </div>-->
+<!--                    <div v-if="contactUpdate" class="flex-row mb-8">-->
+<!--                      <a class="f16" style="width: 130px;">-->
+<!--                        <el-input v-model.trim="contactObj.Name"-->
+<!--                                  clearable placeholder="请输入姓名" size="small">-->
+<!--                        </el-input>-->
+<!--                      </a>-->
+<!--                      <a style="width: 140px;margin-left: 5px">-->
+<!--                        <el-select v-model="contactObj.relation"-->
+<!--                                   placeholder="请选择与债务人关系" size="small"-->
+<!--                                   class="width100">-->
+<!--                          <el-option-->
+<!--                              v-for="(item,index) in relationOptions"-->
+<!--                              :key="index"-->
+<!--                              :label="item.label"-->
+<!--                              :value="item.value">-->
+<!--                          </el-option>-->
+<!--                        </el-select>-->
+<!--                      </a>-->
+<!--                    </div>-->
+<!--                    <div class="flex-row">-->
+<!--                      <a v-if="contactUpdate" class="cursor-pointer pt-6">保存</a>-->
+<!--                      <a v-if="contactUpdate" @click="contactUpdate = false" class="cursor-pointer ml-8 pt-6">取消</a>-->
+<!--                      <a v-if="!contactUpdate" @click="contactUpdate = true" class="cursor-pointer">编辑</a>-->
+<!--                      <a v-if="!contactUpdate" class="cursor-pointer ml-8">删除</a>-->
+<!--                    </div>-->
+<!--                  </div>-->
+<!--                  <div v-if="!contactUpdate">-->
+<!--                    <a>手机号码:</a><a class="ml-8">13333333333</a>-->
+<!--                  </div>-->
+<!--                  <div v-if="contactUpdate" class="flex-row">-->
+<!--                    <a style="width: 180px;">-->
+<!--                      <el-input v-model.trim="contactObj.Phone" size="small"-->
+<!--                                clearable placeholder="请输入手机号码" maxlength="11">-->
+<!--                      </el-input>-->
+<!--                    </a>-->
+<!--                  </div>-->
+<!--                </div>-->
               </div>
 
               <!-- 案件材料 -->
@@ -413,6 +439,7 @@ export default {
     VideoReservationDialog: () => import('./VideoReservationDialog'),//视频预约
     caseMaterial: () => import('./caseMaterial'),//
     caseMaterialLeft: () => import('./caseMaterialLeft'),//案件材料左
+    contactPerson: () => import('./contactPerson'),//联系人左
   },
   data() {
     return {
diff --git a/src/pages/mediation-page/components/contactPerson.vue b/src/pages/mediation-page/components/contactPerson.vue
new file mode 100644
index 0000000..2d9f558
--- /dev/null
+++ b/src/pages/mediation-page/components/contactPerson.vue
@@ -0,0 +1,185 @@
+<template>
+  <div>
+    <div class="mb-16 flex-row justify-content-between">
+      <span class="f-weight500 f18">联系人信息</span>
+      <span class="cursor-pointer color-274ea4" @click="handleContactAdd">
+        <i class="el-icon-plus"></i> 添加联系人
+      </span>
+    </div>
+
+    <div class="mb-16 f14 flex-row">
+      <span class="contact-person-type"
+            v-for="(item, index) in personnelType" :key="index"
+            :class="{'contact-person-active' : item === personnelTypeActive}"
+            @click="personnelTypeActive = item">{{item}}</span>
+    </div>
+    <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">
+      <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>
+          </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>
+
+    <contactPersonDialog v-if="contactAddObj" :eventDialog.sync="contactAddObj" />
+  </div>
+</template>
+
+<script>
+export default {
+  components: {
+    contactPersonDialog: () => import('./contactPersonDialog.vue'),//联系人弹窗
+  },
+  props: {
+    caseId: {
+      type: String,
+      default: () => {
+        return ''
+      },
+    },
+  },
+  data() {
+    return {
+      personnelType: ['申请人', '被申请人' , '申请人代理人'],
+      personnelTypeActive: '申请人',
+      // 联系人
+      contactAddObj: null,
+      tableData: [],
+      total: 0
+    }
+  },
+  methods: {
+    // 列表数据
+    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;
+      //   }
+      // })
+    },
+    handleContactAdd() {
+      if (this.personnelTypeActive === '申请人'){
+        this.$message.warning('无法添加申请人！')
+      }else {
+        this.contactAddObj = {
+          caseId: this.caseId,
+          personId: '',
+          type: this.personnelTypeActive
+        }
+      }
+    },
+    handleEdit(item) {
+      // this.contactAddObj = {
+      //   caseId: this.caseId,
+      //   personId: item.id,
+      //   type: this.personnelTypeActive
+      // }
+    },
+    handleDelete(item) {
+      this.$confirm("确定删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        if(!this.$clickThrottle()) { return }//防止重复点击
+        // basicManage.deleteDictById({ id: scope.row.id }).then((res) => {
+        //   this.$message.success("成功");
+        //   this.getDictList(1)
+        // });
+      }).catch(() => {});
+    },
+    makeCall(item) {},
+    sendMessages(item) {}
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.contact-person-active{
+  background-color: #F2F3F5;
+  color: rgb(188, 111, 96);
+}
+.contact-person-type{
+  padding:8px 15px;
+  border-radius: 25px;
+  margin-right: 10px;
+  cursor: pointer;
+}
+.personnel-list{
+  .ml-0{
+    margin-left: 0;
+  }
+  .el-icon-phone{
+    color: #2F6AF5;
+  }
+  .el-icon-message{
+    color: rgb(240, 180, 113);
+  }
+  .personnel-surname{
+    width: 70px;
+    height: 70px;
+    border-radius: 35px;
+    color: #FFFFFF;
+    background-color: rgb(188, 111, 96);
+    font-size: 32px;
+    text-align: center;
+    line-height: 70px;
+  }
+  .personnel-info{
+    width: 50%;
+    .case-lable{
+      margin-top: 12px;
+      .case-status0{
+        margin-left: 0;
+      }
+    }
+  }
+  .personnel-btn{
+    line-height: 26px;
+    font-size: 15px;
+  }
+}
+</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
new file mode 100644
index 0000000..fc99ded
--- /dev/null
+++ b/src/pages/mediation-page/components/contactPersonDialog.vue
@@ -0,0 +1,255 @@
+<template>
+  <div>
+    <el-dialog title="联系人" :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 === '被申请人'">
+          <el-form ref="ruleFormRespondent"
+                   :model="respondentObj"
+                   :rules="rulesRespondent"
+                   label-width="110px">
+            <el-row :gutter="20">
+              <el-col :span="12">
+                <el-form-item label="姓名:" prop="name">
+                  <el-input
+                      v-model.trim="respondentObj.name"
+                      placeholder="请输入" maxlength="20"
+                      clearable
+                  ></el-input>
+                </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-option
+                        v-for="(item,index) in relationOptions"
+                        :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="phone">
+                  <el-input
+                      v-model.trim="respondentObj.phone"
+                      placeholder="请输入" maxlength="20"
+                      clearable
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+        <div class="p-16 pr-40" v-else>
+          <el-form ref="ruleFormAgent"
+                   :model="agentObj"
+                   :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="name">
+                  <el-input
+                      v-model.trim="agentObj.name"
+                      placeholder="请输入" maxlength="20"
+                      clearable
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="身份证号:" prop="identityCard">
+                  <el-input
+                      v-model.trim="agentObj.identityCard"
+                      placeholder="请输入" maxlength="18"
+                      clearable
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="电话:" prop="phone">
+                  <el-input
+                      v-model.trim="agentObj.phone"
+                      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="email">
+                  <el-input
+                      v-model.trim="agentObj.email"
+                      placeholder="请输入"
+                      clearable
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="地址:" prop="address">
+                  <el-input
+                      v-model.trim="agentObj.address"
+                      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-option
+                        v-for="(item,index) in agentTypeOptions"
+                        :key="index"
+                        :label="item.label"
+                        :value="item.value">
+                    </el-option>
+                  </el-select>
+                </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 caseMaterial from "@/services/caseMaterial";
+export default {
+  props: {
+    eventDialog: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  data() {
+    return {
+      diglogType: '',
+      relationOptions: [
+        {label: '本人', value: '本人'},
+        {label: '父母', value: '父母'},
+        {label: '配偶', value: '配偶'},
+        {label: '子女', value: '子女'},
+        {label: '其他', value: '其他'},
+        {label: '朋友', value: '朋友'},
+        {label: '兄弟', value: '兄弟'},
+        {label: '同事', value: '同事'},
+        {label: '同学', value: '同学'}
+      ],
+      respondentObj: {
+        caseId: '',
+        name: '',
+        relation: '',
+        phone: '',
+      },
+
+      authorityOptions: [
+        {label: '一般代理', value: 1}
+      ],
+      agentTypeOptions: [
+        {label: '执业律师', value: 1},
+        {label: '基层法律服务工作者', value: 2},
+        {label: '当事人的近亲属或工作人员', value: 3},
+        {label: '当事人所在社区，单位以及有关社会团体推荐的公民', value: 4},
+        {label: '经赔委员会许可的其他公民', value: 5}
+      ],
+      agentObj: {
+        authority: '',
+        name: '',
+        identityCard: '',
+        phone: '',
+        workPhone: '',
+        email: '',
+        address: '',
+        agentType: '',
+      },
+      rulesRespondent: {
+        name: [
+          {required: true, message: '请输入', trigger: ['blur', 'change'],},
+        ],
+        relation: [
+          {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']}
+        ],
+
+        authority: [
+          {required: true, message: '请选择', trigger: 'change',},
+        ],
+        identityCard: [
+          { 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']}
+        ],
+      },
+    };
+  },
+  mounted() {
+    // console.log(1231)
+    this.diglogType = this.eventDialog?.type;
+  },
+  methods: {
+    handleClose() {
+      this.$emit('update:eventDialog', null)
+    },
+    handleSubmit() {
+      if(!this.$clickThrottle()) { return }//防止重复点击
+      if (this.diglogType === '被申请人'){
+        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("操作成功");
+            // })
+          }
+        })
+      }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("操作成功");
+            // })
+          }
+        })
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+
+</style>
\ No newline at end of file