|
|
@@ -0,0 +1,108 @@
|
|
|
+import { BookItem, yTRouter } from "basic"
|
|
|
+import { CustomTextStyle } from "../style/CustomTextStyle"
|
|
|
+import { tagItemComp } from "./BuilderIndex"
|
|
|
+
|
|
|
+@ComponentV2
|
|
|
+export struct BookItemComp {
|
|
|
+ @Param @Require item: BookItem
|
|
|
+ // 是否为列表模式, true - 列表模式 false - 封面模式
|
|
|
+ @Param showModel: boolean = true
|
|
|
+
|
|
|
+ @Event addCar: () => void
|
|
|
+
|
|
|
+ router2DetailPage() {
|
|
|
+ yTRouter.router2BookItemDetailPage(this.item)
|
|
|
+ }
|
|
|
+
|
|
|
+ build() {
|
|
|
+ if(this.showModel) {
|
|
|
+ this.bookItemComp()
|
|
|
+ } else {
|
|
|
+ this.bookItemCompCover()
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 书籍Item - 封面模式
|
|
|
+ @Builder
|
|
|
+ bookItemCompCover(){
|
|
|
+ Row(){
|
|
|
+ RelativeContainer(){
|
|
|
+ Image(this.item.coverUrl)
|
|
|
+ .width(200)
|
|
|
+ .aspectRatio(1)
|
|
|
+ .alt($r('[basic].media.png_TopRecommend'))
|
|
|
+ .alignRules({
|
|
|
+ middle: { anchor: '__container__', align: HorizontalAlign.Center },
|
|
|
+ top: { anchor: '__container__', align: VerticalAlign.Top }
|
|
|
+ })
|
|
|
+
|
|
|
+ Image(true ? $r('[basic].media.icon_deerIncrease') : $r('[basic].media.icon_reduce'))
|
|
|
+ .width(24)
|
|
|
+ .aspectRatio(1)
|
|
|
+ .alignRules({
|
|
|
+ right: { anchor: '__container__', align: HorizontalAlign.End },
|
|
|
+ bottom: { anchor: '__container__', align: VerticalAlign.Bottom }
|
|
|
+ })
|
|
|
+ }.width('100%').height('100%')
|
|
|
+ }
|
|
|
+ .width('100%').height(214)
|
|
|
+ .padding({right: 19, bottom: 15, top: 2})
|
|
|
+ .backgroundImageSize({width: '100%', height: '100%'})
|
|
|
+ .backgroundImage($r('[basic].media.png_book_CompCover'))
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 书籍Item - 列表模式
|
|
|
+ @Builder
|
|
|
+ bookItemComp(){
|
|
|
+ Row({space: 11}){
|
|
|
+ Image(this.item.coverUrl)
|
|
|
+ .width(86)
|
|
|
+ .aspectRatio(1)
|
|
|
+ .borderRadius(12)
|
|
|
+ .alt($r('[basic].media.png_TopRecommend'))
|
|
|
+
|
|
|
+ Column({space: 3}){
|
|
|
+ Text(this.item?.bookTitle)
|
|
|
+ .attributeModifier(new CustomTextStyle({size: 14, weight: 600}))
|
|
|
+
|
|
|
+ Text(this.item?.bookSubtitle)
|
|
|
+ .width('100%')
|
|
|
+ .attributeModifier(new CustomTextStyle({size: 12, weight: 400, color: '#FF555555'}))
|
|
|
+
|
|
|
+ Blank()
|
|
|
+ .layoutWeight(1)
|
|
|
+
|
|
|
+ Row(){
|
|
|
+ Row({space: 13}){
|
|
|
+ tagItemComp(`${this.item.minAge}-${this.item.maxAge}岁`, '#FFFC9911', '#FFFFF5E7')
|
|
|
+ tagItemComp('情绪价值', '#FF4EB1EF', '#FFEDF7FD')
|
|
|
+ }
|
|
|
+
|
|
|
+ Image(this.item.schoolbagFlag == '0' ? $r('[basic].media.icon_deerIncrease') : $r('[basic].media.icon_reduce'))
|
|
|
+ .width(24)
|
|
|
+ .aspectRatio(1)
|
|
|
+ .onClick(() => {
|
|
|
+ if(this.addCar){
|
|
|
+ this.addCar()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .width("100%")
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
+ }
|
|
|
+ .layoutWeight(1)
|
|
|
+ .alignItems(HorizontalAlign.Start)
|
|
|
+ }
|
|
|
+ .padding(8)
|
|
|
+ .height(102)
|
|
|
+ .width('100%')
|
|
|
+ .borderRadius(12)
|
|
|
+ .border({width: 2, color: '#FF000000'})
|
|
|
+ .onClick(() => {
|
|
|
+ this.router2DetailPage()
|
|
|
+ })
|
|
|
+}
|
|
|
+}
|