文章最后更新于 {{ article.updateTime }}
@@ -191,6 +192,7 @@
const comment = () => import( "./comment/comment");
const process = () => import( "./common/process");
const commentBox = () => import( "./comment/commentBox");
+ import {navigation} from '../utils/tools.js'
import MarkdownIt from 'markdown-it';
export default {
@@ -203,6 +205,7 @@
data() {
return {
+ dynamicGallery:null,
id: this.$route.query.id,
article: {},
articleContentHtml: "",
@@ -215,7 +218,8 @@
this.getArticle();
},
mounted() {
- // window.addEventListener("scroll", this.onScrollPage);
+ this.$store.commit("changePlaylist", 489085857)
+ // window.addEventListener("scroll", this.onScrollPage)
},
methods: {
deleteTreeHole(id) {
@@ -329,6 +333,55 @@
});
}
},
+ /**
+ * 描点功能
+ */
+ checkAnchor(){
+ this.$nextTick(()=>{
+ $(this.$refs.articleContent).find("a").toArray().forEach((item)=>{
+ let anchor = item.href;
+ if(anchor.indexOf("#SECTION")!=-1){
+ item.onclick=function(e){
+ navigation(anchor.substring(anchor.indexOf("#SECTION"),anchor.length))
+ };
+ item.href="javascript:void(0);";
+ } else {
+ item.target = "_blank";
+ }
+ });
+ })
+ },
+ checkImage(){
+ this.$nextTick(()=>{
+ let images = $(this.$refs.articleContent).find("img").toArray()
+ this.dynamicGallery?.destroy()
+ if (images.length > 0) {
+ this.dynamicGallery = lightGallery(document.createElement("div"), {
+ mobileSettings: {
+ controls: false,
+ showCloseIcon: true,
+ download: false,
+ },
+ dynamic: true,
+ thumbnail: true,
+ controls: false,
+ plugins: [lgZoom, lgThumbnail, lgRotate, lgAutoplay, lgFullscreen],
+ dynamicEl: images.map((obj) => {
+ return {
+ src: obj.src,
+ thumb: obj.thumb ? obj.thumb : obj.src,
+ subHtml: `
${obj.alt}
`,
+ }
+ }),
+ })
+ }
+ images.forEach(element => {
+ element.onclick = ()=>{
+ this.dynamicGallery.openGallery(images.indexOf((element)));
+ }
+ });
+ })
+ },
addId() {
let headings = $(".entry-content").find("h1, h2, h3, h4, h5, h6");
headings.attr('id', (i, id) => id || 'toc-' + i);
@@ -339,11 +392,16 @@
if (!this.$common.isEmpty(res.data)) {
this.article = res.data;
this.getNews();
- const md = new MarkdownIt({breaks: true});
+ const md = new MarkdownIt({breaks: true,html:true,linkify:true,typographer:true});
+ this.articleContentHtml = this.article.articleContent;
this.articleContentHtml = md.render(this.article.articleContent);
+ console.log(this.articleContentHtml);
this.$nextTick(() => {
+ document.title = this.article.articleTitle
this.highlight();
this.addId();
+ this.checkAnchor();
+ this.checkImage();
// todo 只有程序相关文章才显示toc
// this.getTocbot();
});
@@ -445,6 +503,7 @@
bottom: 15px;
left: 20%;
color: var(--white);
+ text-shadow: 1px 1px 5px #00000088;
}
.article-info-news {
diff --git a/src/components/articleList.vue b/src/components/articleList.vue
index 5d01861..fe0705e 100644
--- a/src/components/articleList.vue
+++ b/src/components/articleList.vue
@@ -135,7 +135,7 @@
- {{ article.label.labelName }}
+ {{article.label?article.label.labelName:"" }}
diff --git a/src/components/bangumi.vue b/src/components/bangumi.vue
new file mode 100644
index 0000000..f6d45d2
--- /dev/null
+++ b/src/components/bangumi.vue
@@ -0,0 +1,421 @@
+