catch up on enabling blog APIs in client

This commit is contained in:
Zhigang Wang 2024-06-04 13:43:20 -07:00
parent 05d03451dc
commit ff4af093a8
6 changed files with 59 additions and 66 deletions

View File

@ -1,8 +1,13 @@
<template> <template>
<div v-if="blogs" class="blogs_containter"> <div v-if="blogs" class="blogs_containter">
<div class="blog_containter" v-for="(blog, index) in blogs" :key="index" @click="view_blog(blog)"> <div
class="blog_containter"
v-for="(blog, index) in blogs"
:key="index"
@click="view_blog(blog)"
>
<h2>{{ blog.blog_name }}</h2> <h2>{{ blog.blog_name }}</h2>
<img :src="blog.cover_picture"> <img :src="blog.cover_picture" />
<p v-text="retrieve_summary(blog)"></p> <p v-text="retrieve_summary(blog)"></p>
</div> </div>
</div> </div>
@ -30,7 +35,7 @@ export default {
this.mnx_navToContentViewer(blog.content_id) this.mnx_navToContentViewer(blog.content_id)
}, },
retrieve_summary(blog) { retrieve_summary(blog) {
return mediaDataHandler.retrieveText(blog.summary_text); return mediaDataHandler.retrieveText(blog.summary_text)
} }
}, },
data() { data() {
@ -38,7 +43,6 @@ export default {
blogs: null blogs: null
} }
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

View File

@ -4,7 +4,7 @@
<script> <script>
import { pdfjsLib } from '../../plugins/index' import { pdfjsLib } from '../../plugins/index'
import { ContentApi, mediaDataHandler } from '../../utils/index' import { ContentApi, mediaDataHandler } from '../../utils/index'
import { Buffer } from 'buffer'; import { Buffer } from 'buffer'
export default { export default {
name: 'ContentViewer', name: 'ContentViewer',
props: { props: {
@ -23,20 +23,22 @@ export default {
ContentApi.retrieve_blog_content(this.content_id) ContentApi.retrieve_blog_content(this.content_id)
.then((response) => { .then((response) => {
this.content_media_data = response.data this.content_media_data = response.data
var loadingTask = pdfjsLib.getDocument({ data: Buffer.from(this.content_media_data, 'base64') }) var loadingTask = pdfjsLib.getDocument({
data: Buffer.from(this.content_media_data, 'base64')
})
loadingTask.promise.then(function (pdf) { loadingTask.promise.then(function (pdf) {
// //
// Fetch the first page // Fetch the first page
// //
pdf.getPage(1).then(function (page) { pdf.getPage(1).then(function (page) {
//rendering //rendering
}); })
}); })
}) })
.catch((error) => { .catch((error) => {
this.mnx_backendErrorHandler(error) this.mnx_backendErrorHandler(error)
}) })
}, }
}, },
data() { data() {
return { return {
@ -45,4 +47,3 @@ export default {
} }
} }
</script> </script>

View File

@ -291,7 +291,6 @@ export default {
if (this.uploadFile) { if (this.uploadFile) {
DocumentApi.upload(this.uploadFile) DocumentApi.upload(this.uploadFile)
.then((response) => { .then((response) => {
console.log(response.data.document_id)
return RequestHubApi.makeProposalForRequest( return RequestHubApi.makeProposalForRequest(
this.requestId, this.requestId,
this.proposal.content, this.proposal.content,

View File

@ -1,14 +1,7 @@
import { backendAxios } from './axios' import { backendAxios } from './axios'
class ContentApi { class ContentApi {
static retrieve_blogs() { static retrieve_blogs() {
const request = backendAxios.post( const request = backendAxios.post('/api/content/retrieve-blogs', {}, {})
'/api/content/retrieve-blogs',
{
},
{
}
)
return request return request
} }
static retrieve_blog_content(document_id) { static retrieve_blog_content(document_id) {
@ -17,9 +10,7 @@ class ContentApi {
{ {
document_id: document_id document_id: document_id
}, },
{ {}
}
) )
return request return request
} }

View File

@ -1,14 +1,12 @@
class MediaDataHandler { class MediaDataHandler {
retrieveText(mediaData) { retrieveText(mediaData) {
let prefix = "data:text/plain;base64," let prefix = 'data:text/plain;base64,'
let pos = mediaData.search(prefix); let pos = mediaData.search(prefix)
if (pos < 0) return ""; if (pos < 0) return ''
return atob(mediaData.substring(pos + prefix.length)) return atob(mediaData.substring(pos + prefix.length))
} }
} }
const mediaDataHandler = new MediaDataHandler() const mediaDataHandler = new MediaDataHandler()
export { mediaDataHandler } export { mediaDataHandler }