From 4b8f1e30a4856c38dc18ae81ea3c927b38c921f7 Mon Sep 17 00:00:00 2001
From: duan <1004387497@qq.com>
Date: Wed, 12 Mar 2025 17:21:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E4=BC=9A=E5=91=98?=
 =?UTF-8?q?=E4=BA=8C=E7=BB=B4=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/user/active/indexconfig/api.ts      | 10 ++-
 .../indexconfig/component/AddButton.vue       | 17 +++--
 .../indexconfig/component/downloadQR.vue      | 63 +++++++++++++++++++
 3 files changed, 83 insertions(+), 7 deletions(-)
 create mode 100644 src/views/user/active/indexconfig/component/downloadQR.vue

diff --git a/src/views/user/active/indexconfig/api.ts b/src/views/user/active/indexconfig/api.ts
index 3af6c5b..2981ba8 100644
--- a/src/views/user/active/indexconfig/api.ts
+++ b/src/views/user/active/indexconfig/api.ts
@@ -18,6 +18,14 @@ const AuthAPI = {
       params,
     });
   },
+  // 获取会员码
+getVipCode(data: any) {
+  return request<any, Responseres>({
+    url: `${baseURL}/getVipCode`,
+    method: "post",
+    data: { ...data },
+  });
+},
   // 新增
   add(data: any) {
     return request<any, Responseres>({
@@ -57,4 +65,4 @@ export interface Responseres {
   [property: string]: any;
 }
 
-export default AuthAPI;
\ No newline at end of file
+export default AuthAPI;
diff --git a/src/views/user/active/indexconfig/component/AddButton.vue b/src/views/user/active/indexconfig/component/AddButton.vue
index 90eb9aa..d3869d2 100644
--- a/src/views/user/active/indexconfig/component/AddButton.vue
+++ b/src/views/user/active/indexconfig/component/AddButton.vue
@@ -1,19 +1,24 @@
 <template>
   <el-button type="primary" icon="Plus" @click="addEvent">新增</el-button>
-  <el-button type="primary" icon="Plus" @click="addEvent">下载会员充值二维码</el-button>
+  <el-button type="primary" icon="Plus" @click="toUrl()">下载会员充值二维码</el-button>
   <br />
   <div style="margin-top: 10px;">
     允许充值自定义金额： <el-switch v-model="value2" class="ml-2" />
   </div>
+  <QR ref="downloadQR"></QR>
+
 </template>
 <script setup>
-import { useRouter } from 'vue-router';
-const router = useRouter();
+import QR from './downloadQR.vue'
+import API from '../api.js'
 const emit = defineEmits(['add']);
-function toUrl(name) {
-  router.push({ name });
+const downloadQR = ref(null)
+async function toUrl() {
+  const shopId = localStorage.getItem("shopId");
+  let res = await API.getVipCode({shopId:shopId});
+  downloadQR.value.show(res)
 }
 function addEvent() {
   emit('add');
 }
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/user/active/indexconfig/component/downloadQR.vue b/src/views/user/active/indexconfig/component/downloadQR.vue
new file mode 100644
index 0000000..11fb63a
--- /dev/null
+++ b/src/views/user/active/indexconfig/component/downloadQR.vue
@@ -0,0 +1,63 @@
+<template>
+  <div class="downloadQR" v-show="datas.isshow">
+    <div class="box">
+      <img :src="datas.imgUrl" style="width: 300px;height: 300px;" alt="">
+      <div class="btnStyle">
+        <el-button type="primary" @click="datas.isshow = false">取消</el-button>
+        <el-button type="primary"><a :href="datas.imgUrl">下载</a></el-button>
+      </div>
+
+    </div>
+  </div>
+</template>
+<script setup>
+let props = defineProps({
+  imgUrl: String,
+});
+let datas = reactive({
+  imgUrl: "",
+  isshow: false,
+});
+
+function show(d) {
+  datas.imgUrl = d;
+  datas.isshow = true;
+}
+
+defineExpose({ show });
+</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 {
+    display: flex;
+    align-items: center;
+    margin-top: 20px;
+    justify-content: space-around;
+  }
+}
+</style>