diff --git a/src/router/ebiz/preserve.js b/src/router/ebiz/preserve.js
index d57f16cb4..b4a5c3f48 100644
--- a/src/router/ebiz/preserve.js
+++ b/src/router/ebiz/preserve.js
@@ -16,6 +16,7 @@ const beneficiaryConfirmation = () => import('@/views/ebiz/preserve/BeneficiaryC
 const surrenderInfo = () => import('@/views/ebiz/preserve/SurrenderInfo')
 const surrenderConfirmation = () => import('@/views/ebiz/preserve/SurrenderConfirmation')
 const autopayAuthorization = () => import('@/views/ebiz/preserve/AutopayAuthorization')
+const surrenderTip = () => import('@/views/ebiz/preserve/SurrenderTip')
 
 export default [
   {
@@ -162,6 +163,15 @@ export default [
       index: 12
     }
   },
+  {
+    path: '/preserve/surrenderTip',
+    name: 'surrenderTip',
+    component: surrenderTip,
+    meta: {
+      title: '退保协议',
+      index: 12
+    }
+  },
   {
     path: '/preserve/submitResult',
     name: 'submitResult',
diff --git a/src/views/app/Home.vue b/src/views/app/Home.vue
index 5a1ccc30e..9c9e16ddb 100644
--- a/src/views/app/Home.vue
+++ b/src/views/app/Home.vue
@@ -29,6 +29,7 @@
           <li><router-link to="/agentEenter/approve/ApproveList">入司审批列表</router-link></li>
           <li><router-link to="/survey/surveyList">问卷调查</router-link></li>
           <li><router-link to="/nbs/list">nbs列表</router-link></li>
+          <li><router-link to="/manpower/DiscAnalysis/List">DISC性格分析</router-link></li>
           <li><router-link to="/preserve/search?entry=contact">保全-搜索-联系方式变更</router-link></li>
           <li><router-link to="/preserve/search?entry=beneficiary">保全-搜索-受益人变更</router-link></li>
           <li><router-link to="/preserve/search?entry=renewal">保全-搜索-续期账户变更</router-link></li>
diff --git a/src/views/ebiz/preserve/PolicyList.vue b/src/views/ebiz/preserve/PolicyList.vue
index ea7c60822..d47e30914 100644
--- a/src/views/ebiz/preserve/PolicyList.vue
+++ b/src/views/ebiz/preserve/PolicyList.vue
@@ -91,15 +91,15 @@ export default {
           cvaliDate: '2020-01-19'
         },
         {
-          "grpContNo": "11222111",
-          "contNo": "11111111",
-          "proposalPrtNo": "641596",
-          "hangUpFlag": "2",
-          "appntName": "张三2",
-          "insuredName": "李四2",
-          "riskName": "国富人寿八桂无忧",
-          "amt": "130.00",
-          "cvaliDate": "2020-01-19"
+          grpContNo: '11222111',
+          contNo: '11111111',
+          proposalPrtNo: '641596',
+          hangUpFlag: '2',
+          appntName: '张三2',
+          insuredName: '李四2',
+          riskName: '国富人寿八桂无忧',
+          amt: '130.00',
+          cvaliDate: '2020-01-19'
         }
       ] //保单列表
       /*
@@ -123,8 +123,7 @@ export default {
     async getPolicyList(data) {
       policyList(data).then(res => {
         if (res.result == '0') {
-          // this.policyList = res.content.policyListDTOList
-          this.policyList = res.content.contList
+          this.policyList = res.content.policyListDTOList
         } else {
           this.$toast(res.resultMessage)
         }
diff --git a/src/views/ebiz/preserve/SurrenderConfirmation.vue b/src/views/ebiz/preserve/SurrenderConfirmation.vue
index e2bece42b..65c647c46 100644
--- a/src/views/ebiz/preserve/SurrenderConfirmation.vue
+++ b/src/views/ebiz/preserve/SurrenderConfirmation.vue
@@ -1 +1,418 @@
 <!--退保-保全代办确认页-->
+<template>
+  <div class="surrender-confirmation-container pb50">
+    <div style="border-bottom: 1px solid #ebedf0" class="fs14 pl10 pv12 bg-white">
+      <p>
+        <span>尊敬的</span>
+        <span class="red">{{ orderInfo.accountName }}</span
+        >先生/女士, 您好!
+      </p>
+      <p class="mt10">
+        <span>您的</span>
+        <span class="red">退保</span>已由代理人代办，请确认信息并进行提交:
+      </p>
+    </div>
+    <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>
+
+    <van-cell-group class="fs14 mt10 pl15 pr15 pb20">
+      <p class="pt20 pb20">以下内容需要您阅读确认:</p>
+      <p>需阅读：</p>
+      <p class="mb10 mt10">
+        <span class="red">《国富人寿人身保险退保协议》</span>
+        <img :src="src" v-if="documentStatus == '3'" />
+      </p>
+      <p class="start">点击【开始】按钮，进行相关操作</p>
+    </van-cell-group>
+
+    <!-- 短信验证 -->
+    <van-dialog
+      v-model="show"
+      title="短信确认"
+      show-cancel-button
+      cancelButtonColor="#4FC6B3"
+      class="dialog-delete"
+      confirmButtonColor="#FFFFFF"
+      @confirm="authConfirm(authCode)"
+      @cancel="clearTimer"
+    >
+      <p class="p10 fs14">向此手机发送验证码确认用户身份</p>
+      <p class="p10 fs14" style="border-bottom: 1px solid #ebedf0">{{ customerMobile }}</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>
+
+    <div class="bottom-btn bg-white">
+      <van-button
+        :type="submitForbidden ? '' : 'danger'"
+        :color="submitForbidden ? 'gray' : ''"
+        v-if="isSigned || submitForbidden"
+        size="large"
+        :disabled="nextDisabled || submitForbidden"
+        @click="show = true"
+        v-no-more-click="2000"
+        >提交申请</van-button
+      >
+      <!-- <van-button color="gray" v-else-if="submitForbidden" size="large" disabled>提交申请失败</van-button> -->
+      <!-- <van-button color="gray" v-else-if="linkInvalid" size="large" disabled>链接已失效</van-button>
+      <van-button color="gray" v-else-if="isCanceled" size="large" disabled>代理人已撤销</van-button> -->
+      <van-button type="danger" v-else size="large" @click="start" v-no-more-click="2000">开始</van-button>
+    </div>
+  </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: 'RenewalConfirmation',
+  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: {
+    start() {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + '/#/preserve/autopayAuthorization'
+        },
+        routerInfo: {
+          path: '/preserve/autopayAuthorization'
+        }
+      })
+    },
+    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)
+      }
+      // }
+    },
+    // 获取短信验证码
+    getAuthCode() {
+      this.codeDisabled = true
+      //倒计时
+      this.timeId = setInterval(() => {
+        this.countDown--
+        if (this.countDown <= 0) {
+          window.clearInterval(this.timeId)
+          this.codeDisabled = false
+          this.countDown = 60
+        }
+      }, 1000)
+
+      authCode({
+        operateType: 'smslogin',
+        sessionId: '',
+        validateCode: '',
+        operateCode: this.customerMobile,
+        system: '',
+        operateCodeType: '0'
+      }).then(res => {
+        if (res.result == 0) {
+          this.sessionId = res.sessionId
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    },
+    // 验证码确认事件
+    async authConfirm() {
+      //清理计时器
+      this.clearTimer()
+      changeStatus({
+        surrenderId: JSON.parse(localStorage.customerInfo).surrenderId,
+        surrenderStatus: '3',
+        smsCodeDTO: {
+          smsId: this.sessionId,
+          code: this.authCode
+        }
+      }).then(resDdata => {
+        if (resDdata.result == 0) {
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + `/#/preserve/submitResult`
+            },
+            routerInfo: {
+              path: `/preserve/submitResult`
+            }
+          })
+        } else {
+          this.$toast(resDdata.resultMessage)
+        }
+      })
+    },
+    // 清理计时器
+    clearTimer() {
+      window.clearInterval(this.timeId)
+      this.timeId = null
+      this.countDown = 60
+      this.codeDisabled = false
+    },
+    //获取保单详情
+    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)
+      }
+    },
+    //提交申请
+    submit() {},
+    // 在微信中校验token是否失效
+    async checkSignInvalid(signInvalid) {
+      let that = this
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true, // 禁用背景点击
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      let data = {
+        sign: signInvalid
+      }
+      return new Promise((resolve, reject) => {
+        checkSignInvalid(data).then(res => {
+          if (res.result == '0') {
+            that.$toast.clear()
+            let status = res.content.status
+            resolve(status)
+          } else {
+            reject()
+          }
+        })
+      })
+    },
+    //查询撤销
+    async isPreserveCancel() {
+      return new Promise((resolve, reject) => {
+        let data = {
+          surrenderId: JSON.parse(localStorage.customerInfo).surrenderId
+        }
+        queryCancel(data).then(res => {
+          //result=0 已撤销
+          if (res.result == 0) {
+            this.isCanceled = true
+            resolve()
+          } else {
+            this.isCanceled = false
+            reject()
+          }
+        })
+      })
+    }
+  },
+  beforeDestroy() {
+    //清理计时器
+    this.clearTimer()
+  }
+}
+</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%;
+    }
+  }
+}
+.red {
+  color: #e9332e !important;
+}
+</style>
diff --git a/src/views/ebiz/preserve/SurrenderInfo.vue b/src/views/ebiz/preserve/SurrenderInfo.vue
index c185277aa..bb2b7df05 100644
--- a/src/views/ebiz/preserve/SurrenderInfo.vue
+++ b/src/views/ebiz/preserve/SurrenderInfo.vue
@@ -1 +1,370 @@
 <!--退保页-->
+<template>
+  <div class="renewal-info-container pb45">
+    <div v-if="!isScan">
+      <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="detail.riskName" required />
+        <van-cell title="保单号" :value="detail.riskName" required />
+        <van-cell title="投保人" :value="detail.appntName" required />
+        <van-cell title="被保险人" :value="detail.insuredName" required />
+        <van-cell title="保单生效日期" :value="detail.cvaliDate" required />
+        <van-cell title="退保金额" :value="detail.contState | amtFormat" required />
+        <van-cell title="万能险退保手续费比例" :value="detail.accountName" required />
+      </van-cell-group>
+      <!-- 账号信息 -->
+      <div class="account-info-container">
+        <van-cell-group class="mt10">
+          <p style="border-bottom: 1px solid #ebedf0" class=" fs15 fwb pl10 pv12">账号信息</p>
+          <van-cell title="开户人姓名" required>张三</van-cell>
+          <van-field
+            v-model="account"
+            label="退款账户"
+            placeholder="请选择"
+            right-icon="arrow"
+            @click="accountPopup = true"
+            readonly
+            v-validate="'required'"
+            data-vv-name="退款账户"
+            required
+          />
+          <van-field
+            v-model="bank"
+            label="开户银行"
+            placeholder="请选择"
+            right-icon="arrow"
+            @click="accountType != '1' ? (bankPopup = true) : (bankPopup = false)"
+            readonly
+            v-validate="'required'"
+            data-vv-name="开户银行"
+            :disabled="accountType == '1'"
+            required
+          />
+        </van-cell-group>
+        <van-cell-group class="flex align-items-c">
+          <van-field
+            v-model="bankId"
+            label="银行账号"
+            required
+            maxlength="19"
+            placeholder="请输入"
+            clearable
+            v-validate="'required|bankCard'"
+            data-vv-name="银行账号"
+          />
+          <van-button type="danger" size="small" round class="bankCard mr10 w110 h20" @click="cardScanning('0')" v-no-more-click="2000">银行卡扫描</van-button>
+        </van-cell-group>
+        <van-field v-model="bank" label="开户银行所在地" placeholder="请输入" v-validate="'required'" data-vv-name="开户银行所在地" required />
+        <van-field
+          v-model="surrenderReason"
+          label="退保原因"
+          required
+          placeholder="请选择"
+          right-icon="arrow"
+          @click="surrenderReasonPopup = true"
+          readonly
+          v-validate="'required'"
+          data-vv-name="退保原因"
+        />
+      </div>
+      <!-- 其他退保原因输入框 -->
+      <van-row class="mb10 mt1">
+        <van-col span="8"></van-col>
+        <van-col span="16">
+          <van-field
+            class="van-hairline--surround"
+            v-model="otherReason"
+            rows="4"
+            autosize
+            type="textarea"
+            name="其他退保原因"
+            placeholder="请输入其他退保原因"
+            v-validate="surrenderReasonType === '6' ? 'required' : ''"
+            v-if="surrenderReasonType === '6'"
+          />
+        </van-col>
+      </van-row>
+      <div class="bottom-btn bg-white">
+        <van-button type="danger" size="large" @click="nextStep" v-no-more-click="2000">下一步</van-button>
+      </div>
+      <!-- 开户银行选择 -->
+      <van-popup v-model="bankPopup" position="bottom">
+        <van-list>
+          <van-cell v-for="item in bankList" :key="item.code" :title="item.bankName" class="text-center" @click="chooseBank(item.bankName, item.code)" />
+        </van-list>
+      </van-popup>
+      <!-- 退款账户选择 -->
+      <van-popup v-model="accountPopup">
+        <van-list>
+          <van-cell v-for="item in accountList" :key="item.type" :title="item.title" class="text-center" @click="chooseAccount(item.title, item.type)" />
+        </van-list>
+      </van-popup>
+      <!-- 退保原因选择 -->
+      <van-popup v-model="surrenderReasonPopup" position="bottom">
+        <van-list>
+          <van-cell
+            v-for="item in surrenderReasonList"
+            :key="item.type"
+            :title="item.title"
+            class="text-center"
+            @click="chooseSurrderReason(item.title, item.type)"
+          />
+        </van-list>
+      </van-popup>
+    </div>
+    <!-- 银行卡扫描 -->
+    <BankCardScan :scanShow="isScan" :clear="false" @getScanInfo="getBankCardInfo"></BankCardScan>
+  </div>
+</template>
+
+<script>
+import { Field, Cell, CellGroup, Popup, List, Row, Col } from 'vant'
+import BankCardScan from '@/components/ebiz/sale/BankCardScan'
+// import { orderDetail, customerInfoChange } from '@/api/ebiz/preserve/preserve'
+import { getBankList } from '@/api/ebiz/sale/sale'
+export default {
+  name: 'surrenderInfo',
+  components: {
+    [Field.name]: Field,
+    [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup,
+    [List.name]: List,
+    [Row.name]: Row,
+    [Col.name]: Col,
+    [Popup.name]: Popup,
+    BankCardScan
+  },
+  data() {
+    return {
+      bank: '', //开户银行
+      bankCode: '', //银行编码
+      bankPopup: false, // 展示银行列表
+      bankList: [], // 银行列表
+      bankId: '374198274319824389127341', // 银行卡号
+      isScan: false, // 是否扫描银行卡
+
+      account: '原银行账户', //退款账户
+      accountType: '1', //退款账户
+      accountPopup: false, //展示退款账户弹框
+      accountList: [
+        //退款账户列表
+        { type: '1', title: '原银行账户' },
+        { type: '2', title: '新银行账户' }
+      ],
+
+      otherReason: '', //其他退款原因
+      surrenderReason: '', //退款原因
+      surrenderReasonType: '', //退款原因
+      surrenderReasonPopup: false, //展示退保原因弹框
+      surrenderReasonList: [
+        //退款原因列表
+        { type: '1', title: '个人经济原因，无力负担保费' },
+        { type: '2', title: '对险种不满意' },
+        { type: '3', title: '对业务员不满意' },
+        { type: '4', title: '对公司服务不满意' },
+        { type: '5', title: '人情投保' },
+        { type: '6', title: '其他' }
+      ],
+      detail: {
+        contNo: 'HL052019110010001047',
+        riskName: '鼎诚人寿重大疾病险重大疾病险重大疾病险',
+        appntName: '嘿嘿',
+        insuredName: '狗乐',
+        insuPayType: '1',
+        cvaliDate: '2020-12-31',
+        contState: '001',
+        accountName: '彭小芳',
+        bankCode: '102',
+        bankNo: '374198274319824389127341'
+      } //保单详情
+    }
+  },
+  created() {
+    this.getBank()
+  },
+  mounted() {
+    // 筛选按钮的点击事件
+    window.appCallBack = this.appCallBack
+  },
+  methods: {
+    // 选择银行
+    chooseBank(name, code) {
+      this.bank = name
+      this.bankCode = code
+      this.bankPopup = false
+    },
+    //选择退款账户
+    chooseAccount(title, type) {
+      this.account = title
+      this.accountType = type
+      this.accountPopup = false
+    },
+    //选择退款原因
+    chooseSurrderReason(title, type) {
+      this.surrenderReason = title
+      this.surrenderReasonType = type
+      this.surrenderReasonPopup = false
+    },
+    // 获取银行卡扫描信息
+    getBankCardInfo(data) {
+      this.bankId = data.name
+      this.$jump({
+        flag: 'navigation',
+        extra: {
+          title: '退保',
+          hiddenRight: '1'
+        }
+      })
+      this.isScan = false
+    },
+    // 银行卡扫描
+    cardScanning(cardScanningType) {
+      window.localStorage.setItem('cardScanningType', cardScanningType)
+      document.body.style.backgroundColor = '#F5F5F5'
+      let title = ''
+      this.isclear = false
+      ;[this.isScan, title] = [true, '银行卡扫描']
+      setTimeout(() => {
+        this.$jump({
+          flag: 'navigation',
+          extra: {
+            title,
+            hiddenLeft: '1'
+          }
+        })
+        this.closeBtn()
+      }, 400)
+    },
+    closeBtn() {
+      // 筛选按钮的显示
+      this.$jump({
+        flag: 'webview_right_button',
+        extra: {
+          btns: [
+            {
+              img: this.$assetsUrl + 'images/del-close.png',
+              route: { flag: '', extra: {} }
+            }
+          ]
+        }
+      })
+    },
+    appCallBack() {
+      this.isclear = true
+      // 筛选按钮的点击事件
+      this.isclear = true
+      this.$jump({
+        flag: 'navigation',
+        extra: {
+          title: '退保',
+          hiddenRight: '1'
+        }
+      })
+      this.isScan = false
+    },
+    // 下一步
+    async nextStep() {
+      this.$validator.validate().then(valid => {
+        if (true === valid) {
+          let params = {}
+          /*若更换新的银行卡需重新上传银行卡影像，保费满10000需上传身份证影像，如果低于10000无需上传，
+          如果是纸质合同，需要添加纸质保单影像，
+          在此页进行判断是否需要上传身份证影像和纸质保单影像*/
+          let url = `/preserve/surrenderConfirmation?`
+        } else {
+          this.$toast(this.$validator.errors.all()[0])
+        }
+      })
+    },
+    /*
+    //获取保单详情
+    async getOrderDetail(data) {
+      orderDetail(data).then(res => {
+        if (res.result == 0) {
+          let flag = true
+          this.list.forEach((item, index) => {
+            if (item.contNo == data.contNo) {
+              flag = false
+              this.list.splice(index, 1, res.content)
+            }
+          })
+          if (flag) {
+            this.list.push(res.content)
+            this.policyList.forEach((item, index) => {
+              if (index != 0) {
+                this.list.push({
+                  contNo: item
+                })
+              }
+            })
+
+            // this.getBank()
+          }
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    },
+    */
+    // 获取银行卡列表
+    async getBank() {
+      let data = {
+        operateType: 'edor_bank_type'
+      }
+      let res = await getBankList(data)
+      if (res.result == '0') {
+        this.bankList = res.content
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.van-dialog__confirm {
+  background-color: #e9332e !important;
+  margin-right: 20px;
+}
+
+.renewal-info-container {
+  .cont-info-container {
+    /deep/.van-cell__title,
+    .van-cell__value {
+      flex: auto;
+      text-align: left;
+    }
+    /deep/.van-cell__title {
+      width: 40%;
+    }
+    .van-cell__value {
+      width: 60%;
+    }
+  }
+  .account-info-container {
+    /deep/.van-cell__title {
+      flex: auto;
+      width: 40%;
+      text-align: left;
+    }
+    /deep/.van-cell__value {
+      flex: auto;
+      width: 60%;
+      text-align: left;
+    }
+    .align-items-c {
+      /deep/.van-cell__title {
+        width: 73%;
+      }
+    }
+  }
+  /deep/ .bankCard {
+    width: 120px;
+    height: 20px;
+    line-height: 20px;
+    border-radius: 10px;
+  }
+}
+</style>
diff --git a/src/views/ebiz/preserve/SurrenderTip.vue b/src/views/ebiz/preserve/SurrenderTip.vue
new file mode 100644
index 000000000..96c855534
--- /dev/null
+++ b/src/views/ebiz/preserve/SurrenderTip.vue
@@ -0,0 +1,529 @@
+<!--退保-退保协议书-->
+<template>
+  <div class="insuranceInformation-container pb50">
+    <van-notice-bar :scrollable="false" v-if="!Time" class="notice">{{ `提示：阅读时长需在${this.Time ? this.time : this.number}秒以上` }}</van-notice-bar>
+    <iframe :src="src + appntSign.policyUrl" class="iframe"></iframe>
+    <van-radio-group v-model="radio" class="pb10 pt20 pl30 fs14">
+      <van-radio name="1" @click="click">
+        本人确认已阅读
+        <span>《国富人寿人身保险退保协议》</span>
+      </van-radio>
+    </van-radio-group>
+    <div class="bg-white bottom-btn">
+      <van-button type="danger" size="large" :disabled="isDisabledComplite" @click="goNext" v-no-more-click="1000">完成</van-button>
+    </div>
+  </div>
+</template>
+<script>
+import { RadioGroup, Radio, Dialog, NoticeBar } from 'vant'
+import { saveInformation, getOrderDetail } from '@/api/ebiz/sale/sale'
+import config from '@/config'
+// import axios from 'axios'
+export default {
+  data() {
+    let isWeixin = this.$utils.device().isWeixin //判断环境
+    return {
+      // 投保人还是被保险人信息
+      signVal: '',
+      // 投保人签名信息
+      appntSign: {},
+      radio: '',
+      // 倒计时时间
+      number: '',
+      // 定时器时间
+      time: '10',
+      // 定时器名称
+      timer: null,
+      isOver: false,
+      // 判断验证码是否开始倒计时
+      Time: true,
+      // 按钮是否可以点击
+      isDisable: true,
+      // 是否在微信
+      isWeixin,
+      // 是否签名了 回执流程
+      isSign: true,
+      // sign加密码
+      base64: '',
+      // 是否可以点击
+      isDisabledComplite: true,
+      // local带来的被保险人信息
+      saleInsuredPersonInfo: {},
+      // local带来的投保人信息
+      saleInsuredInfo: {},
+      // 是否从详情跳过来 如果为1 是
+      detailJump: '',
+      src: location.origin + '/pdfjs/web/viewer.html?file=',
+      //保险产品名称
+      riskName: localStorage.riskName
+    }
+  },
+  components: {
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Dialog.name]: Dialog,
+    [NoticeBar.name]: NoticeBar
+  },
+  mounted() {
+    let that = this
+    that.timeOut()
+    document.body.style.backgroundColor = '#fff'
+  },
+  async created() {
+    let that = this
+
+    that.detailJump = window.localStorage.getItem('detailJump')
+    that.signVal = window.localStorage.getItem('sign-val')
+
+    // 获取投保人信息
+    that.saleInsuredInfo = JSON.parse(window.localStorage.getItem('saleInsuredInfo'))
+    if (this.isWeixin) {
+      that.relationToAppnt = JSON.parse(window.localStorage.getItem('saleInsuredPersonInfo')).relationToAppnt
+    }
+
+    if (this.detailJump != '1') {
+      // 投被保险人是否同人
+      that.relationToAppnt = JSON.parse(window.localStorage.getItem('saleInsuredPersonInfo')).relationToAppnt
+      // 获取被保险人信息
+      that.saleInsuredPersonInfo = JSON.parse(window.localStorage.getItem('saleInsuredPersonInfo'))
+    }
+    // if (this.detailJump != '1') {
+    //   this.getOrderDetail()
+    // }
+
+    if (this.isWeixin) {
+      let imgBase64Data = sessionStorage.getItem('oneimgBase64Data')
+      let wxSigned = sessionStorage.getItem('onewxSigned')
+      let signInfo = JSON.parse(localStorage.getItem('signInfo'))
+      console.log('`````````````````````````````````')
+
+      console.log('imgBase64Data: oneimgBase64Data:' + imgBase64Data)
+      console.log('wxSigned: ' + wxSigned)
+      if (wxSigned) {
+        console.log('第二次进入电子保单')
+        console.log('````````````````````````````````')
+        this.getOrderDetail().then(() => {
+          this.Time = true
+          this.isOver = true
+          this.radio = '1'
+          this.base64 = imgBase64Data
+          this.isDisabledComplite = false
+          console.log('signInfo.status:' + signInfo.status)
+          if (signInfo.status == '0') {
+            // this.appntSign.documentStatus = '3'
+            console.log('``````````````````')
+            this.$set(this.appntSign, 'documentStatus', '3')
+            console.log('appntSign.documentStatus: ' + this.appntSign.documentStatus)
+            this.isSign = false
+            this.isDisabledComplite = false
+            // this.isDisable = false
+          } else {
+            this.$set(this.insuredSign, 'documentStatus', '3')
+            // this.insuredSign.documentStatus = '3'
+            this.isDisabledComplite = false
+            this.isSign = false
+          }
+        })
+      } else {
+        console.log('````````````````````````')
+        console.log('第一次进入电子保单')
+        this.timeOut()
+        this.getOrderDetail()
+      }
+    } else {
+      this.timeOut()
+      if (this.detailJump != '1') {
+        this.getOrderDetail()
+      }
+    }
+  },
+  methods: {
+    timeOut() {
+      let that = this
+      let time = that.time
+      that.Time = false
+      that.number = `${time}`
+      let timer = setInterval(() => {
+        time--
+        if (time <= 0) {
+          time = 0
+          clearInterval(timer)
+
+          that.Time = true
+          that.isOver = true
+        }
+        that.number = `${time}`
+      }, 1000)
+    },
+    // 获取签名状态
+    getOrderDetail() {
+      let that = this
+      let data = {
+        orderNo: window.localStorage.getItem('orderNo')
+      }
+      return new Promise((resolve, reject) => {
+        getOrderDetail(data).then(res => {
+          if (res.result == '0') {
+            res.orderDTO.ebizSignDTOS.map(item => {
+              if (item.signType == '0' || item.signType == '2') {
+                if (item.documentCode == '3') {
+                  that.appntSign = item
+                  console.log('that.appntSign', that.appntSign)
+                }
+              }
+            })
+            that.appntSign.policyUrl = encodeURIComponent(config.imgDomain + `/returnDirectStream?imgPath=${that.appntSign.policyUrl}`)
+            if (that.isWeixin) {
+              if (res.orderDTO.ebizSignDTOS.length > 1) {
+                if (that.appntSign.documentStatus == '3') {
+                  that.isDisabledComplite = false
+                }
+              }
+            }
+            resolve('success')
+          }
+        })
+      })
+    },
+    // 点击阅读时
+    click() {
+      let that = this
+      if (that.isOver == false) {
+        Dialog.confirm({
+          title: '提示',
+          message: '该内容涉及您的重大权益，请您仔细阅读',
+          showCancelButton: false
+        }).then(() => {
+          that.radio = ''
+        })
+      }
+    },
+    // 点击签名
+    sign(val) {
+      let that = this
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true, // 禁用背景点击
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      if (val == '0') {
+        if (this.detailJump != '1') {
+          if (this.relationToAppnt == '1') {
+            if (this.isWeixin) {
+              this.toAirSign('0', '投保人签名', '5', '1')
+            } else {
+              EWebBridge.webCallAppInJs('ca_sign', {
+                //身份证号码
+                number: this.saleInsuredInfo.idNo,
+                //姓名
+                name: this.saleInsuredInfo.name,
+                type: this.saleInsuredInfo.idType,
+                keyword: '投保人签名',
+                pageNo: '1',
+                index: '1',
+                offset: '5',
+                pos: '3'
+              }).then(data => {
+                this.$toast.clear()
+                if (JSON.parse(data).state == '1') {
+                  this.base64 = decodeURI(JSON.parse(data).sign)
+                  this.appntSign.documentStatus = '3'
+                  this.isDisabledComplite = false
+                  this.isSign = false
+                }
+              })
+            }
+          } else {
+            if (this.isWeixin) {
+              this.toAirSign('0', '投保人签名', '5', '1')
+            } else {
+              EWebBridge.webCallAppInJs('ca_sign', {
+                //身份证号码
+                number: this.saleInsuredInfo.idNo,
+                //姓名
+                name: this.saleInsuredInfo.name,
+                type: this.saleInsuredInfo.idType,
+                keyword: '投保人签名',
+                pageNo: '1',
+                index: '1',
+                offset: '5',
+                pos: '3'
+              }).then(data => {
+                this.$toast.clear()
+                if (JSON.parse(data).state == '1') {
+                  this.base64 = decodeURI(JSON.parse(data).sign)
+                  this.appntSign.documentStatus = '3'
+                  this.isDisabledComplite = false
+                  this.isSign = false
+                }
+              })
+            }
+          }
+        } else {
+          switch (that.saleInsuredInfo.idType) {
+            case '居民身份证':
+              that.saleInsuredInfo.idType = '1'
+              break
+            case '户口本':
+              that.saleInsuredInfo.idType = '2'
+              break
+            case '出生证':
+              that.saleInsuredInfo.idType = '3'
+              break
+            case '外国人护照':
+              that.saleInsuredInfo.idType = '4'
+              break
+            case '港澳居民来往内地通行证':
+              that.saleInsuredInfo.idType = '5'
+              break
+            case '台湾居民来往大陆通行证':
+              that.saleInsuredInfo.idType = '6'
+              break
+            // case '其他':
+            //   that.saleInsuredInfo.idType = '7'
+            //   break
+            case '外国人永久居留身份证':
+              that.saleInsuredInfo.idType = '8'
+              break
+            case '港澳台居民居住证':
+              that.saleInsuredInfo.idType = '9'
+              break
+          }
+          if (this.isWeixin) {
+            this.toAirSign('0', '投保人签名', '5', '1')
+          } else {
+            EWebBridge.webCallAppInJs('ca_sign', {
+              //身份证号码
+              number: that.saleInsuredInfo.idNo,
+              //姓名
+              name: that.saleInsuredInfo.name,
+              type: that.saleInsuredInfo.idType,
+              keyword: '投保人签名',
+              pageNo: '1',
+              index: '1',
+              offset: '5',
+              pos: '3'
+            }).then(data => {
+              this.$toast.clear()
+              if (JSON.parse(data).state == '1') {
+                that.base64 = decodeURI(JSON.parse(data).sign)
+                that.appntSign.documentStatus = '3'
+                that.isDisabledComplite = false
+                that.isSign = false
+              }
+            })
+          }
+        }
+      }
+    },
+    // toAirSign(status, keyword, offset) {
+    //   localStorage.setItem(
+    //     'signInfo',
+    //     JSON.stringify({
+    //       idNo: this.saleInsuredInfo.idNo,
+    //       name: this.saleInsuredInfo.name,
+    //       type: this.saleInsuredInfo.idType,
+    //       keyword: keyword,
+    //       status: status,
+    //       offset: offset,
+    //       originUrl: location.href
+    //     })
+    //   )
+    //   window.location.href = this.$mainUrl + '/sign/index.html'
+    // },
+    toAirSign(status, keyword, offset, originStatus) {
+      localStorage.setItem(
+        'signInfo',
+        JSON.stringify({
+          originStatus: originStatus,
+          idNo: this.saleInsuredInfo.idNo,
+          name: this.saleInsuredInfo.name,
+          type: this.saleInsuredInfo.idType,
+          keyword: keyword,
+          status: status,
+          offset: offset,
+          originUrl: location.href
+        })
+      )
+      window.location.href = this.$mainUrl + '/sign/index.html'
+    },
+    // 下一步
+    goNext() {
+      if (this.isWeixin) {
+        console.log('````````````````````')
+        console.log('进入微信')
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+
+          forbidClick: true, // 禁用背景点击
+
+          loadingType: 'spinner',
+
+          message: '加载中……'
+        })
+        let that = this
+        if (that.signVal == '0' || that.signVal == '2') {
+          let data = {
+            orderType: 'SIGN_ORDER',
+            orderDTO: {
+              orderInfoDTO: {
+                orderNo: window.localStorage.getItem('orderNo')
+              },
+              ebizSignDTOS: [
+                {
+                  signOrRead: 'sms',
+                  signId: that.appntSign.signId,
+                  orderNo: window.localStorage.getItem('orderNo'),
+                  documentCode: that.appntSign.documentCode,
+                  documentStatus: '3',
+                  signType: that.appntSign.signType,
+                  documentType: that.appntSign.documentType,
+                  baseEncryp: that.base64,
+                  policyUrl: that.appntSign.policyUrl
+                }
+              ]
+            }
+          }
+          saveInformation(data).then(res => {
+            if (res.result == '0') {
+              this.$toast.clear()
+              window.localStorage.setItem('detailJump', '')
+              window.sessionStorage.onewxSigned = false
+              // window.sessionStorage.oneimgBase64Data = ''
+              this.$jump({
+                flag: 'h5',
+                extra: {
+                  url: location.origin + '/#/sale/InsuranceTip'
+                },
+                routerInfo: {
+                  path: '/sale/InsuranceTip'
+                }
+              })
+            } else {
+              that.$toast(res.resultMessage)
+            }
+          })
+        }
+      } else {
+        let that = this
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+
+          forbidClick: true, // 禁用背景点击
+
+          loadingType: 'spinner',
+
+          message: '加载中……'
+        })
+        if (that.signVal == '0' || that.signVal == '2') {
+          let data = {
+            orderType: 'SIGN_ORDER',
+            orderDTO: {
+              orderInfoDTO: {
+                orderNo: window.localStorage.getItem('orderNo')
+              },
+              ebizSignDTOS: [
+                {
+                  signOrRead: 'sms',
+                  signId: that.appntSign.signId,
+                  orderNo: window.localStorage.getItem('orderNo'),
+                  documentCode: that.appntSign.documentCode,
+                  documentStatus: '3',
+                  signType: that.appntSign.signType,
+                  documentType: that.appntSign.documentType,
+                  baseEncryp: that.base64,
+                  policyUrl: that.appntSign.policyUrl
+                }
+              ]
+            }
+          }
+          saveInformation(data).then(res => {
+            if (res.result == '0') {
+              this.$toast.clear()
+              window.localStorage.setItem('detailJump', '')
+              window.sessionStorage.onewxSigned = false
+              // window.sessionStorage.oneimgBase64Data = ''
+              this.$jump({
+                flag: 'h5',
+                extra: {
+                  url: location.origin + '/#/sale/InsuranceTip',
+                  forbidSwipeBack: '1'
+                },
+                routerInfo: {
+                  path: '/sale/InsuranceTip'
+                }
+              })
+            } else {
+              that.$toast(res.resultMessage)
+            }
+          })
+        }
+      }
+    }
+  },
+  computed: {
+    listenChange() {
+      const { isOver, radio, appntSign } = this
+      return { isOver, radio, appntSign }
+    }
+  },
+  watch: {
+    listenChange(val) {
+      let that = this
+      if (!that.isWeixin) {
+        if (that.signVal == '0' || that.signVal == '2') {
+          if (val.isOver == true && val.radio != '' && val.appntSign.documentStatus !== '3') {
+            that.isDisable = false
+          } else {
+            that.isDisable = true
+          }
+
+          if (that.radio == '1' && val.appntSign.documentStatus == '3') {
+            that.isDisabledComplite = false
+          } else {
+            that.isDisabledComplite = true
+          }
+        }
+        if (val.appntSign.documentStatus == '3') {
+          that.isDisable = true
+        }
+      } else {
+        if (that.signVal == '0' || that.signVal == '2') {
+          if (val.isOver == true && val.radio != '') {
+            that.isDisable = false
+          } else {
+            that.isDisable = true
+          }
+          if (that.radio == '1' && val.appntSign.documentStatus == '3') {
+            that.isDisabledComplite = false
+          } else {
+            that.isDisabledComplite = true
+          }
+        }
+      }
+    }
+  },
+
+  beforeRouteLeave(to, from, next) {
+    document.body.style.backgroundColor = ''
+    next()
+  }
+}
+</script>
+<style lang="scss" scoped>
+img {
+  width: 100%;
+  height: 100%;
+}
+.notice {
+  width: 100%;
+  position: fixed;
+  top: 0;
+  z-index: 20;
+}
+.iframe {
+  width: 100vw;
+  height: 70vh;
+}
+</style>