From c46dee41f1786a182d6290bf990f6662fd842892 Mon Sep 17 00:00:00 2001 From: 2008 <49343738+MaoXiaoone@users.noreply.github.com> Date: Thu, 9 May 2024 01:01:25 +0800 Subject: [PATCH] =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=E7=BD=AE?= =?UTF-8?q?=E9=A1=B6=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 管理页面置顶功能 --- .../bookManage/BookInfoGridManage.ets | 16 +++++- .../componets/bookManage/BookInfoManage.ets | 28 ++++++++-- .../componets/bookManage/bookListManage.ets | 53 ++++++++++++++++--- .../main/ets/componets/common/promptShow.ets | 12 +++++ .../main/ets/componets/dataList/bookList.ets | 11 +++- .../main/ets/pages/view/BookManagePage.ets | 52 ++++++++++++++---- .../ets/pages/view/bookShelf/cartoonPage.ets | 2 +- .../ets/pages/view/bookShelf/novelPage.ets | 2 +- 8 files changed, 152 insertions(+), 24 deletions(-) create mode 100644 entry/src/main/ets/componets/common/promptShow.ets diff --git a/entry/src/main/ets/componets/bookManage/BookInfoGridManage.ets b/entry/src/main/ets/componets/bookManage/BookInfoGridManage.ets index 678e108b..3ca64cf2 100644 --- a/entry/src/main/ets/componets/bookManage/BookInfoGridManage.ets +++ b/entry/src/main/ets/componets/bookManage/BookInfoGridManage.ets @@ -17,13 +17,25 @@ export default struct BookInfoGridManage{ @Prop isJoin:boolean - @Prop @Watch('isCheckChange')allCheck:boolean = false + @Prop isTop:boolean + + @Prop @Watch('isCheckChange')allCheck:boolean @Link checkBookList:BookList[] + @Link @Watch('isTopChange')changeTop:boolean + + isTopChange(){ + this.allCheck = false + } + isCheckChange(){ if (this.allCheck) { - this.checkBookList.push(new BookList(this.bookId,this.title,this.describe,this.chapter,this.bookImage,this.isJoin)) + //判断bookId是否有存在 + if (this.checkBookList.some(book => book.bookId === this.bookId)) { + return + } + this.checkBookList.push(new BookList(this.bookId,this.title,this.describe,this.chapter,this.bookImage,new Date(),this.isJoin,true)) } else { this.checkBookList = this.checkBookList.filter(book => book.bookId !== this.bookId); } diff --git a/entry/src/main/ets/componets/bookManage/BookInfoManage.ets b/entry/src/main/ets/componets/bookManage/BookInfoManage.ets index 34772d92..ac4438b6 100644 --- a/entry/src/main/ets/componets/bookManage/BookInfoManage.ets +++ b/entry/src/main/ets/componets/bookManage/BookInfoManage.ets @@ -18,13 +18,25 @@ export default struct BookInfoManage{ @Prop isJoin:boolean - @Prop @Watch('isCheckChange')allCheck:boolean = false + @Prop isTop:boolean + + @Prop @Watch('isCheckChange')allCheck:boolean @Link checkBookList:BookList[] + @Link @Watch('isTopChange')changeTop:boolean + + isTopChange(){ + this.allCheck = false + } + isCheckChange(){ if (this.allCheck) { - this.checkBookList.push(new BookList(this.bookId,this.title,this.describe,this.chapter,this.bookImage,this.isJoin)) + //判断bookId是否有存在 + if (this.checkBookList.some(book => book.bookId === this.bookId)) { + return + } + this.checkBookList.push(new BookList(this.bookId,this.title,this.describe,this.chapter,this.bookImage,new Date(),this.isJoin,true)) } else { this.checkBookList = this.checkBookList.filter(book => book.bookId !== this.bookId); } @@ -41,7 +53,17 @@ export default struct BookInfoManage{ Row({ space:20 }){ - Image(this.bookImage).width(60).height(80) + Flex({ + alignItems: ItemAlign.End, + + }){ + if (this.isTop){ + Text('置顶').fontColor(Color.White).fontWeight(300).fontSize(8).padding(3).borderRadius(5) + .backgroundColor('rgba(0, 0, 0, 0.45)') + } + } + .align(Alignment.Bottom) .width(60).height(80).backgroundImage(this.bookImage).backgroundImageSize({width:60,height:80}) + Column({ space:24 }) diff --git a/entry/src/main/ets/componets/bookManage/bookListManage.ets b/entry/src/main/ets/componets/bookManage/bookListManage.ets index 6c8e8ff9..168c4ab6 100644 --- a/entry/src/main/ets/componets/bookManage/bookListManage.ets +++ b/entry/src/main/ets/componets/bookManage/bookListManage.ets @@ -3,6 +3,7 @@ import { promptAction } from '@kit.ArkUI' import BookInfoManage from './BookInfoManage' import BookInfoGridManage from './BookInfoGridManage' import delDialogExample from '../common/delDialog' +import {showMessage} from '../common/promptShow' @Component export default struct bookListManage{ @@ -12,15 +13,52 @@ export default struct bookListManage{ @State @Watch('isChangeBookList')checkBookList:BookList[] = [] @Link showBookList:BookList[] @Link checkNumber:number + @Link @Watch('isTopChange') changeTop:boolean + isTopChange(){ + if (this.changeTop){ + //将checkBookList选中的内容,showBookList有就更新字段isTop为true + //将checkBookList倒序 + + if (this.checkBookList.length === this.showBookList.length) { + this.checkBookList.reverse() + this.showBookList = this.checkBookList + } else { + for (let index = 0; index < this.checkBookList.length; index++) { + for (let j = 0; j < this.showBookList.length; j++) { + if (this.checkBookList[index].bookId === this.showBookList[j].bookId) { + this.showBookList[j].topUpdateTime = this.checkBookList[index].topUpdateTime + this.showBookList[j].isTop = true + break + } + } + } + } + showMessage('置顶成功') + this.changeTop = false + this.allCheck = false + this.checkBookList = [] + this.showBookSort() + } + } + + //showBookList根据isTop字段true且围绕topUpdateTime时间字段进行排序 + showBookSort() { + this.showBookList.sort((a, b) => { + if (a.isTop && !b.isTop) { + return -1 + } else if (!a.isTop && b.isTop) { + return 1 + } else { + return b.topUpdateTime.getTime() - a.topUpdateTime.getTime() + } + }) + } //监听isClear变化 onIsClearChange() { if (this.checkBookList === null || this.checkBookList.length === 0) { - promptAction.showToast({ - message: '请选择要删除的内容', - duration: 1000, - }) + showMessage('请选择要删除的内容') this.isClear = false return } @@ -35,7 +73,6 @@ export default struct bookListManage{ } console.log(JSON.stringify(this.showBookList)) this.isClear = false - this.allCheck = false this.checkBookList = [] promptAction.showToast({ message: '删除成功', @@ -94,12 +131,14 @@ export default struct bookListManage{ ForEach(this.showBookList, (item: BookList,index:number) => { BookInfoGridManage({ bookId:item.bookId, - title: item.title + this.EXHIBIT, + title: item.title, describe: item.describe, chapter: item.chapter, bookImage: item.bookImage, isJoin:item.isJoin, + isTop:item.isTop, allCheck:this.allCheck, + changeTop:this.changeTop, checkBookList:this.checkBookList }).width('33%') }) @@ -116,7 +155,9 @@ export default struct bookListManage{ chapter: item.chapter, bookImage: item.bookImage, isJoin:item.isJoin, + isTop:item.isTop, allCheck:this.allCheck, + changeTop:this.changeTop, checkBookList:this.checkBookList }) }) diff --git a/entry/src/main/ets/componets/common/promptShow.ets b/entry/src/main/ets/componets/common/promptShow.ets new file mode 100644 index 00000000..69835b54 --- /dev/null +++ b/entry/src/main/ets/componets/common/promptShow.ets @@ -0,0 +1,12 @@ +import { promptAction } from '@kit.ArkUI' + +/** + * 自定义提示 + * @param message + */ +export function showMessage(message:string ,showDuration:number = 1000){ + promptAction.showToast({ + message: message, + duration: showDuration, + }) +} \ No newline at end of file diff --git a/entry/src/main/ets/componets/dataList/bookList.ets b/entry/src/main/ets/componets/dataList/bookList.ets index 1627edc4..a8a67e06 100644 --- a/entry/src/main/ets/componets/dataList/bookList.ets +++ b/entry/src/main/ets/componets/dataList/bookList.ets @@ -1,3 +1,5 @@ +import { data } from '@kit.TelephonyKit' + export class BookList { bookId:string @@ -26,14 +28,21 @@ export class BookList { */ bookImage:Resource + /** + * 是否置顶 + */ + isTop:boolean + topUpdateTime:Date - constructor(bookId:string, title:string,describe:string , chapter:string, bookImage:Resource,isJoin:boolean = false) { + constructor(bookId:string, title:string,describe:string , chapter:string, bookImage:Resource, topUpdateTime:Date = new Date(),isJoin:boolean = false,isTop:boolean = false) { this.bookId = bookId this.title = title this.isJoin = isJoin this.describe = describe this.chapter = chapter this.bookImage = bookImage + this.isTop = isTop + this.topUpdateTime = topUpdateTime } } diff --git a/entry/src/main/ets/pages/view/BookManagePage.ets b/entry/src/main/ets/pages/view/BookManagePage.ets index 779f5777..af74d152 100644 --- a/entry/src/main/ets/pages/view/BookManagePage.ets +++ b/entry/src/main/ets/pages/view/BookManagePage.ets @@ -1,7 +1,7 @@ import router from '@ohos.router'; import bookListManage from '../../componets/bookManage/bookListManage'; import { BookList } from '../../componets/dataList/bookList'; - +import {showMessage} from '../../componets/common/promptShow' class routerParams { currentIndex:number EXHIBIT:string @@ -16,15 +16,24 @@ class routerParams { @Entry @Component struct BookManagePage { - @State currentIndex: number = (router.getParams() as routerParams).currentIndex - @State EXHIBIT: string = (router.getParams() as routerParams).EXHIBIT + @State currentIndex: number = 0 + // (router.getParams() as routerParams).currentIndex + @State EXHIBIT: string = '列表' + // (router.getParams() as routerParams).EXHIBIT @State isClear:boolean = false @State allCheck:boolean = false - @State checkNumber:number = 0 + @State @Watch('changeCheckNumber')checkNumber:number = 0 @State showBookList:BookList[] = [] + @State changeTop:boolean = false + + changeCheckNumber(){ + if (this.checkNumber !== 0 && this.checkNumber === this.showBookList.length) { + this.allCheck = true + } + } @State bookList:BookList[] = [ - new BookList('1','仙人消失之后','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list'),true) + new BookList('1','仙人消失之后','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('2','仙人消失之后','会说话的肘子·未读过2','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('3','仙人消失之后','会说话的肘子·未读过3','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('4','仙人消失之后','会说话的肘子·未读过4','更新至·第340章 镇压',$r('app.media.cover_list')) @@ -37,7 +46,7 @@ struct BookManagePage { ] @State cartoonList:BookList[] = [ - new BookList('1','极主夫道','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list1'),true) + new BookList('1','极主夫道','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('2','极主夫道','会说话的肘子·未读过2','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('3','极主夫道','会说话的肘子·未读过3','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('4','极主夫道','会说话的肘子·未读过4','更新至·第340章 镇压',$r('app.media.cover_list1')) @@ -72,7 +81,21 @@ struct BookManagePage { } else if(this.currentIndex === 2){ this.showBookList = this.soundList } + this.showBookSort() + } + //showBookList根据isTop字段排序true最上面 + showBookSort() { + this.showBookList.sort((a, b) => { + if (a.isTop && !b.isTop) { + return -1 + } else if (!a.isTop && b.isTop) { + return 1 + } else { + return b.topUpdateTime.getTime() - a.topUpdateTime.getTime() + } + }) } + onPageShow(): void { this.onCurrentIndexChange() } @@ -100,7 +123,8 @@ struct BookManagePage { EXHIBIT:this.EXHIBIT, allCheck:this.allCheck, showBookList:this.showBookList, - checkNumber:this.checkNumber + checkNumber:this.checkNumber, + changeTop:this.changeTop }) } .height('80%') @@ -120,12 +144,11 @@ struct BookManagePage { @Builder headTitle(){ Flex( { - alignItems:ItemAlign.Center } ){ Column(){ - Text(!this.allCheck?'全选':'取消全选').fontSize(16).onClick(()=>{ + Text(!this.allCheck?'全选':'取消选择').fontSize(16).onClick(()=>{ this.allCheck = !this.allCheck }) } @@ -136,7 +159,9 @@ struct BookManagePage { }.width('33%') Column(){ Text('完成').fontSize(16) - } + }.onClick(()=>{ + this.allCheck = false + }) .alignItems(HorizontalAlign.End) .width('33%') } @@ -156,6 +181,13 @@ struct BookManagePage { Image($r('app.media.pip_to_top')).width(14) Text('置顶').fontSize(14).fontWeight(500) } + .onClick(()=>{ + if (this.checkNumber === 0) { + showMessage('请选择要置顶的内容') + return + } + this.changeTop = true + }) Column({ space:5 }){ diff --git a/entry/src/main/ets/pages/view/bookShelf/cartoonPage.ets b/entry/src/main/ets/pages/view/bookShelf/cartoonPage.ets index 1c6c1b63..f84a6794 100644 --- a/entry/src/main/ets/pages/view/bookShelf/cartoonPage.ets +++ b/entry/src/main/ets/pages/view/bookShelf/cartoonPage.ets @@ -14,7 +14,7 @@ export default struct cartoonPage{ @State lastIndex:string = '9999' @Prop @Watch('onIsEXHIBITChange') EXHIBIT:string @State cartoonList:BookList[] = [ - new BookList('1','极主夫道','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list1'),true) + new BookList('1','极主夫道','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('2','极主夫道','会说话的肘子·未读过2','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('3','极主夫道','会说话的肘子·未读过3','更新至·第340章 镇压',$r('app.media.cover_list1')) ,new BookList('4','极主夫道','会说话的肘子·未读过4','更新至·第340章 镇压',$r('app.media.cover_list1')) diff --git a/entry/src/main/ets/pages/view/bookShelf/novelPage.ets b/entry/src/main/ets/pages/view/bookShelf/novelPage.ets index 9281ac31..965c2d5a 100644 --- a/entry/src/main/ets/pages/view/bookShelf/novelPage.ets +++ b/entry/src/main/ets/pages/view/bookShelf/novelPage.ets @@ -11,7 +11,7 @@ export default struct novelPage{ @State lastIndex:string = '9999' @Prop @Watch('onIsEXHIBITChange') EXHIBIT:string @State bookList:BookList[] = [ - new BookList('1','仙人消失之后','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list'),true) + new BookList('1','仙人消失之后','会说话的肘子·未读过1','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('2','仙人消失之后','会说话的肘子·未读过2','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('3','仙人消失之后','会说话的肘子·未读过3','更新至·第340章 镇压',$r('app.media.cover_list')) ,new BookList('4','仙人消失之后','会说话的肘子·未读过4','更新至·第340章 镇压',$r('app.media.cover_list'))