TBtools-合伙人申请失败新增重新申请按钮

htmldev/loan/src/views/partner/detail/index.vue

@@ -70,7 +70,15 @@
           </div>
         </li>
       </template>
-      <li class="fail" v-if="orderFinalStatus === 2">{{ orderFinalRemark }}</li>
+      <li class="fail" v-if="orderFinalStatus === 2">
+        <p class="title">
+          <span>{{ orderFinalRemark }}</span>
+        </p>
+        <router-link class="jump-join"
+                     :to="{path: '/partner/join' + (this.partnerInviteCode ? '?inviteCode=' + this.partnerInviteCode : '')}"
+                     v-if="checks[2].checkStatus === 2">重新申请
+        </router-link>
+      </li>
       <li class="order-info border-top-1px">
         <p v-if="orderFinalStatus === 1">合伙人编号：{{ inviteCode }}</p>
         <template v-else>
@@ -78,6 +86,15 @@
           <p>申请单号：{{ orderNumber }}</p>
         </template>
       </li>
+      <li class="qrcode-wrap">
+        <div class="qrcode">
+          <img src="./image/public_qrcode.jpg" alt="">
+        </div>
+        <div class="tip">
+          <p>长按识别二维码</p>
+          <p>关注"妥妥推手"公众号</p>
+        </div>
+      </li>
     </ul>
   </div>
 </template>
@@ -91,6 +108,7 @@ export default {
   props: ['id'],
   data () {
     return {
+      partnerInviteCode: '', // 邀请人的邀请码
       orderUserPhone: '',
       orderUserName: '',
       createdAt: '',
@@ -115,7 +133,8 @@ export default {
       const id = this.id
       orderDetail(id).then(res => {
         if (res.status) {
-          const { orderUserPhone, orderUserName, createdAt, orderNumber, orderFinalStatus, commanyPhone, orderFinalRemark, checks, inviteCode, partnerId } = res.data
+          const { partnerInviteCode, orderUserPhone, orderUserName, createdAt, orderNumber, orderFinalStatus, commanyPhone, orderFinalRemark, checks, inviteCode, partnerId } = res.data
+          this.partnerInviteCode = partnerInviteCode
           this.orderUserPhone = orderUserPhone
           this.orderUserName = orderUserName
           this.createdAt = createdAt
@@ -318,7 +337,8 @@ export default {
 }
 
 .jump-compact,
-.jump-goods {
+.jump-goods,
+.jump-join {
   display: block;
   width: 106px;
   height: 44px;
@@ -346,8 +366,8 @@ export default {
   color: #D73634;
 }
 
-.success,
-.fail {
+.success {
+  margin-top: 2px;
   line-height: 25px;
   font-size: 18px;
   font-weight: 600;
@@ -355,19 +375,29 @@ export default {
   color: #D73634;
 }
 
-.success {
-  margin-top: 2px;
-}
-
 .fail {
   width: 311px;
   padding-left: 8px;
   margin: 12px 0 23px;
+
+  .title {
+    span {
+      line-height: 25px;
+      font-size: 18px;
+      font-weight: 600;
+      word-break: break-all;
+      color: #D73634;
+    }
+  }
+
+  .jump-join {
+    margin-left: 40px;
+  }
 }
 
 .order-info {
   width: 329px;
-  padding: 20px 0 24px;
+  padding-top: 20px;
   @include border-top-1px(#E8E8E8);
 
   p {
@@ -381,4 +411,41 @@ export default {
     }
   }
 }
+
+.qrcode-wrap {
+  display: flex;
+  align-items: center;
+  width: 329px;
+  padding-bottom: 24px;
+  margin-top: 10px;
+
+  .qrcode {
+    width: 129px;
+    height: 129px;
+
+    img {
+      display: block;
+      width: 100%;
+    }
+  }
+
+  .tip {
+    p {
+      margin-left: 5px;
+
+      &:nth-of-type(1) {
+        line-height: 22px;
+        font-size: 16px;
+        font-weight: 500;
+        color: #333;
+      }
+
+      &:nth-of-type(2) {
+        line-height: 20px;
+        font-size: 14px;
+        color: #666;
+      }
+    }
+  }
+}
 </style>