二维码

zhjq-ui/src/api/system/voice.js

@@ -52,4 +52,12 @@ export function createQrCode(data) {
   })
 }
 
+// app查询语音播报详细
+export function getAppInfo(id) {
+  return request({
+    url: '/app/voice/app/' + id,
+    method: 'get'
+  })
+}
+
 

zhjq-ui/src/permission.js

@@ -9,7 +9,7 @@ import {isRelogin} from '@/utils/request'
 
 NProgress.configure({showSpinner: false})
 
-const whiteList = ['/login', '/register', '/details']
+const whiteList = ['/login', '/register']
 
 const isWhiteList = (path) => {
   return whiteList.some(pattern => isPathMatch(pattern, path))
@@ -51,6 +51,8 @@ router.beforeEach((to, from, next) => {
     if (isWhiteList(to.path)) {
       // 在免登录白名单，直接进入
       next()
+    } else if (to.path.includes('/details/?id=')) {
+      next()
     } else {
       next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
       NProgress.done()

zhjq-ui/src/router/index.js

@@ -51,9 +51,9 @@ export const constantRoutes = [
     hidden: true
   },
   {
-    path: '/details/:id',
+    path: '/details',
     component: () => import('@/views/system/voice/details/details'),
-    hidden: true
+    hidden: true,
   },
   {
     path: '/404',

zhjq-ui/src/views/system/voice/details/details.vue

@@ -13,7 +13,7 @@
   </div>
 </template>
 <script>
-import {getVoice} from "@/api/system/voice";
+import {getAppInfo} from "@/api/system/voice";
 import {Howl} from 'howler';
 
 export default {
@@ -32,7 +32,8 @@ export default {
   },
 
   mounted() {
-    this.id = this.$route.params.id;
+    // this.id = this.$route.params.id;
+    this.id = this.$route.query.id;
   },
   created() {
     this.getDetails()
@@ -56,7 +57,7 @@ export default {
     },
     getDetails() {
       let that = this
-      getVoice(that.$route.params.id).then(response => {
+      getAppInfo(that.$route.query.id).then(response => {
         this.form = response.data;
         this.richContent = this.form.content
       });

zhjq-ui/src/views/system/voice/index.vue

@@ -67,8 +67,8 @@
       <el-table-column label="二维码" align="center" prop="qrCodeUrl">
         <template slot-scope="scope">
           <el-popover placement="right" trigger="hover">
-            <image-preview :src="getFullUrl(scope.row.qrCodeUrl)" style="width:200px;height:200px;"/>
-            <image-preview slot="reference" :src="getFullUrl(scope.row.qrCodeUrl)" style="max-width: 50px;max-height: 100px"/>
+            <image-preview :src="scope.row.qrCodeUrl" style="width:200px;height:200px;"/>
+            <image-preview slot="reference" :src="scope.row.qrCodeUrl" style="max-width: 50px;max-height: 100px"/>
           </el-popover>
         </template>
       </el-table-column>
@@ -238,16 +238,14 @@ export default {
       var defaultDate = `${year}-${month}-${date}`
       this.$set(this.form, 'releaseTime', defaultDate)
     },
-    getFullUrl(qrCodeUrl) {
-      return `${this.serverUrl}${qrCodeUrl}`;
-    },
     handleQrCode(row) {
       let that = this;
       let params = {
         id: row.id,
         voiceName: row.voiceName,
-        voiceUrl: this.serverUrl + "/details?id=" + row.id,
+        voiceUrl: this.serverUrl + "/details/?id=" + row.id,
       }
+      console.log("params",params)
       createQrCode(params).then(res => {
         if (res.code == 200) {
           that.$modal.msgSuccess("生成成功");