0
点赞
收藏
分享

微信扫一扫

[云炬小程序开发笔记] 4-1云炬博客首页UI

素锦时年_1b00 2022-02-03 阅读 56

index.wxml

<view class="index-ov">
  <block wx:if="{{is_frist}}">
    <view class="frist-notic">点击右上角“●●●”添加到我的小程序</view>
  </block>
  <view class="menu_scroll_top_img">
    <image class="fengrui-img" src="../../static/index/333.svg" mode="aspectFill"></image>
    <view class="{{[scrollTopHightX<120?'menu_scroll_top_one':'menu_scroll_top_tow']}}">
      <view class="menu-scroll">
        <scroll-view class="menu-scroll-leat" scroll-x="true">
          <block wx:for="{{menusLsit}}" wx:for-item="menu" wx:for-index="index" wx:key="index">
            <view data-event-opts="{{[['tap',[['menuTap',[index]]]]]}}" class="{{[active==index?'active_menu_scroll_leat_font':'menu_scroll_leat_font']}}" bindtap="__e">{{''+menu.name+''}}</view>
          </block>
        </scroll-view>
      </view>
    </view>
  </view>
  <block wx:if="{{active===0}}">
    <block>
      <block wx:if="{{is_data_rotation}}">
        <view class="content-all">
          <swiper class="swiper-box" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" data-event-opts="{{[['change',[['change',['$event']]]]]}}" bindchange="__e">
            <block wx:for="{{rotation}}" wx:for-item="item" wx:for-index="index" wx:key="id">
              <swiper-item data-event-opts="{{[['tap',[['openSwipre',['$0'],[[['rotation','id',item.id,'id']]]]]]]}}" bindtap="__e">
                <view class="swiper-item">
                  <image class="fengrui-img" src="{{item.thumbnailurl}}" mode="widthFix"></image>
                </view>
              </swiper-item>
            </block>
          </swiper>
        </view>
      </block>
      <view class="Vajr a-bg">
        <view class="Vajra">
          <block wx:for="{{vajra}}" wx:for-item="valist" wx:for-index="index" wx:key="index">
            <block>
              <block wx:if="{{valist.type!='xs_program'}}">
                <view data-event-opts="{{[['tap',[['xs_default',[index]]]]]}}" class="Vajra-list" bindtap="__e">
                  <view class="Vajra-list-img">
                    <image class="fengrui-img" src="{{valist.himg}}" mode="aspectFit"></image>
                  </view>
                  <view class="Vajra-list-font">{{''+valist.title+''}}</view>
                </view>
              </block>
              <block wx:if="{{valist.type=='xs_program'}}">
                <view class="Vajra-list">
                  <navigator path="{{valist.url}}" hover-class="none" open-type="navigate" app-id="{{valist.appid}}" target="miniProgram">
                    <view class="Vajra-list-img">
                      <image class="fengrui-img" src="{{valist.himg}}" mode="aspectFit"></image>
                    </view>
                    <view class="Vajra-list-font">{{''+valist.title+''}}</view>
                  </navigator>
                </view>
              </block>
            </block>
          </block>
        </view>
        <view class="poster">
          <view class="poster-imgs">
            <image class="fengrui-img" src="../../static/index/poster.svg" mode="aspectFit"></image>
          </view>
          <view class="poster-text">心念所至,生万千喜欢22</view><button data-event-opts="{{[['tap',[['popupSever']]]]}}" class="poster-btn" bindtap="__e">分享</button>
        </view>
      </view>
      <view class="notice-flex">
        <view class="notice-img">
          <image class="fengrui-img" src="../../static/index/notice.png" mode></image>
        </view>
        <uni-notice-bar class="notice-fr-title" vue-id="8dd740cc-1" scrollable="true" color="{{color}}" single="true" speed="{{speed}}" text="{{about_center[0].fr_notice}}" bind:__l="__l"></uni-notice-bar>
      </view>
      <block wx:if="{{about_center[0].index_jiaodian=='1'}}">
        <view>
          <view class="titel-vi" hover-class="fengrui-li-hover">
            <view class="titel-vi-q">
              <view class="titel-vi-img">
                <image class="fengrui-img" src="../../static/index/title-img.svg" mode="aspectFill"></image>
              </view>
              <view class="titel-vi-font">公众号文章</view>
            </view>
            <view data-event-opts="{{[['tap',[['wxMoreTap']]]]}}" class="titel-vi-right" bindtap="__e">查看更多</view>
          </view>
          <view class="swiper-list">
            <scroll-view scroll-x="true" show-scrollbar="false">
              <block wx:for="{{focuList}}" wx:for-item="wxlist" wx:for-index="index" wx:key="index">
                <view class="scroll-view-item-list" hover-class="fengrui-li-hover" data-event-opts="{{[['tap',[['scrlistTap',['$0'],[[['focuList','',index,'hurl']]]]]]]}}" bindtap="__e">
                  <view class="scroll-view-item-h">
                    <view class="scroll-view-item-h-img">
                      <image class="fengrui-img" src="{{wxlist.himg}}" mode="widthFix"></image>
                    </view>
                  </view>
                  <view class="scroll-view-item-h-title">{{''+wxlist.title+''}}</view>
                  <view class="scroll-view-item-h-describe">{{''+wxlist.describe+''}}</view>
                </view>
              </block>
            </scroll-view>
          </view>
        </view>
      </block>
    </block>
  </block>
  <block wx:if="{{active===0}}">
    <view class="titel-vi">
      <view class="titel-vi-q">
        <view class="titel-vi-img">
          <image class="fengrui-img" src="../../static/index/title-img2.svg" mode="aspectFill"></image>
        </view>
        <view class="titel-vi-font">最新文章</view>
      </view>
      <view data-event-opts="{{[['tap',[['categoryNew']]]]}}" class="titel-vi-right" bindtap="__e">查看更多</view>
    </view>
  </block>
  <block wx:if="{{active===0}}">
    <view class="postlist-bg">
      <block wx:for="{{newPost}}" wx:for-item="newpos" wx:for-index="index" wx:key="index">
        <block>
          <block wx:if="{{about_center[0].index_style!=2}}">
            <view class="menu-scroll-list" hover-class="fengrui-li-hover" data-event-opts="{{[['tap',[['newPostTap',['$0'],[[['newPost','',index,'id']]]]]]]}}" bindtap="__e">
              <block wx:if="{{newpos.thumbnailurl==null}}">
                <view class="menu-scroll-list-img">
                  <image class="fengrui-img" src="{{about_center[0].xs_posts_img}}" mode="aspectFill"></image>
                </view>
              </block>
              <block wx:else>
                <view class="menu-scroll-list-img">
                  <image class="fengrui-img" src="{{newpos.thumbnailurl}}" mode="aspectFill"></image>
                </view>
              </block>
              <view class="menu-scroll-list-right">
                <view class="menu-scroll-list-h">{{''+newpos.title.rendered+''}}</view>
                <view class="muen-sld-icon-display">
                  <block wx:if="{{newpos.content.protected==true}}">
                    <image class="muen-sld-icon" src="../../static/data/protected.svg" mode></image>
                  </block>
                  <block wx:if="{{newpos.fr_videp_if=='1'}}">
                    <image class="muen-sld-icon" src="../../static/data/ad_video.svg" mode></image>
                  </block>
                  <block wx:if="{{newpos.fr_down_url!=''}}">
                    <image class="muen-sld-icon" src="../../static/data/down.svg" mode></image>
                  </block>
                </view>
                <view class="menu-scroll-list-describe">
                  <view>{{newpos.date}}</view>
                </view>
              </view>
            </view>
          </block>
          <block wx:if="{{about_center[0].index_style==2}}">
            <view class="list-one-w" hover-class="fengrui-li-hover" data-event-opts="{{[['tap',[['newPostTap',['$0'],[[['newPost','',index,'id']]]]]]]}}" bindtap="__e">
              <block wx:if="{{newpos.thumbnailurl==null}}">
                <view class="list-one-img">
                  <image class="fengrui-img" mode="aspectFill" src="{{about_center.xs_posts_img}}"></image>
                </view>
              </block>
              <block wx:else>
                <view class="list-one-img">
                  <image class="fengrui-img" mode="aspectFill" src="{{newpos.thumbnailurl}}"></image>
                </view>
              </block>
              <view class="list-one-data-w">
                <view class="muen-sld-icon-display" style="margin-bottom:6rpx;">
                  <block wx:if="{{newpos.content.protected==true}}">
                    <image class="muen-sld-icon" src="../../static/data/protected.svg" mode></image>
                  </block>
                  <block wx:if="{{newpos.fr_videp_if=='1'}}">
                    <image class="muen-sld-icon" src="../../static/data/ad_video.svg" mode></image>
                  </block>
                  <block wx:if="{{newpos.fr_down_url!=''}}">
                    <image class="muen-sld-icon" src="../../static/data/down.svg" mode></image>
                  </block>
                </view>
                <view class="list-one-title">{{''+newpos.title.rendered+''}}</view>
                <view class="list-ona-abstract">
                  <rich-text nodes="{{newpos.excerpt.rendered}}"></rich-text>
                </view>
              </view>
            </view>
          </block>
          <block wx:if="{{about_center.length>0}}">
            <block>
              <view style="width:100%;">
                <block wx:if="{{(index+1)%5==0}}">
                  <ad unit-id="{{about_center[0].wx_video}}" ad-type="video" ad-theme="white"></ad>
                </block>
              </view>
            </block>
          </block>
        </block>
      </block>
    </view>
  </block>
  <block wx:if="{{active!=0}}">
    <block>
      <block wx:if="{{about_center[0].index_style!=2}}">
        <view class="muen-tow-list-one" hover-class="fengrui-li-hover">
          <block wx:for="{{newPost}}" wx:for-item="newpos" wx:for-index="index" wx:key="index">
            <view data-event-opts="{{[['tap',[['newPostTap',['$0'],[[['newPost','',index,'id']]]]]]]}}" bindtap="__e">
              <view class="menu-scroll-list">
                <view class="menu-scroll-list-img">
                  <block>
                    <image class="fengrui-img" src="{{newpos.thumbnailurl}}" mode="aspectFill"></image>
                  </block>
                </view>
                <view class="menu-scroll-list-right">
                  <view class="menu-scroll-list-h">{{''+newpos.title.rendered+''}}</view>
                  <view class="muen-sld-icon-display">
                    <block wx:if="{{newpos.content.protected==true}}">
                      <image class="muen-sld-icon" src="../../static/data/protected.svg" mode></image>
                    </block>
                    <block wx:if="{{newpos.fr_videp_if=='1'}}">
                      <image class="muen-sld-icon" src="../../static/data/ad_video.svg" mode></image>
                    </block>
                    <block wx:if="{{newpos.fr_down_url!=''}}">
                      <image class="muen-sld-icon" src="../../static/data/down.svg" mode></image>
                    </block>
                  </view>
                  <view class="menu-scroll-list-describe">
                    <view>{{newpos.date}}</view>
                  </view>
                </view>
              </view>
              <block wx:if="{{about_center.length>0}}">
                <block>
                  <view style="width:100%;">
                    <block wx:if="{{(index+1)%5==0}}">
                      <ad unit-id="{{about_center[0].wx_video}}" ad-type="video" ad-theme="white"></ad>
                    </block>
                  </view>
                </block>
              </block>
            </view>
          </block>
        </view>
      </block>
      <block wx:if="{{about_center[0].index_style==2}}">
        <view style="margin:20rpx 30rpx;">
          <block wx:for="{{newPost}}" wx:for-item="newpos" wx:for-index="index" wx:key="index">
            <view data-event-opts="{{[['tap',[['newPostTap',['$0'],[[['newPost','',index,'id']]]]]]]}}" bindtap="__e">
              <view class="list-one-w" hover-class="fengrui-li-hover">
                <view class="list-one-img">
                  <image class="fengrui-img" mode="aspectFill" src="{{newpos.thumbnailurl}}"></image>
                </view>
                <view class="list-one-data-w">
                  <view class="muen-sld-icon-display" style="margin-bottom:6rpx;">
                    <block wx:if="{{newpos.content.protected==true}}">
                      <image class="muen-sld-icon" src="../../static/data/protected.svg" mode></image>
                    </block>
                    <block wx:if="{{newpos.fr_videp_if=='1'}}">
                      <image class="muen-sld-icon" src="../../static/data/ad_video.svg" mode></image>
                    </block>
                    <block wx:if="{{newpos.fr_down_url!=''}}">
                      <image class="muen-sld-icon" src="../../static/data/down.svg" mode></image>
                    </block>
                  </view>
                  <view class="list-one-title">{{''+newpos.title.rendered+''}}</view>
                  <view class="list-ona-abstract">
                    <rich-text nodes="{{newpos.excerpt.rendered}}"></rich-text>
                  </view>
                </view>
              </view>
              <block wx:if="{{about_center.length>0}}">
                <block>
                  <view style="width:100%;">
                    <block wx:if="{{(index+1)%5==0}}">
                      <ad unit-id="{{about_center[0].wx_video}}" ad-type="video" ad-theme="white"></ad>
                    </block>
                  </view>
                </block>
              </block>
            </view>
          </block>
        </view>
      </block>
    </block>
  </block>
  <block wx:if="{{no_list_data}}">
    <view class="no-list-data">--我的底线就到这里了--</view>
  </block>
</view>
举报

相关推荐

0 条评论