|
|
@@ -0,0 +1,324 @@
|
|
|
+<!-- 原项目丢了 省事直接cv一下老项目代码 -->
|
|
|
+<template>
|
|
|
+ <div class="wrapper" ref="wrapper">
|
|
|
+ <div id="reportdtl" v-if="isshow">
|
|
|
+ <div class="top-header">
|
|
|
+ <div class="title">{{reportInfo.Title}}</div>
|
|
|
+ <div class="flex">
|
|
|
+ <span>{{reportInfo.Author}}</span>
|
|
|
+ <span>{{reportInfo.PublishTime}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="padding: 0.6rem; box-sizing: border-box; overflow: hidden">
|
|
|
+ <!-- <div id="resetcss" style="overflow:hidden;" v-html="reportInfo.Content"></div> -->
|
|
|
+ <div id="resetcss" style="overflow:hidden;">
|
|
|
+ <ul>
|
|
|
+ <li v-for="(html,index) in realContent" :key="index" v-html="html"></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div id="tipsAlert">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 100%;
|
|
|
+ padding: 0.8rem 0.66rem 2.2rem;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font: 0.52rem/0.8rem 'PingFang-SC-Regular';
|
|
|
+ color: #666;
|
|
|
+ background: #fff;
|
|
|
+ overflow: scroll;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <!-- <h1 style="font:0.64rem '微软雅黑'; color:#333; text-align:center; margin-bottom:0.34rem;">免责声明</h1> -->
|
|
|
+ <h1
|
|
|
+ style="
|
|
|
+ font: 0.64rem 'PingFang-SC-Regular';
|
|
|
+ color: #333;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 0.34rem;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 免责声明
|
|
|
+ </h1>
|
|
|
+ <!-- <p>
|
|
|
+ 1、本报告仅供弘则弥道（上海）投资咨询有限公司正式签约的机构客户使用，不会仅因接收人/接受机构收到本报告而将其视为客户。
|
|
|
+ </p>
|
|
|
+ <p>
|
|
|
+ 2、本报告根据国际和行业通行的准则，以合法渠道获得这些信息，尽可能保证可靠、准确和完整，但并不保证报告所述信息的准确性和完整性，也不保证本报告所包含的信息或建议在本报告发出后不会发生任何变更。本报告中所提供的信息仅供参考。
|
|
|
+ </p>
|
|
|
+ <p>
|
|
|
+ 3、报告中的内容不对投资者做出的最终操作建议做任何的担保，也没有任何形式的分享投资收益或者分担投资损失的书面或口头承诺。不作为客户在投资、法律、会计或税务等方面的最终操作建议，也不作为道义的、责任的和法律的依据或者凭证，无论是否已经明示或者暗示。
|
|
|
+ </p>
|
|
|
+ <p>
|
|
|
+ 4、在任何情况下，本公司不对客户/接受人/接受机构因使用报告中内容所引致的一切损失负责任，客户/接受人/接受机构需自行承担全部风险。
|
|
|
+ </p> -->
|
|
|
+ <div class="disclaimer" v-html="Disclaimer"></div>
|
|
|
+ <p
|
|
|
+ @click="hideTips"
|
|
|
+ style="
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ font-size: 0.56rem;
|
|
|
+ line-height: 1.6rem;
|
|
|
+ color: #2680eb;
|
|
|
+ text-align: center;
|
|
|
+ border-top: 1px solid #eaeaea;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 知道了
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="width:30px; position:fixed; right:0.6rem; bottom:2.4rem; z-index:100;">
|
|
|
+ <img src="~@/assets/img/returntop.png" @click="goTop" style="width:30px; margin-bottom:0.2rem;" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ smartReportDetail,
|
|
|
+} from "@/api/api.js";
|
|
|
+import _ from 'lodash';
|
|
|
+import wxShare from '../utils/wxShare.js';
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ id: this.$route.query.code || '',
|
|
|
+ isshow: false,
|
|
|
+ reportInfo: {},
|
|
|
+ reportlist: [],
|
|
|
+
|
|
|
+ totalContent: [],
|
|
|
+ realContent: [],
|
|
|
+ page_no: 0,
|
|
|
+ pageSize: 20, //默认初始加载50个p标签
|
|
|
+ total_page: 0,
|
|
|
+ Disclaimer:''
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getreportdetail();
|
|
|
+ window.addEventListener('scroll', this.loadMoreHandle);
|
|
|
+ },
|
|
|
+
|
|
|
+ destroyed() {
|
|
|
+ window.removeEventListener('scroll', this.loadMoreHandle);
|
|
|
+ },
|
|
|
+
|
|
|
+ updated() {
|
|
|
+ // $('#resetcss').css({font:"0.76rem/1.5 '微软雅黑'",color:"#333",letterSpacing:"0.05rem"});
|
|
|
+ $("#resetcss")
|
|
|
+ .find("img")
|
|
|
+ .css({ display: "block", margin: "0 auto", maxWidth: "100%" });
|
|
|
+ $("#resetcss")
|
|
|
+ .find("video")
|
|
|
+ .css({ display: "block", margin: "0 auto", maxWidth: "100%" });
|
|
|
+ $("#resetcss")
|
|
|
+ .find("p")
|
|
|
+ .css({
|
|
|
+ margin: "0 auto 0",
|
|
|
+ font: "0.7rem/1.5 'PingFang-SC-Regular'",
|
|
|
+ color: "#333",
|
|
|
+ letterSpacing: "0.08rem",
|
|
|
+ lineHeight: "1.3rem",
|
|
|
+ });
|
|
|
+ /* $("#resetcss")
|
|
|
+ .find("span")
|
|
|
+ .css({
|
|
|
+ font: "0.7rem/1.5 'PingFang-SC-Regular'",
|
|
|
+ letterSpacing: "0.08rem",
|
|
|
+ lineHeight: "1.3rem",
|
|
|
+ }); */
|
|
|
+ $("#resetcss")
|
|
|
+ .find("span.fr-emoticon")
|
|
|
+ .css({
|
|
|
+ width: "20px",
|
|
|
+ height: "20px",
|
|
|
+ backgroundRepeat: "no-repeat",
|
|
|
+ backgroundSize: "cover",
|
|
|
+ display: "inline-block",
|
|
|
+ verticalAlign: "middle",
|
|
|
+ });
|
|
|
+ $("#resetcss").find("ol").css({ listStyleType: "disc" });
|
|
|
+ $("#resetcss")
|
|
|
+ .find("pre")
|
|
|
+ .css({ display: "block", whiteSpace: "pre-wrap" });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ showTips() {
|
|
|
+ //免责声明显示
|
|
|
+ $("#tipsAlert").animate({ top: 0 });
|
|
|
+ },
|
|
|
+ hideTips() {
|
|
|
+ //免责声明收起
|
|
|
+ $("#tipsAlert").animate({ top: "-120rem" });
|
|
|
+ },
|
|
|
+ goTop() {
|
|
|
+ document.body.scrollTop = document.documentElement.scrollTop = 0;
|
|
|
+ },
|
|
|
+
|
|
|
+ async getreportdetail() {
|
|
|
+ const { Data,Ret } = await smartReportDetail({ ReportCode: this.id });
|
|
|
+ document.title=(Data && Data.H5ShareName) || "研报"
|
|
|
+ if (Ret !== 200) return
|
|
|
+ // console.log('data',Data)
|
|
|
+ let H5ShareName = Data.H5ShareName
|
|
|
+ let H5ReportShareImg = Data.H5ReportShareImg
|
|
|
+ let wxShareTitle=!!Data.Hz?
|
|
|
+ '【第'+Data.Report.Stage+'期|FICC'+'】'+Data.Report.Title+'('+Data.Report.CreateTime.substring(5,7)+Data.Report.CreateTime.substring(8,10)+')':
|
|
|
+ Data.Report.Title+'('+Data.Report.CreateTime.substring(5,7)+Data.Report.CreateTime.substring(8,10)+')'
|
|
|
+ this.reportInfo = Data.Report;
|
|
|
+ this.Disclaimer = Data.Disclaimer||'';
|
|
|
+ this.isshow = true;
|
|
|
+
|
|
|
+ this.splitContentHandle(this.reportInfo.Content);
|
|
|
+
|
|
|
+ $(document).on("click", "#resetcss img", function (event) {
|
|
|
+ let imgArray = [];
|
|
|
+ let curImageSrc = $(this).attr("src");
|
|
|
+ let oParent = $(this).parent();
|
|
|
+ if (curImageSrc && !oParent.attr("href")) {
|
|
|
+ $("#resetcss img").each(function (index, el) {
|
|
|
+ let itemSrc = $(this).attr("src");
|
|
|
+ imgArray.push(itemSrc);
|
|
|
+ });
|
|
|
+ wx.previewImage({ current: curImageSrc, urls: imgArray });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ wxShare(document.location.href,H5ShareName || document.title,wxShareTitle,H5ReportShareImg,0);
|
|
|
+ },
|
|
|
+
|
|
|
+ /*内容分割*/
|
|
|
+ splitContentHandle(content) {
|
|
|
+ const regex = new RegExp(`<div[^>]*class="?report-drag-item-wrap"?>`);
|
|
|
+ const arr = content.split(regex);
|
|
|
+ this.totalContent = arr.map((_) => _ + "<div class='report-drag-item-wrap'>");
|
|
|
+ this.realContent = this.totalContent.slice(0, this.pageSize);
|
|
|
+ this.total_page = parseInt(this.totalContent.length / this.pageSize) + 1;
|
|
|
+ // console.log(this.realContent, this.totalContent);
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 加载下一页内容 */
|
|
|
+ loadContent() {
|
|
|
+ this.realContent = this.realContent.concat(
|
|
|
+ this.totalContent.slice(
|
|
|
+ this.page_no * this.pageSize,
|
|
|
+ (this.page_no + 1) * this.pageSize
|
|
|
+ )
|
|
|
+ );
|
|
|
+ },
|
|
|
+ loadMoreHandle: _.throttle(function() {
|
|
|
+
|
|
|
+ if(this.page_no >= this.total_page) return
|
|
|
+
|
|
|
+ const scrollTop = document.documentElement.scrollTop || document.body.scrollTop; // 滚动的高度
|
|
|
+ const clientHeight = document.documentElement.clientHeight || document.body.clientHeight; // 可视高度
|
|
|
+ const scrollHeight = document.body.scrollHeight; // 总高度
|
|
|
+
|
|
|
+ if((scrollHeight - scrollTop - clientHeight) < 500) {
|
|
|
+ console.log('触底')
|
|
|
+ this.page_no = this.page_no+1;
|
|
|
+ this.loadContent();
|
|
|
+ }
|
|
|
+ },300)
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.wrapper {
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ height: 100%;
|
|
|
+ #noaccess {
|
|
|
+ width: 100%;
|
|
|
+ height: 12rem;
|
|
|
+ padding: 5rem 0.6rem 1rem;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ background: url(~@/assets/img/accessbg.png) no-repeat;
|
|
|
+ background-size: 100% auto;
|
|
|
+ overflow: hidden;
|
|
|
+ > a,
|
|
|
+ button {
|
|
|
+ width: 12rem;
|
|
|
+ height: 2rem;
|
|
|
+ background: url(~@/assets/img/newbtn600.png) no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ font-size: 0.48rem;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ margin-top: 1.5rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+#reportdtl {
|
|
|
+ background: #fff;
|
|
|
+ overflow: auto;
|
|
|
+ max-width: 1200px;
|
|
|
+ margin: 0 auto;
|
|
|
+
|
|
|
+ .top-header{
|
|
|
+ background-image: url('@/assets/img/smart_report_bg01.png');
|
|
|
+ background-size: cover;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: center;
|
|
|
+ padding: 16px;
|
|
|
+ color: #fff;
|
|
|
+ .title{
|
|
|
+ font-size: 16px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ .flex{
|
|
|
+ font-size: 12px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ table {
|
|
|
+ border-top: 1px solid #ccc;
|
|
|
+ border-left: 1px solid #ccc;
|
|
|
+ border-collapse: collapse;
|
|
|
+ th,
|
|
|
+ td {
|
|
|
+ border-right: 1px solid #ccc;
|
|
|
+ border-bottom: 1px solid #ccc;
|
|
|
+ padding: 0.1rem 0.2rem;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ #resetcss {
|
|
|
+ pre {
|
|
|
+ white-space: pre-wrap;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // #element .element .element-content .main-container .content tbody td {
|
|
|
+ // padding: 0.01rem 0;
|
|
|
+ // word-break: break-all;
|
|
|
+ // }
|
|
|
+ #tipsAlert {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ padding: 15% 1rem;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: fixed;
|
|
|
+ top: -120rem;
|
|
|
+ left: 0;
|
|
|
+ background: rgba(0, 0, 0, 0.6);
|
|
|
+ z-index: 200;
|
|
|
+ .disclaimer{
|
|
|
+ font-size: 0.58rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
