english_learned_master/pages/main/article.wxml

<block wx:if="{{!IsBuilding && !IsBuildError}}">
<!-- 正常文章 -->
<view class="{{ThemeCSS}} container FlexColumn" style='min-height:{{Containnerheight}}rpx;' catch:tap="hideWordTranslate">
  <view id="panelArticle" style="width: 100%;height: 1rpx;"></view>
  <view class="panel1 FlexColumn">
    <!-- 完整文章 -->
    <text class="textArticle" wx:if="{{!IsShowTranslate}}" >
      <text bindlongpress="onLongPress" data-strtype="article" data-index="{{index}}" wx:for="{{Content.ArticleEnglishArr}}" wx:key="index" >
        <text class="{{itemChild.CSS}}" wx:for="{{item}}" wx:key="index2" wx:for-item="itemChild" wx:for-index="indexChild" catch:tap="selectWord" data-word="{{itemChild.Sentence}}" data-original-word="{{itemChild.OriginalWord}}" data-css="{{itemChild.CSS}}">{{itemChild.Sentence}} </text>
      </text>
    </text>
    <!-- 有翻译文章 -->
    <view class="textArticle FlexColumn" wx:if="{{IsShowTranslate}}">
      <view wx:for="{{Content.ArticleEnglishArr}}" wx:key="index" class="textArticle">
        <text class="{{itemChild.CSS}}" wx:for="{{item}}" wx:key="index2" wx:for-item="itemChild" wx:for-index="indexChild" bind:tap="selectWord" data-word="{{itemChild.Sentence}}" data-original-word="{{itemChild.OriginalWord}}" data-css="{{itemChild.CSS}}">{{itemChild.Sentence}} </text>
        <view class="textArticleTranslate">{{Content.ArticleChinese[index]}}</view>
        <view class="panelLine" wx:if="{{index<Content.ArticleEnglish.length-1}}"></view>
      </view>
    </view>
  </view>
  <view style="width: 100%;height:700rpx;" wx:if="{{IsShowQuestion}}"></view>
  <view style="width: 100%;height:{{TranslateHeight}}rpx;" wx:if="{{IsShowWordTranslate}}"></view>
  
  <view wx:if="{{!IsShowQuestion}}" class="panelFooter FlexRow">
    <view class="panelFooter1 FlexRow">
      <view class="panelFooter11 panelFooter10 FlexColumn" bind:tap="showData" data-name="IsShowTranslate">
        <image src="../images/sysIcon_a15.png" class="sysIcon_a15"></image>
        <view class="text02">中英对照</view>
      </view>
      <view id="btnQAndA" class="panelFooter12 panelFooter10 FlexColumn" bind:tap="showData" data-name="IsShowQuestion">
        答题
      </view>
      <view class="panelFooter13 panelFooter10 FlexColumn" bind:tap="showData" data-name="IsShowSetting">
        <image src="../images/sysIcon_a08.png" class="sysIcon_a03"></image>
        <view class="text02">更多</view>
      </view>
    </view>
  </view>

  <!-- 看问题 -->
  <view hidden="{{!IsShowQuestion}}" class="{{ThemeCSS}} panelAnswer FlexColumn">
    <view class="text03">Reading Comprehension Questions</view>
    <swiper class="panelAnswer1" indicator-dots="true" current="{{CurrentQuestionIndex}}" bindchange="updateQuestionIndex" >
      <swiper-item class="panelAnswer1Item" wx:for="{{Content.Question}}" wx:key="index" data-index="{{index}}">
        <scroll-view scroll-y="true" class="panelAnswer1Item1 FlexColumn">
          <view class="panelAnswer2 FlexRow">
            <image src="../images/sysIcon_c0{{index+1}}.png" wx:if="{{ThemeCSS=='DarkColor'}}" class="sysIcon_c01"></image>
            <image src="../images/sysIcon_d0{{index+1}}.png" wx:if="{{ThemeCSS=='LightColor'}}" class="sysIcon_c01"></image>
            <view class="text04 FlexColumn">
              <view class="text041" bindlongpress="onLongPress" data-strtype="question" data-index="{{index}}">{{item.QuestionEnglish}}</view>
              <view class="text042" wx:if="{{IsShowTranslate}}">{{item.QuestionChinese}}</view>
            </view>
          </view>
          <view class="panelAnswer3 FlexColumn" >
            <view class="panelAnswer31 {{ item.AnswerNumber==indexChild && item.IsShowAnswer?'panelAnswer310':'' }} FlexRow" wx:for="{{item.OptionsEnglish}}" wx:key="indexChild" wx:for-item="itemChild" wx:for-index="indexChild" catch:tap="selectedAnswer" data-question="{{index}}" data-index="{{indexChild}}">
              <view class="panelAnswer311 {{ item.AnswerNumber==indexChild && item.IsShowAnswer?'panelAnswer3110':'' }}" wx:if="{{indexChild!=item.UserAnswer}}"></view>
              <view class="panelAnswer311 panelAnswer3110 FlexColumn" wx:if="{{indexChild==item.UserAnswer}}">
                <image wx:if="{{ThemeCSS=='DarkColor'}}" src="../images/sysIcon_a10.png" class="sysIcon_a10"></image>
                <image wx:if="{{ThemeCSS=='LightColor'}}" src="../images/sysIcon_a11.png" class="sysIcon_a10"></image>
              </view>
              <view class="text05 FlexColumn">
              <view class="text051" bindlongpress="onLongPress" data-strtype="option" data-index="{{index}}" data-index2="{{indexChild}}">{{itemChild}}</view>
              <view class="text052" wx:if="{{IsShowTranslate}}">{{item.OptionsChinese[indexChild]}}</view>
            </view>
            </view>
          </view>
        </scroll-view>
      </swiper-item>
    </swiper>    
    <view class="panelLine2"></view>
    <view class="panelAnswer4 FlexRow">
      <view class="btn1 FlexRow" catch:tap="showData" data-index="{{CurrentQuestionIndex}}" data-name="IsShowAnswer" wx:if="{{!Content.Question[CurrentQuestionIndex].IsShowAnswer}}">看答案</view>
      <view class="btn1 FlexRow" catch:tap="showData" data-index="{{CurrentQuestionIndex}}" data-name="IsShowAnswer" wx:if="{{Content.Question[CurrentQuestionIndex].IsShowAnswer}}">关答案</view>
      <view class="btn1  {{ CurrentQuestionIndex+1==Content.Question.length?'btn10':'' }} FlexRow" catch:tap="nextQuestion">下一题</view>
    </view>
    <view class="btnClose" capture-bind:tap="showData" data-name="IsShowQuestion">隐藏</view>
  </view>

  <!-- 设置 -->
  <view wx:if="{{IsShowSetting}}" class="panelAnswer FlexColumn">
    <view class="text03 text06">更多功能</view>
    <view class="btn2 FlexRow" catch:tap="generatePDF">
      <view>PDF下载</view>
    </view>
    <view class="panelAnswer5 FlexColumn">
      <view class="panelAnswer51 FlexRow">
        <view class="text12">突出关键词</view>
        <switch class="switchClass" bindchange="showData" checked="{{IsShowKeyword}}" data-name="IsShowKeyword" />
      </view>
      <view class="text13">用亮色强调用来生成短文的单词</view>
    </view>
    <view class="panelLine3"></view>
    <view class="panelAnswer5 FlexColumn">
      <view class="panelAnswer51 panelAnswer510 FlexRow">
        <view class="text12">浅色方案</view>
        <switch  class="switchClass" bindchange="showData" checked="{{IsShowLightColor}}" data-name="IsShowLightColor"/>
      </view>
    </view>
    <view class="btnClose btnClose2 FlexRow" capture-bind:tap="showData" data-name="IsShowSetting">
      <image  wx:if="{{ThemeCSS=='DarkColor'}}" src="../images/sysIcon_a03.png" class="sysIcon_a03"></image>
      <image  wx:if="{{ThemeCSS=='LightColor'}}" src="../images/sysIcon_a09.png" class="sysIcon_a03"></image>
    </view>
  </view>

</view>

<!-- 翻译 -->
<view wx:if="{{IsShowWordTranslate}}"  class="panelTranslate FlexColumn" catch:tap="setDataBoolean" data-name="IsShowWordTranslate">
  <text class="panelTranslateTest1">{{EnglishSentence}}</text>
  <text class="panelTranslateTest2">{{ChineseSentence}}</text>
  <view class="panelTranslateCollect FlexColumn" wx:if="{{TranslateHeight==100}}" catch:tap="saveUserCollect" data-word="{{EnglishSentence}}">
    <image wx:if="{{!IsCollect}}" src="../images/sysIcon_a35.png" class="sysIcon_a35"></image>
    <image wx:if="{{IsCollect}}" src="../images/sysIcon_a36.png" class="sysIcon_a35"></image>
  </view>
</view>

<!-- 显示第一次打开帮助 -->
<view wx:if="{{IsShowFirstOpen2}}" class="panelHelp container FlexColumn" style='min-height:{{Containnerheight}}rpx;'>
  <view class="panelHelp1">
    <image src="../images/sysIcon_b07.png" class="sysIcon_b07"></image>
    <view class="panelHelp2 FlexColumn">
      <text class="text07">点击译单词，双击看详细，长按译句子\n点答题做题目，右下角还有PDF</text>
      <view class="btn3 FlexColumn" catch:tap="setDataBoolean" data-name="IsShowFirstOpen2" data-savedata="2">知道了</view>
    </view>
  </view>
</view>
</block>

<!-- 引入引导模板 -->
<import src="../templates/guide-container.wxml"/>
<!-- 显示引导 -->
<template is="guide-container" data="{{IsShowGuideContainer, panelGuideContainerTop, panelGuideContainerWidth1, panelGuideContainerHeight1, panelGuideContainerLeft2, Containnerheight, panelGuideContainerImage, panelGuideContainerImageLeft, panelGuideContainerImageTop, panelGuideContainerCloseLeft, panelGuideContainerCloseTop}}"/>

<!-- 显示生成出错 -->
<view wx:if="{{IsBuildError}}" class="container {{ThemeCSS}} FlexColumn" style='min-height:{{Containnerheight}}rpx;'>
  <view class="{{ThemeCSS}} panelError FlexColumn">
    <image  wx:if="{{ThemeCSS=='DarkColor'}}"  src="../images/sysIcon_b14.png" class="sysIcon_b14"></image>
    <image  wx:if="{{ThemeCSS=='LightColor'}}" src="../images/sysIcon_b15.png" class="sysIcon_b14"></image>
    <view class="textError1">抱歉，生成失败</view>
    <view class="textError2">可能生成过于频繁、网络不畅或使用了不适合的单词，请稍候再试。</view>
  </view>
</view>


<!-- 显示生成排队中 -->
<view wx:if="{{IsBuildQueue}}" class="container {{ThemeCSS}} FlexColumn" style='min-height:{{Containnerheight}}rpx;'>
  <view class="{{ThemeCSS}} panelError FlexColumn">
    <image  wx:if="{{ThemeCSS=='DarkColor'}}"  src="../images/sysIcon_b14.png" class="sysIcon_b14"></image>
    <image  wx:if="{{ThemeCSS=='LightColor'}}" src="../images/sysIcon_b15.png" class="sysIcon_b14"></image>
    <view class="textError1">抱歉，生成排队中</view>
    <view class="textError2">生成文章已加入队列，等待处理，请稍候</view>
  </view>
</view>

<!-- 显示生成中 -->
<view wx:if="{{IsBuilding}}" class="container panelBuildindParent {{ThemeCSS}} FlexColumn" style='min-height:{{Containnerheight}}rpx;'>
</view>
<image wx:if="{{IsBuilding && ThemeCSS=='DarkColor'}}" src="../images/pic_08.png" mode="widthFix" class="pic_08"></image>
<image wx:if="{{IsBuilding && ThemeCSS=='LightColor'}}" src="../images/pic_09.png" mode="widthFix" class="pic_08"></image>
<view wx:if="{{IsBuilding}}" class="panelBuilding panelBuilding{{ThemeCSS}} FlexColumn" style='min-height:{{Containnerheight+140}}rpx;'>
  <view class="panelBuilding1 FlexColumn">
    <image src="../images/pic_03.png" class="pic_03"></image>
    <image src="../images/sysIcon_b08.gif" class="sysIcon_b08"></image>
    <view class="panelBuilding11 FlexColumn">
      <text class="text08" wx:if="{{CountDown>0}}">生成中…{{CountDown}}秒</text>
      <text class="text08" wx:if="{{CountDown==0}}">生成中…差一点，就快好了</text>
      <text class="text09">生成后会通知您，等待时可看看下面这些范文</text>
    </view>
    <view class="panelBuilding12 FlexColumn">
      <view class="panelBuilding121 FlexRow" wx:for="{{ChoicenessList}}" wx:key="index" catch:tap="goto" data-url="./article?ID={{item.ID}}" wx:if="{{item.IsRecommend}}">
        <image src="../images/sysIcon_a17.png" class="sysIcon_a17"></image>
        <view class="panelBuilding121text">{{item.ArticleTitle}}</view>
      </view>
      <view class="panelBuilding121 panelBuilding122 FlexColumn" catch:tap="goto" data-url="articlefine">更多精选</view>
    </view>
  </view>
</view>

<audio hidden='true' src="{{AudioSrc}}" id="myAudio"></audio>