|
@@ -16,6 +16,7 @@
|
|
|
@stat="stat"
|
|
|
@delete="toDelete"
|
|
|
@order="order"
|
|
|
+ @qrBtn="qrBtn"
|
|
|
:data="list"
|
|
|
:opera="opera"
|
|
|
:total="total"
|
|
@@ -30,6 +31,11 @@
|
|
|
</data-table>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
+ <el-dialog title="绑定" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
|
|
|
+ <div>
|
|
|
+ <img :src="qc" />
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
@@ -38,7 +44,7 @@ import dataTable from '@/components/data-table.vue';
|
|
|
import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
|
|
|
const { mapActions: room } = createNamespacedHelpers('room');
|
|
|
const { mapActions: roomuser } = createNamespacedHelpers('roomuser');
|
|
|
-
|
|
|
+import QRCode from 'qrcode';
|
|
|
export default {
|
|
|
name: 'index',
|
|
|
props: {},
|
|
@@ -65,6 +71,11 @@ export default {
|
|
|
return item.status == '0' ? true : false;
|
|
|
},
|
|
|
},
|
|
|
+ {
|
|
|
+ label: '二维码',
|
|
|
+ icon: 'el-icon-film',
|
|
|
+ method: 'qrBtn',
|
|
|
+ },
|
|
|
{
|
|
|
label: '统计',
|
|
|
icon: 'el-icon-view',
|
|
@@ -91,6 +102,9 @@ export default {
|
|
|
],
|
|
|
list: [],
|
|
|
total: 0,
|
|
|
+ dialogVisible: false,
|
|
|
+ roomid: '',
|
|
|
+ qc: '',
|
|
|
}),
|
|
|
created() {
|
|
|
this.search();
|
|
@@ -134,6 +148,24 @@ export default {
|
|
|
async order({ data }) {
|
|
|
this.$router.push({ path: './detailStatus', query: { id: data.id } });
|
|
|
},
|
|
|
+ // 二维码
|
|
|
+ qrBtn({ data }) {
|
|
|
+ this.dialogVisible = true;
|
|
|
+ this.$set(this, `roomid`, data.id);
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.creatQrCode();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 创建二维码
|
|
|
+ async creatQrCode() {
|
|
|
+ let url = `https://zb.liaoningdoupo.com/api/onlive/auth?type=1&qrcode=${this.roomid}`; // 需要转换为二维码的内容
|
|
|
+ let el = document.getElementById('qrCodeUrl');
|
|
|
+ this.qc = await QRCode.toDataURL(url, { height: 200, width: 200 });
|
|
|
+ },
|
|
|
+ // 关闭
|
|
|
+ handleClose(done) {
|
|
|
+ done();
|
|
|
+ },
|
|
|
},
|
|
|
computed: {
|
|
|
...mapState(['user']),
|
|
@@ -152,4 +184,7 @@ export default {
|
|
|
line-height: 35px;
|
|
|
padding: 0 15px;
|
|
|
}
|
|
|
+/deep/.el-dialog__body {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
</style>
|