diff --git a/src/assets/sass/vant-ui.scss b/src/assets/sass/vant-ui.scss
index 7e80e9783..f3b207762 100644
--- a/src/assets/sass/vant-ui.scss
+++ b/src/assets/sass/vant-ui.scss
@@ -75,31 +75,6 @@
     margin-right: 20px;
   }
 
-  .van-hairline--top::after {
-    border: none;
-  }
-}
-
-
-.dialog-alert {
-  // width: 255px;
-  
-  .van-dialog__header {
-    padding-top: 20px;
-    margin-bottom: 8px;
-    color: #E9332E;
-  }
-
-  .van-dialog__message {
-    font-size: 14px;
-    color: #333;
-    padding-bottom: 30px;
-  }
-
-  .van-dialog__confirm {
-    background: #E9332E;
-  }
-
   .van-hairline--top::after {
     border: none;
   }
diff --git a/src/router/ebiz/preserve.js b/src/router/ebiz/preserve.js
index 820e0d0f7..2a84514ac 100644
--- a/src/router/ebiz/preserve.js
+++ b/src/router/ebiz/preserve.js
@@ -18,6 +18,14 @@ const surrenderInfo = () => import('@/views/ebiz/preserve/ct/SurrenderInfo')
 const surrenderConfirmation = () => import('@/views/ebiz/preserve/ct/SurrenderConfirmation')
 const surrenderTip = () => import('@/views/ebiz/preserve/ct/SurrenderTip')
 
+const Progress = () => import('@/views/ebiz/preserve/Progress')
+const Contact = () => import('@/views/ebiz/preserve/detail/Contact')
+const Beneficiary = () => import('@/views/ebiz/preserve/detail/Beneficiary')
+const BeneficiaryInfoD = () => import('@/views/ebiz/preserve/detail/BeneficiaryInfo')
+const Renewal = () => import('@/views/ebiz/preserve/detail/Renewal')
+const CoolingOffperiodSurrender = () => import('@/views/ebiz/preserve/detail/CoolingOffperiodSurrender')
+const Surrender = () => import('@/views/ebiz/preserve/detail/Surrender')
+
 export default [
   {
     path: '/preserve/search',
@@ -180,5 +188,68 @@ export default [
       title: '提交结果',
       index: 13
     }
+  },
+  {
+    path: '/preserve/Progress',
+    name: 'Progress',
+    component: Progress,
+    meta: {
+      title: '保全进度查询',
+      index: 14
+    }
+  },
+  {
+    path: '/preserve/detail/Contact/:surrenderId',
+    name: 'Contact',
+    component: Contact,
+    meta: {
+      title: '联系方式变更',
+      index: 15
+    }
+  },
+  {
+    path: '/preserve/detail/Beneficiary/:surrenderId',
+    name: 'Beneficiary',
+    component: Beneficiary,
+    meta: {
+      title: '受益人',
+      index: 16
+    }
+  },
+  {
+    path: '/preserve/detail/BeneficiaryInfo/:surrenderId',
+    name: 'BeneficiaryInfoD',
+    component: BeneficiaryInfoD,
+    meta: {
+      title: '指定受益人信息',
+      index: 17
+    }
+  },
+  {
+    path: '/preserve/detail/CoolingOffperiodSurrender/:surrenderId',
+    name: 'CoolingOffperiodSurrender',
+    component: CoolingOffperiodSurrender,
+    meta: {
+      title: '犹豫期退保',
+      index: 18
+    }
+  },
+  {
+    path: '/preserve/detail/Surrender/:surrenderId',
+    name: 'Surrender',
+    component: Surrender,
+    meta: {
+      title: '退保',
+      index: 19
+    }
+  },
+  {
+    path: '/preserve/detail/Renewal/:surrenderId',
+    name: 'Renewal',
+    component: Renewal,
+    meta: {
+      title: '续期账号变更',
+      index: 20
+    }
   }
 ]
diff --git a/src/views/ebiz/preserve/Progress.vue b/src/views/ebiz/preserve/Progress.vue
new file mode 100644
index 000000000..9137220f8
--- /dev/null
+++ b/src/views/ebiz/preserve/Progress.vue
@@ -0,0 +1,363 @@
+<!-- 保全进度查询 -->
+<template>
+  <div class="progress container">
+    <van-list
+      v-model="loading"
+      :immediate-check="false"
+      :finished="finished"
+      :finished-text="finishedText"
+      error-text="请求失败，点击重新加载"
+      :error.sync="error"
+      @load="getList"
+      class="pb45"
+    >
+      <div v-if="isSuccess">
+        <div class="fs12" v-for="(item, index) in list" :key="index">
+          <div class="flex align-items-c justify-content-c h40 gray">
+            <div>{{ item.edorapplyNo | date }}</div>
+          </div>
+          <div class="bg-white pv15 pr15 pl10 ml15 mr15">
+            <div class="flex justify-content-s align-items-c">
+              <div>
+                <div class="w80 inline-b"><van-tag plain color="#DD9C56">客户</van-tag></div>
+                <span class="fs14 c-gray-dark">{{ item.customerName }}</span>
+              </div>
+            </div>
+            <div class="flex justify-content-s align-items-c pt15 pb15">
+              <div>
+                <div class="w80 inline-b"><van-tag plain color="#5ca7de">状态</van-tag></div>
+                <span class="fs14 c-gray-dark">{{ item.surrenderStatus | idToText('preserveState') }}</span>
+              </div>
+            </div>
+            <div class="pt15" style="border-top:1px solid #dadada">
+              <div>
+                <div class="w80 inline-b"><van-tag plain color="#999">保全项</van-tag></div>
+                <span class="fs14 c-gray-dark">{{ item.surrenderType | idToText('preserveTypeT') }}</span>
+              </div>
+            </div>
+            <div class="mt10 flex justify-content-fe">
+              <van-button round @click="detail(item)" size="small" class="mr5" type="danger" plain v-no-more-click="2000">查看详情</van-button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div v-else class="text-center">
+        <img class="mt40 w250" src="@/assets/images/pic_page-non.png" />
+        <div class="fs17 c-gray-dark mt40">暂无数据</div>
+      </div>
+    </van-list>
+  </div>
+</template>
+
+<script>
+import { Divider, Tag, Row, Col, Checkbox, CheckboxGroup, List } from 'vant'
+import { progressListQuery } from '@/api/ebiz/preserve/preserve'
+import dataDic from './js/data-dictionary.js'
+import dateUtils from '@/assets/js/utils/date-utils'
+export default {
+  name: 'progressInfo',
+  data() {
+    return {
+      list: [], //保全进度列表
+      loading: false,
+      finished: false,
+      pageSize: 5, //页面条数
+      pageNum: 1, //页码数
+      currentPage: 1, //当前页数
+      error: false,
+      finishedText: '没有更多了',
+      isSuccess: false,
+      dataDic: dataDic
+    }
+  },
+  filters: {
+    idToText: function(value, key) {
+      if (value !== undefined) {
+        return dataDic[key][value]
+      } else {
+        return value
+      }
+    },
+    date: function(value) {
+      let date = new Date(value)
+      if (date.toString() != 'Invalid Date') {
+        return dateUtils.formatDate(date)
+      } else {
+        return '时间格式错误'
+      }
+    }
+  },
+  components: {
+    [Divider.name]: Divider,
+    [Tag.name]: Tag,
+    [Row.name]: Row,
+    [Col.name]: Col,
+    [Checkbox.name]: Checkbox,
+    [List.name]: List,
+    [CheckboxGroup.name]: CheckboxGroup
+  },
+  created() {
+    //获取保全进度列表
+    this.getList()
+  },
+  methods: {
+    // 查看详情
+    detail(item) {
+      let { surrenderType, surrenderId } = item
+      surrenderType = dataDic.route[surrenderType]
+
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/preserve/detail/${surrenderType}/${surrenderId}`
+        },
+        routerInfo: {
+          path: `/preserve/detail/${surrenderType}/${surrenderId}`
+        }
+      })
+    },
+    getList() {
+      this.$toast.loading({
+        // 持续展示 toast
+        duration: 0,
+        // 禁用背景点击
+        forbidClick: true,
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      progressListQuery({
+        pageSize: this.pageSize,
+        pageNum: this.currentPage
+      }).then(res => {
+        this.$toast.clear()
+        if (res.result == 0) {
+          this.isSuccess = true
+          this.currentPage++
+          if (res.content.list.length == 0) {
+            this.finishedText = ''
+          } else {
+            this.finishedText = '已经全部加载'
+          }
+          this.loading = false
+          if (res.content.nextPage == 0) {
+            this.finished = true
+          }
+          this.list = this.list.concat(res.content.list)
+
+          this.list = [
+            {
+              surrenderId: 5102898,
+              edorapplyNo: 5585154,
+              edoracceptNo: 679891,
+              surrenderType: 1,
+              surrenderStatus: 2,
+              customerNo: 906473,
+              customerId: 4339487,
+              customerName: 8200072
+            },
+            {
+              surrenderId: 9696988,
+              edorapplyNo: 1741393,
+              edoracceptNo: 6079324,
+              surrenderType: 2,
+              surrenderStatus: 4,
+              customerNo: 3330232,
+              customerId: 2880507,
+              customerName: 9109817
+            },
+            {
+              surrenderId: 4897798,
+              edorapplyNo: 6876344,
+              edoracceptNo: 8360171,
+              surrenderType: 3,
+              surrenderStatus: 0,
+              customerNo: 3087814,
+              customerId: 8258533,
+              customerName: 3066420
+            },
+            {
+              surrenderId: 7812198,
+              edorapplyNo: 1333423,
+              edoracceptNo: 1425471,
+              surrenderType: 4,
+              surrenderStatus: 1,
+              customerNo: 1411430,
+              customerId: 8670617,
+              customerName: 3576056
+            },
+            {
+              surrenderId: 7388124,
+              edorapplyNo: 5622976,
+              edoracceptNo: 5010809,
+              surrenderType: 5,
+              surrenderStatus: 3,
+              customerNo: 7363316,
+              customerId: 5234486,
+              customerName: 8018362
+            },
+            {
+              surrenderId: 4357552,
+              edorapplyNo: 9701949,
+              edoracceptNo: 7429151,
+              surrenderType: 1,
+              surrenderStatus: 1,
+              customerNo: 6782150,
+              customerId: 6663599,
+              customerName: 9394689
+            },
+            {
+              surrenderId: 3911227,
+              edorapplyNo: 6410336,
+              edoracceptNo: 9487320,
+              surrenderType: 2,
+              surrenderStatus: 1,
+              customerNo: 8853912,
+              customerId: 4991652,
+              customerName: 9087882
+            },
+            {
+              surrenderId: 4231177,
+              edorapplyNo: 9844235,
+              edoracceptNo: 8677040,
+              surrenderType: 3,
+              surrenderStatus: 4,
+              customerNo: 500637,
+              customerId: 4436172,
+              customerName: 3719912
+            },
+            {
+              surrenderId: 397706,
+              edorapplyNo: 4282268,
+              edoracceptNo: 5110503,
+              surrenderType: 4,
+              surrenderStatus: 2,
+              customerNo: 7400002,
+              customerId: 6757490,
+              customerName: 9817134
+            },
+            {
+              surrenderId: 7120189,
+              edorapplyNo: 5690793,
+              edoracceptNo: 2822224,
+              surrenderType: 5,
+              surrenderStatus: 2,
+              customerNo: 7170594,
+              customerId: 4586358,
+              customerName: 4112579
+            },
+            {
+              surrenderId: 4855291,
+              edorapplyNo: 8371289,
+              edoracceptNo: 7828600,
+              surrenderType: 1,
+              surrenderStatus: 3,
+              customerNo: 8831495,
+              customerId: 630958,
+              customerName: 5048478
+            },
+            {
+              surrenderId: 6075558,
+              edorapplyNo: 2691672,
+              edoracceptNo: 2689542,
+              surrenderType: 2,
+              surrenderStatus: 5,
+              customerNo: 1768919,
+              customerId: 6230908,
+              customerName: 8155312
+            },
+            {
+              surrenderId: 7401509,
+              edorapplyNo: 9039925,
+              edoracceptNo: 3784166,
+              surrenderType: 3,
+              surrenderStatus: 4,
+              customerNo: 1878104,
+              customerId: 8160525,
+              customerName: 702626
+            },
+            {
+              surrenderId: 7859199,
+              edorapplyNo: 9330858,
+              edoracceptNo: 8777920,
+              surrenderType: 4,
+              surrenderStatus: 6,
+              customerNo: 8840132,
+              customerId: 1643253,
+              customerName: 9217322
+            },
+            {
+              surrenderId: 4045685,
+              edorapplyNo: 7938751,
+              edoracceptNo: 7381440,
+              surrenderType: 5,
+              surrenderStatus: 3,
+              customerNo: 4696734,
+              customerId: 6224371,
+              customerName: 924475
+            },
+            {
+              surrenderId: 6717692,
+              edorapplyNo: 8439143,
+              edoracceptNo: 948668,
+              surrenderType: 1,
+              surrenderStatus: 4,
+              customerNo: 9809608,
+              customerId: 9221624,
+              customerName: 994759
+            },
+            {
+              surrenderId: 5910317,
+              edorapplyNo: 4817194,
+              edoracceptNo: 2886042,
+              surrenderType: 2,
+              surrenderStatus: 5,
+              customerNo: 3241928,
+              customerId: 7272050,
+              customerName: 8834252
+            },
+            {
+              surrenderId: 1979874,
+              edorapplyNo: 1402263,
+              edoracceptNo: 1349984,
+              surrenderType: 3,
+              surrenderStatus: 2,
+              customerNo: 987972,
+              customerId: 2094223,
+              customerName: 7936866
+            },
+            {
+              surrenderId: 875854,
+              edorapplyNo: 4952714,
+              edoracceptNo: 2754563,
+              surrenderType: 4,
+              surrenderStatus: 3,
+              customerNo: 7439861,
+              customerId: 5127485,
+              customerName: 2538480
+            },
+            {
+              surrenderId: 606738,
+              edorapplyNo: 3884417,
+              edoracceptNo: 2434220,
+              surrenderType: 5,
+              surrenderStatus: 5,
+              customerNo: 6024894,
+              customerId: 3507209,
+              customerName: 2801584
+            }
+          ]
+
+          // this.list = res.content.list
+        } else {
+          this.finished = true
+          this.loading = false
+          this.finishedText = ''
+        }
+      })
+    }
+  },
+  computed: {}
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/ebiz/preserve/detail/Beneficiary.vue b/src/views/ebiz/preserve/detail/Beneficiary.vue
new file mode 100644
index 000000000..edb485552
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/Beneficiary.vue
@@ -0,0 +1,257 @@
+<!--受益人 -->
+<template>
+  <div class="beneficiary-container">
+    <div h10></div>
+    <div class="fs14 flex justify-content-s pv12 ph15 van-hairline--bottom">
+      <label class="c-gray-dark">被保险人</label>
+      <span class="c-gray-darker">{{ insuredName }}</span>
+    </div>
+    <div class="fs14 pv12 ph15 van-hairline--bottom flex">
+      <label class="c-gray-dark">身故受益人</label>
+      <div class="ml20 c-gray-darker">
+        <van-radio-group :disabled="isDisType" v-model="type" class="flex">
+          <van-radio name="1">法定受益人</van-radio>
+          <van-radio name="2" class="ml10">指定受益人</van-radio>
+        </van-radio-group>
+      </div>
+    </div>
+    <!-- 受益人列表 -->
+    <div class="fs14 beneficiary-list" v-if="type == 2">
+      <ul>
+        <li class="pv20 ph15 item" v-for="(item, index) in beneficiaries" :key="index">
+          <div class="bg-white p15" @click="detail(item)">
+            <div class="flex justify-content-s c-gray-darker">
+              <div>
+                <img src="@/assets/images/bnf_avatar.png" width="40" height="40" class="radius50 v-middle" />
+                <span class="ml10 c-gray-base">{{ item.name }}</span>
+              </div>
+            </div>
+            <p class="mt20">
+              <span class="c-gray-dark">是被保险人的</span>
+              <span class="ml20">{{ item.relationToInsured | idToText('relationToAppnt') }}</span>
+            </p>
+            <p class="mt10">
+              <span class="c-gray-dark">受益份额</span>
+              <span class="ml35">{{ item.bnfLot }}%</span>
+            </p>
+          </div>
+        </li>
+      </ul>
+    </div>
+    <!-- <van-dialog
+      v-model="show"
+      title="短信确认"
+      show-cancel-button
+      class="dialog-delete"
+      cancelButtonColor="#4FC6B3"
+      confirmButtonColor="#FFFFFF"
+      @confirm="authConfirm(authCode)"
+      @cancel="clearTimer"
+    >
+      <p class="p10 fs14">向此手机发送验证码确认用户身份</p>
+      <p class="p10 fs14" style="border-bottom: 1px solid #ebedf0;">{{ '15512341234' | Mask }}</p>
+      <van-cell-group class="flex align-items-c pr5 mb15">
+        <van-field maxlength="6" placeholder="请输入手机验证码" v-model="authCode" clearable label-width="0" />
+        <van-button type="danger" plain size="small" class="w160 p0" @click="getAuthCode" :disabled="codeDisabled" v-no-more-click="2000">
+          {{ codeDisabled ? `${countDown}s后重新获取` : '获取验证码' }}
+        </van-button>
+      </van-cell-group>
+    </van-dialog> -->
+
+    <!-- <van-button type="danger" class="bottom-btn" @click="nextStep">提交申请</van-button> -->
+  </div>
+</template>
+
+<script>
+import { Field, CellGroup, RadioGroup, Radio, Icon, Dialog } from 'vant'
+import { progressDetailQuery } from '@/api/ebiz/preserve/preserve'
+export default {
+  name: 'DetailBeneficiary',
+  components: {
+    [Field.name]: Field,
+    [CellGroup.name]: CellGroup,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Icon.name]: Icon,
+    [Dialog.name]: Dialog
+  },
+  filters: {
+    Mask: function(value) {
+      if (value) {
+        return value.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
+      } else {
+        return ''
+      }
+    }
+  },
+  data() {
+    // let feachData = {
+    //   surrenderDTOList: [
+    //     {
+    //       surrenderId: '',
+    //       edorapplyNo: '',
+    //       surrenderType: '2',
+    //       bnfDTOs: []
+    //     }
+    //   ]
+    // }
+    return {
+      // show: false, // 获取短信验证码
+      // codeDisabled: false, // 获取验证码按钮是否禁用
+      // timeId: null, // 计时器ID
+      // countDown: 60, // 倒计时
+      // authCode: '', // 验证码
+      // feachData: feachData,
+      type: '',
+      isDisType: true,
+      policy: null,
+      insuredName: '', //被保险人
+      beneficiaries: [] // 指定受益人列表
+    }
+  },
+  created() {
+    progressDetailQuery({
+      surrenderType : 2,
+      surrenderId : this.$route.params.surrenderId
+    })
+    .then(res => {
+      if(res.result == '0'){
+        this.policy = res.content.policyListDTOList[0]
+        this.insuredName = this.policy.insuredName
+        this.beneficiaries = res.content.bnfDTOs
+        this.type = this.beneficiaries[0].bnfType
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    })
+    .catch( (err) => {
+      console.log(err);
+    })
+    // 获取保单列表存储的数据
+    // this.policy = JSON.parse(localStorage['preserve-policy'])
+    // this.insuredName = this.policy.insuredName
+    // this.type = this.policy.bnfDTOs[0].bnfType
+    // this.beneficiaries = this.policy.bnfDTOs
+  },
+  mounted() {},
+  methods: {
+    //告知信息
+    // nextStep() {
+    //   this.showAuth()
+    // },
+    detail(item) {
+      // edit=0
+      localStorage["preserve-userInfo"] = JSON.stringify(item)
+      let path = '/preserve/detail/BeneficiaryInfo'
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + '/#' + path
+        },
+        routerInfo: {
+          path: path
+        }
+      })
+    },
+    // 显示验证码  van-dialog
+    // showAuth() {
+    //   this.show = true
+    // },
+    // // 获取短信验证码
+    // getAuthCode() {
+    //   this.codeDisabled = true
+    //   //倒计时
+    //   this.timeId = setInterval(() => {
+    //     this.countDown--
+    //     if (this.countDown <= 0) {
+    //       window.clearInterval(this.timeId)
+    //       this.codeDisabled = false
+    //       this.countDown = 60
+    //     }
+    //   }, 1000)
+
+    //   getAuthCode({
+    //     operateType: 'appntInfoEntry',
+    //     sessionId: '',
+    //     validateCode: '',
+    //     operateCode: this.customerMobile,
+    //     system: '',
+    //     operateCodeType: '0'
+    //   }).then(res => {
+    //     if (res.result == 0) {
+    //       this.sessionId = res.sessionId
+    //     } else {
+    //       this.$toast({
+    //         message: res.resultMessage,
+    //         onClose: this.showAuth
+    //       })
+    //     }
+    //   })
+    // },
+    // // 验证码确认事件
+    // async authConfirm() {
+    //   //清理计时器
+    //   this.clearTimer()
+    //   this.changeSubmit()
+    // },
+    // // 清理计时器
+    // clearTimer() {
+    //   window.clearInterval(this.timeId)
+    //   this.timeId = null
+    //   this.countDown = 60
+    //   this.codeDisabled = false
+    // },
+    // //提交变更申请
+    // async changeSubmit() {
+    //   if (!this.sessionId) {
+    //     this.$toast({
+    //       message: '请先获取验证码',
+    //       onClose: this.showAuth
+    //     })
+    //     return
+    //   }
+    //   let res = await autchCodeCheck({
+    //     smsId: this.sessionId,
+    //     code: this.authCode
+    //   })
+    //   if (res.result == 0) {
+    //     this.$jump({
+    //       flag: 'h5',
+    //       extra: {
+    //         url: location.origin + `/#/preserve/submitResult`,
+    //         backToFirst: '1'
+    //       },
+    //       routerInfo: {
+    //         path: `/preserve/submitResult`
+    //       }
+    //     })
+    //   } else {
+    //     this.show = false
+    //     this.$toast({
+    //       message: res.resultMessage,
+    //       onClose: this.showAuth
+    //     })
+    //   }
+    // }
+  },
+  // beforeDestroy() {
+  //   //清理计时器
+  //   this.clearTimer()
+  // }
+}
+</script>
+<style lang="scss" scoped>
+.beneficiary-container {
+  .add-btn {
+    width: 80%;
+    margin: 20px auto;
+    border: 1px dashed #999;
+  }
+  .beneficiary-list {
+    margin-bottom: 65px;
+  }
+  .item {
+    background-color: #f5f5f5;
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/detail/BeneficiaryInfo.vue b/src/views/ebiz/preserve/detail/BeneficiaryInfo.vue
new file mode 100644
index 000000000..67a5feaaa
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/BeneficiaryInfo.vue
@@ -0,0 +1,286 @@
+<template>
+  <div class="add-beneficiary-container pb50">
+    <!-- 基本信息 -->
+    <van-cell-group>
+      <van-field
+        :value="userInfo.relationToInsured | idToText('relationToAppnt')"
+        required
+        readonly
+        label="是被保险人的"
+        name="是被保险人的"
+        right-icon="arrow"
+        placeholder="请选择"
+        v-validate="'required'"
+      />
+      <customer-picker
+        v-validate="'required|name'"
+        name="姓名"
+        label="姓名"
+        required
+        :value.sync="userInfo.name"
+        :parentShowPicker.sync="customerShowPicker"
+        readonly
+      ></customer-picker>
+      <van-field
+        :value="userInfo.idType | idToText('idType')"
+        v-validate="'required'"
+        readonly
+        required
+        label="证件类型"
+        name="证件类型"
+        right-icon="arrow"
+        placeholder="请选择"
+      />
+      <van-field
+        v-model="userInfo.idNo"
+        label="证件号码"
+        name="证件号码"
+        required
+        readonly
+        placeholder="请输入"
+        maxlength="18"
+        clearable
+        v-validate="'required'"
+      ></van-field>
+      <!-- <FieldDatePicter
+        :v-validate="{ required: effectiveDateRequired }"
+        label="证件起始日期"
+        name="证件起始日期"
+        :required="isRequired"
+        :defaultDate="new Date()"
+        :value.sync="userInfo.certificateValidate"
+        type="date"
+        @confirm="onDateConfirm($event, '1')"
+        ref="certificateValidate"
+        :flag="certificateValidateShow"
+        :readonly="idLimit"
+      ></FieldDatePicter> -->
+      <FieldDatePicter
+        :v-validate="{ required: effectiveDateRequired }"
+        label="证件截止日期"
+        name="证件截止日期"
+        :required="isRequired"
+        :defaultDate="new Date()"
+        :value.sync="userInfo.effectiveDate"
+        type="date"
+        @confirm="onDateConfirm($event, '1')"
+        ref="effectiveDate"
+        :flag="effectiveDateShow"
+        readonly
+      ></FieldDatePicter>
+      <div class="border-bt relative fs14 p10 flex align-center">
+        <van-checkbox v-model="userInfo.effectiveDateType" class="fr" :disabled="true">长期</van-checkbox>
+      </div>
+      <select-radio :radios="sexRadio" disabled required label="性别" :value.sync="userInfo.sex"></select-radio>
+      <van-field
+        :value="userInfo.nationality | idToText('nativeplace')"
+        readonly
+        label="国家/地区"
+        name="国家/地区"
+        required
+        v-validate="'required'"
+        right-icon="arrow"
+        placeholder="请选择"
+      />
+      <van-field
+        v-model="userInfo.bnfOrder"
+        required
+        readonly
+        label="受益顺序"
+        name="受益顺序"
+        placeholder="请输入"
+        v-validate="'required|onlyNumber'"
+        maxlength="1"
+      />
+      <van-field
+        v-model="userInfo.bnfLot"
+        label="受益比例(%)"
+        name="受益比例"
+        placeholder="请输入"
+        required
+        readonly
+        v-validate="'required|onlyNumber'"
+        maxlength="3"
+        clearable
+      />
+
+      <template v-if="false">
+        <van-field
+          v-model="userInfo.mobile"
+          clearable
+          label="联系电话"
+          name="联系电话"
+          required
+          readonly
+          placeholder="请输入"
+          v-validate="'required|mobile'"
+          maxlength="11"
+        />
+        <van-field
+          v-model="areaName"
+          readonly
+          label="联系地址"
+          name="联系地址"
+          required
+          right-icon="arrow"
+          placeholder="请选择"
+          v-validate="'required'"
+          @click="chooseArea"
+        />
+        <van-field v-model="userInfo.village" label="" readonly name="详细地址" placeholder="请输入详细地址" v-validate="'required'" clearable maxlength="30" />
+        <van-field v-model="userInfo.email" required readonly label="电子邮箱" name="电子邮箱" placeholder="请输入" v-validate="'required|email'" clearable />
+        <occupation-picker
+          :value.sync="userInfo.occupationCode"
+          :chooseName.sync="userInfo.occupationName"
+          :lifeGrade.sync="userInfo.lifeGrade"
+          :healthGrade.sync="userInfo.healthGrade"
+          clearable
+          label="职业类别"
+          name="职业类别"
+          required
+          v-validate="'required'"
+          placeholder="请选择"
+          readonly
+          :parentShowPicker.sync="occupationShowPicker"
+          @on-choose="chooseOccupation"
+        />
+      </template>
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, CellGroup, Checkbox, Popup, Picker, Area } from 'vant'
+import SelectRadio from '@/components/ebiz/SelectRadio'
+import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
+import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
+import DataDictionary from '@/assets/js/utils/data-dictionary'
+import areaList from '@/assets/js/utils/area'
+import getAreaName from '@/assets/js/utils/get-area-name'
+import utilsAge from '@/assets/js/utils/age'
+import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
+import CustomerPicker from '@/components/ebiz/customer/CustomerPicker'
+import idNoCheck from '@/assets/js/utils/idNoCheck'
+import { idToData } from '../js/verification'
+import { selectComp } from '../js/methods'
+let relationToInsured = DataDictionary.relationToAppnt
+
+export default {
+  name: 'beneficiaryInfoAdd',
+  components: {
+    [SelectRadio.name]: SelectRadio,
+    [FieldDatePicter.name]: FieldDatePicter,
+    [OccupationPicker.name]: OccupationPicker,
+    [Field.name]: Field,
+    [CellGroup.name]: CellGroup,
+    [Checkbox.name]: Checkbox,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [Area.name]: Area,
+    [IdentityCardScan.name]: IdentityCardScan,
+    [CustomerPicker.name]: CustomerPicker
+  },
+  data() {
+    return {
+      effectiveDateTypeAble: true, //长期按钮是否禁用
+      isScan: false, //是否显示证件扫描组件
+      sexRadio: [
+        {
+          label: '男',
+          value: '0'
+        },
+        {
+          label: '女',
+          value: '1'
+        }
+      ],
+      currentPopupIndex: '',
+      relationToAppnt: '',
+      popupShow: false,
+      areaShow: false,
+      pickerType: undefined,
+      columns: [],
+      valueKey: 'text',
+      nationality: '',
+      idType: '居民身份证',
+      degree: '',
+      socialSecurity: '',
+      taxIdentity: '',
+      areaName: '',
+      areaValue: '110101',
+      effectiveDateRequired: true, //证件截止日期是否需要校验
+      effectiveDateShow: true, //证件截止日期是否可以选择
+      marriage: '',
+      isRequired: '', //长期前是否有*
+      userInfo: {
+        bnfId: '',
+        bnfType: '2',
+        bnfGrade: '',
+        name: '',
+        sex: '0',
+        nationality: '1',
+        birthday: '',
+        idType: '1',
+        idNo: '',
+        certificateValidate: '',
+        effectiveDate: '',
+        effectiveDateType: false, //是否长期
+        bnfNo: '1',
+        bnfOrder: 1,
+        bnfLot: '',
+        phone: '',
+        province: '',
+        city: '',
+        area: '',
+        postalAddress: '',
+        email: '',
+        occupationCode: '',
+        occupationName: '' // 职业中文
+      },
+      areaList: areaList,
+      occupationShowPicker: false,
+      customerShowPicker: false, //客户列表展示
+      idLimit: false, //证件起止日期是否只读
+      policy: null,
+      bnfDTOs: []
+    }
+  },
+  created() {
+    this.userInfo = JSON.parse(localStorage['preserve-userInfo'])
+  },
+  mounted() {},
+  methods: {
+    chooseOccupation() {
+      this.$jump({
+        flag: 'navigation',
+        extra: {
+          title: '指定受益人信息',
+          hiddenRight: '1'
+        }
+      })
+      this.occupationShowPicker = false
+    },
+    //时间戳格式处理
+    timeStampFormat(timeStamp) {
+      let date = new Date(timeStamp)
+      let year = date.getFullYear()
+      let month = date.getMonth() + 1
+      month = month.toString().padStart(2, '0')
+      let day = date.getDate()
+      day = day.toString().padStart(2, '0')
+      return `${year}-${month}-${day}`
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.add-beneficiary-container {
+  .title {
+    font-weight: 600;
+    border-bottom: 1px solid #dadada;
+  }
+  /deep/.van-checkbox {
+    margin-left: auto;
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/detail/Contact.vue b/src/views/ebiz/preserve/detail/Contact.vue
new file mode 100644
index 000000000..096fc9d14
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/Contact.vue
@@ -0,0 +1,159 @@
+<!-- 查看详情-联系方式变更 -->
+<template>
+  <div class="basic-info-container pb45">
+    <!-- 基本信息 -->
+    <van-cell-group class="mt10">
+      <p style="border-bottom: 1px solid #ebedf0;" class="fs15 fwb pl10 pv12">基本信息</p>
+      <van-field label="姓名" required :value="customerInfo.customerName" readonly />
+      <van-field
+        v-model="customerInfo.customerMobile"
+       
+        readonly
+        required
+        label="移动电话"
+        name="移动电话"
+        v-validate="'required|mobile'"
+        maxlength="11"
+      />
+      <van-field
+        v-model="homeName"
+        readonly
+        required
+        label="联系地址"
+        name="联系地址"
+        right-icon="arrow"
+        v-validate="'required'"
+      />
+      <van-field v-model="customerInfo.address" readonly label="" name="详细地址" v-validate="'required'" maxlength="30" />
+      <van-field
+        v-model="customerInfo.zipCode"
+        label="邮编"
+        readonly
+        required
+        name="邮编"
+        v-validate="'required|zipCode'"
+        maxlength="6"
+       
+      />
+      <van-field v-model="customerInfo.customerEmail" readonly label="电子邮箱" name="电子邮箱" v-validate="'email'" />
+      <van-field v-model="customerInfo.homePhone" readonly label="固定电话" name="固定电话" />
+      <van-field v-model="surrenderResult" readonly label="返回原因" name="返回原因" />
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, CellGroup, Popup, Picker, Area } from 'vant'
+import { progressDetailQuery } from '@/api/ebiz/preserve/preserve'
+import areaList from '@/assets/js/utils/area'
+import getAreaName from '@/assets/js/utils/get-area-name'
+export default {
+  name: 'DetailContact',
+  components: {
+    [Field.name]: Field,
+    [CellGroup.name]: CellGroup,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [Area.name]: Area
+  },
+  data() {
+    let feachData = {
+        surrenderDTOList: [
+          {
+            surrenderId: '',
+            edorapplyNo: '',
+            surrenderType: '1',
+            customerInfoDTOList: []
+          }
+        ]
+      },
+      customerInfo = {
+        surrenderId: '',
+        customerNo: '',
+        customerType: '',
+        customerName: '',
+        idType: '',
+        idNo: '',
+        customerMobile: '',
+        customerEmail: '',
+        province: '',
+        city: '',
+        area: '',
+        address: '',
+        zipCode: '',
+        homePhone: '',
+        isNewInfo: ''
+      }
+    feachData.surrenderDTOList[0].customerInfoDTOList.push(customerInfo)
+    return {
+      homeName: '',
+      homeShow: false,
+      areaList,
+      feachData,
+      customerInfo,
+      surrenderResult : ''
+    }
+  },
+  created() {
+    progressDetailQuery({
+      surrenderType : 1,
+      surrenderId : this.$route.params.surrenderId
+    })
+    .then(res => {
+      console.log(res);
+      if(res.result == '0'){
+        this.customerInfo = res.content.customerInfoDTOList[0]
+        this.surrenderResult = res.content.surrenderResult
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    })
+    .catch( (err) => {
+      console.log(err);
+    })
+  },
+  methods: {
+    //区域选择
+    sureArea(area) {
+      this.homeName = getAreaName(area)
+      ;[this.customerInfo.province, this.customerInfo.city, this.customerInfo.area] = [area[0].code, area[1].code, area[2].code]
+      this.homeShow = false
+    },
+    // 下一步
+    nextStep() {
+      //表单校验
+      this.$validator.validate().then(valid => {
+        if (true == valid) {
+          edorChange(this.feachData)
+            .then(res => {
+              if (res.result == 0) {
+                localStorage['preserve-customerInfo-old'] = localStorage['preserve-customerInfo']
+                localStorage['preserve-customerInfo'] = JSON.stringify(this.customerInfo)
+                this.$jump({
+                  flag: 'h5',
+                  extra: {
+                    url: location.origin + '/#/preserve/HandleResult?entry=contact'
+                  },
+                  routerInfo: '/preserve/HandleResult?entry=contact'
+                })
+              } else {
+                this.$toast(res.resultMessage)
+              }
+            })
+            .catch(err => {
+              console.log(err)
+            })
+        } else {
+          this.$toast(this.$validator.errors.all()[0])
+          return
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.basic-info-container {
+}
+</style>
diff --git a/src/views/ebiz/preserve/detail/CoolingOffperiodSurrender.vue b/src/views/ebiz/preserve/detail/CoolingOffperiodSurrender.vue
new file mode 100644
index 000000000..e3ecc24df
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/CoolingOffperiodSurrender.vue
@@ -0,0 +1,234 @@
+<!--退保-保全代办确认页-->
+<template>
+  <div class="surrender-confirmation-container mb10">
+    <van-cell-group class="mt10 cont-info-container">
+      <!-- 保单信息 -->
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">保单信息</p>
+      <van-cell title="保单号" :value="orderInfo.riskName" />
+      <van-cell title="产品名称" :value="orderInfo.riskName" />
+      <van-cell title="投保人" :value="orderInfo.appntName" />
+      <van-cell title="被保险人" :value="orderInfo.insuredName" />
+      <van-cell title="保单生效日期" :value="orderInfo.cvaliDate" />
+      <van-cell title="退保金额" :value="orderInfo.accountMoney" />
+      <van-cell title="万能险退保手续费比例" :value="orderInfo.ratio" />
+    </van-cell-group>
+    <!-- 账号信息 -->
+    <van-cell-group class="mt10 cont-info-container">
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">账号信息</p>
+      <van-cell title="开户人姓名" :value="accountInfo.accountName" />
+      <van-cell title="退款账户" :value="accountInfo.accountName" />
+      <van-cell title="开户银行">
+        <div class="red" slot="default">{{ accountInfo.newBank }}</div>
+      </van-cell>
+      <van-cell title="银行账号">
+        <div class="red" slot="default">{{ accountInfo.newBankNo }}</div>
+      </van-cell>
+      <van-cell title="开户行所在地" :value="accountInfo.accountName" />
+      <van-cell title="退保原因" :value="accountInfo.accountName" />
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, Cell, CellGroup, Dialog } from 'vant'
+import { customerInfoShare, orderDetail, authCode, changeStatus, queryCancel } from '@/api/ebiz/preserve/preserve'
+import { checkSignInvalid } from '@/api/ebiz/sale/sale'
+export default {
+  name: 'Surrender',
+  components: {
+    [Field.name]: Field,
+    [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup,
+    [Dialog.name]: Dialog
+  },
+  data() {
+    return {
+      //账号信息
+      accountInfo: {
+        accountName: '张三',
+        newBank: '工商银行',
+        newBankNo: '1122334455667899076'
+      },
+      //保单信息
+      orderInfo: {
+        riskName: '国富人寿八桂无忧',
+        appntName: '张三',
+        insuredName: '李四',
+        cvaliDate: '2020-02-02',
+        accountMoney: '130.00',
+        ratio: '70%'
+      },
+      show: false, // 获取短信验证码
+      codeDisabled: false, // 获取验证码按钮是否禁用
+      timeId: null, // 计时器ID
+      countDown: 60, // 倒计时
+      authCode: '', // 验证码
+      src: this.$assetsUrl + 'images/u6490.png', // 图片路径
+      newBank: '', //新开户银行
+      newBankNo: '', //新银行卡号
+      customerMobile: '',
+      sessionId: '',
+      nextDisabled: true,
+      signInvalid: '',
+      isSigned: false, //是否签完名了
+      submitForbidden: false, //是否提交申请失败
+      linkInvalid: false, //链接是否失效
+      isCanceled: false, //是否撤销
+      documentStatus: '' //签名状态
+    }
+  },
+  async created() {
+    this.$route.query.customerInfo && (localStorage.customerInfo = decodeURI(this.$route.query.customerInfo))
+    this.$route.query.token && (localStorage.token = this.$route.query.token)
+    this.customerMobile = JSON.parse(localStorage.customerInfo).customerMobile
+    //是否已经签名
+    if (sessionStorage.customerSign && JSON.parse(sessionStorage.customerSign).isSign) {
+      this.isSigned = true
+    } else {
+      this.isSigned = false
+      //token签名
+      if (this.$route.query.signInvalid) {
+        localStorage.signInvalid = this.$route.query.signInvalid
+        this.signInvalid = this.$route.query.signInvalid
+        //token是否过期
+        let resData = await this.checkSignInvalid(this.signInvalid)
+        if (resData == '1') {
+          this.linkInvalid = false
+        } else {
+          this.linkInvalid = true
+        }
+      }
+    }
+    this.init()
+  },
+  methods: {
+    async init() {
+      this.$toast.loading({
+        // 持续展示 toast
+        duration: 0,
+        // 禁用背景点击
+        forbidClick: true,
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      // await this.isPreserveCancel()
+      //如果没有被撤销
+      // if (backData == 'notCanceled') {
+      let params = {
+        surrenderType: '2', //"1","基本信息变更" "2","续期账号变更" "3","红利领取"
+        customerInfoDTOList: [],
+        mediaDTOList: [],
+        surrenderId: JSON.parse(localStorage.customerInfo).surrenderId,
+        edorapplyNo: JSON.parse(localStorage.customerInfo).edorapplyNo || JSON.parse(localStorage.customerInfo).edorApplyNo
+      }
+      let res = await customerInfoShare(params)
+      this.$toast.clear()
+      if (res.result == 0) {
+        if (!JSON.parse(localStorage.customerInfo).contNo) {
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+          localStorage.policyList = JSON.stringify(this.policyList)
+        } else {
+          //如果是从保全进度查询分享进来(只有一个单)
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.contNo == JSON.parse(localStorage.customerInfo).contNo && item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+        }
+
+        //未签名并且链接有效的情况下
+        if (!this.isSigned && !this.linkInvalid) {
+          //撤销
+          this.isCanceled = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 5
+          })
+        }
+        //未签名并且链接有效的情况下
+        if (!this.linkInvalid) {
+          //已提交
+          this.submitForbidden = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 3 || item.surrenderStatus == 6 || item.surrenderStatus == 9 || item.surrenderStatus == 7
+          })
+        }
+        //未签名&链接有效&未撤销
+        // if (!this.isSigned && !this.linkInvalid && !this.isCanceled) {
+        //   //提交申请失败
+        //   this.submitForbidden = res.content.accountResList.every(item => {
+        //     return item.surrenderStatus == 7
+        //   })
+        // }
+        // localStorage.signList = JSON.stringify(res.content.signList[0])
+        if (!sessionStorage.customerSign) {
+          let customerSign = {
+            baseEncryp: '',
+            policyUrl: res.content.signList[0].policyUrl
+          }
+          sessionStorage.customerSign = JSON.stringify(customerSign)
+        }
+        this.documentStatus = res.content.signList[0].documentStatus
+        this.getOrderDetail({
+          contNo: this.policyList[0].contNo
+        })
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+    //获取保单详情
+    async getOrderDetail(data) {
+      let res = await orderDetail(data)
+      if (res.result == 0) {
+        this.nextDisabled = false
+        let flag = true
+        this.list.forEach((item, index) => {
+          if (item.contNo == data.contNo) {
+            flag = false
+            console.info(index, item, res.content)
+            // this.list.splice(index, 1, res.content)
+            this.list.splice(index, 1, Object.assign(this.policyList[index], res.content))
+          }
+        })
+        if (flag) {
+          // this.list.push(res.content)
+          this.list.push(Object.assign(this.policyList[0], res.content))
+          this.policyList.forEach((item, index) => {
+            if (index != 0) {
+              this.list.push(item)
+            }
+          })
+        }
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.surrender-confirmation-container {
+  .cont-info-container {
+    /deep/.van-cell__title,
+    .van-cell__value {
+      flex: auto;
+      text-align: left;
+      width: 50%;
+    }
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/detail/Renewal.vue b/src/views/ebiz/preserve/detail/Renewal.vue
new file mode 100644
index 000000000..4366c1b0f
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/Renewal.vue
@@ -0,0 +1,258 @@
+<!--续期账号变更-保全代办确认页-->
+<template>
+  <div class="renewal-confirmation-container pb50">
+    <van-cell-group class="mt10 cont-info-container">
+      <!-- 保单信息 -->
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">保单信息</p>
+      <van-collapse v-model="activeNames" @change="collapseChange">
+        <div v-for="(item, index) in list" :key="index">
+          <van-collapse-item @click.native="changeCollapse(111)" v-no-more-click="2000" :title="`保单号:${item.contNo}`" :name="index">
+            <!-- <div slot="value" class="text-right collapse-value red fs12">{{ item.surrenderStatus == '5' ? '已撤销' : '' }}</div> -->
+            <van-cell title="产品名称" :value="item.riskName" />
+            <van-cell title="投保人" :value="item.appntName" />
+            <van-cell title="被保险人" :value="item.insuredName" />
+            <van-cell title="交费方式" :value="item.insuPayType | idToText('payIntv')" />
+            <van-cell title="保单生效日期" :value="item.cvaliDate" />
+            <van-cell title="保单状态" :value="item.contState | idToText('contState')" />
+            <van-cell title="开户人姓名" :value="item.accountName" />
+            <van-cell title="原银行名称" :value="item.bankCode | idToText('preserveBank')" />
+            <van-cell title="原银行账号" :value="item.bankNo" />
+          </van-collapse-item>
+        </div>
+      </van-collapse>
+    </van-cell-group>
+    <!-- 以上变更后续账号信息 -->
+    <van-cell-group class="mt10  cont-info-container">
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">以上变更后续账号信息</p>
+      <van-cell title="开户人姓名" :value="list[0].accountName" v-if="list.length" />
+      <van-cell title="新开户银行">
+        <div class="red" slot="default">{{ newBank }}</div>
+      </van-cell>
+      <van-cell title="新银行账号">
+        <div class="red" slot="default">{{ newBankNo }}</div>
+      </van-cell>
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, Cell, Collapse, CollapseItem, CellGroup, Dialog } from 'vant'
+import { customerInfoShare, orderDetail, authCode, changeStatus, queryCancel } from '@/api/ebiz/preserve/preserve'
+import { checkSignInvalid } from '@/api/ebiz/sale/sale'
+export default {
+  name: 'RenewalConfirmation',
+  components: {
+    [Field.name]: Field,
+    [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup,
+    [Collapse.name]: Collapse,
+    [CollapseItem.name]: CollapseItem,
+    [Dialog.name]: Dialog
+  },
+  data() {
+    return {
+      show: false, // 获取短信验证码
+      codeDisabled: false, // 获取验证码按钮是否禁用
+      timeId: null, // 计时器ID
+      countDown: 60, // 倒计时
+      authCode: '', // 验证码
+      activeNames: [0],
+      src: this.$assetsUrl + 'images/u6490.png', // 图片路径
+      policyList: [],
+      list: [
+        // {
+        //   contNo: 'HL052019110010001047',
+        //   riskName: '鼎诚人寿重大疾病险',
+        //   appntName: '嘿嘿',
+        //   insuredName: '狗乐',
+        //   insuPayType: '11',
+        //   cvaliDate: '2020-12-31',
+        //   contState: '001',
+        //   accountName: '彭小芳',
+        //   bankCode: '102',
+        //   bankNo: '374198274319824389127341'
+        // },
+        // {
+        //   contNo: 'HL052019110010001047',
+        //   riskName: '鼎诚人寿重大疾病险',
+        //   appntName: '嘿嘿',
+        //   insuredName: '狗乐',
+        //   insuPayType: '11',
+        //   cvaliDate: '2020-12-31',
+        //   contState: '001',
+        //   accountName: '彭小芳',
+        //   bankCode: '102',
+        //   bankNo: '374198274319824389127341'
+        // }
+      ],
+      newBank: '', //新开户银行
+      newBankNo: '', //新银行卡号
+      customerMobile: '',
+      sessionId: '',
+      nextDisabled: true,
+      signInvalid: '',
+      isSigned: false, //是否签完名了
+      submitForbidden: false, //是否提交申请失败
+      linkInvalid: false, //链接是否失效
+      isCanceled: false, //是否撤销
+      documentStatus: '' //签名状态
+    }
+  },
+  async created() {
+    this.$route.query.customerInfo && (localStorage.customerInfo = decodeURI(this.$route.query.customerInfo))
+    this.$route.query.token && (localStorage.token = this.$route.query.token)
+    this.customerMobile = JSON.parse(localStorage.customerInfo).customerMobile
+    
+    this.init()
+  },
+  methods: {
+    async init() {
+      this.$toast.loading({
+        // 持续展示 toast
+        duration: 0,
+        // 禁用背景点击
+        forbidClick: true,
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      // await this.isPreserveCancel()
+      //如果没有被撤销
+      // if (backData == 'notCanceled') {
+      let params = {
+        surrenderType: '2', //"1","基本信息变更" "2","续期账号变更" "3","红利领取"
+        customerInfoDTOList: [],
+        mediaDTOList: [],
+        surrenderId: JSON.parse(localStorage.customerInfo).surrenderId,
+        edorapplyNo: JSON.parse(localStorage.customerInfo).edorapplyNo || JSON.parse(localStorage.customerInfo).edorApplyNo
+      }
+      let res = await customerInfoShare(params)
+      this.$toast.clear()
+      if (res.result == 0) {
+        if (!JSON.parse(localStorage.customerInfo).contNo) {
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+          localStorage.policyList = JSON.stringify(this.policyList)
+        } else {
+          //如果是从保全进度查询分享进来(只有一个单)
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.contNo == JSON.parse(localStorage.customerInfo).contNo && item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+        }
+
+        //未签名并且链接有效的情况下
+        if (!this.isSigned && !this.linkInvalid) {
+          //撤销
+          this.isCanceled = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 5
+          })
+        }
+        //未签名并且链接有效的情况下
+        if (!this.linkInvalid) {
+          //已提交
+          this.submitForbidden = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 3 || item.surrenderStatus == 6 || item.surrenderStatus == 9 || item.surrenderStatus == 7
+          })
+        }
+        //未签名&链接有效&未撤销
+        // if (!this.isSigned && !this.linkInvalid && !this.isCanceled) {
+        //   //提交申请失败
+        //   this.submitForbidden = res.content.accountResList.every(item => {
+        //     return item.surrenderStatus == 7
+        //   })
+        // }
+        // localStorage.signList = JSON.stringify(res.content.signList[0])
+        if (!sessionStorage.customerSign) {
+          let customerSign = {
+            baseEncryp: '',
+            policyUrl: res.content.signList[0].policyUrl
+          }
+          sessionStorage.customerSign = JSON.stringify(customerSign)
+        }
+        this.documentStatus = res.content.signList[0].documentStatus
+        this.getOrderDetail({
+          contNo: this.policyList[0].contNo
+        })
+      } else {
+        this.$toast(res.resultMessage)
+      }
+      // }
+    },
+    changeCollapse(params) {
+      console.log(params)
+    },
+    //展开保单详情
+    collapseChange(val) {
+      if (val.length) {
+        let flag = true
+        this.list.forEach(item => {
+          if (item.contNo == this.policyList[val[val.length - 1]].contNo && item.riskName) {
+            return (flag = false)
+          }
+        })
+        if (flag) {
+          this.getOrderDetail({
+            contNo: this.policyList[val[val.length - 1]].contNo
+          })
+        }
+      }
+    },
+    //获取保单详情
+    async getOrderDetail(data) {
+      let res = await orderDetail(data)
+      if (res.result == 0) {
+        this.nextDisabled = false
+        let flag = true
+        this.list.forEach((item, index) => {
+          if (item.contNo == data.contNo) {
+            flag = false
+            console.info(index, item, res.content)
+            // this.list.splice(index, 1, res.content)
+            this.list.splice(index, 1, Object.assign(this.policyList[index], res.content))
+          }
+        })
+        if (flag) {
+          // this.list.push(res.content)
+          this.list.push(Object.assign(this.policyList[0], res.content))
+          this.policyList.forEach((item, index) => {
+            if (index != 0) {
+              this.list.push(item)
+            }
+          })
+        }
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.renewal-confirmation-container {
+  .cont-info-container {
+    /deep/.van-cell__title,
+    .van-cell__value {
+      flex: auto;
+      text-align: left;
+      width: 50%;
+    }
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/detail/Surrender.vue b/src/views/ebiz/preserve/detail/Surrender.vue
new file mode 100644
index 000000000..e3ecc24df
--- /dev/null
+++ b/src/views/ebiz/preserve/detail/Surrender.vue
@@ -0,0 +1,234 @@
+<!--退保-保全代办确认页-->
+<template>
+  <div class="surrender-confirmation-container mb10">
+    <van-cell-group class="mt10 cont-info-container">
+      <!-- 保单信息 -->
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">保单信息</p>
+      <van-cell title="保单号" :value="orderInfo.riskName" />
+      <van-cell title="产品名称" :value="orderInfo.riskName" />
+      <van-cell title="投保人" :value="orderInfo.appntName" />
+      <van-cell title="被保险人" :value="orderInfo.insuredName" />
+      <van-cell title="保单生效日期" :value="orderInfo.cvaliDate" />
+      <van-cell title="退保金额" :value="orderInfo.accountMoney" />
+      <van-cell title="万能险退保手续费比例" :value="orderInfo.ratio" />
+    </van-cell-group>
+    <!-- 账号信息 -->
+    <van-cell-group class="mt10 cont-info-container">
+      <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">账号信息</p>
+      <van-cell title="开户人姓名" :value="accountInfo.accountName" />
+      <van-cell title="退款账户" :value="accountInfo.accountName" />
+      <van-cell title="开户银行">
+        <div class="red" slot="default">{{ accountInfo.newBank }}</div>
+      </van-cell>
+      <van-cell title="银行账号">
+        <div class="red" slot="default">{{ accountInfo.newBankNo }}</div>
+      </van-cell>
+      <van-cell title="开户行所在地" :value="accountInfo.accountName" />
+      <van-cell title="退保原因" :value="accountInfo.accountName" />
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, Cell, CellGroup, Dialog } from 'vant'
+import { customerInfoShare, orderDetail, authCode, changeStatus, queryCancel } from '@/api/ebiz/preserve/preserve'
+import { checkSignInvalid } from '@/api/ebiz/sale/sale'
+export default {
+  name: 'Surrender',
+  components: {
+    [Field.name]: Field,
+    [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup,
+    [Dialog.name]: Dialog
+  },
+  data() {
+    return {
+      //账号信息
+      accountInfo: {
+        accountName: '张三',
+        newBank: '工商银行',
+        newBankNo: '1122334455667899076'
+      },
+      //保单信息
+      orderInfo: {
+        riskName: '国富人寿八桂无忧',
+        appntName: '张三',
+        insuredName: '李四',
+        cvaliDate: '2020-02-02',
+        accountMoney: '130.00',
+        ratio: '70%'
+      },
+      show: false, // 获取短信验证码
+      codeDisabled: false, // 获取验证码按钮是否禁用
+      timeId: null, // 计时器ID
+      countDown: 60, // 倒计时
+      authCode: '', // 验证码
+      src: this.$assetsUrl + 'images/u6490.png', // 图片路径
+      newBank: '', //新开户银行
+      newBankNo: '', //新银行卡号
+      customerMobile: '',
+      sessionId: '',
+      nextDisabled: true,
+      signInvalid: '',
+      isSigned: false, //是否签完名了
+      submitForbidden: false, //是否提交申请失败
+      linkInvalid: false, //链接是否失效
+      isCanceled: false, //是否撤销
+      documentStatus: '' //签名状态
+    }
+  },
+  async created() {
+    this.$route.query.customerInfo && (localStorage.customerInfo = decodeURI(this.$route.query.customerInfo))
+    this.$route.query.token && (localStorage.token = this.$route.query.token)
+    this.customerMobile = JSON.parse(localStorage.customerInfo).customerMobile
+    //是否已经签名
+    if (sessionStorage.customerSign && JSON.parse(sessionStorage.customerSign).isSign) {
+      this.isSigned = true
+    } else {
+      this.isSigned = false
+      //token签名
+      if (this.$route.query.signInvalid) {
+        localStorage.signInvalid = this.$route.query.signInvalid
+        this.signInvalid = this.$route.query.signInvalid
+        //token是否过期
+        let resData = await this.checkSignInvalid(this.signInvalid)
+        if (resData == '1') {
+          this.linkInvalid = false
+        } else {
+          this.linkInvalid = true
+        }
+      }
+    }
+    this.init()
+  },
+  methods: {
+    async init() {
+      this.$toast.loading({
+        // 持续展示 toast
+        duration: 0,
+        // 禁用背景点击
+        forbidClick: true,
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      // await this.isPreserveCancel()
+      //如果没有被撤销
+      // if (backData == 'notCanceled') {
+      let params = {
+        surrenderType: '2', //"1","基本信息变更" "2","续期账号变更" "3","红利领取"
+        customerInfoDTOList: [],
+        mediaDTOList: [],
+        surrenderId: JSON.parse(localStorage.customerInfo).surrenderId,
+        edorapplyNo: JSON.parse(localStorage.customerInfo).edorapplyNo || JSON.parse(localStorage.customerInfo).edorApplyNo
+      }
+      let res = await customerInfoShare(params)
+      this.$toast.clear()
+      if (res.result == 0) {
+        if (!JSON.parse(localStorage.customerInfo).contNo) {
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+          localStorage.policyList = JSON.stringify(this.policyList)
+        } else {
+          //如果是从保全进度查询分享进来(只有一个单)
+          res.content.accountResList.forEach(item => {
+            // this.policyList.push(item.contNo)
+            if (item.contNo == JSON.parse(localStorage.customerInfo).contNo && item.isNewInfo == '0') {
+              this.policyList.push({
+                contNo: item.contNo,
+                surrenderStatus: item.surrenderStatus
+              })
+              this.newBank = item.bankName
+              this.newBankNo = item.bankNo
+            }
+          })
+        }
+
+        //未签名并且链接有效的情况下
+        if (!this.isSigned && !this.linkInvalid) {
+          //撤销
+          this.isCanceled = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 5
+          })
+        }
+        //未签名并且链接有效的情况下
+        if (!this.linkInvalid) {
+          //已提交
+          this.submitForbidden = res.content.accountResList.every(item => {
+            return item.surrenderStatus == 3 || item.surrenderStatus == 6 || item.surrenderStatus == 9 || item.surrenderStatus == 7
+          })
+        }
+        //未签名&链接有效&未撤销
+        // if (!this.isSigned && !this.linkInvalid && !this.isCanceled) {
+        //   //提交申请失败
+        //   this.submitForbidden = res.content.accountResList.every(item => {
+        //     return item.surrenderStatus == 7
+        //   })
+        // }
+        // localStorage.signList = JSON.stringify(res.content.signList[0])
+        if (!sessionStorage.customerSign) {
+          let customerSign = {
+            baseEncryp: '',
+            policyUrl: res.content.signList[0].policyUrl
+          }
+          sessionStorage.customerSign = JSON.stringify(customerSign)
+        }
+        this.documentStatus = res.content.signList[0].documentStatus
+        this.getOrderDetail({
+          contNo: this.policyList[0].contNo
+        })
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+    //获取保单详情
+    async getOrderDetail(data) {
+      let res = await orderDetail(data)
+      if (res.result == 0) {
+        this.nextDisabled = false
+        let flag = true
+        this.list.forEach((item, index) => {
+          if (item.contNo == data.contNo) {
+            flag = false
+            console.info(index, item, res.content)
+            // this.list.splice(index, 1, res.content)
+            this.list.splice(index, 1, Object.assign(this.policyList[index], res.content))
+          }
+        })
+        if (flag) {
+          // this.list.push(res.content)
+          this.list.push(Object.assign(this.policyList[0], res.content))
+          this.policyList.forEach((item, index) => {
+            if (index != 0) {
+              this.list.push(item)
+            }
+          })
+        }
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.surrender-confirmation-container {
+  .cont-info-container {
+    /deep/.van-cell__title,
+    .van-cell__value {
+      flex: auto;
+      text-align: left;
+      width: 50%;
+    }
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/js/data-dictionary.js b/src/views/ebiz/preserve/js/data-dictionary.js
index 0b9c340e4..650cb408c 100644
--- a/src/views/ebiz/preserve/js/data-dictionary.js
+++ b/src/views/ebiz/preserve/js/data-dictionary.js
@@ -1,3 +1,4 @@
+// 保全相关的数据字典
 export default {
   //保全类型
   preserveType: [
@@ -26,5 +27,42 @@ export default {
       label: '犹豫期退保',
       type: 'WT'
     }
-  ]
+  ],
+  preserveState: {
+    0: '申请成功',
+    1: '待导入核心',
+    2: '保全失败',
+    3: '保全申请失败待导入核心',
+    4: '待打款',
+    5: '保全成功',
+    6: '转核'
+  },
+  preserveTypeT: {
+    1: '联系方式变更',
+    2: '受益人变更',
+    3: '续期账号变更',
+    4: '犹豫期退保',
+    5: '退保'
+  },
+  preserveUserType: {
+    1: '联系方式变更保存的客户',
+    2: '受益人变更保存的客户',
+    3: '续期账号变更保存的客户',
+    4: '犹退保存的客户',
+    5: '退保保存的客户'
+  },
+  preserveAccountType: {
+    1: '联系方式变更保存的客户',
+    2: '受益人变更保存的客户',
+    3: '续期账号变更保存的客户',
+    4: '犹退保存的客户',
+    5: '退保保存的客户'
+  },
+  route: {
+    1: 'Contact',
+    2: 'Beneficiary',
+    3: 'Renewal',
+    4: 'CoolingOffperiodSurrender',
+    5: 'Surrender'
+  }
 }
diff --git a/src/views/ebiz/preserve/js/utils.js b/src/views/ebiz/preserve/js/utils.js
new file mode 100644
index 000000000..7d615c50b
--- /dev/null
+++ b/src/views/ebiz/preserve/js/utils.js
@@ -0,0 +1,4 @@
+
+export default {
+  
+}