developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
陈剑华
2cdc560d 1 parent ae88b402

fix: 仅wifi加载图片功能

Inline Side-by-side
Showing 19 changed files with 198 additions and 292 deletions
@@ -4,6 +4,7 @@ import { ProcessUtils } from 'wdRouter'; @@ -4,6 +4,7 @@ import { ProcessUtils } from 'wdRouter';
4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'; 4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'; 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo';
6 import { Notes } from './notes'; 6 import { Notes } from './notes';
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
7 8
8 /** 9 /**
9 * 大专题卡--CompStyle: 10 10 * 大专题卡--CompStyle: 10
@@ -14,6 +15,11 @@ const TAG: string = 'Card10Component'; @@ -14,6 +15,11 @@ const TAG: string = 'Card10Component';
14 @Component 15 @Component
15 export struct Card10Component { 16 export struct Card10Component {
16 @State contentDTO: ContentDTO = {} as ContentDTO; 17 @State contentDTO: ContentDTO = {} as ContentDTO;
  18 + @State loadImg: boolean = false;
  19 +
  20 + async aboutToAppear(): Promise<void> {
  21 + this.loadImg = await onlyWifiLoadImg();
  22 + }
17 23
18 build() { 24 build() {
19 Column() { 25 Column() {
@@ -32,7 +38,8 @@ export struct Card10Component { @@ -32,7 +38,8 @@ export struct Card10Component {
32 } 38 }
33 // 大图 39 // 大图
34 Stack() { 40 Stack() {
35 - Image(this.contentDTO && this.contentDTO.coverUrl) 41 + Image(this.loadImg ? this.contentDTO?.coverUrl : '')
  42 + .backgroundColor(0xf5f5f5)
36 .width('100%') 43 .width('100%')
37 .borderRadius({ 44 .borderRadius({
38 topLeft: $r('app.float.image_border_radius'), 45 topLeft: $r('app.float.image_border_radius'),
@@ -117,7 +124,8 @@ export struct Card10Component { @@ -117,7 +124,8 @@ export struct Card10Component {
117 // 右侧图片 124 // 右侧图片
118 if (item.fullColumnImgUrls[0] && item.fullColumnImgUrls[0].url) { 125 if (item.fullColumnImgUrls[0] && item.fullColumnImgUrls[0].url) {
119 Stack() { 126 Stack() {
120 - Image(item.fullColumnImgUrls[0].url) 127 + Image(this.loadImg ? item.fullColumnImgUrls[0].url : '')
  128 + .backgroundColor(0xf5f5f5)
121 .width(117) 129 .width(117)
122 .height(78) 130 .height(78)
123 .objectFit(ImageFit.Cover) 131 .objectFit(ImageFit.Cover)
@@ -4,6 +4,7 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo' @@ -4,6 +4,7 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
4 import { CommonConstants } from 'wdConstant/Index'; 4 import { CommonConstants } from 'wdConstant/Index';
5 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
6 import {CarderInteraction} from '../CarderInteraction' 6 import {CarderInteraction} from '../CarderInteraction'
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
7 8
8 const TAG = 'Card14Component'; 9 const TAG = 'Card14Component';
9 10
@@ -12,41 +13,11 @@ const TAG = 'Card14Component'; @@ -12,41 +13,11 @@ const TAG = 'Card14Component';
12 */ 13 */
13 @Component 14 @Component
14 export struct Card14Component { 15 export struct Card14Component {
15 - @State contentDTO: ContentDTO = {  
16 - appStyle: '20',  
17 - coverType: 1,  
18 - coverUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',  
19 - fullColumnImgUrls: [  
20 - {  
21 - landscape: 1,  
22 - size: 1,  
23 - url: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',  
24 - weight: 1600  
25 - }  
26 - ],  
27 - newsTitle: '好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》好玩！》',  
28 - rmhInfo: {  
29 - authIcon:  
30 - 'https://cdnjdphoto.aikan.pdnews.cn/creator-category/icon/auth/yellow.png',  
31 - authTitle: '10后音乐人王烁然个人人民号',  
32 - authTitle2: '10后音乐人王烁然个人人民号',  
33 - banControl: 0,  
34 - cnIsAttention: 1,  
35 - rmhDesc: '10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人',  
36 - rmhHeadUrl: 'https://cdnjdphoto.aikan.pdnews.cn/image/creator/rmh/20221031/3d3419e86a.jpeg?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',  
37 - rmhName: '王烁然',  
38 - userId: '522435359667845',  
39 - userType: '2'  
40 - },  
41 - objectType: '1',  
42 - videoInfo: {  
43 - firstFrameImageUri: '',  
44 - videoDuration: 37,  
45 - videoUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/mp4/202105/rmrb_GSNARt6P1622451310.mp4'  
46 - }  
47 - } as ContentDTO; 16 + @State contentDTO: ContentDTO = {} as ContentDTO;
  17 + @State loadImg: boolean = false;
48 18
49 - aboutToAppear(): void { 19 + async aboutToAppear(): Promise<void> {
  20 + this.loadImg = await onlyWifiLoadImg();
50 } 21 }
51 22
52 build() { 23 build() {
@@ -69,7 +40,8 @@ export struct Card14Component { @@ -69,7 +40,8 @@ export struct Card14Component {
69 .margin({right: 12}) 40 .margin({right: 12})
70 .flexBasis(214) 41 .flexBasis(214)
71 42
72 - Image(this.contentDTO.coverUrl) 43 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  44 + .backgroundColor(0xf5f5f5)
73 .flexBasis(117) 45 .flexBasis(117)
74 .height(78) 46 .height(78)
75 .borderRadius($r('app.float.image_border_radius')) 47 .borderRadius($r('app.float.image_border_radius'))
@@ -4,6 +4,7 @@ import { RmhTitle } from '../cardCommon/RmhTitle' @@ -4,6 +4,7 @@ import { RmhTitle } from '../cardCommon/RmhTitle'
4 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 4 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
5 import { CommonConstants } from 'wdConstant/Index'; 5 import { CommonConstants } from 'wdConstant/Index';
6 import {CarderInteraction} from '../CarderInteraction' 6 import {CarderInteraction} from '../CarderInteraction'
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
7 8
8 const TAG: string = 'Card15Component'; 9 const TAG: string = 'Card15Component';
9 10
@@ -16,45 +17,13 @@ const TAG: string = 'Card15Component'; @@ -16,45 +17,13 @@ const TAG: string = 'Card15Component';
16 */ 17 */
17 @Component 18 @Component
18 export struct Card15Component { 19 export struct Card15Component {
19 - @State contentDTO: ContentDTO = {  
20 - // appStyle: '15',  
21 - // coverType: 1,  
22 - // objectType: '9',  
23 - // coverUrl: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/img/2024/0413/VL20Z09ISBEKXZU_963672030241091584.jpeg?x-oss-process=image/resize,m_fill,h_450,w_800/quality,q_90',  
24 - // fullColumnImgUrls: [  
25 - // {  
26 - // landscape: 2,  
27 - // size: 1,  
28 - // url: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/img/2024/0413/VL20Z09ISBEKXZU_963672030241091584.jpeg?x-oss-process=image/resize,m_fill,h_450,w_800/quality,q_90',  
29 - // weight: 1170  
30 - // }  
31 - // ],  
32 - // newsTitle: '押解画面公开！被湖北民警从柬埔寨押解回国被湖北民警从柬埔寨押解回国的130名涉赌诈嫌疑人是他们被湖北民警从柬埔寨押解回国的130名涉赌诈嫌疑人是他们的130名涉赌诈嫌疑人是他们',  
33 - // publishTime: '1712993333000',  
34 - // rmhInfo: {  
35 - // authIcon: '',  
36 - // authTitle: '',  
37 - // authTitle2: '',  
38 - // banControl: 0,  
39 - // cnIsAttention: 1,  
40 - // rmhDesc: '中共武汉市委机关报长江日报官方人民号',  
41 - // rmhHeadUrl: 'https://uatjdcdnphoto.aikan.pdnews.cn/vod/content/202302/202302Sa121448724/TUw.png?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',  
42 - // rmhId: '4255270',  
43 - // rmhName: '长江日报',  
44 - // userId: '513696944662469',  
45 - // userType: '3'  
46 - // },  
47 - // videoInfo: {  
48 - // firstFrameImageUri: '',  
49 - // videoDuration: 12,  
50 - // // videoLandscape: 2,  
51 - // videoUrl: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/video/2024/0413/VL20Z09ISBEKXZU_963672027208609792.mp4'  
52 - // },  
53 - // photoNum: '9',  
54 - // voiceInfo: {  
55 - // voiceDuration: 12  
56 - // }  
57 - } as ContentDTO; 20 + @State contentDTO: ContentDTO = {} as ContentDTO;
  21 + @State loadImg: boolean = false;
  22 +
  23 + async aboutToAppear(): Promise<void> {
  24 + this.loadImg = await onlyWifiLoadImg();
  25 + }
  26 +
58 27
59 build() { 28 build() {
60 Column() { 29 Column() {
@@ -71,7 +40,8 @@ export struct Card15Component { @@ -71,7 +40,8 @@ export struct Card15Component {
71 } 40 }
72 //大图 41 //大图
73 Stack() { 42 Stack() {
74 - Image(this.contentDTO.coverUrl) 43 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  44 + .backgroundColor(0xf5f5f5)
75 .borderRadius($r('app.float.image_border_radius')) 45 .borderRadius($r('app.float.image_border_radius'))
76 //播放状态+时长 46 //播放状态+时长
77 CardMediaInfo({ 47 CardMediaInfo({
@@ -4,6 +4,7 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo' @@ -4,6 +4,7 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
4 import { CommonConstants } from 'wdConstant/Index'; 4 import { CommonConstants } from 'wdConstant/Index';
5 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
6 import {CarderInteraction} from '../CarderInteraction' 6 import {CarderInteraction} from '../CarderInteraction'
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
7 8
8 const TAG = 'Card16Component'; 9 const TAG = 'Card16Component';
9 10
@@ -18,8 +19,10 @@ interface fullColumnImgUrlItem { @@ -18,8 +19,10 @@ interface fullColumnImgUrlItem {
18 @Component 19 @Component
19 export struct Card16Component { 20 export struct Card16Component {
20 @State contentDTO: ContentDTO = {} as ContentDTO; 21 @State contentDTO: ContentDTO = {} as ContentDTO;
  22 + @State loadImg: boolean = false;
21 23
22 - aboutToAppear(): void { 24 + async aboutToAppear(): Promise<void> {
  25 + this.loadImg = await onlyWifiLoadImg();
23 } 26 }
24 27
25 build() { 28 build() {
@@ -41,7 +44,11 @@ export struct Card16Component { @@ -41,7 +44,11 @@ export struct Card16Component {
41 if (this.contentDTO.fullColumnImgUrls?.length > 0) { 44 if (this.contentDTO.fullColumnImgUrls?.length > 0) {
42 Flex() { 45 Flex() {
43 ForEach(this.contentDTO.fullColumnImgUrls.slice(0, 3), (item: fullColumnImgUrlItem, index: number) => { 46 ForEach(this.contentDTO.fullColumnImgUrls.slice(0, 3), (item: fullColumnImgUrlItem, index: number) => {
44 - Image(item.url).flexBasis(113).height(75).margin({ right: index > 1 ? 0 : 2 }) 47 + Image(this.loadImg ? item.url : '')
  48 + .backgroundColor(0xf5f5f5)
  49 + .flexBasis(113)
  50 + .height(75)
  51 + .margin({ right: index > 1 ? 0 : 2 })
45 }) 52 })
46 } 53 }
47 } 54 }
@@ -70,6 +77,11 @@ interface radiusType { @@ -70,6 +77,11 @@ interface radiusType {
70 @Component 77 @Component
71 struct createImg { 78 struct createImg {
72 @Prop contentDTO: ContentDTO 79 @Prop contentDTO: ContentDTO
  80 + @State loadImg: boolean = false;
  81 +
  82 + async aboutToAppear(): Promise<void> {
  83 + this.loadImg = await onlyWifiLoadImg();
  84 + }
73 85
74 build() { 86 build() {
75 GridRow() { 87 GridRow() {
@@ -79,7 +91,8 @@ struct createImg { @@ -79,7 +91,8 @@ struct createImg {
79 span: { xs: 12 } 91 span: { xs: 12 }
80 }) { 92 }) {
81 Stack() { 93 Stack() {
82 - Image(this.contentDTO.coverUrl) 94 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  95 + .backgroundColor(0xf5f5f5)
83 .width(CommonConstants.FULL_WIDTH) 96 .width(CommonConstants.FULL_WIDTH)
84 .aspectRatio(16 / 9) 97 .aspectRatio(16 / 9)
85 .borderRadius($r('app.float.image_border_radius')) 98 .borderRadius($r('app.float.image_border_radius'))
@@ -93,7 +106,8 @@ struct createImg { @@ -93,7 +106,8 @@ struct createImg {
93 span: { xs: 6 } 106 span: { xs: 6 }
94 }) { 107 }) {
95 Stack() { 108 Stack() {
96 - Image(this.contentDTO.coverUrl) 109 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  110 + .backgroundColor(0xf5f5f5)
97 .width(CommonConstants.FULL_WIDTH) 111 .width(CommonConstants.FULL_WIDTH)
98 .borderRadius($r('app.float.image_border_radius')) 112 .borderRadius($r('app.float.image_border_radius'))
99 CardMediaInfo({ contentDTO: this.contentDTO }) 113 CardMediaInfo({ contentDTO: this.contentDTO })
@@ -5,6 +5,8 @@ import { DateTimeUtils } from 'wdKit'; @@ -5,6 +5,8 @@ import { DateTimeUtils } from 'wdKit';
5 import { WDRouterRule } from 'wdRouter'; 5 import { WDRouterRule } from 'wdRouter';
6 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 6 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
7 import { CardSourceInfo } from '../cardCommon/CardSourceInfo' 7 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
  8 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
  9 +
8 const TAG = 'Card17Component'; 10 const TAG = 'Card17Component';
9 11
10 /** 12 /**
@@ -14,6 +16,12 @@ const TAG = 'Card17Component'; @@ -14,6 +16,12 @@ const TAG = 'Card17Component';
14 export struct Card17Component { 16 export struct Card17Component {
15 @State compDTO: CompDTO = {} as CompDTO 17 @State compDTO: CompDTO = {} as CompDTO
16 @State contentDTO: ContentDTO = {} as ContentDTO; 18 @State contentDTO: ContentDTO = {} as ContentDTO;
  19 + @State loadImg: boolean = false;
  20 +
  21 + async aboutToAppear(): Promise<void> {
  22 + this.loadImg = await onlyWifiLoadImg();
  23 + }
  24 +
17 25
18 build() { 26 build() {
19 Column({ space: 8 }) { 27 Column({ space: 8 }) {
@@ -29,8 +37,8 @@ export struct Card17Component { @@ -29,8 +37,8 @@ export struct Card17Component {
29 // 三个图， 37 // 三个图，
30 GridRow({ gutter: 2 }) { 38 GridRow({ gutter: 2 }) {
31 GridCol({ span: { xs: 8 } }) { 39 GridCol({ span: { xs: 8 } }) {
32 - Image(this.contentDTO.fullColumnImgUrls.length > 0 ?this.contentDTO.fullColumnImgUrls[0].url:'')  
33 - .backgroundColor('#f5f5f5') 40 + Image(this.loadImg ? this.contentDTO.fullColumnImgUrls.length > 0 ?this.contentDTO.fullColumnImgUrls[0].url:'' : '')
  41 + .backgroundColor(this.loadImg ? '#f5f5f5' : 0xf5f5f5)
34 .width(CommonConstants.FULL_WIDTH) 42 .width(CommonConstants.FULL_WIDTH)
35 .aspectRatio(16 / 9) 43 .aspectRatio(16 / 9)
36 .borderRadius({ 44 .borderRadius({
@@ -40,8 +48,8 @@ export struct Card17Component { @@ -40,8 +48,8 @@ export struct Card17Component {
40 } 48 }
41 49
42 GridCol({ span: { xs: 4 } }) { 50 GridCol({ span: { xs: 4 } }) {
43 - Image(this.contentDTO.fullColumnImgUrls.length > 1? this.contentDTO.fullColumnImgUrls[1].url:'')  
44 - .backgroundColor('#f5f5f5') 51 + Image(this.loadImg ? this.contentDTO.fullColumnImgUrls.length > 1? this.contentDTO.fullColumnImgUrls[1].url:'' : '')
  52 + .backgroundColor(this.loadImg ? '#f5f5f5' : 0xf5f5f5)
45 .width(CommonConstants.FULL_WIDTH) 53 .width(CommonConstants.FULL_WIDTH)
46 .aspectRatio(16 / 9) 54 .aspectRatio(16 / 9)
47 .margin({ bottom: 1 }) 55 .margin({ bottom: 1 })
@@ -56,8 +64,8 @@ export struct Card17Component { @@ -56,8 +64,8 @@ export struct Card17Component {
56 } 64 }
57 65
58 GridCol({ span: { xs: 4 } }) { 66 GridCol({ span: { xs: 4 } }) {
59 - Image(this.contentDTO.fullColumnImgUrls.length > 2? this.contentDTO.fullColumnImgUrls[2].url:'')  
60 - .backgroundColor('#f5f5f5') 67 + Image(this.loadImg ? this.contentDTO.fullColumnImgUrls.length > 2? this.contentDTO.fullColumnImgUrls[2].url:'' : '')
  68 + .backgroundColor(this.loadImg ? '#f5f5f5' : 0xf5f5f5)
61 .width(CommonConstants.FULL_WIDTH) 69 .width(CommonConstants.FULL_WIDTH)
62 .aspectRatio(16 / 9) 70 .aspectRatio(16 / 9)
63 .margin({ top: 1 }) 71 .margin({ top: 1 })
@@ -3,6 +3,7 @@ import { RmhTitle } from '../cardCommon/RmhTitle' @@ -3,6 +3,7 @@ import { RmhTitle } from '../cardCommon/RmhTitle'
3 import { ProcessUtils } from 'wdRouter'; 3 import { ProcessUtils } from 'wdRouter';
4 import { CommonConstants } from 'wdConstant/Index'; 4 import { CommonConstants } from 'wdConstant/Index';
5 import {CarderInteraction} from '../CarderInteraction' 5 import {CarderInteraction} from '../CarderInteraction'
  6 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
6 7
7 const TAG = 'Card19Component'; 8 const TAG = 'Card19Component';
8 9
@@ -12,69 +13,8 @@ const TAG = 'Card19Component'; @@ -12,69 +13,8 @@ const TAG = 'Card19Component';
12 @Component 13 @Component
13 export struct Card19Component { 14 export struct Card19Component {
14 @State contentDTO: ContentDTO = { 15 @State contentDTO: ContentDTO = {
15 - // appStyle: '19',  
16 - // coverUrl: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994160362418176.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
17 - // fullColumnImgUrls: [  
18 - // {  
19 - // fullUrl: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994155727712256.png?x-oss-process=image/quality,q_90/auto-orient,1',  
20 - // height: 1500,  
21 - // landscape: 1,  
22 - // size: 1,  
23 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994160362418176.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
24 - // weight: 2000  
25 - // },  
26 - // {  
27 - // fullUrl: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994155727712256.png?x-oss-process=image/quality,q_90/auto-orient,1',  
28 - // height: 1500,  
29 - // landscape: 1,  
30 - // size: 1,  
31 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994155727712256.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
32 - // weight: 2000  
33 - // },  
34 - // {  
35 - // fullUrl: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994132109586432.png?x-oss-process=image/quality,q_90/auto-orient,1',  
36 - // height: 1280,  
37 - // landscape: 1,  
38 - // size: 1,  
39 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994132109586432.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
40 - // weight: 1707  
41 - // },  
42 - // {  
43 - // fullUrl: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994132109586432.png?x-oss-process=image/quality,q_90/auto-orient,1',  
44 - // height: 1280,  
45 - // landscape: 1,  
46 - // size: 1,  
47 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/ueditor/image/20240323/a_955994132109586432.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
48 - // weight: 1707  
49 - // }  
50 - // ],  
51 - // newsSummary: '#平安建设双提升#【进工地，送安全】3月21日下午，@合肥交警 包河大队走进辖区建筑工地为驾驶员、安全员们开展春季交通安全主题宣传活动。活动中，交警结合涉工程运输车、渣土车交通事故案例，详细讲解行驶注意事项，并普及了“一盔一带”“右转必停”等安全常识，要求驾驶员牢固树立交通安全意识，自觉遵守交通法律法规，确保出行安全。',  
52 - // newsTitle: '#平安建设双提升#【进工地，送安全】3月21日下午，@合肥交警 包河大队走进辖区建筑工地为驾驶员、安全员们开展春季交通安全主题宣传活动。活动中，交警结合涉工程运输车、渣土车交通事故案例，详细讲解行驶注意事项，并普及了“一盔一带”“右转必停”等安全常识，要求驾驶员牢固树立交通安全意识，自觉遵守交通法律法规，确保出行安全。',  
53 - // publishTime: '1711185754000',  
54 - // relType: '1',  
55 - // rmhInfo: {  
56 - // authIcon: '',  
57 - // authTitle: '',  
58 - // authTitle2: '',  
59 - // banControl: 0,  
60 - // cnIsAttention: 1,  
61 - // cnIsComment: 1,  
62 - // cnIsLike: 1,  
63 - // cnMainControl: 1,  
64 - // cnShareControl: 1,  
65 - // posterShareControl: 1,  
66 - // rmhDesc: '合肥市公安局官方人民号',  
67 - // rmhHeadUrl: 'https://uatjdcdnphoto.aikan.pdnews.cn/vod/content/202302/202302Sa121448724/TUw.png?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',  
68 - // rmhId: '4255290',  
69 - // rmhName: '合肥警方',  
70 - // userId: '513697181730757',  
71 - // userType: '2'  
72 - // }  
73 } as ContentDTO 16 } as ContentDTO
74 17
75 - aboutToAppear(): void {  
76 - }  
77 -  
78 build() { 18 build() {
79 Column() { 19 Column() {
80 // rmh信息 20 // rmh信息
@@ -132,13 +72,17 @@ struct createImg { @@ -132,13 +72,17 @@ struct createImg {
132 @Prop fullColumnImgUrls: FullColumnImgUrlDTO[] 72 @Prop fullColumnImgUrls: FullColumnImgUrlDTO[]
133 @State picWidth: number = 0; 73 @State picWidth: number = 0;
134 @State picHeight: number = 0; 74 @State picHeight: number = 0;
135 - aboutToAppear(): void { 75 + @State loadImg: boolean = false;
  76 +
  77 + async aboutToAppear(): Promise<void> {
  78 + this.loadImg = await onlyWifiLoadImg();
136 if(this.fullColumnImgUrls.length === 4) { // 为了使用栅格布局以便于占用三分之二的宽度，加一个占位 79 if(this.fullColumnImgUrls.length === 4) { // 为了使用栅格布局以便于占用三分之二的宽度，加一个占位
137 this.fullColumnImgUrls.splice(2,0, { 80 this.fullColumnImgUrls.splice(2,0, {
138 fullUrl: '' 81 fullUrl: ''
139 } as FullColumnImgUrlDTO) 82 } as FullColumnImgUrlDTO)
140 } 83 }
141 } 84 }
  85 +
142 caclImageRadius(index: number) { 86 caclImageRadius(index: number) {
143 let radius: radiusType = { 87 let radius: radiusType = {
144 topLeft: index === 0 ? $r('app.float.image_border_radius') : 0, 88 topLeft: index === 0 ? $r('app.float.image_border_radius') : 0,
@@ -191,13 +135,14 @@ struct createImg { @@ -191,13 +135,14 @@ struct createImg {
191 alignContent: Alignment.BottomEnd 135 alignContent: Alignment.BottomEnd
192 }) { 136 }) {
193 if (this.getPicType() === 1) { 137 if (this.getPicType() === 1) {
194 - Image(item.fullUrl) 138 + Image(this.loadImg ? item.fullUrl : '')
  139 + .backgroundColor(0xf5f5f5)
195 .width('100%') 140 .width('100%')
196 // .height(172) 141 // .height(172)
197 .autoResize(true) 142 .autoResize(true)
198 .borderRadius(this.caclImageRadius(index)) 143 .borderRadius(this.caclImageRadius(index))
199 } else if (this.getPicType() === 2) { 144 } else if (this.getPicType() === 2) {
200 - Image(item.fullUrl) 145 + Image(this.loadImg ? item.fullUrl : '')
201 // .width('100%') 146 // .width('100%')
202 .height(305) 147 .height(305)
203 .autoResize(true) 148 .autoResize(true)
@@ -223,7 +168,8 @@ struct createImg { @@ -223,7 +168,8 @@ struct createImg {
223 GridCol({ 168 GridCol({
224 span: { xs: 8 } 169 span: { xs: 8 }
225 }) { 170 }) {
226 - Image(item.fullUrl) 171 + Image(this.loadImg ? item.fullUrl : '')
  172 + .backgroundColor(0xf5f5f5)
227 .width('100%') 173 .width('100%')
228 .borderRadius(this.caclImageRadius(index)) 174 .borderRadius(this.caclImageRadius(index))
229 .autoResize(true) 175 .autoResize(true)
@@ -238,7 +184,8 @@ struct createImg { @@ -238,7 +184,8 @@ struct createImg {
238 GridCol({ 184 GridCol({
239 span: { xs: 4 } 185 span: { xs: 4 }
240 }) { 186 }) {
241 - Image(item.fullUrl) 187 + Image(this.loadImg ? item.fullUrl : '')
  188 + .backgroundColor(0xf5f5f5)
242 .aspectRatio(1) 189 .aspectRatio(1)
243 .borderRadius(this.caclImageRadius(index)) 190 .borderRadius(this.caclImageRadius(index))
244 } 191 }
@@ -246,7 +193,8 @@ struct createImg { @@ -246,7 +193,8 @@ struct createImg {
246 GridCol({ 193 GridCol({
247 span: { sm: 4, lg: 3 } 194 span: { sm: 4, lg: 3 }
248 }) { 195 }) {
249 - Image(item.fullUrl) 196 + Image(this.loadImg ? item.fullUrl : '')
  197 + .backgroundColor(0xf5f5f5)
250 .aspectRatio(1) 198 .aspectRatio(1)
251 .borderRadius(this.caclImageRadius(index)) 199 .borderRadius(this.caclImageRadius(index))
252 } 200 }
@@ -4,6 +4,8 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo' @@ -4,6 +4,8 @@ import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
4 import { CommonConstants } from 'wdConstant/Index'; 4 import { CommonConstants } from 'wdConstant/Index';
5 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
6 import {CarderInteraction} from '../CarderInteraction' 6 import {CarderInteraction} from '../CarderInteraction'
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
  8 +
7 const TAG = 'Card20Component'; 9 const TAG = 'Card20Component';
8 10
9 /** 11 /**
@@ -12,37 +14,6 @@ const TAG = 'Card20Component'; @@ -12,37 +14,6 @@ const TAG = 'Card20Component';
12 @Component 14 @Component
13 export struct Card20Component { 15 export struct Card20Component {
14 @State contentDTO: ContentDTO = { 16 @State contentDTO: ContentDTO = {
15 - // appStyle: '20',  
16 - // coverType: 1,  
17 - // coverUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',  
18 - // fullColumnImgUrls: [  
19 - // {  
20 - // landscape: 1,  
21 - // size: 1,  
22 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',  
23 - // weight: 1600  
24 - // }  
25 - // ],  
26 - // newsTitle: '好玩！》',  
27 - // rmhInfo: {  
28 - // authIcon:  
29 - // 'https://cdnjdphoto.aikan.pdnews.cn/creator-category/icon/auth/yellow.png',  
30 - // authTitle: '10后音乐人王烁然个人人民号',  
31 - // authTitle2: '10后音乐人王烁然个人人民号',  
32 - // banControl: 0,  
33 - // cnIsAttention: 1,  
34 - // rmhDesc: '10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人',  
35 - // rmhHeadUrl: 'https://cdnjdphoto.aikan.pdnews.cn/image/creator/rmh/20221031/3d3419e86a.jpeg?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',  
36 - // rmhName: '王烁然',  
37 - // userId: '522435359667845',  
38 - // userType: '2'  
39 - // },  
40 - // objectType: '1',  
41 - // videoInfo: {  
42 - // firstFrameImageUri: '',  
43 - // videoDuration: 37,  
44 - // videoUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/mp4/202105/rmrb_GSNARt6P1622451310.mp4'  
45 - // }  
46 } as ContentDTO; 17 } as ContentDTO;
47 18
48 aboutToAppear(): void { 19 aboutToAppear(): void {
@@ -90,6 +61,12 @@ interface radiusType { @@ -90,6 +61,12 @@ interface radiusType {
90 @Component 61 @Component
91 struct createImg { 62 struct createImg {
92 @Prop contentDTO: ContentDTO 63 @Prop contentDTO: ContentDTO
  64 + @State loadImg: boolean = false;
  65 +
  66 + async aboutToAppear(): Promise<void> {
  67 + this.loadImg = await onlyWifiLoadImg();
  68 + }
  69 +
93 70
94 build() { 71 build() {
95 GridRow() { 72 GridRow() {
@@ -99,7 +76,8 @@ struct createImg { @@ -99,7 +76,8 @@ struct createImg {
99 span: { xs: 12 } 76 span: { xs: 12 }
100 }) { 77 }) {
101 Stack() { 78 Stack() {
102 - Image(this.contentDTO.coverUrl) 79 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  80 + .backgroundColor(0xf5f5f5)
103 .width(CommonConstants.FULL_WIDTH) 81 .width(CommonConstants.FULL_WIDTH)
104 .aspectRatio(16 / 9) 82 .aspectRatio(16 / 9)
105 .borderRadius($r('app.float.image_border_radius')) 83 .borderRadius($r('app.float.image_border_radius'))
@@ -116,7 +94,8 @@ struct createImg { @@ -116,7 +94,8 @@ struct createImg {
116 span: { xs: 6 } 94 span: { xs: 6 }
117 }) { 95 }) {
118 Stack() { 96 Stack() {
119 - Image(this.contentDTO.coverUrl) 97 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  98 + .backgroundColor(0xf5f5f5)
120 .width(CommonConstants.FULL_WIDTH) 99 .width(CommonConstants.FULL_WIDTH)
121 .borderRadius($r('app.float.image_border_radius')) 100 .borderRadius($r('app.float.image_border_radius'))
122 CardMediaInfo({ contentDTO: this.contentDTO }) 101 CardMediaInfo({ contentDTO: this.contentDTO })
@@ -4,6 +4,8 @@ import { ProcessUtils } from 'wdRouter'; @@ -4,6 +4,8 @@ import { ProcessUtils } from 'wdRouter';
4 import { RmhTitle } from '../cardCommon/RmhTitle' 4 import { RmhTitle } from '../cardCommon/RmhTitle'
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
6 import {CarderInteraction} from '../CarderInteraction' 6 import {CarderInteraction} from '../CarderInteraction'
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
  8 +
7 const TAG: string = 'Card6Component-Card13Component'; 9 const TAG: string = 'Card6Component-Card13Component';
8 10
9 /** 11 /**
@@ -12,6 +14,11 @@ const TAG: string = 'Card6Component-Card13Component'; @@ -12,6 +14,11 @@ const TAG: string = 'Card6Component-Card13Component';
12 @Component 14 @Component
13 export struct Card21Component { 15 export struct Card21Component {
14 @State contentDTO: ContentDTO = {} as ContentDTO; 16 @State contentDTO: ContentDTO = {} as ContentDTO;
  17 + @State loadImg: boolean = false;
  18 +
  19 + async aboutToAppear(): Promise<void> {
  20 + this.loadImg = await onlyWifiLoadImg();
  21 + }
15 22
16 build() { 23 build() {
17 Column() { 24 Column() {
@@ -32,7 +39,8 @@ export struct Card21Component { @@ -32,7 +39,8 @@ export struct Card21Component {
32 39
33 GridItem() { 40 GridItem() {
34 Stack() { 41 Stack() {
35 - Image(this.contentDTO.coverUrl) 42 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  43 + .backgroundColor(0xf5f5f5)
36 .width(CommonConstants.FULL_WIDTH) 44 .width(CommonConstants.FULL_WIDTH)
37 .borderRadius($r('app.float.image_border_radius')) 45 .borderRadius($r('app.float.image_border_radius'))
38 CardMediaInfo({ contentDTO: this.contentDTO }) 46 CardMediaInfo({ contentDTO: this.contentDTO })
@@ -5,6 +5,7 @@ import { ProcessUtils } from 'wdRouter'; @@ -5,6 +5,7 @@ import { ProcessUtils } from 'wdRouter';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'; 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo';
6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'; 6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo';
7 import { Notes } from './notes'; 7 import { Notes } from './notes';
  8 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
8 9
9 const TAG: string = 'Card2Component'; 10 const TAG: string = 'Card2Component';
10 11
@@ -17,21 +18,12 @@ const TAG: string = 'Card2Component'; @@ -17,21 +18,12 @@ const TAG: string = 'Card2Component';
17 */ 18 */
18 @Component 19 @Component
19 export struct Card2Component { 20 export struct Card2Component {
20 - @State contentDTO: ContentDTO = {  
21 - // appStyle: '2',  
22 - // objectType: '1',  
23 - // coverUrl:  
24 - // 'https://rmrbcmsonline.peopleapp.com/upload/image/202404/202404141115457926.png?x-oss-process=image/resize,m_fill,h_450,w_800/quality,q_90',  
25 - // newsTitle: '又见花开！新疆伊犁花海延绵清新怡人',  
26 - // publishTime: '1713067227000',  
27 - // source: '荔枝新闻',  
28 - // videoInfo: {  
29 - // videoDuration: 25,  
30 - // videoLandscape: 1,  
31 - // videoUrl:  
32 - // 'https://rmrbcmsonline.peopleapp.com/upload/video/mp4/202404/1713064515901314d148763996.mp4'  
33 - // }  
34 - } as ContentDTO; 21 + @State contentDTO: ContentDTO = {} as ContentDTO;
  22 + @State loadImg: boolean = false;
  23 +
  24 + async aboutToAppear(): Promise<void> {
  25 + this.loadImg = await onlyWifiLoadImg();
  26 + }
35 27
36 build() { 28 build() {
37 Column() { 29 Column() {
@@ -53,10 +45,11 @@ export struct Card2Component { @@ -53,10 +45,11 @@ export struct Card2Component {
53 45
54 //大图 46 //大图
55 Stack() { 47 Stack() {
56 - Image(this.contentDTO.coverUrl) 48 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
57 .width(CommonConstants.FULL_WIDTH) 49 .width(CommonConstants.FULL_WIDTH)
58 .aspectRatio(16 / 9) 50 .aspectRatio(16 / 9)
59 .borderRadius($r('app.float.image_border_radius')) 51 .borderRadius($r('app.float.image_border_radius'))
  52 + .backgroundColor(0xf5f5f5)
60 //播放状态+时长 53 //播放状态+时长
61 CardMediaInfo({ 54 CardMediaInfo({
62 contentDTO: this.contentDTO 55 contentDTO: this.contentDTO
@@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant/Index'; @@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant/Index';
3 import { ProcessUtils } from 'wdRouter'; 3 import { ProcessUtils } from 'wdRouter';
4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo' 4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
  6 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
6 const TAG: string = 'Card4Component'; 7 const TAG: string = 'Card4Component';
7 8
8 /** 9 /**
@@ -14,62 +15,12 @@ const TAG: string = 'Card4Component'; @@ -14,62 +15,12 @@ const TAG: string = 'Card4Component';
14 */ 15 */
15 @Component 16 @Component
16 export struct Card4Component { 17 export struct Card4Component {
17 - @State contentDTO: ContentDTO = {  
18 - // appStyle: '4',  
19 - // fullColumnImgUrls: [  
20 - // {  
21 - // format: null,  
22 - // fullUrl: '',  
23 - // height: 187,  
24 - // landscape: 1,  
25 - // size: 1,  
26 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/article_resource/image/1648118198_0c20f7c31c7b4eca6b0d0871e7771c62.png?x-oss-process=image/resize,m_fill,h_160,w_240/quality,q_90',  
27 - // weight: 248  
28 - // },  
29 - // {  
30 - // format: null,  
31 - // fullUrl: '',  
32 - // height: 187,  
33 - // landscape: 1,  
34 - // size: 1,  
35 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/article_resource/image/1648118198_0c20f7c31c7b4eca6b0d0871e7771c62.png?x-oss-process=image/resize,m_fill,h_160,w_240/quality,q_90',  
36 - // weight: 248  
37 - // },  
38 - // {  
39 - // format: null,  
40 - // fullUrl: '',  
41 - // height: 187,  
42 - // landscape: 1,  
43 - // size: 1,  
44 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/article_resource/image/1648118200_d10309bee894a67311e6c8f77df676d4.png?x-oss-process=image/resize,m_fill,h_160,w_240/quality,q_90',  
45 - // weight: 248  
46 - // },  
47 - // {  
48 - // format: null,  
49 - // fullUrl: '',  
50 - // height: 187,  
51 - // landscape: 1,  
52 - // size: 1,  
53 - // url: 'https://rmrbcmsonline.peopleapp.com/upload/article_resource/image/1648118202_f33743e452fb69ee2c45c18a56eccdf6.png?x-oss-process=image/resize,m_fill,h_160,w_240/quality,q_90',  
54 - // weight: 248  
55 - // }  
56 - // ],  
57 - // newsTitle: '科普：如何发现家中是否有白蚁危害？丨又到白蚁分飞季②',  
58 - // rmhInfo: {  
59 - // authIcon:  
60 - // 'https://cdnjdphoto.aikan.pdnews.cn/creator-category/icon/auth/blue.png',  
61 - // authTitle: '封面新闻',  
62 - // rmhDesc: '封面新闻，亿万年轻人的生活方式。',  
63 - // rmhHeadUrl:  
64 - // 'https://cdnjdphoto.aikan.pdnews.cn/image/creator/rmh/20221212/122faff796.jpeg?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',  
65 - // rmhId: '2016608',  
66 - // rmhName: '封面新闻',  
67 - // userId: '522390888224390',  
68 - // userType: '2'  
69 - // },  
70 - // source: '头条号',  
71 - // publishTime: '1651204607000',  
72 - } as ContentDTO; 18 + @State contentDTO: ContentDTO = {} as ContentDTO;
  19 + @State loadImg: boolean = false;
  20 +
  21 + async aboutToAppear(): Promise<void> {
  22 + this.loadImg = await onlyWifiLoadImg();
  23 + }
73 24
74 build() { 25 build() {
75 Column() { 26 Column() {
@@ -88,7 +39,8 @@ export struct Card4Component { @@ -88,7 +39,8 @@ export struct Card4Component {
88 ForEach(this.contentDTO.fullColumnImgUrls, (item: FullColumnImgUrlDTO, index: number) => { 39 ForEach(this.contentDTO.fullColumnImgUrls, (item: FullColumnImgUrlDTO, index: number) => {
89 if (index < 3) { 40 if (index < 3) {
90 GridCol({ span: { xs: 4 } }) { 41 GridCol({ span: { xs: 4 } }) {
91 - Image(item.url) 42 + Image(this.loadImg ? item.url : '')
  43 + .backgroundColor(0xf5f5f5)
92 .width('100%') 44 .width('100%')
93 .aspectRatio(113 / 75) 45 .aspectRatio(113 / 75)
94 .borderRadius({ 46 .borderRadius({
1 import { ContentDTO } from 'wdBean'; 1 import { ContentDTO } from 'wdBean';
2 import { CommonConstants } from 'wdConstant'; 2 import { CommonConstants } from 'wdConstant';
3 import { ProcessUtils } from 'wdRouter'; 3 import { ProcessUtils } from 'wdRouter';
  4 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
4 5
5 const TAG: string = 'Card5Component'; 6 const TAG: string = 'Card5Component';
6 7
@@ -10,21 +11,18 @@ const TAG: string = 'Card5Component'; @@ -10,21 +11,18 @@ const TAG: string = 'Card5Component';
10 // @Entry 11 // @Entry
11 @Component 12 @Component
12 export struct Card5Component { 13 export struct Card5Component {
13 - @State contentDTO: ContentDTO = {  
14 - // coverSize: '850*478',  
15 - // coverType: 1,  
16 - // coverUrl:  
17 - // 'https://uatjdcdnphoto.aikan.pdnews.cn/sjbj-20240323/image/display/54ce2de0d20842839e96a644c78361b7.jpg?x-oss-process=image/resize,w_550/quality,q_90/format,jpg',  
18 - // linkUrl:  
19 - // 'https://pd-people-uat.pdnews.cn/h/atv/collect/1000000472?hiddenNavigator=1',  
20 - // newsTitle: '今天是周日，天气阴天，明天是周一。',  
21 - // objectType: '6'  
22 - } as ContentDTO; 14 + @State contentDTO: ContentDTO = {} as ContentDTO;
23 @State titleShowPolicy: number | string = 1 15 @State titleShowPolicy: number | string = 1
  16 + @State loadImg: boolean = false;
  17 +
  18 + async aboutToAppear(): Promise<void> {
  19 + this.loadImg = await onlyWifiLoadImg();
  20 + }
24 21
25 build() { 22 build() {
26 Stack() { 23 Stack() {
27 - Image(this.contentDTO.coverUrl) 24 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  25 + .backgroundColor(0xf5f5f5)
28 .width(CommonConstants.FULL_WIDTH) 26 .width(CommonConstants.FULL_WIDTH)
29 .autoResize(true) 27 .autoResize(true)
30 .borderRadius($r('app.float.image_border_radius')) 28 .borderRadius($r('app.float.image_border_radius'))
@@ -4,6 +4,7 @@ import { ProcessUtils } from 'wdRouter'; @@ -4,6 +4,7 @@ import { ProcessUtils } from 'wdRouter';
4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'; 4 import { CardSourceInfo } from '../cardCommon/CardSourceInfo';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'; 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo';
6 import { Notes } from './notes'; 6 import { Notes } from './notes';
  7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
7 8
8 const TAG: string = 'Card6Component-Card13Component'; 9 const TAG: string = 'Card6Component-Card13Component';
9 10
@@ -13,6 +14,11 @@ const TAG: string = 'Card6Component-Card13Component'; @@ -13,6 +14,11 @@ const TAG: string = 'Card6Component-Card13Component';
13 @Component 14 @Component
14 export struct Card6Component { 15 export struct Card6Component {
15 @State contentDTO: ContentDTO = {} as ContentDTO; 16 @State contentDTO: ContentDTO = {} as ContentDTO;
  17 + @State loadImg: boolean = false;
  18 +
  19 + async aboutToAppear(): Promise<void> {
  20 + this.loadImg = await onlyWifiLoadImg();
  21 + }
16 22
17 build() { 23 build() {
18 Row() { 24 Row() {
@@ -55,8 +61,8 @@ export struct Card6Component { @@ -55,8 +61,8 @@ export struct Card6Component {
55 .width('58%') 61 .width('58%')
56 62
57 Stack() { 63 Stack() {
58 - Image(this.contentDTO.coverUrl)  
59 - .backgroundColor($r('app.color.color_B0B0B0')) 64 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  65 + .backgroundColor( this.loadImg ? $r('app.color.color_B0B0B0') : 0xf5f5f5)
60 .borderRadius(5) 66 .borderRadius(5)
61 .aspectRatio(this.contentDTO.appStyle === CompStyle.Card_13 ? 3 / 2 : 3 / 4) 67 .aspectRatio(this.contentDTO.appStyle === CompStyle.Card_13 ? 3 / 2 : 3 / 4)
62 .height(this.contentDTO.appStyle === CompStyle.Card_13 ? 90 : 180) 68 .height(this.contentDTO.appStyle === CompStyle.Card_13 ? 90 : 180)
@@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant'; @@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant';
3 import { DateTimeUtils } from 'wdKit'; 3 import { DateTimeUtils } from 'wdKit';
4 import { ProcessUtils } from 'wdRouter'; 4 import { ProcessUtils } from 'wdRouter';
5 import { Notes } from './notes'; 5 import { Notes } from './notes';
  6 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
6 7
7 /** 8 /**
8 * 时间链卡--CompStyle: 09 9 * 时间链卡--CompStyle: 09
@@ -12,6 +13,11 @@ const TAG: string = 'Card9Component'; @@ -12,6 +13,11 @@ const TAG: string = 'Card9Component';
12 @Component 13 @Component
13 export struct Card9Component { 14 export struct Card9Component {
14 @State contentDTO: ContentDTO = {} as ContentDTO; 15 @State contentDTO: ContentDTO = {} as ContentDTO;
  16 + @State loadImg: boolean = false;
  17 +
  18 + async aboutToAppear(): Promise<void> {
  19 + this.loadImg = await onlyWifiLoadImg();
  20 + }
15 21
16 build() { 22 build() {
17 Column() { 23 Column() {
@@ -27,7 +33,8 @@ export struct Card9Component { @@ -27,7 +33,8 @@ export struct Card9Component {
27 } 33 }
28 // 大图 34 // 大图
29 Stack() { 35 Stack() {
30 - Image(this.contentDTO.coverUrl) 36 + Image(this.loadImg ? this.contentDTO.coverUrl : '')
  37 + .backgroundColor(0xf5f5f5)
31 .width('100%') 38 .width('100%')
32 .borderRadius({ 39 .borderRadius({
33 topLeft: $r('app.float.image_border_radius'), 40 topLeft: $r('app.float.image_border_radius'),
@@ -127,7 +134,8 @@ export struct Card9Component { @@ -127,7 +134,8 @@ export struct Card9Component {
127 .alignSelf(ItemAlign.Center) 134 .alignSelf(ItemAlign.Center)
128 .margin({ left: 12 }) 135 .margin({ left: 12 })
129 if (item.fullColumnImgUrls[0] && item.fullColumnImgUrls[0].url) { 136 if (item.fullColumnImgUrls[0] && item.fullColumnImgUrls[0].url) {
130 - Image(item.fullColumnImgUrls[0].url) 137 + Image(this.loadImg? item.fullColumnImgUrls[0].url : '')
  138 + .backgroundColor(0xf5f5f5)
131 .width(90) 139 .width(90)
132 .height(60) 140 .height(60)
133 .borderRadius($r('app.float.image_border_radius')) 141 .borderRadius($r('app.float.image_border_radius'))
@@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant/Index'; @@ -3,6 +3,7 @@ import { CommonConstants } from 'wdConstant/Index';
3 import { Logger } from 'wdKit/Index'; 3 import { Logger } from 'wdKit/Index';
4 import { ProcessUtils } from 'wdRouter'; 4 import { ProcessUtils } from 'wdRouter';
5 import PageViewModel from '../../viewmodel/PageViewModel'; 5 import PageViewModel from '../../viewmodel/PageViewModel';
  6 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
6 7
7 const TAG = 'Zh_Grid_Layout-02'; 8 const TAG = 'Zh_Grid_Layout-02';
8 const FULL_PARENT: string = '100%'; 9 const FULL_PARENT: string = '100%';
@@ -18,18 +19,22 @@ let listSize: number = 2; @@ -18,18 +19,22 @@ let listSize: number = 2;
18 export struct ZhGridLayout02 { 19 export struct ZhGridLayout02 {
19 @State compDTO: CompDTO = {} as CompDTO 20 @State compDTO: CompDTO = {} as CompDTO
20 @State operDataList: ContentDTO[] = [] 21 @State operDataList: ContentDTO[] = []
21 - currentPage = 1  
22 - pageSize = 12 22 + @State loadImg: boolean = false;
23 23
24 - aboutToAppear() { 24 + async aboutToAppear(): Promise<void> {
25 Logger.debug(TAG, 'aboutToAppear ' + this.compDTO.objectTitle) 25 Logger.debug(TAG, 'aboutToAppear ' + this.compDTO.objectTitle)
26 this.currentPage = 1 26 this.currentPage = 1
27 PageViewModel.getLiveReviewUrl(this.currentPage, this.pageSize).then((liveReviewDTO) => { 27 PageViewModel.getLiveReviewUrl(this.currentPage, this.pageSize).then((liveReviewDTO) => {
28 this.operDataList = [] 28 this.operDataList = []
29 this.operDataList.push(...liveReviewDTO.list) 29 this.operDataList.push(...liveReviewDTO.list)
30 }) 30 })
  31 +
  32 + this.loadImg = await onlyWifiLoadImg();
31 } 33 }
32 34
  35 + currentPage = 1
  36 + pageSize = 12
  37 +
33 build() { 38 build() {
34 Column() { 39 Column() {
35 Scroll() { 40 Scroll() {
@@ -96,7 +101,8 @@ export struct ZhGridLayout02 { @@ -96,7 +101,8 @@ export struct ZhGridLayout02 {
96 @Builder 101 @Builder
97 buildItemCard(item: ContentDTO) { 102 buildItemCard(item: ContentDTO) {
98 Column() { 103 Column() {
99 - Image(item.fullColumnImgUrls[0].url) 104 + Image(this.loadImg ? item.fullColumnImgUrls[0].url : '')
  105 + .backgroundColor(0xf5f5f5)
100 .width('100%') 106 .width('100%')
101 .height(95) 107 .height(95)
102 .borderRadius(4) 108 .borderRadius(4)
@@ -3,6 +3,7 @@ import { CompStyle } from 'wdConstant'; @@ -3,6 +3,7 @@ import { CompStyle } from 'wdConstant';
3 import { Logger } from 'wdKit'; 3 import { Logger } from 'wdKit';
4 import { WDRouterRule } from 'wdRouter'; 4 import { WDRouterRule } from 'wdRouter';
5 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
  6 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
6 7
7 const TAG = 'Zh_Grid_Layout-03'; 8 const TAG = 'Zh_Grid_Layout-03';
8 const FULL_PARENT: string = '100%'; 9 const FULL_PARENT: string = '100%';
@@ -18,11 +19,13 @@ let listSize: number = 4; @@ -18,11 +19,13 @@ let listSize: number = 4;
18 @Component 19 @Component
19 export struct ZhGridLayout03 { 20 export struct ZhGridLayout03 {
20 @State compDTO: CompDTO = {} as CompDTO 21 @State compDTO: CompDTO = {} as CompDTO
  22 + @State loadImg: boolean = false;
21 23
22 - aboutToAppear() { 24 + async aboutToAppear(): Promise<void> {
23 if (this.compDTO.operDataList) { 25 if (this.compDTO.operDataList) {
24 listSize = this.compDTO.operDataList.length > 5 ? 4 : this.compDTO.operDataList.length; 26 listSize = this.compDTO.operDataList.length > 5 ? 4 : this.compDTO.operDataList.length;
25 } 27 }
  28 + this.loadImg = await onlyWifiLoadImg();
26 } 29 }
27 30
28 build() { 31 build() {
@@ -52,7 +55,8 @@ export struct ZhGridLayout03 { @@ -52,7 +55,8 @@ export struct ZhGridLayout03 {
52 @Builder 55 @Builder
53 buildItemCard(item: ContentDTO) { 56 buildItemCard(item: ContentDTO) {
54 Column() { 57 Column() {
55 - Image(item.coverUrl) 58 + Image(this.loadImg ? item.coverUrl : '')
  59 + .backgroundColor(0xf5f5f5)
56 .width(44) 60 .width(44)
57 .aspectRatio(1 / 1) 61 .aspectRatio(1 / 1)
58 .margin({ 62 .margin({
@@ -4,7 +4,7 @@ import { HttpUrlUtils } from 'wdNetwork/Index'; @@ -4,7 +4,7 @@ import { HttpUrlUtils } from 'wdNetwork/Index';
4 import { postInteractAccentionOperateParams } from 'wdBean'; 4 import { postInteractAccentionOperateParams } from 'wdBean';
5 import { PageRepository } from '../../repository/PageRepository'; 5 import { PageRepository } from '../../repository/PageRepository';
6 import { CommonConstants } from 'wdConstant/Index'; 6 import { CommonConstants } from 'wdConstant/Index';
7 - 7 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
8 /** 8 /**
9 * 兴趣卡 9 * 兴趣卡
10 * Zh_Single_Column-09 10 * Zh_Single_Column-09
@@ -18,12 +18,13 @@ export struct ZhSingleColumn09 { @@ -18,12 +18,13 @@ export struct ZhSingleColumn09 {
18 @State activeIndexs: Array<number> = [] 18 @State activeIndexs: Array<number> = []
19 @State operDataList: ContentDTO[] = this.compDTO?.operDataList || [] 19 @State operDataList: ContentDTO[] = this.compDTO?.operDataList || []
20 @State selfClosed: Boolean = false; 20 @State selfClosed: Boolean = false;
  21 + @State loadImg: boolean = false;
21 22
22 - aboutToAppear(): void { 23 + async aboutToAppear(): Promise<void> {
  24 + this.loadImg = await onlyWifiLoadImg();
23 this.operDataList = this.shuffleArray(this.compDTO?.operDataList) 25 this.operDataList = this.shuffleArray(this.compDTO?.operDataList)
24 } 26 }
25 27
26 -  
27 getItemWidth(index: number) { 28 getItemWidth(index: number) {
28 if (index % 4 === 0 || index % 4 === 3) { 29 if (index % 4 === 0 || index % 4 === 3) {
29 return 80 30 return 80
@@ -84,7 +85,8 @@ export struct ZhSingleColumn09 { @@ -84,7 +85,8 @@ export struct ZhSingleColumn09 {
84 ForEach(this.operDataList, (item: ContentDTO, index: number) => { 85 ForEach(this.operDataList, (item: ContentDTO, index: number) => {
85 GridItem() { 86 GridItem() {
86 Stack({alignContent: Alignment.TopEnd}) { 87 Stack({alignContent: Alignment.TopEnd}) {
87 - Image(item.coverUrl) 88 + Image(this.loadImg ? item.coverUrl : '')
  89 + .backgroundColor(0xf5f5f5)
88 .width('100%') 90 .width('100%')
89 .height('100%') 91 .height('100%')
90 Text(item.newsTitle) 92 Text(item.newsTitle)
@@ -5,6 +5,7 @@ import { PageRepository } from '../../repository/PageRepository'; @@ -5,6 +5,7 @@ import { PageRepository } from '../../repository/PageRepository';
5 import { CommonConstants } from 'wdConstant/Index'; 5 import { CommonConstants } from 'wdConstant/Index';
6 import { ProcessUtils } from 'wdRouter'; 6 import { ProcessUtils } from 'wdRouter';
7 import { HttpUtils } from 'wdNetwork/Index'; 7 import { HttpUtils } from 'wdNetwork/Index';
  8 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
8 9
9 /** 10 /**
10 * 小视频横划卡 11 * 小视频横划卡
@@ -104,13 +105,21 @@ function textOverflowStyle(maxLine: number) { @@ -104,13 +105,21 @@ function textOverflowStyle(maxLine: number) {
104 struct CreatorItem { 105 struct CreatorItem {
105 @Prop item: ContentDTO 106 @Prop item: ContentDTO
106 @State rmhIsAttention: number = 0 107 @State rmhIsAttention: number = 0
  108 + @State loadImg: boolean = false;
  109 +
  110 + async aboutToAppear(): Promise<void> {
  111 + this.loadImg = await onlyWifiLoadImg();
  112 + }
  113 +
107 build() { 114 build() {
108 ListItem() { 115 ListItem() {
109 Column() { 116 Column() {
110 Stack({ alignContent: Alignment.Bottom }) { 117 Stack({ alignContent: Alignment.Bottom }) {
111 - Image(this.item.coverUrl) 118 + Image(this.loadImg ? this.item.coverUrl : '')
112 .width(156) 119 .width(156)
113 .height(208) 120 .height(208)
  121 + .backgroundColor(0xf5f5f5)
  122 +
114 Row() 123 Row()
115 .width(156) 124 .width(156)
116 .height(80) 125 .height(80)
@@ -7,6 +7,7 @@ import { HttpUtils } from 'wdNetwork/Index'; @@ -7,6 +7,7 @@ import { HttpUtils } from 'wdNetwork/Index';
7 import { DateTimeUtils } from 'wdKit'; 7 import { DateTimeUtils } from 'wdKit';
8 import { LiveModel } from '../../viewmodel/LiveModel' 8 import { LiveModel } from '../../viewmodel/LiveModel'
9 import { Logger, ToastUtils } from 'wdKit'; 9 import { Logger, ToastUtils } from 'wdKit';
  10 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
10 11
11 /** 12 /**
12 * 直播预约卡 13 * 直播预约卡
@@ -32,12 +33,15 @@ export struct ZhSingleRow03 { @@ -32,12 +33,15 @@ export struct ZhSingleRow03 {
32 @State isEndEdge: boolean = false; 33 @State isEndEdge: boolean = false;
33 // @State reserveStatus: reserveItem[] = [] 34 // @State reserveStatus: reserveItem[] = []
34 @State reservedIds: string[] = []; 35 @State reservedIds: string[] = [];
35 - scroller: Scroller = new Scroller() 36 + @State loadImg: boolean = false;
36 37
37 - aboutToAppear(): void { 38 + async aboutToAppear(): Promise<void> {
38 this.getReserveState(); 39 this.getReserveState();
  40 + this.loadImg = await onlyWifiLoadImg();
39 } 41 }
40 42
  43 + scroller: Scroller = new Scroller()
  44 +
41 // 请求所有预约状态 45 // 请求所有预约状态
42 async getReserveState() { 46 async getReserveState() {
43 const reserveBean: reserveReqItem[] = this.compDTO.operDataList.map((item: ContentDTO) => { 47 const reserveBean: reserveReqItem[] = this.compDTO.operDataList.map((item: ContentDTO) => {
@@ -128,10 +132,12 @@ export struct ZhSingleRow03 { @@ -128,10 +132,12 @@ export struct ZhSingleRow03 {
128 ItemCard(item: ContentDTO) { 132 ItemCard(item: ContentDTO) {
129 Column() { 133 Column() {
130 Row() { 134 Row() {
131 - Image(item.coverUrl) 135 + Image(this.loadImg ? item.coverUrl : '')
132 .width(106) 136 .width(106)
133 .height(60) 137 .height(60)
134 .margin({right: 12}) 138 .margin({right: 12})
  139 + .backgroundColor(0xf5f5f5)
  140 +
135 Text(item.newsTitle) 141 Text(item.newsTitle)
136 .width(154) 142 .width(154)
137 .height(60) 143 .height(60)
@@ -256,11 +262,17 @@ function textOverflowStyle(maxLine: number) { @@ -256,11 +262,17 @@ function textOverflowStyle(maxLine: number) {
256 struct CreatorItem { 262 struct CreatorItem {
257 @Prop item: ContentDTO 263 @Prop item: ContentDTO
258 @State rmhIsAttention: number = 0 264 @State rmhIsAttention: number = 0
  265 + @State loadImg: boolean = false;
  266 +
  267 + async aboutToAppear(): Promise<void> {
  268 + this.loadImg = await onlyWifiLoadImg();
  269 + }
259 build() { 270 build() {
260 ListItem() { 271 ListItem() {
261 Column() { 272 Column() {
262 Stack({ alignContent: Alignment.Bottom }) { 273 Stack({ alignContent: Alignment.Bottom }) {
263 - Image(this.item.coverUrl) 274 + Image(this.loadImg ? this.item.coverUrl : '')
  275 + .backgroundColor(0xf5f5f5)
264 .width(156) 276 .width(156)
265 .height(208) 277 .height(208)
266 Row() 278 Row()
@@ -8,10 +8,18 @@ import { ExtraDTO } from 'wdBean/src/main/ets/bean/component/extra/ExtraDTO' @@ -8,10 +8,18 @@ import { ExtraDTO } from 'wdBean/src/main/ets/bean/component/extra/ExtraDTO'
8 import { LiveModel } from '../../viewmodel/LiveModel' 8 import { LiveModel } from '../../viewmodel/LiveModel'
9 import { ContentConstants } from '../../constants/ContentConstants' 9 import { ContentConstants } from '../../constants/ContentConstants'
10 import { ProcessUtils } from 'wdRouter'; 10 import { ProcessUtils } from 'wdRouter';
  11 +import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
  12 +
11 13
12 @Component 14 @Component
13 export struct LiveHorizontalCardComponent { 15 export struct LiveHorizontalCardComponent {
14 @State compDTO: CompDTO = {} as CompDTO 16 @State compDTO: CompDTO = {} as CompDTO
  17 + @State loadImg: boolean = false;
  18 +
  19 + async aboutToAppear(): Promise<void> {
  20 + this.loadImg = await onlyWifiLoadImg();
  21 + }
  22 +
15 23
16 build() { 24 build() {
17 Column() { 25 Column() {
@@ -63,7 +71,8 @@ export struct LiveHorizontalCardComponent { @@ -63,7 +71,8 @@ export struct LiveHorizontalCardComponent {
63 ListItem() { 71 ListItem() {
64 Column() { 72 Column() {
65 Stack({ alignContent: Alignment.BottomEnd }) { 73 Stack({ alignContent: Alignment.BottomEnd }) {
66 - Image(item.coverUrl) 74 + Image(this.loadImg ? item.coverUrl : '')
  75 + .backgroundColor(0xf5f5f5)
67 .aspectRatio(16 / 9) 76 .aspectRatio(16 / 9)
68 .width(this.compDTO.operDataList.length == 2 ? 210 : 150) 77 .width(this.compDTO.operDataList.length == 2 ? 210 : 150)
69 .borderRadius(4) 78 .borderRadius(4)