project init & fix ui

miniprogram_npm/tdesign-miniprogram/image-viewer/image-viewer.wxml

@@ -0,0 +1,59 @@
+<import src="../common/template/icon.wxml" />
+<wxs src="../common/utils.wxs" module="_" />
+
+<view wx:if="{{visible}}" id="{{classPrefix}}" class="{{classPrefix}} {{prefix}}-class">
+  <view class="{{classPrefix}}__mask" style="{{ 'background-color: ' + backgroundColor }}" />
+  <block wx:if="{{images && images.length}}">
+    <view slot="content" class="{{classPrefix}}__content">
+      <swiper
+        height="{{windowHeight * 2}}"
+        class="swiper"
+        autoplay="{{false}}"
+        current="{{currentSwiperIndex}}"
+        bindchange="onSwiperChange"
+      >
+        <swiper-item
+          wx:for="{{images}}"
+          wx:key="index"
+          class="{{classPrefix}}__preview-image"
+          data-source="overlay"
+          bind:tap="onClose"
+        >
+          <t-image
+            t-class="t-image--external"
+            style="{{imagesShape[index].style}}"
+            mode="aspectFit"
+            lazy
+            src="{{item}}"
+            data-index="{{index}}"
+            class="{{classPrefix}}__image"
+            bindload="onImageLoadSuccess"
+          ></t-image>
+        </swiper-item>
+      </swiper>
+    </view>
+    <view class="{{classPrefix}}__nav">
+      <view
+        wx:if="{{closeBtnName || _.isNoEmptyObj(closeBtnData)}}"
+        class="{{classPrefix}}__nav-close"
+        bind:tap="onClose"
+      >
+        <slot wx:if="{{closeBtnName === 'slot'}}" name="close-btn" />
+        <template wx:else is="icon" data="{{ name: closeBtnName, ...closeBtnData}}"></template>
+      </view>
+
+      <view wx:if="{{showIndex}}" class="{{classPrefix}}__nav-index">
+        {{currentSwiperIndex + 1}}/{{images.length}}
+      </view>
+
+      <view
+        wx:if="{{deleteBtnName || _.isNoEmptyObj(deleteBtnData)}}"
+        class="{{classPrefix}}__nav-delete"
+        bind:tap="onDelete"
+      >
+        <slot wx:if="{{deleteBtnName === 'slot'}}" name="delete-btn" />
+        <template wx:else is="icon" data="{{ name: deleteBtnName, ...deleteBtnData}}"></template>
+      </view>
+    </view>
+  </block>
+</view>