添加二维码

dist/static/css/chunk-148bac98.38248537.css

@@ -0,0 +1 @@
+.m-container .m-wrap[data-v-740327ad]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;width:100%}.m-container .m-wrap .newBand[data-v-740327ad]{margin:0 5px 0 10px}.m-container .m-wrap .el-tooltip.micon[data-v-740327ad]{width:20px;height:20px;position:relative;top:12px}[data-v-740327ad] .el-input__icon.el-icon-date{height:40px!important}

dist/static/css/chunk-7a3de81b.a1524d6f.css → dist/static/css/chunk-152003e2.67eb87b9.css

@@ -1 +1 @@
-.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.red[data-v-5dc25896]{color:red}.visibleForm[data-v-5dc25896] .el-input__inner,.visibleForm[data-v-5dc25896] .el-textarea__inner{width:225px!important}
+.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.red[data-v-960ddfd6]{color:red}.visibleForm[data-v-960ddfd6] .el-input__inner,.visibleForm[data-v-960ddfd6] .el-textarea__inner{width:225px!important}

dist/static/css/chunk-523c3930.9aab6607.css → dist/static/css/chunk-3ce189c2.160bca3b.css

@@ -1 +1 @@
-.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.m-container[data-v-6d88bf0e]{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#fff}.newBand[data-v-6d88bf0e]{display:inline-block}
+.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.m-container[data-v-43227fb9]{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#fff}.newBand[data-v-43227fb9]{display:inline-block}

dist/static/css/chunk-4588f2f6.cdce1471.css

@@ -0,0 +1 @@
+.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.newBand[data-v-4ec01fac]{display:inline-block;margin-right:10px}.right-code .title[data-v-4ec01fac]{font-size:18px;text-align:center;padding-bottom:8px}[data-v-4ec01fac] .studentInfo .el-dialog__body{padding-top:0;padding-bottom:0}[data-v-4ec01fac] .studentInfo .multiple.el-select{width:185px!important}

dist/static/css/chunk-4df36711.62dcfca3.css → dist/static/css/chunk-6b3e63bc.64eaf6fd.css

@@ -1 +1 @@
-.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.inputStyle[data-v-5d2b2f36]{width:100px;text-align:center}.title[data-v-0eb05fc4]{margin-bottom:20px}.amap-demo[data-v-0eb05fc4]{height:300px}.inputStyle[data-v-7d789d15]{width:100px;text-align:center}.work[data-v-7d789d15]{margin-bottom:30px;font-size:16px}.visible[data-v-6a4bc26e]{visibility:hidden}.cl-container .topFrom[data-v-6a4bc26e]{margin:20px 30px 0}.cl-container .topFrom .classlist[data-v-6a4bc26e]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.cl-container .topFrom .classlist ul li[data-v-6a4bc26e]{list-style:none}.cl-container .searchForm[data-v-6a4bc26e]{margin:0 30px}.btnWraps[data-v-6a4bc26e]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.btnWraps div[data-v-6a4bc26e]{margin-right:20px}.inputStyle[data-v-6a4bc26e]{width:180px}.red[data-v-6a4bc26e]{color:red}.exportBtn[data-v-6a4bc26e]{background:#13817a}
+.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.inputStyle[data-v-5d2b2f36]{width:100px;text-align:center}.title[data-v-0eb05fc4]{margin-bottom:20px}.amap-demo[data-v-0eb05fc4]{height:300px}.inputStyle[data-v-7d789d15]{width:100px;text-align:center}.work[data-v-7d789d15]{margin-bottom:30px;font-size:16px}.visible[data-v-2ccfcece]{visibility:hidden}.cl-container .topFrom[data-v-2ccfcece]{margin:20px 30px 0}.cl-container .topFrom .classlist[data-v-2ccfcece]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.cl-container .topFrom .classlist ul li[data-v-2ccfcece]{list-style:none}.cl-container .searchForm[data-v-2ccfcece]{margin:0 30px}.btnWraps[data-v-2ccfcece]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.btnWraps div[data-v-2ccfcece]{margin-right:20px}.inputStyle[data-v-2ccfcece]{width:180px}.red[data-v-2ccfcece]{color:red}.exportBtn[data-v-2ccfcece]{background:#13817a}

dist/static/css/chunk-7cccaeb1.9d8f5c75.css

@@ -1 +0,0 @@
-.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.newBand[data-v-7c44e094]{display:inline-block;margin-right:10px}.right-code .title[data-v-7c44e094]{font-size:18px;text-align:center;padding-bottom:8px}[data-v-7c44e094] .studentInfo .el-dialog__body{padding-top:0;padding-bottom:0}[data-v-7c44e094] .studentInfo .multiple.el-select{width:185px!important}

dist/static/css/chunk-018076e2.92462f4a.css → dist/static/css/chunk-8ef0df2c.cdaddac5.css

@@ -1 +1 @@
-.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.micon[data-v-665b3b62]{position:absolute;top:3px;right:2px}
+.pagination-container[data-v-31cb099a]{background:#fff;padding:32px 16px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pagination-container.hidden[data-v-31cb099a]{display:none}.micon[data-v-541bdeaf]{position:absolute;top:3px;right:2px}

dist/static/css/chunk-d1993f12.d5e12101.css

@@ -1 +0,0 @@
-.m-container .m-wrap[data-v-22ddc966]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;width:100%}.m-container .m-wrap .newBand[data-v-22ddc966]{margin:0 5px 0 10px}.m-container .m-wrap .el-tooltip.micon[data-v-22ddc966]{width:20px;height:20px;position:relative;top:12px}[data-v-22ddc966] .el-input__icon.el-icon-date{height:40px!important}

src/views/resetTeaming/components/resetPayList.vue

@@ -8,6 +8,7 @@
       <div class="newBand"
            v-permission="'/studentPayBase'"
            @click="setStudentPay">学员缴费设置</div>
+      <div class="newBand" @click="onCreateQRCode">续费二维码</div>
     </div>
     <div class="tableWrap">
       <el-table style="width: 100%"
@@ -138,6 +139,18 @@
                    @click="resetPayDate">确 定</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog title="续费二维码"
+               :visible.sync="qrcodeStatus"
+               width="300px">
+      <div class="left-code">
+        <div id="qrcode"
+             class="qrcode code"
+             ref="qrCodeUrl"></div>
+        <p class="code-url"
+           v-if="codeUrl">{{ codeUrl }}</p>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -145,6 +158,8 @@ import axios from "axios";
 import { getToken } from "@/utils/auth";
 import pagination from "@/components/Pagination/index";
 import load from "@/utils/loading";
+import QRCode from 'qrcodejs2'
+import { vaildStudentUrl } from '@/utils/validate'
 import { addMusicGroupPaymentCalender, getMusicGroupPaymentCalender, resetMusicGroupPaymentCalender, delMusicGroupPaymentCalender } from "@/api/buildTeam";
 export default {
   components: { pagination },
@@ -176,6 +191,10 @@ export default {
           return time.getTime() + 86400000 <= new Date().getTime();
         }
       },
+      qrcodeStatus: false, // 生成二维码
+      qrcodes: true,
+      qrcode: null,
+      codeUrl: null,
     };
   },
   //生命周期 - 创建完成（可以访问当前this实例）
@@ -203,6 +222,24 @@ export default {
         }
       })
     },
+    onCreateQRCode () { // 生成报名二维码
+      this.qrcodeStatus = true
+      let id = this.$route.query.id
+
+      let teamName = this.$route.query.name
+      setTimeout(() => {
+        document.getElementById('qrcode').innerHTML = '';
+        this.qrcode = new QRCode('qrcode', {
+          width: 200,
+          height: 200,
+          colorDark: '#000000',
+          colorLight: '#ffffff',
+          correctLevel: QRCode.CorrectLevel.H
+        })
+        this.qrcode.makeCode(vaildStudentUrl() + '/#/SporadicLogin?type=renew&musicGroupId=' + id)
+        this.codeUrl = vaildStudentUrl() + '/#/SporadicLogin?type=renew&musicGroupId=' + id
+      }, 500)
+    },
     newPay () {
       this.diTitle = '新增缴费'
       this.isNew = true
@@ -264,6 +301,11 @@ export default {
     }
   },
   watch: {
+    qrcodeStatus (val) {
+      if (!val) {
+        this.qrcode.clear()
+      }
+    },
     payVisible (val) {
       if (!val) {
         this.payForm = {
@@ -286,4 +328,30 @@ export default {
     margin-right: 10px;
   }
 }
+.left-code,
+.right-code {
+  // width: 50%;
+  // float: left;
+  h2 {
+    font-size: 18px;
+    text-align: center;
+    padding-bottom: 8px;
+  }
+
+  .qrcode {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    img {
+      width: 200px;
+      height: 200px;
+      margin: 0 auto;
+    }
+  }
+  .code-url {
+    font-size: 18px;
+    text-align: center;
+    padding: 15px 15px 0 15px;
+  }
+}
 </style>