Merge branch 'mbx' into pc2.0

src/api/common.js

@@ -54,4 +54,19 @@ export const apiGetEmailCode=params=>{
  */
 export const apiUserLogin=params=>{
 	return post('/user/login',params)
+}
+
+/**
+ * 获取海报
+ * @param code_page 分享海报小程序页面地址
+ * @param code_scene 小程序页面参数
+ * @param source 来源 activity_detail(活动详情) activity_list(活动列表)
+ *                    special_column_list(专栏列表) special_column_detail(专栏详情)
+ *                    report_list(报告列表) report_detail(报告详情)
+ *                    chart_list(图库列表) chart_detail(图库详情)
+ * @param version 
+ * @param pars 生成海报需要的页面参数
+ */
+ export const apiGetPoster=params=>{
+    return post('/public/get_share_poster',{version:'3.0',...params})
 }

src/components/SharePoster.vue

@@ -0,0 +1,127 @@
+<script setup>
+import {ref} from 'vue'
+import { onLongPress } from '@vueuse/core'
+import {apiGetPoster} from '@/api/common'
+
+const props=defineProps({
+    style:Object,
+    shareData:Object
+})
+
+const imgDom=ref(null)
+
+let show=ref(false)
+let showPoster=ref(false)
+let posterImg=ref('')
+
+const handleCreatePoster=async ()=>{
+    show.value=true
+    const res=await apiGetPoster({
+        code_page:props.shareData.code_page,
+        code_scene:props.shareData.code_scene,
+        source:props.shareData.type,
+        pars:JSON.stringify(props.shareData.data)
+    })
+    if(res.code==200){
+        posterImg.value=res.data
+        show.value=false
+        showPoster.value=true
+    }else{
+        show.value=false
+    }
+}
+
+const onLongPressImg=()=>{
+    const a=document.createElement('a')
+    a.setAttribute("download",'名字')
+    a.style.display = "none"
+    a.href=posterImg.value+'?response-content-type=application/octet-stream'
+    document.body.appendChild(a);
+    a.click()
+}
+
+onLongPress(imgDom, onLongPressImg)
+
+</script>
+
+
+<template>
+    <div class="share-poster-wrap" @touchmove.prevent>
+        <img @click="handleCreatePoster" :style="props.style" class="share-icon" src=""/>
+
+        <div class="poster-mask" v-if="show||showPoster" @click="showPoster=false" @touchmove.prevent></div>
+        <div class="loading-box" v-if="show">
+            <img class="load-img" src=""/>
+            <div>海报生成中...</div>
+        </div>
+        <img v-if="showPoster" ref="imgDom" class="poster-img" :src="posterImg" @longpress="" />
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.share-poster-wrap{
+    .share-icon{
+        position: fixed;
+        bottom: 100px;
+        right: 34px;
+        z-index: 50;
+        width: 76px;
+        height: 76px;
+    }
+    .chart-icon{
+        float: right;
+        width: 40px;
+        height: 40px;
+        margin-left: 30px;
+    }
+    .poster-mask{
+        position: fixed;
+        left: 0;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0, 0, 0, 0.4);
+        z-index: 998;
+    }
+    .loading-box{
+        background-color: #fff;
+        position: fixed;
+        left: 50%;
+        top: 50%;
+        z-index: 999;
+        transform: translate(-50%,-50%);
+        width: 417px;
+        height: 261px;
+        text-align: center;
+        padding-top: 80px;
+        font-size: 32px;
+        font-weight: bold;
+        .load-img{
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            width: 91px;
+            height: 91px;
+            animation: circle 1s linear infinite;
+        }
+        @keyframes circle {
+            0%{
+                transform: rotateZ(0);
+            }
+            100%{
+                transform: rotateZ(360deg);
+            }
+        }
+    }
+    .poster-img{
+        width: 400px;
+        display: block;
+        position: fixed;
+        left: 50%;
+        top: 50%;
+        z-index: 999;
+        transform: translate(-50%,-50%);
+        border-radius: 16px;
+    }
+}
+</style>

src/hooks/useHZRouter.js

@@ -1,4 +1,5 @@
 // 自定义路由钩子
+// 没有使用到 改为重写了router的push方法 详情见utils/interceptRouterMethod.js
 import router from "@/router";
 import store from '@/store'
 
@@ -73,7 +74,7 @@ export default function(){
 export const listenRouterBack=()=>{
     if(window.history&&window.history.pushState){{
         $(window).on('popstate',()=>{
-            console.log('路由后退',window.location);
+            console.log('路由后退');
             const path=window.location.pathname
             const routesItem=getToRoute(path)
             store.commit('setBreadCrumb', routesItem)

src/layout/Index.vue

@@ -37,7 +37,7 @@ import LoginPop from '@/components/LoginPop.vue'
     </el-container>
 
     <!-- 回到顶部 -->
-    <el-backtop :bottom="100" visibility-height="900" style="z-index:1000">
+    <el-backtop :bottom="100" :visibility-height="900" style="z-index:1000">
       <img src="@/assets/icon-back-top.png" alt="" style="width: 60px;">
     </el-backtop>
 

src/layout/component/Aside.vue

@@ -3,7 +3,7 @@ import { reactive, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 const route = useRoute();
 
-let activePath = ref("/activity/list");
+let activePath = ref("/report/index");
 watch(
   () => route.path,
   (to) => {

src/layout/component/Header.vue

@@ -6,9 +6,7 @@ import { apiGetPermissionList } from "@/api/common.js";
 import { ElMessageBox, ElMessage } from "element-plus";
 import { apiLastApplyRecord ,apiApplyPermission} from "@/api/user";
 import { useRouter } from "vue-router";
-import useHZRouter from '@/hooks/useHZRouter'
 
-const HZRouter=useHZRouter()
 const router = useRouter();
 const store = useStore();
 store.dispatch("getUserInfo"); //获取个人信息
@@ -127,17 +125,17 @@ const handleContact = async () => {
 const goBack=()=>{
   if(window.history.state.back){
     console.log('返回上一页');
-    HZRouter.go(-1)
+    router.go(-1)
   }else{
     console.log('返回首页');
-    HZRouter.push({path:'/report/index'})
+    router.push({path:'/report/index'})
   }
 }
 
 // 点击面包屑
 const handleClickBreadCrumb=(item,index)=>{
   const _index=index-(store.state.breadCrumbList.length-1)
-  HZRouter.go(_index)
+  router.go(_index)
 }
 </script>
 

src/main.js

@@ -7,13 +7,7 @@ import 'element-plus/dist/index.css'
 import "@/style/global.scss";//全局样式
 import 'normalize.css'
 import {drag} from  "./directive/drag"
-import {listenRouterBack} from '@/hooks/useHZRouter';
-
-listenRouterBack()// 监听路由后退事件 更新面包屑
-
-
-
-
+import '@/utils/interceptRouterMethod.js' //重写router方法模块
 
 const app = createApp(App)
 app.directive('drag', drag)

src/store/index.js

@@ -129,7 +129,7 @@ export default createStore({
     // 设置面包屑数据
     // 在全局路由钩子中和自定义路由函数中调用
     setBreadCrumb(state,data){
-      console.log('store中设置面包屑',data);
+      // console.log('store中设置面包屑',data);
       // 如果是侧边栏 清除路由栈
       if (data.meta.isRoot) {
         let obj = {
@@ -145,7 +145,7 @@ export default createStore({
             index=e
           }
         });
-        if (index==-1) {
+        if (index==-1) {//不存在
           state.breadCrumbList.push({name:data.meta.title,path:data.path})
         }else{
           const arr=state.breadCrumbList.slice(0,index+1)

src/utils/interceptRouterMethod.js

@@ -0,0 +1,80 @@
+// 在router 方法中加拦截
+
+import router from '@/router'
+import store  from '@/store';
+
+// 找到要跳转到的那个路由信息
+const getToRoute=(path)=>{
+    const allRoutes=router.getRoutes()
+    let routesItem={}
+    allRoutes.forEach(route => {
+        if(route.path===path){
+            routesItem=route
+        }
+    });
+    return routesItem
+}
+
+
+const routerPush=router.push //保存原来的push函数
+
+// 重写push函数
+router.push = function push(location) {
+    // location 可能是string 也可能是obj 完全取决于 你是怎么调push的
+    console.log('push');
+    console.log(location);
+
+    let path=''
+    let query=null
+    // 判断location是string 还是obj
+    if(typeof location === 'string'){
+        path=location
+    }else{
+        path=location.path
+        query=location.query
+    }
+
+    // 判断是否已经存在面包屑中 
+    let index=-1
+    store.state.breadCrumbList.forEach((item,e) => {
+        if(item.path === path){
+          index=e
+        }
+    });
+    if(index===-1){//不存在
+        const routesItem=getToRoute(path)
+        store.commit('setBreadCrumb', routesItem)
+    }else{
+        console.log('拦截路由push改为返回');
+        const _index=index-(store.state.breadCrumbList.length-1)
+        router.go(_index)
+        setTimeout(() => {
+            if(query){
+                router.replace({
+                    query:query
+                })
+            }else{
+                router.replace(path)
+            }
+        }, 10);
+        return
+    }
+
+
+    // 调用原来的push函数，并捕获异常
+    return routerPush.call(this, location).catch(error => error)
+}
+
+
+// 监听路由后退事件
+const listenRouterBack=()=>{
+    if(window.history&&window.history.pushState){{
+        $(window).on('popstate',()=>{
+            console.log('路由后退');
+            const path=window.location.pathname
+            const routesItem=getToRoute(path)
+            store.commit('setBreadCrumb', routesItem)
+        })
+    }}
+}
+listenRouterBack()

src/views/activity/List.vue

@@ -285,7 +285,7 @@ onActivated(()=>{//解决从详情返回到列表 分享时还是详情问题
                     <div class="flex bot">
                         <span class="time">{{formatActivityTime(item.startTime,item.endTime)}}</span>
                         <div>
-                            <block v-if="item.activityState===1">
+                            <template v-if="item.activityState===1">
                                 <span 
                                     style="width:138px"
                                     :class="['btn',item.registerState&&'active']"
@@ -293,7 +293,7 @@ onActivated(()=>{//解决从详情返回到列表 分享时还是详情问题
                                     @click.stop="handleRegister(item)"
                                 >{{item.registerState?'取消线下报名':'报名线下参会'}}</span>
                                 <span :class="['btn',item.hasRemind&&'active']" @click.stop="handleRemind(item)">{{item.hasRemind?'取消提醒':'会议提醒'}}</span>
-                            </block>
+                            </template>
                             <!-- 音频播放 -->
                             <div 
                                 :class="['btn-audio',$store.state.audioData.activityId==item.activityId&&'btn-audio-active']" 

src/views/report/ChapterDetail.vue

@@ -11,11 +11,10 @@ import {apiGetWechatQRCode} from '@/api/common'
 import { ElMessageBox } from 'element-plus'
 import moment from 'moment';
 import AudioBox from './components/AudioBox.vue'
-import { useRoute,onBeforeRouteUpdate } from 'vue-router';
-import useHZRouter from '@/hooks/useHZRouter'
+import { useRoute,onBeforeRouteUpdate,useRouter } from 'vue-router';
 
 const route=useRoute()
-const HZRouter=useHZRouter()
+const router=useRouter()
 
 let chapterId=ref(route.query.chapterId||'') //章节id
 let frompage=ref(route.query.frompage||'')//如果来自报告详情页 则展示底部章节列表
@@ -148,7 +147,7 @@ const getAsideMoreRecmd=async (data)=>{
 
 // 点击侧边栏更多推荐
 const handleClickAsideRecmd=item=>{
-    HZRouter.push({
+    router.push({
         path:'/report/detail',
         query:{
             reportId:item.ReportId
@@ -170,7 +169,7 @@ const getAsideBanner=async (data)=>{
 
 //点击侧边栏报告合集
 const handleAsideBanner=(data)=>{
-    HZRouter.push({
+    router.push({
         path:'/report/list',
         query:{
             classifyId:data.ClassifyIdFirst,
@@ -245,7 +244,7 @@ const handleGoApply=async ()=>{
             })
         }else{
           if(!info.value.permission_check.customer_info.status||info.value.permission_check.customer_info.status!='流失'){
-            HZRouter.push({
+            router.push({
                 path:'/apply/permission',
                 query:{
                     source:4,

src/views/report/Classify.vue

@@ -1,9 +1,9 @@
 <script setup>
 import {onMounted, ref} from 'vue'
 import {apiReportClassify} from '@/api/report'
-import useHZRouter from '@/hooks/useHZRouter'
+import {useRouter} from 'vue-router'
 
-const HZRouter=useHZRouter()
+const router=useRouter()
 
 // 向小程序发送数据
 const handleDataToXcx=()=>{
@@ -30,7 +30,7 @@ getClassifyList()
 const goNext=(item)=>{
     // redirect_type : 跳转页面类型：1专栏列表，2报告列表，3专栏详情
     if(item.redirect_type===1){
-        HZRouter.push({
+        router.push({
             path:'/report/specialcolumnlist',
             query:{
                 classifyId:item.classify_id_first,
@@ -39,7 +39,7 @@ const goNext=(item)=>{
         })
     }
     if(item.redirect_type===2){
-        HZRouter.push({
+        router.push({
             path:'/report/list',
             query:{
                 classifyId:item.classify_id_first,
@@ -48,7 +48,7 @@ const goNext=(item)=>{
         })
     }
     if(item.redirect_type===3){
-        HZRouter.push({
+        router.push({
             path:'/report/specialcolumndetail',
             query:{
                 columnId:item.classify_id_second
@@ -66,7 +66,7 @@ onMounted(()=>{
 </script>
 <template>
     <div class="report-classify-page">
-        <img :src="$store.state.globalImgUrls.ficcServiceImg" alt=""  class="top-banner" @click="HZRouter.push({path:'/report/ficcserveintro'})">
+        <img :src="$store.state.globalImgUrls.ficcServiceImg" alt=""  class="top-banner" @click="$router.push({path:'/report/ficcserveintro'})">
         <div class="list-wrap">
             <el-row :gutter="20">
                 <el-col :span="6" v-for="item in list" :key="item.classify_name_first">

src/views/report/Detail.vue

@@ -1,18 +1,18 @@
 <script setup>
-import {onMounted, onUpdated, ref} from 'vue'
+import {onMounted, onUpdated, ref,computed} from 'vue'
 import { ElMessageBox } from 'element-plus'
 import moment from 'moment';
 import 'moment/dist/locale/zh-cn'
 import AudioBox from './components/AudioBox.vue'
+import SharePoster from '@/components/SharePoster.vue'
 import {apiReportDetail,apiReportMoreRecmd,apiReportDetailBanner} from '@/api/report'
 import {apiGetWechatQRCode} from '@/api/common'
-import { useRoute , onBeforeRouteUpdate} from 'vue-router';
-import useHZRouter from '@/hooks/useHZRouter'
+import { useRoute , onBeforeRouteUpdate,useRouter} from 'vue-router';
 import { useStore } from 'vuex';
 moment.locale('zh-cn')
 
 const route=useRoute()
-const HZRouter=useHZRouter()
+const router=useRouter()
 const store=useStore()
 
 let reportId=ref(route.query.reportId||'')
@@ -92,7 +92,7 @@ const getAsideMoreRecmd=async (data)=>{
 
 //点击侧边栏更多推荐
 const handleClickAsideRecmd=(item)=>{
-    HZRouter.replace({
+    router.replace({
         query:{
             reportId:item.ReportId
         }
@@ -118,7 +118,7 @@ const getAsideBanner=async (data)=>{
 //点击侧边栏报告合集
 const handleAsideBanner=(data)=>{
     if(data.Type=='报告合集'){
-        HZRouter.push({
+        router.push({
             path:'/report/list',
             query:{
                 classifyId:data.ClassifyIdFirst,
@@ -126,7 +126,7 @@ const handleAsideBanner=(data)=>{
             }
         })
     }else{
-        HZRouter.push({
+        router.push({
             path:'/report/specialcolumndetail',
             query:{
                 columnId:data.ClassifyIdSecond
@@ -179,7 +179,7 @@ const getTagColor=(str)=>{
 
 // 跳转章节详情
 const goChapterDetail=(item)=>{
-    HZRouter.push({
+    router.push({
         path:'/report/chapterdetail',
         query:{
             chapterId:item.report_chapter_id,
@@ -203,7 +203,7 @@ const handleGoApply=async ()=>{
             })
         }else{
             if(!info.value.permission_check.customer_info.status||info.value.permission_check.customer_info.status!='流失'){
-                HZRouter.push({
+                router.push({
                     path:'/apply/permission',
                     query:{
                         source:4,
@@ -250,6 +250,18 @@ getQRCodeImg()
 
 let showDisclaimers=ref(false)//显示免责声明
 
+const code_scene=computed(()=>{
+    return JSON.stringify({reportId:reportId.value})
+})
+
+const posterParams=computed(()=>{
+    return {
+        report_type:info.value.report_info.classify_name_first,
+        report_title:`【第${info.value.report_info.stage}期 | ${info.value.report_info.classify_name_second}】${info.value.report_info.title}`,
+        report_abstract:info.value.report_info.content
+    }
+})
+
 </script>
 
 <template>
@@ -391,6 +403,19 @@ let showDisclaimers=ref(false)//显示免责声明
             <div style="margin-bottom:10px">4、在任何情况下，本公司不对客户/接受人/接受机构因使用报告中内容所引致的一切损失负责任，客户/接受人/接受机构需自行承担全部风险。</div>
         </div>
     </el-dialog>
+
+    <!-- 生成海报 -->
+    <Teleport to="body">
+        <SharePoster  
+            :shareData="{
+                type:'report_detail',
+                code_page:'pages-report/reportDetail',
+                code_scene:code_scene,
+                data:posterParams
+            }"
+            v-if="info&&info.auth_ok"
+        ></SharePoster>
+    </Teleport>
 </template>
 
 <style lang="scss" scoped>

src/views/report/Index.vue

@@ -8,14 +8,13 @@ import {
 import { onActivated, onMounted, reactive, ref } from "vue"
 import Search from "@/components/Search.vue"
 import SelfList from '@/components/SelfList.vue'
-import { onBeforeRouteLeave } from "vue-router"
-import useHZRouter from '@/hooks/useHZRouter'
+import { onBeforeRouteLeave , useRouter } from "vue-router"
 import { ElMessageBox } from 'element-plus'
 import moment from 'moment'
 import 'moment/dist/locale/zh-cn'
 moment.locale('zh-cn')
 
-const HZRouter=useHZRouter()
+const router=useRouter()
 
 // 向小程序发送数据
 const handleDataToXcx=()=>{
@@ -38,7 +37,7 @@ const getLatestNews=async ()=>{
 }
 //点击最新资讯跳转报告详情
 const handleClickNews=item=>{
-  HZRouter.push({
+  router.push({
     path:'/report/detail',
     query:{
       reportId:item.ReportId
@@ -172,21 +171,21 @@ getNewAnnounce()
 
 //跳转至研报分类页
 const handleGoMoreClassify = () => {
-  HZRouter.push({ path:'/report/classify' });
+  router.push({ path:'/report/classify' });
 };
 
 //点击上新公告
 const handleClickAnnounce=(data)=>{
   //redirect_type 0活动 1专栏
   if(data.redirect_type==0){
-    HZRouter.push({
+    router.push({
       path:'/activity/detail',
       query:{
         id:data.Activity.activityID
       }
     })
   }else{
-    HZRouter.push({
+    router.push({
       path:'/report/specialcolumndetail',
       query:{
         columnId:data.ClassifyIdSecond
@@ -206,14 +205,14 @@ const formatAnnounceActivityTime=(start,end)=>{
 //跳转报告详情
 const handleGoReportDetail=(item)=>{
   if(['晨报','周报'].includes(item.classify_name_first)){
-    HZRouter.push({
+    router.push({
       path:'/report/chapterdetail',
       query:{
         chapterId:item.report_chapter_id
       }
     })
   }else{
-    HZRouter.push({
+    router.push({
       path:'/report/detail',
       query:{
         reportId:item.report_id
@@ -254,7 +253,7 @@ onActivated(()=>{
         style="margin-top: 10px;"
         placeholder="请输入标题/关键词"
         :disabled="true"
-        @click="HZRouter.push({path:'/report/search'})"
+        @click="$router.push({path:'/report/search'})"
       ></Search>
     </teleport>
   </template>

src/views/report/List.vue

@@ -4,12 +4,11 @@ import moment from 'moment';
 import { apiSubClassifyList , apiReportList } from '@/api/report'
 import Search from '@/components/Search.vue'
 import SelfList from '@/components/SelfList.vue'
-import { useRoute } from 'vue-router';
-import useHZRouter from '@/hooks/useHZRouter'
+import { useRoute,useRouter } from 'vue-router';
 import { useStore } from 'vuex';
 
 const route=useRoute()
-const HZRouter=useHZRouter()
+const router=useRouter()
 const store=useStore()
 
 
@@ -99,7 +98,7 @@ const handleSearch=(e)=>{
 
 // 跳转报告详情
 const goReportDetail=(item)=>{
-    HZRouter.push({
+    router.push({
         path:'/report/detail',
         query:{
             reportId:item.report_id

src/views/report/Search.vue

@@ -4,10 +4,9 @@ import {apiReportSearch} from '@/api/report'
 import moment from 'moment'
 import Search from "@/components/Search.vue"
 import SelfList from '@/components/SelfList.vue'
-import { onBeforeRouteLeave } from 'vue-router'
-import useHZRouter from '@/hooks/useHZRouter'
+import { onBeforeRouteLeave,useRouter } from 'vue-router'
 
-const HZRouter=useHZRouter()
+const router=useRouter()
 
 let listState=reactive({
     list:[],
@@ -50,14 +49,14 @@ const handleSearch=(e)=>{
 
 const goDetail=(item)=>{
     if(['晨报','周报'].includes(item.classify_name_first)){
-        HZRouter.push({
+        router.push({
             path:'/report/chapterdetail',
             query:{
                 chapterId:item.report_chapter_id
             }
         })
     }else{
-        HZRouter.push({
+        router.push({
             path:'/report/detail',
             query:{
                 reportId:item.report_id

src/views/report/specialColumn/Detail.vue

@@ -3,12 +3,11 @@ import {onActivated, reactive, ref} from 'vue'
 import moment from 'moment';
 import SelfList from '@/components/SelfList.vue'
 import {apiSpecialColumnDetail,apiSpecialColumnReportList,apiSpecialColumnComment} from '@/api/report'
-import { useRoute } from 'vue-router';
-import useHZRouter from '@/hooks/useHZRouter'
+import { useRoute ,useRouter} from 'vue-router';
 import { useStore } from 'vuex';
 
 const route=useRoute()
-const HZRouter=useHZRouter()
+const router=useRouter()
 const store=useStore()
 
 let nav=ref('专栏介绍')
@@ -85,7 +84,7 @@ const onLoad=()=>{
 
 //跳转报告详情
 const goReportDetail=(item)=>{
-    HZRouter.push({
+    router.push({
         path:'/report/detail',
         query:{
             reportId:item.report_id

src/views/report/specialColumn/List.vue

@@ -2,11 +2,10 @@
 import {onActivated, onMounted, reactive, ref} from 'vue'
 import SelfList from '@/components/SelfList.vue'
 import {apiReportClassify,apiSpecialColumnList} from '@/api/report'
-import { useRoute } from 'vue-router';
-import useHZRouter from '@/hooks/useHZRouter'
+import { useRoute,useRouter } from 'vue-router';
 
 const route=useRoute()
-const HZRouter=useHZRouter()
+const router=useRouter()
 
 document.title=decodeURIComponent(route.query.classifyName)
 
@@ -51,7 +50,7 @@ const handleClickTab=(item)=>{
 
 // 跳转专栏详情
 const goSpecialColumnDetail=(item)=>{
-    HZRouter.push({
+    router.push({
         path:'/report/specialcolumndetail',
         query:{
             columnId:item.classify_id_second