From ea994d9fcc70b21fba213a3109e48ae84b4d8517 Mon Sep 17 00:00:00 2001 From: xuhuajiao <13476289682@163.com> Date: Fri, 27 Dec 2024 10:40:10 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=85=8D=E7=BD=AE=E6=96=87?= =?UTF-8?q?=E4=BB=B6/=E5=8C=BA=E5=88=86=E5=92=8C=E4=B8=9C=E8=A5=BF?= =?UTF-8?q?=E6=B9=96=E7=9A=84img=E5=8F=96=E5=80=BC=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/index.html | 1 + public/static/config.js | 4 + src/main.js | 4 +- src/utils/request.js | 3 +- src/views/bookRackList-dxh.vue | 178 ++++++++++++++++++++++++ src/views/bookRackList.vue | 9 ++ src/views/index-dxh.vue | 191 ++++++++++++++++++++++++++ src/views/index.vue | 20 ++- src/views/mixins/booklist-dxh.js | 103 ++++++++++++++ src/views/mixins/booklist.js | 36 ++++- src/views/module/homeListItem-dxh.vue | 97 +++++++++++++ src/views/module/homeListItem.vue | 9 ++ 12 files changed, 643 insertions(+), 12 deletions(-) create mode 100644 public/static/config.js create mode 100644 src/views/bookRackList-dxh.vue create mode 100644 src/views/index-dxh.vue create mode 100644 src/views/mixins/booklist-dxh.js create mode 100644 src/views/module/homeListItem-dxh.vue diff --git a/public/index.html b/public/index.html index d69dc6a..cb0651d 100644 --- a/public/index.html +++ b/public/index.html @@ -6,6 +6,7 @@ + + + diff --git a/src/views/bookRackList.vue b/src/views/bookRackList.vue index 6162f7e..f2c8ab6 100644 --- a/src/views/bookRackList.vue +++ b/src/views/bookRackList.vue @@ -86,13 +86,22 @@ export default { }, 50) }, handleDetails(itemData) { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API const params = { isbn: itemData.isbn.replace(/\-/g, '') } getBookDetailsByISBN(params).then(res => { this.$refs.detailDom.dialogVisible = true if (res) { + // this.$refs.detailDom.bookData = res + console.log('res', res) + Object.keys(res).forEach(key => { + if (key === 'srcUrl' && res[key]) { + res[key] = linkSrc + '/downloadFile' + res[key] + } + }) this.$refs.detailDom.bookData = res + console.log('ddd', this.$refs.detailDom.bookData) } else { this.$refs.detailDom.bookData = { srcUrl: itemData.bookAuthor, diff --git a/src/views/index-dxh.vue b/src/views/index-dxh.vue new file mode 100644 index 0000000..eacf43b --- /dev/null +++ b/src/views/index-dxh.vue @@ -0,0 +1,191 @@ + + + + + diff --git a/src/views/index.vue b/src/views/index.vue index eacf43b..5f992f9 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -110,16 +110,25 @@ export default { }, // 首页 - 新书推荐 getNewBookList() { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API const params = { libcode: this.libcode, pageNo: 1, pageSize: 4 } FetchNewBookRecommend(params).then(res => { - let data = [] - data = res.newbookList - data.forEach(item => { - this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + // let data = [] + // data = res.newbookList + // data.forEach(item => { + // this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + // }) + this.newList = res.newbookList.map((item, index) => { + if (item.nbImgPath) { + item.cover = linkSrc + '/downloadFile' + item.nbImgPath + } else { + item.cover = null + } + return item }) }).catch(() => { this.$message.error('接口错误') @@ -164,8 +173,9 @@ export default { // 处理数据格式 initBookData(bookList) { return bookList.map(async(item, index) => { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API const newItem = { - cover: item.srcUrl, + cover: linkSrc + '/downloadFile' + item.srcUrl, ranking: item.bookUID, nbName: item.bookName, isOtherBook: index !== 0, diff --git a/src/views/mixins/booklist-dxh.js b/src/views/mixins/booklist-dxh.js new file mode 100644 index 0000000..dee8aff --- /dev/null +++ b/src/views/mixins/booklist-dxh.js @@ -0,0 +1,103 @@ +import { FetchHotBookRecommend, FetchNewBookRecommend, FetchCoverByISBN, getBookDetailsByISBN } from '@/api/bookshelf' +export const bookListCrud = { + // 组件共用属性 + data() { + return { + defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"', + bookData: [], + page: 1, + pageSize: 13, + pageCount: 1, + bookLoading: false + } + }, + computed: { + bookList() { + const arr = this.bookData.slice(1) + return arr + } + }, + // 组件共用方法 + methods: { + // 获取热门/新书图书list + getBookData() { + this.bookLoading = true + const bookType = this.$route.query.bookType + const params = { + libcode: this.libcode, + pageNo: this.page, + pageSize: this.pageSize + } + if (bookType === 'hot') { + FetchHotBookRecommend(params).then(res => { + this.pageCount = res.page.totalPages + res.hotbookList.forEach(item => { + this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + }) + }).catch(() => { + this.$message.error('接口错误') + }) + } else { + FetchNewBookRecommend(params).then(res => { + res.newbookList.forEach(item => { + this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + }) + }).catch(() => { + this.$message.error('接口错误') + }) + } + }, + // 根据isbn查找封面 + getCoverByISBN(isbn, item) { + const params = { + isbn: isbn + } + FetchCoverByISBN(params).then((res) => { + // item.cover = window.URL.createObjectURL(res) + if (res) { + item.cover = res + } else { + item.cover = '' + } + this.bookData.push(item) + this.bookLoading = false + }) + }, + // 滚动加载 + lazyLoading(e) { + const scrollTop = e.target.scrollTop + const windowHeight = e.target.clientHeight + const scrollHeight = e.target.scrollHeight + // 滚动条到底部 + if (scrollTop + windowHeight === scrollHeight) { + this.bookLoading = true + this.page++ + if (this.page > this.pageCount) { + this.bookLoading = false + this.$message.success('暂无更多数据~') + return + } + this.getBookData() + } + }, + // 点击查看详情 + handleDetails(index) { + const params = { + isbn: this.bookData[index].isbn.replace(/\-/g, '') + } + getBookDetailsByISBN(params).then(res => { + if (res) { + this.$refs.detailDom.bookData = res + this.$refs.detailDom.dialogVisible = true + } else { + this.$message.error('暂无图书内容~') + } + }).catch(() => { + this.$message.error('接口错误') + }) + } + }, + // 组件挂载时的共用方法 + mounted() { + } +} diff --git a/src/views/mixins/booklist.js b/src/views/mixins/booklist.js index dee8aff..73ecbe7 100644 --- a/src/views/mixins/booklist.js +++ b/src/views/mixins/booklist.js @@ -21,6 +21,7 @@ export const bookListCrud = { methods: { // 获取热门/新书图书list getBookData() { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API this.bookLoading = true const bookType = this.$route.query.bookType const params = { @@ -31,17 +32,35 @@ export const bookListCrud = { if (bookType === 'hot') { FetchHotBookRecommend(params).then(res => { this.pageCount = res.page.totalPages - res.hotbookList.forEach(item => { - this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + // res.hotbookList.forEach(item => { + // this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + // }) + this.bookData = res.hotbookList.map((item, index) => { + if (item.nbImgPath) { + item.cover = linkSrc + '/downloadFile' + item.nbImgPath + } else { + item.cover = null + } + return item }) + this.bookLoading = false }).catch(() => { this.$message.error('接口错误') }) } else { FetchNewBookRecommend(params).then(res => { - res.newbookList.forEach(item => { - this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + this.bookData = res.newbookList.map((item, index) => { + if (item.nbImgPath) { + item.cover = linkSrc + '/downloadFile' + item.nbImgPath + } else { + item.cover = null + } + return item }) + this.bookLoading = false + // res.newbookList.forEach(item => { + // this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item) + // }) }).catch(() => { this.$message.error('接口错误') }) @@ -82,12 +101,21 @@ export const bookListCrud = { }, // 点击查看详情 handleDetails(index) { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API const params = { isbn: this.bookData[index].isbn.replace(/\-/g, '') } getBookDetailsByISBN(params).then(res => { if (res) { + // this.$refs.detailDom.bookData = res + console.log('res', res) + Object.keys(res).forEach(key => { + if (key === 'srcUrl' && res[key]) { + res[key] = linkSrc + '/downloadFile' + res[key] + } + }) this.$refs.detailDom.bookData = res + console.log('ddd', this.$refs.detailDom.bookData) this.$refs.detailDom.dialogVisible = true } else { this.$message.error('暂无图书内容~') diff --git a/src/views/module/homeListItem-dxh.vue b/src/views/module/homeListItem-dxh.vue new file mode 100644 index 0000000..f439c52 --- /dev/null +++ b/src/views/module/homeListItem-dxh.vue @@ -0,0 +1,97 @@ + + + + + diff --git a/src/views/module/homeListItem.vue b/src/views/module/homeListItem.vue index f439c52..9eb83ce 100644 --- a/src/views/module/homeListItem.vue +++ b/src/views/module/homeListItem.vue @@ -67,13 +67,22 @@ export default { }, methods: { handleDetails(index) { + const linkSrc = process.env.NODE_ENV === 'production' ? window.g.ApiUrl : process.env.VUE_APP_BASE_API const params = { isbn: this.listData[index].isbn.replace(/\-/g, '') } getBookDetailsByISBN(params).then(res => { this.$refs.detailDom.dialogVisible = true if (res) { + // this.$refs.detailDom.bookData = res + console.log('res', res) + Object.keys(res).forEach(key => { + if (key === 'srcUrl' && res[key]) { + res[key] = linkSrc + '/downloadFile' + res[key] + } + }) this.$refs.detailDom.bookData = res + console.log('ddd', this.$refs.detailDom.bookData) } else { this.$refs.detailDom.bookData = { srcUrl: this.listData[index].cover,