stage：发信账户-直属账户

src/views/business/salaryAccount/ownAcc.vue

@@ -197,6 +197,42 @@
         </div>
       </div>
     </el-dialog>
+    <!-- 扫码签约新弹窗 -->
+    <el-dialog title="扫码签约" class="payThoroughfareDialogStyle" :visible.sync="openPayThoroughfareDialog" width="55%">
+      <div class="thoroughfareMain">
+        <div class="thoroughfareIntroduce">支付宝安全发是由支付宝提供的人力资源发薪通道，需要使用企业支付宝扫码授权，方可使用，具体授权步骤如下图所示:</div>
+        <!-- 开通主体信息部分 -->
+        <div class="thoroughfareConter">
+          <div class="thoroughfareInfo">
+            <div class="stapStyle">【步骤一】</div>
+            <div class="stapInfoStyle">
+              <span>使用</span>
+              <span class="stapInfoBlueStyle">{{ thoroughfareData }}</span>
+              <span>的企业支付宝扫描右侧二维码</span>
+            </div>
+            <div class="stapStyle">【步骤二】</div>
+            <div class="stapInfoStyle">
+              <span>在手机上确认</span>
+              <span class="stapInfoBlueStyle">同意协议并开通</span>
+              <span>此支付宝记账本</span>
+            </div>
+            <div class="stapStyle">【步骤三】</div>
+            <div class="stapInfoStyle">
+              <span>操作完成后大约5-10分钟可点击搜索查看结果</span>
+            </div>
+          </div>
+          <div class="thoroughfareDivider"></div>
+          <div class="thoroughfareQRcode">
+            <!-- <img class="QRcodeImg" :src="thoroughfareUrl" alt=""> -->
+            <qr-code-component class="QRcodeImg" :text="thoroughfareUrl" />
+            <span class="QRcodeText">扫码签约</span>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button class="cancelButton" type="primary" @click="openPayThoroughfareDialog = false">取 消</el-button>
+      </span>
+    </el-dialog>
     <!-- 余额充值组件 -->
     <ownAccBalance ref="ownAccBalance"></ownAccBalance>
     <!-- 服务费充值组件 -->
@@ -280,7 +316,11 @@ export default {
       },
       // 去发薪部分参数
       payVisible: false,
-      cardNo: ''
+      cardNo: '',
+      // 开通通道参数
+      openPayThoroughfareDialog: false,
+      thoroughfareUrl: '',
+      thoroughfareData: ''
     };
   },
   created() {
@@ -357,8 +397,13 @@ export default {
       }
       this.$modal.loading()
       signChannel(singForm).then(resp => {
-        this.openSign.codePanel = true;
-        this.openSign.codeUrl = resp.data
+        // this.openSign.codePanel = true;
+        this.thoroughfareUrl = resp.data
+        console.log('返回的路径', resp.data);
+
+
+        this.openPayThoroughfareDialog = true
+        // this.openSign.codeUrl = resp.data
       }).finally(() => {
         this.$modal.closeLoading()
         this.openSign.panel = false;
@@ -380,6 +425,11 @@ export default {
     /** 绑定账户-选择账户主体执行 */
     selectSignCompany(value) {
       this.openSign.channelCode = null;
+      this.openSign.companyList.forEach(ele => {
+        if (ele.id === value) {
+          this.thoroughfareData = ele.companyName
+        }
+      })
       const channelQuery = {
         unitType: 1,
         companyId: value,
@@ -481,4 +531,106 @@ export default {
     justify-content: space-evenly;
   }
 }
+</style>
+<style lang="scss">
+.payThoroughfareDialogStyle {
+  .el-dialog {
+    margin-top: 18vh !important;
+    border-radius: 6px !important;
+  }
+
+  .el-dialog__header {
+    display: none;
+  }
+
+  .el-dialog__body {
+    padding: 56px 38px 8px !important;
+  }
+
+  .thoroughfareMain {
+    background-color: #F7F8FA;
+    border-radius: 6px;
+    padding: 20px 32px 28px 30px;
+
+    .thoroughfareIntroduce {
+      font-weight: 400;
+      font-size: 16px;
+      color: #333333;
+      line-height: 24px;
+      letter-spacing: 1.5px;
+      padding-left: 8px;
+    }
+
+    .thoroughfareConter {
+      width: 100%;
+      margin-top: 20px;
+      padding-left: 12px;
+      // height: 400px;
+      // background-color: #8df;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+
+      .thoroughfareInfo {
+        width: 60%;
+        font-size: 14px;
+
+        .stapStyle {
+          font-size: 16px;
+          color: #409EFF;
+          margin-bottom: 12px;
+        }
+
+
+
+        .stapInfoStyle {
+          font-size: 14px;
+          color: #333333;
+          margin-bottom: 32px;
+          margin-left: 6px;
+
+          .stapInfoBlueStyle {
+            color: #409EFF;
+          }
+        }
+
+        .stapInfoStyle:last-child {
+          margin-bottom: 0px !important;
+        }
+      }
+
+      .thoroughfareDivider {
+        width: 1px;
+        background-color: #E8E8E8;
+        height: 200px;
+      }
+
+      .thoroughfareQRcode {
+        width: 26%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+
+        .QRcodeImg {
+          width: 100%;
+        }
+
+        .QRcodeText {
+          color: #333;
+          font-size: 14px;
+        }
+      }
+    }
+  }
+
+  .dialog-footer {
+
+    // margin-top: -20px !important;
+    .el-button {
+      padding: 9px 26px;
+      font-size: 14px;
+    }
+  }
+}
 </style>
\ No newline at end of file

src/views/business/taxUnit/channel.vue

@@ -93,7 +93,7 @@
           </div>
           <div class="thoroughfareDivider"></div>
           <div class="thoroughfareQRcode">
-            <img class="QRcodeImg" :src="thoroughfareUrl" alt="">
+            <qr-code-component class="QRcodeImg" :text="thoroughfareUrl" />
             <span class="QRcodeText">扫码签约</span>
           </div>
         </div>
@@ -161,7 +161,7 @@ export default {
       // 开通通道参数
       openPayThoroughfareDialog: false,
       thoroughfareUrl: '',
-      thoroughfareData: {}
+      thoroughfareData: ''
     };
   },
   created() {