通知中心

src/views/user_manage/active_list.vue

@@ -15,6 +15,9 @@
             <el-button type="primary" icon="el-icon-plus" @click="$refs.addActive.show()">
                 添加活动
             </el-button>
+            <el-button type="primary" icon="el-icon-plus" @click="$refs.downloadQR.show()">
+                下载会员充值二维码
+            </el-button>
         </div>
         <div class="head-container">
             <el-table :data="tableData.data" v-loading="tableData.loading">
@@ -51,17 +54,19 @@
                 @current-change="paginationChange" layout="total"></el-pagination>
         </div>
         <addActive ref="addActive" @success="getTableData" />
+        <QR ref="downloadQR"></QR>
     </div>
 </template>
 
 <script>
 import handselTypes from './handselTypes'
 import addActive from './components/addActive'
+import QR from './components/downloadQR.vue'
 import { findActivate, modityActivate } from '@/api/shop'
 import dayjs from 'dayjs'
 export default {
     components: {
-        addActive
+        addActive,QR
     },
     data() {
         return {

src/views/user_manage/components/downloadQR.vue

@@ -0,0 +1,76 @@
+<template>
+    <div class="downloadQR" v-show="isshow">
+        <div class="box">
+            <img :src="imgUrl" style="width: 300px;height: 300px;" alt="">
+            <div class="btnStyle">
+                <el-button type="primary" @click="isshow = false">取消</el-button>
+                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                <a :href="imgUrl"><el-button type="primary" @click="downImg">下载</el-button></a>
+            </div>
+
+        </div>
+    </div>
+</template>
+<script>
+import { getwxacode } from '@/api/shop'
+
+export default {
+    data() {
+        return {
+            isshow: false,
+            imgUrl: ""
+        }
+    },
+    mounted() {
+        this.getlist()
+    },
+    methods: {
+        show() {
+            this.isshow = true
+        },
+        async getlist() {
+            let res = await getwxacode({
+                shopId: localStorage.getItem('shopId')
+            })
+            this.imgUrl = res
+        }, downImg() {
+            // window.location.href()
+            window.URL.revokeObjectURL(this.imgUrl)
+        }
+    }
+}
+</script>
+<style scoped lang="scss">
+.downloadQR {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: rgba($color: #000000, $alpha: .6);
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 9999;
+
+    .box {
+        padding: 20px;
+        border-radius: 3px;
+        height: 400px;
+        width: 340px;
+        background-color: #fff;
+        display: flex;
+        // align-items: center;
+        // justify-content: center;
+        flex-direction: column;
+
+    }
+
+
+
+    .btnStyle {
+        margin-top: 20px;
+        text-align: center;
+    }
+}
+</style>