project init & fix ui
This commit is contained in:
67
miniprogram_npm/tdesign-miniprogram/tabs/tabs.wxml
Normal file
67
miniprogram_npm/tdesign-miniprogram/tabs/tabs.wxml
Normal file
@@ -0,0 +1,67 @@
|
||||
<import src="../common/template/badge.wxml" />
|
||||
<wxs src="./tabs.wxs" module="filters" />
|
||||
<wxs src="../common/utils.wxs" module="_" />
|
||||
|
||||
<view style="{{ customStyle }}" class="{{_.cls(classPrefix, [placement])}} {{prefix}}-class">
|
||||
<t-sticky
|
||||
t-class="{{_.cls(classPrefix + '__sticky', [placement])}}"
|
||||
disabled="{{ !sticky }}"
|
||||
z-index="{{ stickyProps.zIndex || '1' }}"
|
||||
offset-top="{{ stickyProps.offsetTop }}"
|
||||
container="{{ stickyProps.container }}"
|
||||
bind:scroll="onTouchScroll"
|
||||
>
|
||||
<view class="{{_.cls(classPrefix + '__wrapper', [theme])}}">
|
||||
<scroll-view
|
||||
class="{{_.cls(classPrefix + '__scroll', [placement])}}"
|
||||
enable-flex
|
||||
scroll-left="{{offset}}"
|
||||
scroll-x="{{isScrollX}}"
|
||||
scroll-y="{{isScrollY}}"
|
||||
scroll-with-animation
|
||||
>
|
||||
<view class="{{_.cls(classPrefix + '__nav', [placement])}}" aria-role="tablist">
|
||||
<view
|
||||
wx:for="{{tabs}}"
|
||||
wx:key="index"
|
||||
data-index="{{index}}"
|
||||
class="{{_.cls(classPrefix + '__item', [theme, ['evenly', spaceEvenly], placement, ['disabled', item.disabled], ['active', currentIndex === index]])}} {{currentIndex === index ? prefix + '-class-active' : ''}} {{prefix}}-class-item"
|
||||
bind:tap="onTabTap"
|
||||
aria-role="tab"
|
||||
aria-controls="{{tabID + '_panel_' + index}}"
|
||||
aria-selected="{{currentIndex === index}}"
|
||||
aria-disabled="{{item.disabled}}"
|
||||
>
|
||||
<view class="{{_.cls(classPrefix + '__item-inner', [theme, ['active', currentIndex === index]])}}">
|
||||
<block wx:if="{{item.badgeProps}}">
|
||||
<template is="badge" data="{{ ...item.badgeProps, content: item.label }}" />
|
||||
</block>
|
||||
<block wx:else>{{item.label}}</block>
|
||||
</view>
|
||||
<view wx:if="{{theme == 'card' && currentIndex - 1 == index}}" class="{{classPrefix}}__item-prefix" />
|
||||
<view wx:if="{{theme == 'card' && currentIndex + 1 == index}}" class="{{classPrefix}}__item-suffix" />
|
||||
</view>
|
||||
<view
|
||||
wx:if="{{theme == 'line' && showBottomLine}}"
|
||||
class="{{_.cls(classPrefix + '__track', [placement])}} {{prefix}}-class-track"
|
||||
style="{{trackStyle}}"
|
||||
/>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</t-sticky>
|
||||
<view
|
||||
class="{{_.cls(classPrefix + '__content', [['animated', animation]])}}"
|
||||
bind:touchstart="onTouchStart"
|
||||
bind:touchmove="onTouchMove"
|
||||
bind:touchend="onTouchEnd"
|
||||
bind:touchcancel="onTouchEnd"
|
||||
>
|
||||
<view
|
||||
class="{{classPrefix}}__content-inner"
|
||||
style="{{ filters.animate({duration: animation.duration, currentIndex:currentIndex, direction}) }}"
|
||||
>
|
||||
<slot />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
Reference in New Issue
Block a user