english_learned_master/pages/main/articlefine.wxml

<view class="container FlexColumn" style='min-height:{{Containnerheight}}rpx;'>
  <view class="panel1 FlexColumn">
    <swiper class="swiper" autoplay="true" indicator-dots="true"  >
      <swiper-item class="panel1Item" wx:for="{{ChoicenessList}}" wx:key="index" data-index="{{index}}" wx:if="{{item.IsRecommend}}" bind:tap="goto" data-url="article?ID={{item.ID}}">
        <image mode="aspectFill" src="{{ImageUrl}}web/_yjbdc/{{item.ArticleImage}}" class="img"></image>
        <view class="panel1Item1 FlexColumn">
          <view class="panel1Item11 FlexColumn">
            <view class="text1">{{item.LevelStr}} {{item.ArticleStyle}}</view>
            <view class="text2">{{item.ArticleTitleCHN}}</view>
            <view class="text3">{{item.ArticleTitle}}</view>
          </view>
        </view>
      </swiper-item>
    </swiper>
  </view>
  

  <view class="panelTitle">CEFR</view>
  <view class="panel2 FlexColumn">
    <view class="panel21 FlexRow">
      <view class="panel211 FlexColumn" wx:for="{{GradeArr}}" wx:key="index" style="background-color: {{item.BColor}};" bind:tap="goto" data-url="articlecategory?title={{item.Name2}}&level={{item.Name}}">
        <image src="../images/sysIcon_a{{item.Image}}.png" class="sysIcon_a19"></image>
        <view class="text4">{{item.Name}}</view>
        <view class="text5">{{item.Name2}}</view>
      </view>
    </view>
  </view>
  <view class="panelTitle">LATEST STORIES</view>
  <view class="panel3 FlexColumn">
    <view class="panel3Item FlexRow" wx:for="{{ChoicenessList}}" wx:key="index" wx:if="{{index<4}}" bind:tap="goto" data-url="article?ID={{item.ID}}">
      <view class="panel3ItemLeft FlexColumn">
        <view class="text6">{{item.ArticleTitle}}</view>
        <view>{{item.LevelStr}} {{item.ArticleStyle}}</view>
        <view  class="text7">{{item.ArticleTitleCHN}}</view>
      </view>
      <image mode="aspectFill" src="{{ImageUrl}}web/_yjbdc/{{item.ArticleImage}}" class="img2"></image>
    </view>
    <view class="panel3Item panel3Item0 FlexRow" bind:tap="goto" data-url="guide">
      <view class="panel3ItemLeft FlexColumn">
        <text class="text8">卡在单词输入？\n新手引导带您体验</text>
        <view>New User Guide</view>
      </view>
      <image src="../images/sysIcon_b20.png" class="sysIcon_b20"></image>
    </view>
  </view>

  <view class="panelTitle">EXPLORE BY TOPIC</view>
  <view class="panel4 FlexRow">
    <view style="width: 100%;height:20rpx"></view>
    <view class="panel4Item FlexColumn" wx:for="{{ArticleStyleArr}}" wx:key="index" bind:tap="goto" data-url="articlecategory?title={{item.Name}}&articlestyle={{item.Name}}">
      <view class="panel4Item1 FlexColumn">
        <image src="../images/sysIcon_a{{22+item.ID}}.png" class="sysIcon_a23"></image>
      </view>
      <view class="text9">{{item.Name}}</view>
      <view class="text10">{{item.Eng}}</view>
    </view>
  </view>

  <view class="panelFooter FlexColumn">
    <view class="panelFooter1 FlexRow">
      <view class="panelFooterBtn FlexColumn" bind:tap="goto" data-url="index">
        <view>制作</view>
        <view class="panelFooterLine"></view>
      </view>
      <view class="panelFooterBtn FlexColumn" >
        <view>精选</view>
        <view class="panelFooterLine1"></view>
      </view>
    </view>
    <view class="iphone10plus" wx:if="{{IsIPhoneX}}"></view>
  </view>
</view>