feat: 批量签署

src/pages/carConfirm/batchSign.vue

@@ -9,12 +9,17 @@
 
         <scroll ref="scrollLists" :updateData="[prolists]" :pullUp="false">
             <div class="scroll-box">
-                <div class="box" v-for="item of list" :key="item.id" @click="doCheck(item.id)">
+                <div
+                    class="box"
+                    v-for="item of list"
+                    :key="item.project_id"
+                    @click="doCheck(item.project_id)"
+                >
                     <div class="name">
                         <img src="@/assets/login/contract.png" alt="icon" />
-                        <span>{{ item.name }}</span>
+                        <span>{{ item.project_name }}</span>
                     </div>
-                    <div>{{ item.id }}</div>
+                    <div>{{ item.project_number }}</div>
                 </div>
             </div>
         </scroll>
@@ -24,61 +29,51 @@
         </button>-->
 
         <bottom-tab class="add-box">
-            <tab-button class="before" >签署电子合同</tab-button>
-            <tab-button class="next"  >提交审核</tab-button>
+            <tab-button class="before" @click.native="signContact">签署电子合同</tab-button>
+            <tab-button class="next" @click.native="submit">提交审核</tab-button>
         </bottom-tab>
     </h-view>
 </template>
 
 <script>
-
 export default {
     name: 'myBindUser',
     data() {
         return {
             prolists: [],
             title: this.$route.query.name === 'confirmList' ? '批量签署电子合同' : '',
-
-            list: [
-                {
-                    id: 13434343434343,
-                    name: '签署合同',
-                },
-                {
-                    id: 23434343434343,
-                    name: '签署合同',
-                },
-                {
-                    id: 34343434343,
-                    name: '签署合同',
-                },
-                {
-                    id: 44343434343434,
-                    name: '签署合同',
-                },
-                {
-                    id: 44343434343434,
-                    name: '签署合同',
-                },
-                {
-                    id: 44343434343434,
-                    name: '签署合同',
-                },
-                {
-                    id: 44343434343434,
-                    name: '签署合同',
-                }, 
-            ]
+            list: JSON.parse(window.localStorage.getItem('handleContact')),
         }
     },
-    beforeRouteEnter(to, from, next) {
-        next(vm => {
-        })
-    },
     methods: {
+        // 提交
+        async submit() {
+        },
+        // 签署
+        async signContact() {
+            let url = process.env.basePath + 'batch_sign';
+            let param = {
+                "master": {
+                    "project_id": this.list.map(item => item.project_id),
+                    "bp_id": JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_id
+                }
+            }
+            hlsPopup.showLoading('请稍候');
+            let res = await this.$post(url, param);
+            this.hlsPopup.hideLoading()
+
+            if (res.result == 'S' && res.info.msg === 'success') {
+                this.$router.push({
+                    name: 'ElectronicSign',
+                    params: { url: res.info.data.url },
+                })
+            } else {
+                hlsPopup.showLongCenter(res.message || res.info.msg)
+            }
+        },
         doCheck(id) {
             this.list = this.list.map(item => {
-                item.checked = item.id == id;
+                item.checked = item.project_id == id;
                 return item;
             })
         },
@@ -129,7 +124,7 @@ export default {
                 margin-right: 7px;
             }
         }
-    } 
+    }
 
     .content {
         position: absolute;
@@ -143,7 +138,7 @@ export default {
 }
 
 .platform-ios {
-    #batch-sign  {
+    #batch-sign {
         .scrollContent {
             padding-top: 2.32rem;
             padding-bottom: 50px;
@@ -159,7 +154,7 @@ export default {
                 padding-top: 2.72rem;
             }
         }
-    } 
+    }
 }
 
 // iPhoneXR适配
@@ -170,6 +165,6 @@ export default {
                 padding-top: 2.72rem;
             }
         }
-    } 
+    }
 }
 </style>

src/pages/contractSigning/contract-signing.vue

 <template>
   <h-view id="contract-signing">
-    <h-header :proportion="[5,1,1]" class="bar-custom">
+    <h-header :proportion="[5, 1, 1]" class="bar-custom">
       <div slot="left" class="h-header-btn">
-        <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
+        <img src="@/assets/userBind/arrow.png" @click="$routeGo()" />
         <span>融租方案确认</span>
       </div>
     </h-header>
     <div class="tab-style has-header">
-      <div :class="{'done':num === 1,'undone':num !== 1}" @click="num = 1;"><img :src="num === 1?check1:uncheck1"><span>待确认</span></div>
-      <div :class="{'done':num === 2,'undone':num !== 2}" @click="num = 2;"><img :src="num === 2?check2:uncheck2"><span>已确认</span></div>
+      <div :class="{ 'done': num === 1, 'undone': num !== 1 }" @click="num = 1;  isRadio = false">
+        <img :src="num === 1 ? check1 : uncheck1" />
+        <span>待确认</span>
+      </div>
+      <div :class="{ 'done': num === 2, 'undone': num !== 2 }" @click="num = 2; isRadio = false">
+        <img :src="num === 2 ? check2 : uncheck2" />
+        <span>已确认</span>
+      </div>
     </div>
     <!-- 搜索 -->
     <div class="search">
-      <input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称">
+      <input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称" />
     </div>
 
-    <scroll
-      ref="scroll"
-      :updateData="[showLists]"
-      :pullUp="true"
-      @pullingUp="loadMore"
-    >
+    <scroll ref="scroll" :updateData="[showLists]" :pullUp="true" @pullingUp="loadMore">
       <div class="wrap">
-        <div v-for="(item,index) in showLists" :key="index" class="contract-lists" >
+        <div v-for="(item,index) in showLists" :key="index" class="contract-lists">
           <div class="pro-code" @click="goDetails(item)">
-            <img src="@/assets/distributorSign/fileIcon.png" alt="" class="file-icon">
+            <img src="@/assets/distributorSign/fileIcon.png" alt class="file-icon" />
             <p>
               <span>合同号</span>
               <span>{{ item.project_number }}</span>
             </p>
-            <img src="@/assets/constractSigning/righticon.png" alt="" class="arrow">
+            <img src="@/assets/constractSigning/righticon.png" alt class="arrow" />
           </div>
           <div class="box">
-            <div><p>承租人</p><p>{{ item.bp_name }}</p></div>
-            <div><p>合同名称</p><p>{{ item.project_name }}</p></div>
-            <div><p>合同租金</p><p class="money">{{ item.total_price|currency }}</p></div>
-            <div><p>产品名称</p><p>{{ item.division_n }}</p></div>
-            <div><p>申请时间</p><p>{{ dateConverse(item.confirm_start_date) }}</p></div>
+            <div
+              v-show="isRadio"
+              style=" flex: 0 1 50px"
+              class="check-box"
+              @click.stop="clickRadio(item)"
+            >
+              <div v-show="!item.checked"></div>
+              <img v-show="item.checked" src="@/assets/contractCreate/selected.png" alt="已选择" />
+            </div>
+            <div
+              class="text"
+              style="flex: 0 1 calc(100vw - 55px)"
+              :style="{ marginLeft: !isRadio ? '50px' : '0' }"
+            >
+              <div>
+                <p>承租人</p>
+                <p>{{ item.bp_name }}</p>
+              </div>
+              <div>
+                <p>合同名称</p>
+                <p>{{ item.project_name }}</p>
+              </div>
+              <div>
+                <p>合同租金</p>
+                <p class="money">{{ item.total_price | currency }}</p>
+              </div>
+              <div>
+                <p>产品名称</p>
+                <p>{{ item.division_n }}</p>
+              </div>
+              <div>
+                <p>申请时间</p>
+                <p>{{ dateConverse(item.confirm_start_date) }}</p>
+              </div>
+            </div>
           </div>
         </div>
       </div>
     </scroll>
+    <div class="check-bottom">
+      <div class="choose" v-show="isRadio">
+        <div class="radio" @click="allChoose(!chooseAll)">
+          <img v-show="chooseAll" src="@/assets/login/radio.png" alt="radio" />
+          <div class="no-check" v-show="!chooseAll"></div>
+          <span :style="{ color: chooseAll ? '#1d3fff' : 'rgb(212,214,212)' }">全选</span>
+        </div>
+        <button class="cancel" @click="cancelRadio">× 取消批量</button>
+        <button
+          class="sign"
+          @click="signContract"
+        >签订电子合同</button>
+      </div>
+
+      <button v-show="num == 1 && !isRadio" class="go-radio" @click="isRadio = true">
+        <img src="@/assets/login/write.png" alt="icon" />
+        <span>批量签署</span>
+      </button>
+    </div>
     <div v-if="showLists.length === 0">
       <div class="display">
-        <img src="@/assets/messageCenter/noMsg.png" alt="">
+        <img src="@/assets/messageCenter/noMsg.png" alt />
       </div>
     </div>
   </h-view>
@@ -56,7 +106,7 @@ import unCheck1 from '@/assets/constractSigning/no-undone.png'
 import unCheck2 from '@/assets/constractSigning/yes-undone.png'
 
 export default {
-  data () {
+  data() {
     return {
       num: 1,
       pagenum: 1,
@@ -73,11 +123,14 @@ export default {
       showLists: [],
       lists: [],
       approvedFlag: false,
+
+      chooseAll: false,
+      isRadio: false,
     }
   },
   watch: {
     'num': {
-      handler (newVal, oldVal) {
+      handler(newVal, oldVal) {
         // this.$refs.scroll.update(false)
         if (newVal === 2) {
           if (!this.approvedFlag) {
@@ -91,7 +144,7 @@ export default {
         }
       },
     },
-    searchInput () {
+    searchInput() {
       let vm = this
       if (vm.timeout) {
         clearTimeout(vm.timeout)
@@ -101,13 +154,13 @@ export default {
       }, 1000)
     },
   },
-  activated () {
+  activated() {
 
   },
-  created () {
+  created() {
 
   },
-  beforeRouteEnter (to, from, next) {
+  beforeRouteEnter(to, from, next) {
     next(vm => {
       if (from.name === 'MyInfo' || from.name === 'MyContract') {
         vm.num = 1
@@ -133,17 +186,39 @@ export default {
     })
   },
   methods: {
-    dateConverse (date) {
+    signContract() {
+      let list = this.showLists.filter(item => item.checked);
+      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.showLists.every(item => item.checked);
+    },
+    allChoose(status) { 
+      this.chooseAll = status; 
+      this.showLists = this.showLists.map(item => {
+        item.checked = status;
+        return item;
+      });  
+    },
+    cancelRadio() {
+      this.isRadio = false;   // 关闭多选菜单
+      this.allChoose(false);  // 关闭全选按钮
+    },
+    dateConverse(date) {
       return date.replace(/\//g, '-')
     },
     // 合同查询
-    contractList () {
+    contractList() {
       let vm = this
       if (vm.num === 1) {
         let url = $config.basePath + 'prj_confirm_list_query'
         let param = {
           // user_phone: window.localStorage.user_phone,
-           bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+          bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
           pagesize: 10,
           pagenum: vm.submitPagenum,
           confirm_status: 'SUBMIT',
@@ -153,7 +228,10 @@ export default {
         vm.hlsHttp.post(url, param).then(function (res) {
           vm.hlsPopup.hideLoading()
           if (res.result === 'S') {
-            vm.submitLists = res.lists
+            vm.submitLists = res.lists.map(item => {
+              item.checked = false;
+              return item;
+            })
             vm.showLists = vm.submitLists
             if (res.lists.length > 0 && res.lists.length < 10) {
               vm.$refs.scroll.update(true)
@@ -172,14 +250,17 @@ export default {
           searchInput: vm.searchInput,
           confirm_status: 'APPROVED',
           // user_phone: window.localStorage.user_phone,
-           bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+          bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
         }
         vm.hlsPopup.showLoading('数据加载中')
         vm.hlsHttp.post(url, param).then(function (res) {
           vm.hlsPopup.hideLoading()
           if (res.result === 'S') {
             console.log(res.lists)
-            vm.approvedLists = res.lists
+            vm.approvedLists = res.lists.map(item => {
+              item.checked = false;
+              return item;
+            })
             vm.approvedFlag = true
             vm.showLists = vm.approvedLists
             if (res.lists.length > 0 && res.lists.length < 10) {
@@ -194,14 +275,14 @@ export default {
       }
     },
 
-    loadMore () {
+    loadMore() {
       let vm = this
       if (vm.num === 1) {
         vm.submitPagenum++
         let url = $config.basePath + 'prj_confirm_list_query'
         let param = {
           // user_phone: window.localStorage.user_phone,
-           bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+          bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
           pagesize: 10,
           pagenum: vm.submitPagenum,
           confirm_status: 'SUBMIT',
@@ -236,7 +317,7 @@ export default {
         let url = $config.basePath + 'prj_confirm_list_query'
         let param = {
           // user_phone: window.localStorage.user_phone,
-           bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+          bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
           pagesize: 10,
           pagenum: vm.approvedPagenum,
           confirm_status: 'APPROVED',
@@ -268,13 +349,13 @@ export default {
         })
       }
     },
-    async submitSearch () {
+    async submitSearch() {
       let vm = this
       vm.submitPagenum = 1
       let url = $config.basePath + 'prj_confirm_list_query'
       let param = {
         // user_phone: window.localStorage.user_phone,
-         bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+        bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
         pagesize: 10,
         pagenum: vm.submitPagenum,
         confirm_status: 'SUBMIT',
@@ -284,7 +365,10 @@ export default {
       let res = await vm.$post(url, param)
       if (res.result === 'S') {
         vm.hlsPopup.hideLoading()
-        vm.submitLists = res.lists
+        vm.submitLists = res.lists.map(item => {
+          item.checked = false;
+          return item;
+        })
         if (vm.num === 1) {
           vm.showLists = vm.submitLists
         }
@@ -300,20 +384,23 @@ export default {
         return false
       }
     },
-    approvedearch () {
+    approvedearch() {
       let vm = this
       let url = $config.basePath + 'prj_confirm_list_query'
       vm.approvedPagenum = 1
       let param = {
         // user_phone: window.localStorage.user_phone,
-         bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
+        bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
         pagesize: 10,
         pagenum: vm.approvedPagenum,
         confirm_status: 'APPROVED',
         searchInput: vm.searchInput,
       }
       vm.hlsHttp.post(url, param).then(function (res) {
-        vm.approvedLists = res.lists
+        vm.approvedLists = res.lists.map(item => {
+          item.checked = false;
+          return item;
+        })
         if (vm.num === 2) {
           vm.showLists = vm.approvedLists
         }
@@ -325,14 +412,14 @@ export default {
         }
       })
     },
-    async search () {
+    async search() {
       let res = await this.submitSearch()
       if (res) {
         this.approvedearch()
       }
     },
 
-    goDetails (item) {
+    goDetails(item) {
       this.$router.push({
         name: 'ContractDetail',
         params: {
@@ -348,10 +435,10 @@ export default {
 </script>
 
 <style lang="less" type="text/less">
-#contract-signing{
+#contract-signing {
   .display {
-      width: 100%;
-      height: 100%;
+    width: 100%;
+    height: 100%;
     position: fixed;
     // top: 0;
     img {
@@ -360,131 +447,217 @@ export default {
       // margin-top: -70px;
     }
   }
-  .tab-style{
-    display:flex;
+  .tab-style {
+    display: flex;
     width: 100%;
     justify-content: center;
-    padding-top:12px;
+    padding-top: 12px;
     padding-bottom: 8px;
     align-items: center;
     background-color: #fff;
-    box-shadow:0 2px 3px 0  rgba(220,220,221,0.50);
+    box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.5);
     position: absolute;
     z-index: 999;
 
-    div{
+    div {
       position: relative;
       height: 32px;
       width: 172px;
-      border-radius:16px;
+      border-radius: 16px;
       border-radius: 16px;
       font-family: PingFangSC-Semibold;
       font-size: 14px;
       letter-spacing: 0.43px;
-      margin:  0 4px;
+      margin: 0 4px;
       line-height: 32px;
     }
-    .undone{
-      background: rgba(220,220,221,0.26);
-      color: #383F45;
+    .undone {
+      background: rgba(220, 220, 221, 0.26);
+      color: #383f45;
     }
-    .done{
-      background: rgba(0,70,156,0.10);
-      color: #00469C;
+    .done {
+      background: rgba(0, 70, 156, 0.1);
+      color: #00469c;
     }
 
-    img{
+    img {
       height: 20px;
       display: block;
       float: left;
       margin: 6px 0 0 43px;
     }
 
-    span{
+    span {
       position: absolute;
-      left:70px;
+      left: 70px;
     }
   }
 
-  .search {
-      background-color: #fff;
-      padding: 8px 12px;
-      position: absolute;
-      width: 100%;
-      z-index: 100;
-      margin-bottom: 8px;
-      margin-top: 52px;
-      input {
-        padding-left: 12px;
-        border-radius: 4px;
-        height: 36px;
-        width: 100%;
-        font-family: PingFangSC-Regular;
-        font-size: 14px;
-        color: #888C8F;
-        line-height: 36px;
-        background: url("../../assets/contractStart/search1.png") 320px no-repeat;
-        background-size: 16px 16px;
-        background-color: rgba(239, 239, 239, 0.55);
+  .check-bottom {
+    width: 100%;
+    height: 60px;
+    background-color: #fff;
+    position: absolute;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .go-radio {
+      width: 90%;
+      color: #fff;
+      background-color: #1d3fff;
+      padding: 7px 10px;
+      border-radius: 5px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 0.15rem;
+      img {
+        width: 16px;
+        margin-right: 4px;
       }
+    }
+
+    .choose {
+      width: 100%;
+      display: flex;
+      justify-content: space-evenly;
+      align-items: center;
+      height: 100%;
+      font-size: 0.25rem;
+    }
 
-      input::placeholder {
-        font-family: PingFangSC-Regular;
-        font-size: 14px;
-        color: #888C8F;
-        letter-spacing: 0;
+    .radio {
+      display: flex;
+      align-items: center;
+      color: #1d3fff;
+      img {
+        width: 24px;
       }
-      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;
+      .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 40px;
+      border-radius: 3px;
+    }
+  }
+
+  .search {
+    background-color: #fff;
+    padding: 8px 12px;
+    position: absolute;
+    width: 100%;
+    z-index: 100;
+    margin-bottom: 8px;
+    margin-top: 52px;
+    input {
+      padding-left: 12px;
+      border-radius: 4px;
+      height: 36px;
+      width: 100%;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #888c8f;
+      line-height: 36px;
+      background: url("../../assets/contractStart/search1.png") 320px no-repeat;
+      background-size: 16px 16px;
+      background-color: rgba(239, 239, 239, 0.55);
+    }
+
+    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;
+    }
+  }
 
   .wrap {
+    width: 100%;
+    padding: 8px;
+    .contract-lists {
       width: 100%;
-      padding: 8px;
-      .contract-lists {
+      background: #fff;
+      margin-bottom: 8px;
+      border-radius: 2px;
+      .pro-code {
+        height: 44px;
         width: 100%;
-        background: #fff;
-        margin-bottom: 8px;
-        border-radius: 2px;
-        .pro-code {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+
+        .file-icon {
+          width: 30px;
+          height: 30px;
+          margin-left: 10px;
+        }
+        p {
           height: 44px;
-          width: 100%;
+          line-height: 44px;
+          margin-left: 10px;
+          flex: 1;
+          font-family: PingFangSC-Semibold;
+          font-size: 15px;
+          color: #4b4a4b;
+          letter-spacing: 0;
+          border-bottom: 1px solid #f3f3f7;
+        }
+        .arrow {
+          height: 16px;
+          width: 16px;
+          margin-right: 10px;
+          margin-left: -8px;
+        }
+      }
+      .box {
+        // margin-left: 50px;
+        // margin-right: 19px;
+        display: flex;
+
+        .check-box {
+          height: 100px;
           display: flex;
-          flex-direction: row;
+          justify-content: center;
           align-items: center;
 
-          .file-icon {
-            width: 30px;
-            height: 30px;
-            margin-left: 10px;
-          }
-          p {
-            height: 44px;
-            line-height: 44px;
-            margin-left: 10px;
-            flex: 1;
-            font-family: PingFangSC-Semibold;
-            font-size: 15px;
-            color: #4B4A4B;
-            letter-spacing: 0;
-            border-bottom: 1px solid #F3F3F7
+          div {
+            width: 0.32rem;
+            height: 0.32rem;
+            border: 0.02rem solid #1d3fff;
+            border-radius: 0.06rem;
           }
-          .arrow {
-            height: 16px;
-            width: 16px;
-            margin-right: 10px;
-            margin-left: -8px;
+
+          img {
+            width: 0.32rem;
           }
         }
-        .box {
-          margin-left: 50px;
+
+        .text {
           margin-right: 19px;
           div {
-            width: 100%;
             padding: 8px 0;
             line-height: 18px;
             display: flex;
@@ -493,7 +666,7 @@ export default {
             .money {
               font-family: Verdana-Bold;
               font-size: 14px;
-              color: #4B4A4B;
+              color: #4b4a4b;
               letter-spacing: 0;
               font-weight: 600;
             }
@@ -505,53 +678,54 @@ export default {
               font-size: 14px;
               letter-spacing: 0;
             }
-            p:nth-of-type(1){
+            p:nth-of-type(1) {
               width: 32%;
               left: 0;
-              color: rgba(75,74,75,0.60);
+              color: rgba(75, 74, 75, 0.6);
             }
-            p:nth-of-type(2){
+            p:nth-of-type(2) {
               right: 0;
-              color: #4B4A4B;
+              color: #4b4a4b;
             }
           }
         }
       }
     }
-  .content{
+  }
+  .content {
     position: absolute;
-      top:0;
+    top: 0;
+  }
+  .scrollContent {
+    padding-top: 3rem;
+    padding-bottom: 20px;
   }
-  .scrollContent{
-     padding-top: 3rem;
-      padding-bottom: 20px;
-    }
 }
 .platform-ios {
+  #contract-signing {
+    .scrollContent {
+      padding-top: 3.4rem;
+    }
+  }
+}
+// iPhoneX适配
+@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
+  .platform-ios {
     #contract-signing {
       .scrollContent {
-        padding-top: 3.4rem;
+        padding-top: 3.8rem;
       }
     }
   }
-  // iPhoneX适配
-  @media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
-    .platform-ios {
-      #contract-signing {
-        .scrollContent {
-          padding-top: 3.8rem;
-        }
+}
+// iPhoneXR适配
+@media (device-width: 414px) and (device-height: 896px) {
+  .platform-ios {
+    #contract-signing {
+      .scrollContent {
+        padding-top: 3.8rem;
       }
-    }
-  }
-  // iPhoneXR适配
-  @media (device-width: 414px) and (device-height: 896px) {
-    .platform-ios {
-      #contract-signing {
-        .scrollContent {
-          padding-top: 3.8rem;
-        }
-        .search {
+      .search {
         input {
           background: url("../../assets/contractStart/search1.png") 320px
             no-repeat;
@@ -565,7 +739,7 @@ export default {
           color: #888c8f;
         }
       }
-      }
     }
   }
+}
 </style>

src/pages/myInfo/myBindUser.vue

@@ -29,7 +29,12 @@
                         <div
                             :class="['normal', { unbind: item.bp_status === 'APPROVED' }]"
                             @click.stop="doStatus(item)"
-                        >{{ item.bp_status === 'APPROVED' ? '× 解绑' : item.bp_status_n }}</div>
+                        >
+                            <span
+                                style="font-size: .3rem;"
+                            >{{ item.bp_status === 'APPROVED' ? '×' : '' }}</span>
+                            {{ item.bp_status === 'APPROVED' ? ' 解绑' : item.bp_status === 'NEW' ? '待提交' : item.bp_status_n }}
+                        </div>
                     </div>
                 </div>
             </div>
@@ -80,16 +85,24 @@ export default {
             NowItem: {}, // 当前操作对象
         }
     },
-    mounted() { 
+    mounted() {
         this.getList()
     },
     methods: {
         // 未认证进行人脸 认证
-        face(item) {
+        async face(item) {
             let vm = this;
             let register = ['NP_NO', 'ORG_NO', 'ORG_L_NO', 'ORG_AUTH_NO'];
             if (register.includes(item.bp_identity)) {
 
+                //  人脸识别之前要确认是否已经在别的渠道已经绑定。  
+                let res = await vm.getNpCertificationUrl(item)
+                if (res) {
+                    hlsPopup.showLongCenter(item.bp_identity === 'ORG_NO' ? '请联系业务人员协助认证' : '认证已通过');
+                    return vm.getList();
+                }
+
+                // 正式进行人脸识别
                 let url = process.env.basePath + 'bp_query'
                 let param = { bp_id: item.bp_id }
                 hlsPopup.showLoading('请稍候')
@@ -103,10 +116,12 @@ export default {
                                 idName: data.bp_name,
                                 phoneNum: window.localStorage.user_phone,
                             },
-                            function (suc) {
+                            async function (suc) {
                                 let success = JSON.parse(suc)
                                 if (success.code === 1) {
-                                    vm.getNpCertificationUrl(item)
+                                    let res = await vm.getNpCertificationUrl(item)
+                                    hlsPopup.showLongCenter(res ? '绑定成功！' : '绑定失败！');
+                                    if (res) vm.getList();
                                 }
                             },
                             function (reason) {
@@ -135,10 +150,12 @@ export default {
             let res = await vm.$post(url, param)
             hlsPopup.hideLoading()
             if (res.info.code === 0 && res.info.data.authUrl) {
-                hlsPopup.showLongCenter('绑定失败！')
+                // hlsPopup.showLongCenter('绑定失败！')
+                return false
             } else if (res.info.code === 0 && res.info.data.openId) {
-                hlsPopup.showLongCenter('绑定成功！')
-                vm.getList()
+                // hlsPopup.showLongCenter('绑定成功！')
+                // vm.getList()
+                return true
             } else {
                 hlsPopup.showLongCenter(res.info.msg)
             }