diff --git a/src/pages/extensionApply/apply-detail.vue b/src/pages/extensionApply/apply-detail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..9e9d23e92a0b28792b08b1e713de8195c8fadd1e
--- /dev/null
+++ b/src/pages/extensionApply/apply-detail.vue
@@ -0,0 +1,1232 @@
+<template>
+  <h-view id="addCar">
+    <transition name="trans">
+      <div v-show="downNum" class="modal-show">
+        <div class="down">
+          <div class="top">
+            录入产品信息
+            <!-- <img src="@/assets/intoApproval/close.png"  > -->
+            <span @click="downNum=false">x</span>
+          </div>
+          <div class="down-content">
+            <span>请上传照片</span>
+            <div class="photo">
+              <img v-show="vehicleImg" :src="vehicleImg" @click="showBigPicture(vehicleImg)">
+            </div>
+            <list-item :item-height="44">
+              <item>
+                <div slot="name">车架号</div>
+                <input
+                  slot="content"
+                  v-model="rentInfo.frame_number"
+                  readonly
+                  placeholder="自动识别车架号"
+                >
+              </item>
+              <item>
+                <div slot="name">发动机号</div>
+                <input slot="content" v-model="rentInfo.engine" readonly placeholder="自动识别发动机号" >
+              </item>
+              <item>
+                <div slot="name">车辆型号</div>
+                <input
+                  slot="content"
+                  v-model="rentInfo.vehicle_model"
+                  readonly
+                  placeholder="自动识别车辆型号"
+                >
+              </item>
+              <item>
+                <div slot="name">合格证编号</div>
+                <input
+                  slot="content"
+                  v-model="rentInfo.certificate_number"
+                  readonly
+                  placeholder="自动识别合格证编号"
+                >
+              </item>
+              <item>
+                <div slot="name">发车日期</div>
+                <input slot="content" v-model="rentInfo.departure_date" readonly placeholder="暂无数据" >
+              </item>
+              <item>
+                <div slot="name">开票日期</div>
+                <input slot="content" v-model="rentInfo.invoice_date" readonly placeholder="暂无数据" >
+              </item>
+            </list-item>
+          </div>
+        </div>
+      </div>
+    </transition>
+    <h-header :proportion="[5,1,1]" class="bar-custom">
+      <div slot="left" class="h-header-btn" @click="$routeGo()" >
+        <img src="@/assets/userBind/arrow.png">
+        <span>申请明细</span>
+      </div>
+    </h-header>
+    <Tab :title="text" @getTabNum="getTabNum" />
+    <h-content>
+      <div v-show="tabNum===0">
+        <div class="userInfo">变更主信息</div>
+        <list-item :item-height="44">
+          <item>
+            <div slot="name">偿还计划变更单据编号</div>
+            <input slot="content" v-model="project_number" readonly placeholder="暂无数据" >
+          </item>
+<!--          <item>-->
+<!--            <div slot="name">{{ info.bp_agent_name?'经销商':'办事处' }}</div>-->
+<!--            <div slot="content">{{ info.bp_agent_name?info.bp_agent_name:info.office_name }}</div>-->
+<!--          </item>-->
+          <item>
+            <div slot="name">变更日期</div>
+            <input slot="content" v-model="info.bp_name" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">变更类型</div>
+            <input slot="content" v-model="info.division_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">延期利息</div>
+            <input slot="content" v-model="info.product_code" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">变更手续费</div>
+            <input slot="content" v-model="info.total_price" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">利息手续费支付日期</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+<!--          <item>-->
+<!--            <div slot="name">租赁物数量</div>-->
+<!--            <input slot="content" v-model="info.product_num" readonly placeholder="暂无数据" >-->
+<!--          </item>-->
+<!--          <item>-->
+<!--            <div slot="name" class="firstPay">签约日期</div>-->
+<!--            <input-->
+<!--              slot="content" v-model="info.sale_date" class="firstPay" readonly-->
+<!--              placeholder="暂无数据" >-->
+<!--          </item>-->
+<!--          <item>-->
+<!--            <div slot="name" class="firstPay">首次分期付款日</div>-->
+<!--            <input-->
+<!--              slot="content" v-model="info.lease_start_date" class="firstPay" readonly-->
+<!--              placeholder="暂无数据" >-->
+<!--          </item>-->
+<!--          <item :showArrow="true" @click.native="goPlan">-->
+<!--            <div slot="name">查看还款计划</div>-->
+<!--            <input slot="content" readonly >-->
+<!--          </item>-->
+        </list-item>
+        <div class="userInfo">合同信息</div>
+        <list-item :item-height="44">
+          <item>
+            <div slot="name">合同编号</div>
+            <input slot="content" v-model="project_number" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">签约时间</div>
+            <input slot="content" v-model="info.bp_name" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">承租期限</div>
+            <input slot="content" v-model="info.division_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">每期支付租金</div>
+            <input slot="content" v-model="info.product_code" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">主机厂名称</div>
+            <input slot="content" v-model="info.total_price" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">经销商名称</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">主承租人名称</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">主承租人证件号</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">担保人名称</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">担保人证件号</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">配偶名称</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <item>
+            <div slot="name">配偶证件号</div>
+            <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+          </item>
+          <!--          <item :showArrow="true" @click.native="goPlan">-->
+          <!--            <div slot="name">查看还款计划</div>-->
+          <!--            <input slot="content" readonly >-->
+          <!--          </item>-->
+        </list-item>
+        <div class="userInfo">设备清单</div>
+        <list-item v-if="equip.length" :item-height="44">
+          <div v-for="(item, index) in equip" :key="index">
+            <item>
+              <div slot="name">设备名称</div>
+              <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+            </item>
+            <item>
+              <div slot="name">设备类型</div>
+              <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+            </item>
+            <item>
+              <div slot="name">设备数量</div>
+              <input slot="content" v-model="info.product_plan_id_n" readonly placeholder="暂无数据" >
+            </item>
+          </div>
+        </list-item>
+<!--        <div-->
+<!--          v-for="(item,index) in equip"-->
+<!--          :key="index"-->
+<!--          class="equipment"-->
+<!--          @click="downNum=true;getRent(item.contract_id,item.contract_lease_item_id)"-->
+<!--        >-->
+<!--          <div class="left">-->
+<!--            <span>-->
+<!--              <img src="@/assets/contractStart/list.png" >-->
+<!--            </span>-->
+<!--          </div>-->
+<!--          <div class="center">-->
+<!--            <span>租赁物信息</span>-->
+<!--            <span-->
+<!--              :class="['status',item.lease_status === 'Y'?'unMantain':'mantain']"-->
+<!--            >{{ item.lease_status === 'Y'?'已维护':'待维护' }}</span>-->
+<!--            <p>-->
+<!--              设备识别号-->
+<!--              <span>{{ item.product_code }}-{{ index+1|lengthCheck }}</span>-->
+<!--            </p>-->
+<!--          </div>-->
+<!--          <div class="right">-->
+<!--            <img src="@/assets/contractStart/into.png" >-->
+<!--          </div>-->
+<!--        </div>-->
+      </div>
+      <div v-show="tabNum===1">
+        <list-item
+          :item-height="56"
+          class="contract-text"
+          style="background-color:rgb(250,250,250);"
+        >
+          <item v-for="(item,index) in attachArray" :proportion="[7,1]" :key="index">
+            <div slot="name" class="aguremrnt-list">
+              <img src="@/assets/constractSigning/npack.png" alt class="pics" >
+              <p class="second first">{{ item.attachment_file }}</p>
+              <img v-if="item.read_status === 'N'" class="unread" src="@/assets/constractSigning/unread.png" >
+              <img v-if="item.read_status === 'Y'" class="unread" src="@/assets/constractSigning/read.png" >
+              <div
+                v-if="item.template_code === 'PRE_ABC_PAYMENT'"
+                class="wrap-img"
+                @click="entryInfo"
+              >
+                <img src="@/assets/constractSigning/scan.png" >
+              </div>
+            </div>
+            <div slot="content" class="in-detail" @click="goContent(item,index)">
+              <img src="@/assets/constractSigning/detail.png" alt >
+            </div>
+          </item>
+        </list-item>
+      </div>
+    </h-content>
+    <bottom-tab v-if="!flag">
+      <tab-button v-if="!signFlag" class="before" @click.native="takePhonto">
+        <img src="@/assets/constractSigning/certification.png" >签署合同
+      </tab-button>
+      <tab-button v-else class="approve" @click.native="isConfirm">提交审核</tab-button>
+    </bottom-tab>
+  </h-view>
+</template>
+
+<script>
+import Tab from '@/pages/carConfirm/tab'
+
+export default {
+  components: {
+    Tab,
+    // bodyCheck,
+  },
+  filters: {
+    lengthCheck: function (value) {
+      if (value.toString().length === 1) {
+        return `0${value}`
+      } else {
+        return value
+      }
+    },
+  },
+  data () {
+    return {
+      num: null,
+      downNum: false,
+      attachArray: [],
+      faceListUpload: [],
+      check_id: this.$route.query.check_id,
+      show: false,
+      flag: false, // 判断是否为已确认
+      vehicleImg: '', // 查询到的合格证
+      leasePic: '', // 租赁合同图片
+      agentPic: '', // 经销商担保协议图片
+      bankPic: '', // 农行代扣授权书图片
+      legalPic: '', // 法人授权书图片
+      content_id: this.$route.query.content_id,
+      confirm_id: this.$route.query.confirm_id,
+      project_id: this.$route.query.project_id,
+      project_number: this.$route.query.project_number,
+      readed: require('@/assets/constractSigning/read.png'), // 已读
+      unRead: require('@/assets/constractSigning/unread.png'), // 未读
+      tabNum: 0,
+      text: {
+        first: '合同详情',
+        second: '合同文本',
+      },
+      info: {
+        product_plan_id: '',
+        product_num: '',
+        first_pay: '',
+        division_n: '',
+        gps_fee: '',
+        bp_name: '',
+        project_number: '',
+        bp_agent_name: ' ',
+        product_plan_id_n: '',
+        product_code: '',
+        sale_date: '',
+        lease_start_date: '',
+      },
+      signMsg: '',
+      rentInfo: {
+        frame_number: '',
+        engine: '',
+        manufacturer: '',
+        license_plate_number: '',
+        vehicle_model: '',
+        certificate_number: '',
+        departure_date: '',
+        invoice_date: '',
+      },
+      products: [],
+      confirm_status: this.$route.query.confirm_status,
+      equip: [
+        {
+          product_id: '3',
+          product_code: 'GTC389',
+          contract_id: '231',
+        },
+      ],
+      signFlag: false,
+      isReadFlag: false,
+    }
+  },
+  // created () {
+  //   let vm = this
+  //   vm.getDetail()
+  //   vm.getEquipment()
+  //   vm.getAttachment()
+  //   vm.agentPic = vm.unRead
+  //   vm.leasePic = vm.unRead
+  //   if (vm.confirm_status === 'SUBMIT') {
+  //     vm.flag = false
+  //   } else if (vm.confirm_status === 'APPROVED') {
+  //     vm.flag = true
+  //   }
+  // },
+  beforeRouteEnter (to, from, next) {
+    next(async vm => {
+      if (from.name === 'ConfirmList') {
+        window.localStorage.removeItem('confirm_id')
+        window.localStorage.removeItem('project_id')
+        window.localStorage.setItem('confirm_id', vm.$route.query.confirm_id)
+        window.localStorage.setItem('project_id', vm.$route.query.project_id)
+      }
+      vm.confirm_id = window.localStorage.getItem('confirm_id')
+      vm.project_id = window.localStorage.getItem('project_id')
+      if (from.name === 'ElectronicSign') {
+        let url = process.env.basePath + 'sign_check'
+        let param = {
+          confirm_id: vm.confirm_id,
+          data_class: 'LEASE_ITEM',
+          content_id: vm.content_id,
+        }
+        vm.hlsPopup.showLoading('请稍候!')
+        let res = await vm.hlsHttp.post(url, param)
+        vm.hlsPopup.hideLoading()
+        // if (res.result === 'S') {
+        //   vm.signFlag = true
+        //   await vm.confirm()
+        // } else {
+        //   vm.signMsg = res.message
+        //   vm.signFlag = false
+        // }
+      }
+
+      // if (from.name === 'ContractRepayPlan') {
+      vm.signCheck()
+      vm.getDetail()
+      vm.getEquipment()
+      vm.getAttachment()
+      vm.agentPic = vm.unRead
+      vm.leasePic = vm.unRead
+      if (vm.confirm_status === 'SUBMIT') {
+        vm.flag = false
+      } else if (vm.confirm_status === 'APPROVED') {
+        vm.flag = true
+      }
+
+      // }
+    })
+  },
+  methods: {
+    // 合同文本详情附件查询
+    getAttachment () {
+      let vm = this
+      let url = process.env.basePath + 'get_content_app'
+      let param = {
+        confirm_id: vm.confirm_id,
+        data_class: 'LEASE_ITEM',
+        content_id: vm.content_id,
+        bp_id: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_id,
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(res => {
+        hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          vm.attachArray = res.attachments
+          vm.isReadFlag = res.attachments[0].read_status === 'Y'
+        } else {
+          vm.hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    goPlan () {
+      let vm = this
+      vm.$router.push({
+        name: 'ContractRepayPlan',
+        params: {
+          product_num: vm.info.product_num,
+          project_id: vm.project_id,
+          // quotation_id: vm.$route.query.quotation_id,
+        },
+      })
+    },
+    goContent (item, index) {
+      // 详情
+      // 合同状态更新保存
+      let vm = this
+      vm.attachFlag = true
+      vm.attachUrl = item.attachment_file_path
+      let url = process.env.basePath + 'prj_content_status_save'
+      let param = {
+        master: {
+          content_id: item.content_id,
+          read_status: 'Y',
+          bp_id: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_id,
+        },
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(res => {
+        hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          let temp = vm.attachArray[index]
+          temp.read_status = 'Y'
+          vm.$router.push({name: 'previewPdf', params: {attachUrl: vm.attachUrl}})
+          vm.attachArray.splice(vm.attachArray[index], 1, temp)
+          vm.isReadFlag = true
+        } else {
+          vm.hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    getImg (id) {
+      // 获取合格证
+      let vm = this
+      let randomString = Math.floor(Math.random() * 21)
+      let url =
+        process.env.basePath +
+        'app_attment_query' +
+        '&index' +
+        `'${randomString}'`
+      let param = {
+        master: {
+          source_type: 'CON_CONTRACT_LEASE_ITEM',
+          pkvalue: id,
+        },
+      }
+      vm.$post(url, param).then(function (res) {
+        if (res.result === 'S') {
+          if (res.info) {
+            vm.vehicleImg =
+              process.env.filePath +
+              'attachment_id=' +
+              res.info.attachment_id +
+              '&access_token=' +
+              window.localStorage.access_token
+          } else {
+            vm.vehicleImg = ''
+          }
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    // 签约校验
+    async signCheck () {
+      let vm = this
+      let url = process.env.basePath + 'sign_check'
+      let param = {
+        confirm_id: vm.confirm_id,
+        data_class: 'LEASE_ITEM',
+        content_id: vm.content_id,
+      }
+      vm.hlsPopup.showLoading('请稍候!')
+      let res = await vm.hlsHttp.post(url, param)
+      vm.hlsPopup.hideLoading()
+      if (res.result === 'S') {
+        vm.signFlag = true
+        return true
+      } else {
+        vm.signMsg = res.message
+        vm.signFlag = false
+        return false
+      }
+    },
+    getTabNum (i) {
+      this.tabNum = i
+    },
+    async takePhonto () {
+      let vm = this
+      if (!vm.isReadFlag) {
+        vm.hlsPopup.showLongCenter('请先阅读签约合同!')
+        return
+      }
+      let flag = await this.signCheck()
+      if (flag) {
+        vm.hlsPopup.showLongCenter('已经验证过!')
+        return
+      }
+      let url = process.env.basePath + 'bp_query'
+      let param = {
+        // bp_id: window.localStorage.bp_id,
+        bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(res => {
+        hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          let data = res.lists[0]
+          vm.startTencentFace({
+            name: data.bp_name,
+            idNo: data.id_card_no,
+            userId: data.id_card_no,
+            bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+          })
+          // cordova.plugins.IdCardPlugin.faceContrast({'idNum': data.id_card_no, 'idName': data.bp_name}, function (suc) {
+          //   let success = JSON.parse(suc)
+          //   if (success.code === 1) {
+          //     let filePath = JSON.stringify(success.message, '\\', null)
+          //     filePath = 'file:\/\/' + filePath.replace('\"', '')
+          //     filePath = filePath.substr(0, filePath.length - 1)
+          //     console.log('filePath ==== ' + filePath)
+          //     // 回调成功上传图片
+          //     vm.uploadImg(filePath)
+          //     vm.goElectronicSign()
+          //   } else {
+          //     vm.hlsPopup.showLongCenter('认证失败,请重试!')
+          //   }
+          // }, function (reason) {
+          //   let error = JSON.parse(reason)
+          //   vm.hlsPopup.showLongCenter('认证失败: ' + error.message)
+          // })
+        } else {
+          vm.hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    startTencentFace (params) {
+      let vm = this
+      let url = process.env.basePath + 'api_get_faceinfo'
+      let param = params
+      hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(res => {
+        hlsPopup.hideLoading()
+        console.log(res)
+        if (res.result === 'S') {
+          let faceParams = res.info
+          window.successCallback = function (suc) {
+            console.log('success', suc)
+            let params = {
+              master: {
+                orderNo: faceParams.agreementNo,
+                getFile: 1, // 是否需要获取人脸识别的视频和文件,值为1则返回视频和照片、值为2则返回照片、值为3则返回视频;其他则不返回
+                queryVersion: '1.0',
+                nonce: faceParams.openApiNonce,
+                record_id: faceParams.faceId,
+                project_list: [{ project_id: vm.project_id, content_id: vm.content_id }],
+              },
+            }
+            vm.getTencentFaceResult(params)
+          }
+          window.errorCallback = function (err) {
+            console.log('error', err)
+            vm.hlsPopup.showLongCenter('人脸唤起失败, 请重新尝试或联系管理员!')
+          }
+          let option = {
+            // 以下是必须的参数
+            'openApiAppId': res.info.openApiAppId,
+            'keyLicence': res.info.keyLicence,
+            'faceId': res.info.faceId,
+            'agreementNo': res.info.agreementNo,
+            'openApiAppVersion': res.info.openApiAppVersion,
+            'openApiNonce': res.info.openApiNonce,
+            'openApiUserId': res.info.openApiUserId,
+            'openApiSign': res.info.openApiSign,
+            // 以下是可选的
+            'config': {
+              'customTipsInUpload': '已提交审核,请等待结果',
+              'forceOrientation': true,
+            },
+          }
+          console.log('option', option)
+          Tencentface.startWbFaceVerifySdk(successCallback, errorCallback, option)
+        } else {
+          vm.hlsPopup.showLongCenter('人脸身份认证失败:' + res.message)
+        }
+      })
+    },
+    getTencentFaceResult (params) {
+      let vm = this
+      let url = process.env.basePath + 'api_query_faceresult'
+      let param = params
+      hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(res => {
+        hlsPopup.hideLoading()
+        console.log('faceResult', res)
+        if (res.result === 'S') {
+          if (res.info.code === '0') {
+            vm.hlsPopup.showLongCenter('人脸认证成功!')
+            vm.goElectronicSign()
+          } else {
+            vm.hlsPopup.showLongCenter('人脸认证失败:' + res.info.msg)
+          }
+        } else {
+          vm.hlsPopup.showLongCenter('人脸结果查询失败:' + res.message)
+        }
+      })
+    },
+    // 查看大图
+    showBigPicture (pic) {
+      let vm = this
+      vm.hlsPopup.showBigPicture({
+        imgUrl: pic,
+        width: '100%',
+      })
+    },
+    uploadImg (img) {
+      let vm = this
+      vm.faceListUpload = []
+      let obj = {
+        pkvalue: vm.check_id,
+        source_type: 'PRJ_CDD_ITEM_CHECK',
+        picture: '',
+        filePath: img,
+        attachment_id: '',
+        user_id: 1,
+        fileName: 'face',
+      }
+      vm.faceListUpload.push(obj)
+      vm.save_picture(vm.faceListUpload)
+    },
+    goElectronicSign () { // 电子签
+      let vm = this
+      let url = process.env.basePath + 'get_sign_url'
+      let param = {
+        confirm_id: vm.confirm_id,
+        data_class: 'LEASE_ITEM',
+        content_id: vm.content_id,
+      }
+      vm.hlsPopup.showLoading('请稍候')
+      vm.hlsHttp.post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.info.msg === 'success') {
+          vm.$router.push({
+            name: 'ElectronicSign',
+            params: {
+              url: res.info.data.url,
+            },
+          })
+        } else {
+          vm.hlsPopup.showLongCenter(res.info.msg)
+        }
+      })
+    },
+    // 获取身份证照片
+    async idCardImgUrlGet () {
+      let vm = this
+      let url = $config.basePath + 'car_id_card_query'
+      let param = {
+        confirm_id: vm.confirm_id,
+      }
+      hlsPopup.showLoading('请稍候')
+      let res = await vm.$post(url, param)
+      hlsPopup.hideLoading()
+      if (res.result === 'S' && res.info) {
+        let cardUrl =
+          process.env.filePath +
+          'attachment_id=' +
+          res.info.attachment_id +
+          '&access_token=' +
+          window.localStorage.access_token
+        return cardUrl
+      } else if (res.result === 'S' && !res.info) {
+        hlsPopup.showLongCenter('未找到身份证照片')
+        return null
+      } else {
+        hlsPopup.showLongCenter(res.message)
+        return null
+      }
+    },
+    // 图片保存
+    save_picture (list) {
+      let vm = this
+      if (list.length) {
+        // hlsPopup.showLoading('图片上传请稍候')
+        var alreadyUploadNum = 0
+        var attLength = 0
+        var recordUploadInterval = setInterval(function () {
+          if (alreadyUploadNum === attLength) {
+            clearInterval(recordUploadInterval)
+          }
+        }, 500)
+        for (var i = 0; i < list.length; i++) {
+          let uploadSuccess = function (res) {
+            if (res.result === 'S') {
+              alreadyUploadNum++
+              for (var j = 0; j < list.length; j++) {
+                if (list[j].filePath === res.response.filePath) {
+                  list[j].attachment_id = res.response.attachment_id
+                  vm.faceListUpload.push(list[j])
+                  break
+                }
+              }
+            } else {
+              hlsPopup.hideLoading()
+            }
+          }
+          if (!list[i].attachment_id) {
+            attLength++
+            hlsUtil.fileUploadSvc(list[i], uploadSuccess)
+          }
+        }
+      } else {
+        hlsPopup.hideLoading()
+      }
+    },
+    async isConfirm () {
+      let vm = this
+      let flag = await vm.signCheck()
+      if (flag) {
+        // 只有认证通过后方可进行签约操作
+        vm.hlsPopup.showConfirm({
+          title: '提示',
+          content: '您确定提交审核吗?',
+          onConfirm: data => {
+            if (data === 1) {
+              vm.confirm()
+            }
+          },
+        })
+      } else {
+        vm.hlsPopup.showLongCenter(vm.signMsg)
+      }
+    },
+    confirm () {
+      let vm = this
+      let url = process.env.basePath + 'do_car_confirm'
+      let param = {
+        master: {
+          confirm_id: vm.confirm_id,
+          confirm_status: 'APPROVED',
+          confirm_note: '同意',
+        },
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.$post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          vm.hlsPopup.showSuccess('合同签署成功')
+          setTimeout(() => {
+            vm.$router.push({
+              name: 'MyInfo',
+            })
+          }, 2000)
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    // 跳转合同详情
+    goContractContent (name) {
+      this.$router.push({
+        name: 'ContractContent',
+        params: {
+          name,
+          business_type: this.$route.query.business_type,
+        },
+      })
+      if (name === '经销商担保协议') {
+        setTimeout(() => {
+          this.agentPic = this.readed
+        }, 1000)
+      } else if (name === '租赁主合同') {
+        setTimeout(() => {
+          this.leasePic = this.readed
+        }, 1000)
+      }
+    },
+    getEquipment () {
+      let vm = this
+      let url = process.env.basePath + 'car_equip_list_query'
+      let param = {
+        project_id: vm.project_id,
+        // quotation_id: vm.$route.params.quotation_id,
+        pagesize: 999,
+        pagenum: 1,
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.$post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          vm.equip = res.lists
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    getRent (e, id) {
+      let vm = this
+      let url = process.env.basePath + 'leases_info_query'
+      let param = {
+        contract_id: e,
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.$post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          Object.assign(vm.rentInfo, res.info)
+          vm.getImg(id)
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+
+    getDetail () {
+      let vm = this
+      let url = process.env.basePath + 'con_contract_detial'
+      let param = {
+        project_id: vm.project_id,
+        // quotation_id: vm.$route.query.quotation_id,
+
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.$post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          vm.info = res.info
+          vm.info.sale_date ? vm.info.sale_date = vm.info.sale_date.substr(0, 10) : vm.info.sale_date = ''
+          vm.info.lease_start_date ? vm.info.lease_start_date = vm.info.lease_start_date.substr(0, 10) : vm.info.lease_start_date = ''
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+  },
+}
+</script>
+<style lang="less" scoped>
+#addCar {
+  input::placeholder {
+    color: #888c8f;
+  }
+  .firstPay {
+    color: #ff9200;
+    font-weight: bold;
+  }
+  .trans-enter-active,
+  .trans-leave-active {
+    transition: opacity 0.5s;
+  }
+  .trans-enter,
+  .trans-leave-active {
+    opacity: 0;
+  }
+ .aguremrnt-list {
+    display: flex;
+    display: -webkit-flex;
+    align-items: center;
+    -webkit-align-items: center;
+    width: 100%;
+    height: 100%;
+    .unread {
+      width: 34px;
+      height: 20px;
+      margin: 0 10px;
+    }
+    .wrap-img {
+      width: 12%;
+      height: 100%;
+      display: flex;
+      display: -webkit-flex;
+      align-items: center;
+      -webkit-align-items: center;
+      justify-content: center;
+      -webkit-justify-content:center;
+      background: rgb(254, 251, 233);
+      img {
+        width: 22px;
+        height: 20px;
+      }
+    }
+    .pic {
+      margin-left: -3px;
+    }
+
+    .pics {
+      //    width: 21px;
+      height: 30px;
+    }
+
+    .read {
+      height: 16px;
+      margin-top: 8px;
+      margin-left: 6px;
+    }
+
+    .second {
+      // height: 32px;
+      // line-height: 32px;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      margin-left: 16px;
+      color: #383f45;
+      letter-spacing: 0.43px;
+    }
+
+    .first {
+      margin-left: 13px;
+      width: 60%;
+    }
+  }
+
+  .contract-text {
+    .border-red {
+      border: 2px solid rgba(255, 0, 0, 0.4);
+    }
+
+    .hls-item {
+      margin-top: 8px;
+      background-color: #fff;
+    }
+
+    .contents {
+      padding: 0;
+    }
+
+    .in-detail {
+      background-color: rgba(0, 70, 156, 0.08);
+      width: 48px;
+      height: 56px;
+      text-align: center;
+      line-height: 65px;
+
+      img {
+        width: 16px;
+      }
+    }
+
+    .in-all {
+      //width: 96px;
+      display: flex;
+
+      img {
+        width: 16px;
+      }
+
+      div {
+        width: 48px;
+        height: 56px;
+        text-align: center;
+        line-height: 65px;
+      }
+
+      div:first-child {
+        background-color: rgba(252, 200, 0, 0.1);
+      }
+
+      div:nth-child(2) {
+        background-color: rgba(0, 70, 156, 0.08);
+      }
+    }
+  }
+  .hide {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    img {
+      width: 30px;
+      height: 30px;
+      margin-left: 65%;
+    }
+  }
+  .wrap {
+    padding-top: 92px;
+  }
+  .modal-show {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: 900;
+    background-color: rgba(56, 63, 69, 0.3);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .down {
+      position: relative;
+      width: 314px;
+      height: 526px;
+      background-size: 301px 24.7px;
+      background-color: #fff;
+    }
+    .top {
+      width: 100%;
+      height: 44px;
+      font-family: PingFangSC-Semibold;
+      font-size: 16px;
+      letter-spacing: 0;
+      text-align: center;
+      line-height: 44px;
+      color: #fff;
+      background: #0041c4;
+      span {
+        font-size: 24px;
+        float: right;
+        margin-right: 10px;
+        font-family: YouYuan;
+        // margin-left:100px;
+      }
+    }
+    .down-content {
+      margin-top: 8px;
+      span:first-child {
+        font-family: PingFangSC-Regular;
+        font-size: 13px;
+        color: #656464;
+        letter-spacing: 0;
+        margin-left: 15px;
+      }
+      .photo {
+        width: 172px;
+        height: 120px;
+        border: 1px solid #dcdcdd;
+        border-radius: 2px;
+        margin: 0 auto;
+        margin-top: 12px;
+        background: url("../../assets/contractStart/photo.png") 70px no-repeat;
+        background-size: 24px 20px;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+    }
+  }
+  .userInfo {
+    height: 45px;
+    line-height: 45px;
+    color: #0041c4;
+    font-size: 15px;
+    margin-left: 16px;
+    position: relative;
+  }
+  .userInfo::before {
+    content: "";
+    display: block;
+    width: 4px;
+    height: 20px;
+    background-color: #0041c4;
+    position: absolute;
+    left: -15px;
+    top: 12px;
+  }
+  .equipment:not(:first-child) {
+    margin-top: 2px;
+  }
+  .equipment {
+    width: 359px;
+    height: 72px;
+    background-color: #fff;
+    margin: 0 auto;
+    display: flex;
+    .left {
+      flex: 1;
+      span {
+        display: block;
+        width: 30px;
+        height: 30px;
+        background-color: #e8e9ed;
+        border-radius: 8px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-left: 10px;
+        margin-top: 8px;
+        img {
+          width: 11px;
+          height: 14px;
+        }
+      }
+    }
+    .center {
+      flex: 6;
+      span:first-child {
+        font-family: PingFangSC-Regular;
+        font-size: 14px;
+        color: #383f45;
+        letter-spacing: 0.43px;
+        margin-left: 10px;
+        margin-top: 12px;
+      }
+      .status {
+        display: inline-block;
+        width: 46px;
+        height: 16px;
+        text-align: center;
+        line-height: 16px;
+        font-family: PingFangSC-Medium;
+        font-size: 12px;
+        color: #ffffff;
+        letter-spacing: 0;
+        margin-left: 21px;
+        margin-top: 12px;
+      }
+      .unMantain {
+        background-color: #1d3fff;
+      }
+      .mantain {
+        background-color: #fff;
+        border: 1px solid #1d3fff;
+        color: #1d3fff;
+      }
+      p {
+        font-family: PingFangSC-Regular;
+        font-size: 13px;
+        color: rgba(56, 63, 69, 0.6);
+        letter-spacing: 0.4px;
+        margin-left: 10px;
+        margin-top: 10px;
+        span {
+          font-family: Helvetica;
+          font-size: 13px;
+          color: rgba(56, 63, 69, 0.6);
+        }
+      }
+    }
+    .right {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      img {
+        width: 13px;
+        height: 13px;
+      }
+    }
+  }
+  .approve {
+    color: #fff;
+    background-color: #0041c4;
+  }
+  .before {
+    border: 1px solid #fdb62f;
+    border-radius: 4px;
+    color: #fdb62f;
+    img {
+      width: 18px;
+    }
+  }
+  .name-box {
+    display: inline-block;
+    text-align: center;
+    line-height: 16px;
+    color: #00469c;
+    width: 16px;
+    height: 16px;
+    background: #cddbec;
+    border-radius: 4px;
+  }
+
+  .name {
+    font-family: PingFangSC-Regular;
+    font-size: 14px;
+    color: #383f45;
+    letter-spacing: 0;
+    margin-left: 10px;
+  }
+
+  .card-num {
+    font-family: PingFangSC-Regular;
+    font-size: 14px;
+    color: #383f45;
+    letter-spacing: 0;
+    display: block;
+    margin-left: 31px;
+    margin-top: 7px;
+  }
+
+  .right {
+    position: relative;
+  }
+
+  .right span {
+    float: right;
+    margin-right: 48px;
+    display: block;
+    font-family: PingFangSC-Regular;
+    font-size: 14px;
+    color: rgba(56, 63, 69, 0.6);
+    letter-spacing: 0;
+    line-height: 18px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    width: 150px;
+    margin-top: -10px;
+    text-align: right;
+  }
+
+  .right span:last-child {
+    margin-top: 7px;
+  }
+
+  .right img {
+    position: absolute;
+    top: 30%;
+    left: 88%;
+    width: 14px;
+    height: 16px;
+  }
+}
+</style>
diff --git a/src/pages/extensionApply/apply-list.vue b/src/pages/extensionApply/apply-list.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ae28ff7c9f7d7adfbf221ba30285be580b3b908a
--- /dev/null
+++ b/src/pages/extensionApply/apply-list.vue
@@ -0,0 +1,544 @@
+<template>
+  <h-view id="confirmList">
+    <h-header :proportion="[5, 1, 1]" class="bar-custom">
+      <div slot="left" class="h-header-btn" @click="$routeGo()" >
+        <img src="@/assets/userBind/arrow.png">
+        <span>延期申请</span>
+      </div>
+    </h-header>
+    <Tab :title="text" @getTabNum="getTabNum" />
+    <div class="search has-header">
+      <input v-model="keyWord" placeholder="请输入变更单据编号" >
+    </div>
+    <scroll ref="scroll" :updateData="[showList]" :pullUp="true" @pullingUp="getList">
+      <div v-for="(item,index) in showList" :key="index" class="item">
+        <div class="left">
+          <span @click="changePage(item)">
+            <img src="@/assets/contractStart/icon.png" >
+          </span>
+          <div v-show="isRadio" class="check-box" @click.stop="clickRadio(item)">
+            <div v-show="!item.checked"/>
+            <img v-show="item.checked" src="@/assets/contractCreate/selected.png" alt="已选择" >
+          </div>
+        </div>
+        <div class="right" @click="changePage(item)">
+          <div class="right-top">
+            <span>变更单据编号</span>
+            <span>{{ item.project_number }}</span>
+          </div>
+          <div class="right-bottom">
+            <ul>
+<!--              <li>-->
+<!--                {{ item.bp_type_n }}-->
+<!--                <span>{{ item.bp_name }}</span>-->
+<!--              </li>-->
+              <li>
+                变更类型
+                <span>{{ item.division_n }}</span>
+              </li>
+              <li>
+                变更日期
+                <span class="number">{{ item.total_price | currency }}</span>
+              </li>
+              <li>
+                审批状态
+                <span>{{ item.templet_name }}</span>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </scroll>
+<!--    <div class="check-bottom">-->
+<!--      <div v-show="isRadio" class="choose">-->
+<!--        <div class="radio" @click="allChoose(!chooseAll)">-->
+<!--          <img v-show="chooseAll" src="@/assets/login/radio.png" alt="radio" >-->
+<!--          <div v-show="!chooseAll" class="no-check"/>-->
+<!--          <span :style="{ color: chooseAll ? '#1d3fff' : 'rgb(212,214,212)' }">全选</span>-->
+<!--        </div>-->
+<!--        <button class="cancel" @click="cancelRadio">× 取消批量</button>-->
+<!--        <button class="sign" @click="sign">签订电子合同</button>-->
+<!--      </div>-->
+
+<!--      <div v-show="!tabNum && !isRadio" class="button-box">-->
+<!--        <div class="go-radio" @click="isRadio = true">-->
+<!--          <img src="@/assets/login/write.png" alt="icon" >-->
+<!--          <span>批量签署</span>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--    </div>-->
+    <div v-if="showList.length === 0">
+      <div class="display">
+        <img src="@/assets/messageCenter/noMsg.png" alt >
+      </div>
+    </div>
+  </h-view>
+</template>
+<script>
+import Tab from '@/pages/carConfirm/tab'
+export default {
+  components: {
+    Tab,
+  },
+  data () {
+    return {
+      text: { first: '待确认', second: '已确认' },
+      tabNum: 0,
+      keyWord: '',
+      status: '',
+      pagenumNew: 1,
+      pagenumApproved: 1,
+      lists: [],
+      showList: [],
+      undo: [],
+      done: [],
+
+      chooseAll: false,
+      isRadio: false,
+    }
+  },
+  watch: {
+    tabNum: {
+      handler (newVal, oldVal) {
+        if (newVal === 0) {
+          this.status = 'SUBMIT'
+          this.showList = this.undo
+        } else if (newVal === 1) {
+          this.status = 'APPROVED'
+          this.showList = this.done
+        }
+        this.getList()
+      },
+      immediate: true,
+    },
+    keyWord (newVal, oldVal) {
+      this.search()
+    },
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      vm.pagenumNew = 1
+      vm.pagenumApproved = 1
+      vm.lists = []
+    })
+  },
+  methods: {
+    sign () {
+      let list = this.showList.filter(item => item.checked).map(item => { item.checked = true; return item })
+      if (!list.length) return hlsPopup.showLongCenter('请选择合同')
+      window.localStorage.setItem('handleContact', JSON.stringify(list))
+      this.$router.push({ path: '/batchSign', query: { name: 'confirmList' } })
+    },
+    clickRadio (item) {
+      item.checked = !item.checked
+
+      this.chooseAll = this.showList.every(item => item.checked)
+      this.$forceUpdate()
+    },
+    allChoose (status) {
+      this.chooseAll = status
+      this.lists = this.lists.map(item => {
+        item.checked = status
+        return item
+      })
+    },
+    cancelRadio () {
+      this.isRadio = false // 关闭多选菜单
+      this.allChoose(false) // 关闭全选按钮
+    },
+    search () {
+      let vm = this
+      let randomString = Math.floor(Math.random() * 21)
+      let url =
+        process.env.basePath +
+        'car_confirm_list_query' +
+        '&index' +
+        `'${randomString}'`
+      let param = {
+        // user_phone: window.localStorage.getItem('user_phone'),
+        bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+        confirm_status: vm.status,
+        searchInput: vm.keyWord,
+      }
+      vm.$post(url, param).then(function (res) {
+        if (res.result === 'S') {
+          vm.lists = res.lists
+          vm.selectShowList()
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+    selectShowList () {
+      let vm = this
+      vm.undo = []
+      vm.done = []
+      this.lists.forEach(item => {
+        if (item.confirm_status === 'SUBMIT') {
+          vm.undo.push(item)
+        } else if (item.confirm_status === 'APPROVED') {
+          vm.done.push(item)
+        }
+      })
+      if (vm.tabNum === 0) {
+        this.undo = this.undo.map(item => {
+          item.checked = false
+          return item
+        })
+        this.showList = this.undo
+      } else {
+        this.showList = this.done
+      }
+    },
+    getTabNum (i) {
+      this.tabNum = i
+      this.isRadio = false
+      this.$refs.scroll.update(false)
+      this.$refs.scroll.scrollToTop()
+    },
+    changePage (e) {
+      this.$router.push({
+        name: 'extensionApplyDetail',
+        query: {
+          project_id: e.project_id,
+          confirm_status: e.confirm_status,
+          check_id: e.check_id,
+          confirm_id: e.confirm_id,
+          content_id: e.content_id,
+          business_type: e.business_type,
+          // quotation_id: e.quotation_id,
+          project_number: e.project_number,
+        },
+      })
+    },
+    getList () {
+      let vm = this
+      let randomString = Math.floor(Math.random() * 21)
+      let url =
+        process.env.basePath +
+        'car_confirm_list_query' +
+        '&index' +
+        `'${randomString}'`
+      let param = {
+        // user_phone: window.localStorage.getItem('user_phone'),
+        bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+        pagesize: 10,
+        pagenum: vm.status === 'APPROVED' ? vm.pagenumApproved : vm.pagenumNew,
+        confirm_status: vm.status,
+        searchInput: vm.keyWord,
+      }
+      hlsPopup.showLoading('请稍候')
+      vm.$post(url, param).then(function (res) {
+        vm.hlsPopup.hideLoading()
+        if (res.result === 'S') {
+          let returnData = []
+          returnData = res.lists
+          if (returnData.length === 0) {
+            vm.$refs.scroll.update(true)
+          } else if (returnData.length > 0 && returnData.length < 10) {
+            vum.forEach(returnData, function (data, index, array) {
+              vm.lists.push(array[index])
+            })
+            vm.status === 'APPROVED' ? vm.pagenumApproved++ : vm.pagenumNew++
+            vm.$refs.scroll.update(true)
+          } else if (returnData.length === 10) {
+            vum.forEach(returnData, function (data, index, array) {
+              vm.lists.push(array[index])
+            })
+            vm.status === 'APPROVED' ? vm.pagenumApproved++ : vm.pagenumNew++
+            vm.$refs.scroll.update(false)
+          }
+          vm.selectShowList()
+
+          vm.allChoose(false)
+        } else {
+          hlsPopup.showLongCenter(res.message)
+        }
+      })
+    },
+  },
+}
+</script>
+<style lang="less">
+#confirmList {
+  .display {
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    // top: 0;
+    img {
+      width: 100%;
+      height: 100%;
+      // margin-top: -70px;
+    }
+  }
+  .check-bottom {
+    width: 100%;
+    height: 1.2rem;
+    // background-color: #fff;
+    position: absolute;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .button-box {
+      width: 100%;
+      height: 100%;
+      background: #fff;
+
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .go-radio {
+      width: 90%;
+      color: #fff;
+      background-color: #1d3fff;
+      padding: 8px 10px;
+      border-radius: 5px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 0.32rem;
+      img {
+        width: 16px;
+        margin-right: 4px;
+      }
+    }
+
+    .choose {
+      width: 100%;
+      display: flex;
+      background: #fff;
+      justify-content: space-evenly;
+      align-items: center;
+      height: 100%;
+      font-size: 0.3rem;
+    }
+
+    .radio {
+      display: flex;
+      align-items: center;
+      color: #1d3fff;
+      img {
+        width: 24px;
+      }
+      .no-check {
+        width: 17px;
+        height: 17px;
+        border-radius: 8.5px;
+        border: 1px solid #edeef1;
+        background-color: #fff;
+        margin-right: 7.1px;
+      }
+    }
+    .cancel {
+      background-color: #ffcece;
+      color: red;
+      padding: 7px 15px;
+      border-radius: 3px;
+    }
+    .sign {
+      color: #fff;
+      background-color: #1d3fff;
+      padding: 7px 30px;
+      border-radius: 3px;
+    }
+  }
+
+  .search {
+    background-color: #fff;
+    padding: 8px 12px;
+    position: absolute;
+    width: 100%;
+    height: 1.02rem;
+    z-index: 100;
+    margin-top: 52px;
+    margin-bottom: 8px;
+    input {
+      background: url("../../assets/contractStart/search1.png") 320px no-repeat;
+      background-size: 16px 16px;
+      background-color: rgba(239, 239, 239, 0.55);
+      padding-left: 12px;
+      height: 36px;
+      line-height: 36px;
+      border-radius: 4px;
+      width: 100%;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #888c8f;
+    }
+
+    input::placeholder {
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #888c8f;
+      letter-spacing: 0;
+    }
+
+    input:focus {
+      background: url("../../assets/contractStart/search2.png") 320px no-repeat;
+      background-size: 16px 16px;
+      background-color: rgba(239, 239, 239, 0.55);
+      border: 2px solid #bcc6ff;
+    }
+  }
+  .item {
+    width: 359px;
+    height: 170px;
+    background-color: #fff;
+    border-radius: 2px;
+    margin: 0 auto;
+    margin-top: 9px;
+    .left {
+      display: flex;
+      flex-direction: column;
+      width: 15%;
+      height: 100%;
+      float: left;
+
+      .check-box {
+        width: 100%;
+        height: 100px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+
+        div {
+          width: 0.32rem;
+          height: 0.32rem;
+          border: 0.02rem solid #1d3fff;
+          border-radius: 0.06rem;
+        }
+
+        img {
+          width: 0.32rem;
+        }
+      }
+
+      span {
+        display: block;
+        width: 30px;
+        height: 30px;
+        background-color: #e8e9ed;
+        border-radius: 8px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-left: 10px;
+        margin-top: 8px;
+        img {
+          width: 11px;
+          height: 14px;
+        }
+      }
+    }
+    .right {
+      height: 100%;
+      width: 85%;
+      float: right;
+      .right-top {
+        width: 285px;
+        height: 45px;
+        font-family: PingFangSC-Semibold;
+        font-size: 15px;
+        color: #4b4a4b;
+        letter-spacing: 0;
+        line-height: 45px;
+        border-bottom: 1px solid #f3f3f7;
+        span:last-child {
+          float: right;
+        }
+      }
+      .right-bottom {
+        width: 285px;
+        margin-top: 10px;
+        .number {
+          font-family: Verdana-Bold;
+          font-size: 14px;
+          color: #4b4a4b;
+          letter-spacing: 0;
+          font-weight: bold;
+        }
+        li {
+          font-family: PingFangSC-Regular;
+          font-size: 14px;
+          color: #4b4a4b;
+          letter-spacing: 0;
+          height: 30px;
+          width: 100%;
+          span {
+            float: right;
+          }
+        }
+      }
+    }
+  }
+  .content {
+    position: absolute;
+    top: 0;
+  }
+  .scrollContent {
+    padding-top: 2.92rem;
+    padding-bottom: 20px;
+  }
+  .tab-style {
+    width: 100%;
+    position: absolute;
+  }
+}
+.platform-ios {
+  #confirmList {
+    .scrollContent {
+      padding-top: 3.32rem;
+      padding-bottom: 1.2rem;
+    }
+  }
+}
+
+@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
+  .platform-ios {
+    #confirmList {
+      .scrollContent {
+        padding-top: 3.72rem;
+        padding-bottom: 1.2rem;
+      }
+
+      .check-bottom {
+        bottom: 32px;
+      }
+    }
+  }
+}
+// iPhoneXR适配
+@media (device-width: 414px) and (device-height: 896px) {
+  .platform-ios {
+    #confirmList {
+      .scrollContent {
+        padding-top: 3.72rem;
+        padding-bottom: 1.2rem;
+      }
+      .search {
+        input {
+          background: url("../../assets/contractStart/search1.png") 320px
+            no-repeat;
+          background-size: 16px 16px;
+          background-color: rgba(239, 239, 239, 0.55);
+          padding: 8px 12px;
+          border-radius: 4px;
+          width: 100%;
+          font-family: PingFangSC-Regular;
+          font-size: 14px;
+          color: #888c8f;
+        }
+      }
+
+      .check-bottom {
+        bottom: 32px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/pages/extensionApply/tab.vue b/src/pages/extensionApply/tab.vue
new file mode 100644
index 0000000000000000000000000000000000000000..d67a1f048a49fade67c7dc827fbd415ab25bc4cc
--- /dev/null
+++ b/src/pages/extensionApply/tab.vue
@@ -0,0 +1,92 @@
+<!--
+ * @Description: In User Settings Edit
+ * @Author: your name
+ * @Date: 2019-09-25 11:10:34
+ * @LastEditTime: 2019-09-25 21:05:24
+ * @LastEditors: Please set LastEditors
+ -->
+<template>
+  <div class="tab-style">
+    <div :class="{'tab-content-bg':tabNum == 0}" class="tab-content" @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?signed:sign"><span
+      :class="{'colored':tabNum == 0}">{{ title.first }}</span></div>
+    <div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?finished:finish"><span
+      :class="{'colored':tabNum == 1}">{{ title.second }}</span></div>
+  </div>
+</template>
+<script>
+import signed from '@/assets/contractStart/noY.png'
+import finished from '@/assets/contractStart/confirmY.png'
+import sign from '@/assets/contractStart/noN.png'
+import finish from '@/assets/contractStart/confirmN.png'
+
+export default {
+  props: {
+    title: {
+      type: Object,
+      default: function () {
+        return {}
+      },
+    },
+  },
+  data () {
+    return {
+      tabNum: 0,
+      signed: signed,
+      finished: finished,
+      sign: sign,
+      finish: finish,
+    }
+  },
+  methods: {
+    sendTabNum () {
+      this.$emit('getTabNum', this.tabNum)
+    },
+  },
+}
+</script>
+<style lang="less" scoped>
+  .tab-style {
+    position: relative;
+    z-index: 50;
+    background-color: #fff;
+    display: flex;
+    justify-content: center;
+    padding-top: 12px;
+    padding-bottom: 8px;
+    align-items: center;
+    box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.50);
+    .tab-content {
+      display: block;
+      width: 45.9%;
+      height: 32px;
+      background: rgba(220, 220, 221, 0.26);
+      border-radius: 16px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      span {
+        margin-left: 2%;
+        font-size: 14px;
+        color: #383F45;
+        font-weight: 600;
+        font-family: PingFangSC-Semibold;
+      }
+
+      .colored {
+        color: #1D3FFF
+      }
+    }
+    .tab-content-bg{
+      background: rgba(0,70,156,0.10);
+    }
+    img {
+        width:16px;
+      height: 16px;
+      // margin-right:5.7px;
+    }
+    .tab-content:nth-of-type(2) {
+      margin-left: 7px;
+    }
+  }
+</style>
diff --git a/src/pages/functionCenter/function-list.vue b/src/pages/functionCenter/function-list.vue
index 84a5b73e1de12a11be3bb689d56bd8b67e675908..24096f5e22c34e3245a288b1af3b53327eede63d 100755
--- a/src/pages/functionCenter/function-list.vue
+++ b/src/pages/functionCenter/function-list.vue
@@ -98,6 +98,15 @@
             <img src="@/assets/functionCenter/in@2x.png" alt="">
           </div>
         </div>
+        <div class="info-content">
+          <div class="add-name">
+            <img src="@/assets/functionCenter/car@2x.png" alt="">
+            <div class="name-title">延期申请</div>
+          </div>
+          <div class="add-content" @click="goExtensionApply">
+            <img src="@/assets/functionCenter/in@2x.png" alt="">
+          </div>
+        </div>
         <!-- <div class="info-content">
           <div class="add-name">
             <img src="@/assets/functionCenter/con-sign@2x.png" alt="">
@@ -606,6 +615,21 @@ export default {
         hlsPopup.showLongCenter('请先进行用户绑定')
       }
     },
+    // 进入延期申请
+    goExtensionApply () {
+      let vm = this
+      if (vm.bp_id) {
+        if (vm.user_bp_type === 'OFFICE' || vm.user_bp_type === 'FACTORY') {
+          hlsPopup.showLongCenter('您当前角色非承租人或担保人或经销商,无法使用该功能!')
+        } else {
+          vm.$router.push({
+            name: 'extensionApplyList',
+          })
+        }
+      } else {
+        hlsPopup.showLongCenter('请先进行用户绑定')
+      }
+    },
   },
 }
 </script>
@@ -844,8 +868,8 @@ export default {
       border-radius: 0.4rem;
       width: 80%;
       margin-left: 10%;
-      // margin-top: 10.8rem;
-      margin-top: 9.8rem;
+       margin-top: 10.8rem;
+      //margin-top: 9.8rem;
       margin-bottom: 1.5rem;
       //  position: absolute;
       // z-index: 2;
diff --git a/src/router/index.js b/src/router/index.js
index d29c52123241dab40975d492f837e7c98b9cf6ea..677f84b4bd6cc7b4f678ad7b4fbb0d4cac4e096b 100755
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -165,6 +165,9 @@ const overTimeQueryDetail = resolve => require.ensure([], () => { resolve(requir
 const overTimeApplyList = resolve => require.ensure([], () => { resolve(require('@/pages/overTimeApply/list')) }, 'overTimeApply')
 const overTimeApplyDetail = resolve => require.ensure([], () => { resolve(require('@/pages/overTimeApply/detail')) }, 'overTimeApply')
 
+// 延期申请
+const extensionApplyList = resolve => require.ensure([], () => { resolve(require('@/pages/extensionApply/apply-list')) }, 'extensionApply')
+const extensionApplyDetail = resolve => require.ensure([], () => { resolve(require('@/pages/extensionApply/apply-detail')) }, 'extensionApply')
 Vue.use(Router)
 
 export default new Router({
@@ -431,6 +434,18 @@ export default new Router({
       name: 'overTimeApplyDetail',
       meta: { keepAlive: false },
     },
+    {
+      path: '/extension-apply-list',
+      component: extensionApplyList,
+      name: 'extensionApplyList',
+      meta: { keepAlive: false },
+    },
+    {
+      path: '/extension-apply-detail',
+      component: extensionApplyDetail,
+      name: 'extensionApplyDetail',
+      meta: { keepAlive: false },
+    },
   ],
   scrollBehavior (to, from, savedPosition) {
     if (to.hash) {