fix: 兴趣卡ui优化

@@ -131,9 +131,9 @@ export struct ZhSingleColumn09 {
       .justifyContent(FlexAlign.SpaceBetween)
       .justifyContent(FlexAlign.SpaceBetween)
       .width('100%')
       .width('100%')
 
 
-      Grid() {
+      Flex({wrap: FlexWrap.Wrap}) {
         ForEach(this.operDataList.slice(0, 8), (item: ContentDTO, index: number) => {
         ForEach(this.operDataList.slice(0, 8), (item: ContentDTO, index: number) => {
-          GridItem() {
+          Row() {
             Stack({ alignContent: Alignment.TopEnd }) {
             Stack({ alignContent: Alignment.TopEnd }) {
               Image(this.loadImg ? item.coverUrl : '')
               Image(this.loadImg ? item.coverUrl : '')
                 .backgroundColor(0xf5f5f5)
                 .backgroundColor(0xf5f5f5)
@@ -163,6 +163,7 @@ export struct ZhSingleColumn09 {
             .width('100%')
             .width('100%')
             .aspectRatio(2 / 1)
             .aspectRatio(2 / 1)
           }
           }
+          .width('calc((100% - 6vp * 3) / 4)')
           .margin({ right: index % 4 === 3 ? 0 : 6, bottom: 6 })
           .margin({ right: index % 4 === 3 ? 0 : 6, bottom: 6 })
           .onClick(() => {
           .onClick(() => {
             if (this.activeIndexs.includes(index)) {
             if (this.activeIndexs.includes(index)) {
@@ -174,7 +175,7 @@ export struct ZhSingleColumn09 {
           })
           })
         })
         })
       }
       }
-      .columnsTemplate('1fr 1fr 1fr 1fr')
+      // .columnsTemplate('1fr 1fr 1fr 1fr')
       .margin({ bottom: 5 })
       .margin({ bottom: 5 })
 
 
       Row() {
       Row() {