转pdf

src/api/hzyb/report.js

@@ -82,4 +82,21 @@ export const apiPublicBannerList = params=>{
  */
 export const bannerHistoryList = params=>{
     return get('/public/banner_history/list',params)
+}
+
+/**
+ * banner图获取报名二维码
+ * @returns 
+ */
+export const getBannerQrcode = params=>{
+    return get('/public/banner/get_qrcode',params)
+}
+
+
+/**
+ * banner图详情
+ * @returns 
+ */
+export const getBannerDetail = params=>{
+    return get('/public/banner/detail',params)
 }

src/router/hzyb/index.js

@@ -95,5 +95,10 @@ export const hzybRoutes=[
                 component:()=> import("@/views/hzyb/forexCalendar/Detail.vue")
             }
         ]
-    }
+    },
+    {
+        path:'/hzyb/surveyDetail',
+        name:'surveyDetail',
+        component: () => import("@/views/hzyb/report/surveyDetail.vue"),
+    },
 ]

src/views/hzyb/report/surveyDetail.vue

@@ -0,0 +1,77 @@
+<script setup>
+import { onMounted, ref } from "vue";
+import { getBannerQrcode, getBannerDetail } from "@/api/hzyb/report";
+
+import { useRoute, useRouter } from "vue-router";
+const route = useRoute();
+const router = useRouter();
+
+const codeImg = ref("");
+async function getCodeImg() {
+  const res = await getBannerQrcode({
+    UserId: route.query.userId,
+    BannerId: route.query.bannerId,
+    Remark: route.query.remark,
+  });
+  if (res.code === 200) {
+    codeImg.value = res.data;
+  }
+}
+
+const bannerImg = ref("");
+
+async function getBannerImg() {
+  const res = await getBannerDetail({
+    banner_id: route.query.bannerId,
+  });
+  if (res.code === 200) {
+    bannerImg.value = res.data.jump_url_mobile;
+  }
+}
+
+// xcx_h5/hzyb/surveyDetail?token=e235b413337f3efc4db3a0b86c78ce4bdd141bf0d0410dd4b2bab561005b41a2&userId=83664&bannerId=4&remark=炼油调研
+
+onMounted(() => {
+  console.log(route.query);
+  localStorage.setItem("hzyb-token", route.query.token);
+  getCodeImg();
+  getBannerImg();
+});
+</script>
+
+<template>
+  <div class="survey-container">
+    <img class="survey-bg-img" :src="bannerImg" />
+    <div class="r-code">
+      <img :src="codeImg" />
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+* {
+  padding: 0;
+  margin: 0;
+}
+.survey-container {
+  position: relative;
+  width: 100%;
+  height: auto;
+  .survey-bg-img {
+    width: 100%;
+    height: 100%;
+  }
+  .r-code {
+    position: absolute;
+    left: 50%;
+    bottom: 200px;
+    width: 256px;
+    height: 256px;
+    transform: translateX(-50%);
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+}
+</style>