/*
 * Copyright (C) 2024 Huawei Device Co., Ltd.
 * Licensed under the Apache License, Version 2.0 (the 'License');
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an 'AS IS' BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { ImageKnifeComponent,ImageKnife } from '@ohos/libraryimageknife';
import { CommonDataSource } from './model/CommonDataSource';

@Entry
@Component
struct MaxRequest2 {
  @State hotCommendList:CommonDataSource<string> = new CommonDataSource<string>([])
  private data: Array<string> = []
  aboutToAppear(): void {
    ImageKnife.getInstance().setMaxRequests(20)
    for (let index = 200; index < 400; index++) {
      this.data.push(`https://img-blog.csdn.net/20140514114029140?${index}`)
    }
    this.hotCommendList.addData(this.hotCommendList.totalCount(),this.data)
  }
  build() {
    Column() {
      WaterFlow() {
        LazyForEach(this.hotCommendList,(item: string)=>{
          FlowItem() {
            Column(){
              ImageKnifeComponent({
                imageKnifeOption: {
                  loadSrc: item,
                  placeholderSrc: $r('app.media.loading'),
                  errorholderSrc: $r('app.media.failed'),
                }
              }).width('50%').height(160)
            }
          }.height(200)
          .backgroundColor('#95efd2')
        },(item: string) => item)
      }.columnsTemplate('1fr 1fr')
      .cachedCount(20)
      .columnsGap(10)
      .rowsGap(5)
      .backgroundColor(0xFAEEE0)
      .width('100%').height('100%')
    }
  }
}