fix travel location attachment style
This commit is contained in:
@ -84,11 +84,10 @@
|
|||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
|
||||||
.media-item {
|
.media-item {
|
||||||
width: 100%;
|
width: 220rpx;
|
||||||
height: 200rpx;
|
height: 220rpx;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: relative;
|
position: relative;
|
||||||
border-radius: 12rpx;
|
|
||||||
|
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@ -126,9 +126,6 @@ Page({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log(mediaItems);
|
|
||||||
|
|
||||||
this.setData({
|
this.setData({
|
||||||
location: {
|
location: {
|
||||||
...location,
|
...location,
|
||||||
|
|||||||
@ -90,9 +90,9 @@
|
|||||||
</t-cell-group>
|
</t-cell-group>
|
||||||
<!-- 照片/视频 -->
|
<!-- 照片/视频 -->
|
||||||
<t-cell-group wx:if="{{location.mediaItems && 0 < location.mediaItems.length}}" class="section media">
|
<t-cell-group wx:if="{{location.mediaItems && 0 < location.mediaItems.length}}" class="section media">
|
||||||
<view slot="title" class="title">照片/视频</view>
|
<view slot="title" class="title">照片视频</view>
|
||||||
<t-cell>
|
<t-cell>
|
||||||
<view class="media-grid">
|
<view slot="title" class="media-grid">
|
||||||
<view
|
<view
|
||||||
wx:for="{{location.mediaItems}}"
|
wx:for="{{location.mediaItems}}"
|
||||||
wx:key="attachmentId"
|
wx:key="attachmentId"
|
||||||
|
|||||||
@ -81,8 +81,8 @@
|
|||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
width: 240rpx;
|
width: 220rpx;
|
||||||
height: 240rpx;
|
height: 220rpx;
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: var(--theme-bg-card);
|
background: var(--theme-bg-card);
|
||||||
|
|||||||
@ -104,63 +104,55 @@
|
|||||||
</view>
|
</view>
|
||||||
</t-cell>
|
</t-cell>
|
||||||
</t-cell-group>
|
</t-cell-group>
|
||||||
<view class="section media">
|
<t-cell-group class="section media">
|
||||||
<view class="gallery">
|
<view slot="title" class="title">图片视频</view>
|
||||||
<!-- 创建模式:mediaList 显示新选择的媒体 -->
|
<t-cell>
|
||||||
<block wx:if="{{mode === 'create'}}">
|
<view slot="title" class="gallery">
|
||||||
<block wx:for="{{mediaList}}" wx:key="index">
|
<!-- 创建模式:mediaList 显示新选择的媒体 -->
|
||||||
<view class="item">
|
<block wx:if="{{mode === 'create'}}">
|
||||||
<!-- 图片 -->
|
<block wx:for="{{mediaList}}" wx:key="index">
|
||||||
<image
|
<view class="item">
|
||||||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
<!-- 图片 -->
|
||||||
src="{{item.path}}"
|
|
||||||
class="thumbnail"
|
|
||||||
mode="aspectFill"
|
|
||||||
bindtap="preview"
|
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{true}}"
|
|
||||||
></image>
|
|
||||||
<!-- 视频 -->
|
|
||||||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
|
||||||
<image
|
<image
|
||||||
src="{{item.thumbPath}}"
|
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||||||
|
src="{{item.path}}"
|
||||||
class="thumbnail"
|
class="thumbnail"
|
||||||
mode="aspectFill"
|
mode="aspectFill"
|
||||||
bindtap="preview"
|
bindtap="preview"
|
||||||
data-index="{{index}}"
|
data-index="{{index}}"
|
||||||
data-new-media="{{true}}"
|
data-new-media="{{true}}"
|
||||||
></image>
|
></image>
|
||||||
<t-icon class="play-icon" name="play" />
|
<!-- 视频 -->
|
||||||
|
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||||||
|
<image
|
||||||
|
src="{{item.thumbPath}}"
|
||||||
|
class="thumbnail"
|
||||||
|
mode="aspectFill"
|
||||||
|
bindtap="preview"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{true}}"
|
||||||
|
></image>
|
||||||
|
<t-icon class="play-icon" name="play" />
|
||||||
|
</view>
|
||||||
|
<!-- 删除 -->
|
||||||
|
<t-icon
|
||||||
|
class="delete"
|
||||||
|
name="close"
|
||||||
|
bindtap="deleteMedia"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{true}}"
|
||||||
|
/>
|
||||||
</view>
|
</view>
|
||||||
<!-- 删除 -->
|
</block>
|
||||||
<t-icon
|
|
||||||
class="delete"
|
|
||||||
name="close"
|
|
||||||
bindtap="deleteMedia"
|
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{true}}"
|
|
||||||
/>
|
|
||||||
</view>
|
|
||||||
</block>
|
</block>
|
||||||
</block>
|
<!-- 编辑模式:mediaList 显示现有附件,newMediaList 显示新添加的附件 -->
|
||||||
<!-- 编辑模式:mediaList 显示现有附件,newMediaList 显示新添加的附件 -->
|
<block wx:else>
|
||||||
<block wx:else>
|
<!-- 现有附件 -->
|
||||||
<!-- 现有附件 -->
|
<block wx:for="{{mediaList}}" wx:key="attachmentId">
|
||||||
<block wx:for="{{mediaList}}" wx:key="attachmentId">
|
<view class="item">
|
||||||
<view class="item">
|
<!-- 图片 -->
|
||||||
<!-- 图片 -->
|
|
||||||
<image
|
|
||||||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
|
||||||
src="{{item.thumbURL}}"
|
|
||||||
class="thumbnail"
|
|
||||||
mode="aspectFill"
|
|
||||||
bindtap="preview"
|
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{false}}"
|
|
||||||
></image>
|
|
||||||
<!-- 视频 -->
|
|
||||||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
|
||||||
<image
|
<image
|
||||||
|
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||||||
src="{{item.thumbURL}}"
|
src="{{item.thumbURL}}"
|
||||||
class="thumbnail"
|
class="thumbnail"
|
||||||
mode="aspectFill"
|
mode="aspectFill"
|
||||||
@ -168,68 +160,79 @@
|
|||||||
data-index="{{index}}"
|
data-index="{{index}}"
|
||||||
data-new-media="{{false}}"
|
data-new-media="{{false}}"
|
||||||
></image>
|
></image>
|
||||||
<t-icon class="play-icon" name="play" />
|
<!-- 视频 -->
|
||||||
|
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||||||
|
<image
|
||||||
|
src="{{item.thumbURL}}"
|
||||||
|
class="thumbnail"
|
||||||
|
mode="aspectFill"
|
||||||
|
bindtap="preview"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{false}}"
|
||||||
|
></image>
|
||||||
|
<t-icon class="play-icon" name="play" />
|
||||||
|
</view>
|
||||||
|
<!-- 删除 -->
|
||||||
|
<t-icon
|
||||||
|
class="delete"
|
||||||
|
name="close"
|
||||||
|
bindtap="deleteMedia"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{false}}"
|
||||||
|
/>
|
||||||
</view>
|
</view>
|
||||||
<!-- 删除 -->
|
</block>
|
||||||
<t-icon
|
<!-- 新选择附件 -->
|
||||||
class="delete"
|
<block wx:for="{{newMediaList}}" wx:key="index">
|
||||||
name="close"
|
<view class="item new-item">
|
||||||
bindtap="deleteMedia"
|
<!-- 图片 -->
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{false}}"
|
|
||||||
/>
|
|
||||||
</view>
|
|
||||||
</block>
|
|
||||||
<!-- 新选择附件 -->
|
|
||||||
<block wx:for="{{newMediaList}}" wx:key="index">
|
|
||||||
<view class="item new-item">
|
|
||||||
<!-- 图片 -->
|
|
||||||
<image
|
|
||||||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
|
||||||
src="{{item.path}}"
|
|
||||||
class="thumbnail"
|
|
||||||
mode="aspectFill"
|
|
||||||
bindtap="preview"
|
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{true}}"
|
|
||||||
></image>
|
|
||||||
<!-- 视频 -->
|
|
||||||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
|
||||||
<image
|
<image
|
||||||
src="{{item.thumbPath}}"
|
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||||||
|
src="{{item.path}}"
|
||||||
class="thumbnail"
|
class="thumbnail"
|
||||||
mode="aspectFill"
|
mode="aspectFill"
|
||||||
bindtap="preview"
|
bindtap="preview"
|
||||||
data-index="{{index}}"
|
data-index="{{index}}"
|
||||||
data-new-media="{{true}}"
|
data-new-media="{{true}}"
|
||||||
></image>
|
></image>
|
||||||
<t-icon class="play-icon" name="play" />
|
<!-- 视频 -->
|
||||||
|
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||||||
|
<image
|
||||||
|
src="{{item.thumbPath}}"
|
||||||
|
class="thumbnail"
|
||||||
|
mode="aspectFill"
|
||||||
|
bindtap="preview"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{true}}"
|
||||||
|
></image>
|
||||||
|
<t-icon class="play-icon" name="play" />
|
||||||
|
</view>
|
||||||
|
<!-- 新增标识 -->
|
||||||
|
<t-icon class="new-badge" name="add" />
|
||||||
|
<!-- 删除 -->
|
||||||
|
<t-icon
|
||||||
|
class="delete"
|
||||||
|
name="close"
|
||||||
|
bindtap="deleteNewMedia"
|
||||||
|
data-index="{{index}}"
|
||||||
|
data-new-media="{{true}}"
|
||||||
|
/>
|
||||||
</view>
|
</view>
|
||||||
<!-- 新增标识 -->
|
</block>
|
||||||
<t-icon class="new-badge" name="add" />
|
|
||||||
<!-- 删除 -->
|
|
||||||
<t-icon
|
|
||||||
class="delete"
|
|
||||||
name="close"
|
|
||||||
bindtap="deleteNewMedia"
|
|
||||||
data-index="{{index}}"
|
|
||||||
data-new-media="{{true}}"
|
|
||||||
/>
|
|
||||||
</view>
|
|
||||||
</block>
|
</block>
|
||||||
</block>
|
<!-- 添加按钮 -->
|
||||||
<!-- 添加按钮 -->
|
<t-button
|
||||||
<t-button
|
class="item add"
|
||||||
class="item add"
|
theme="primary"
|
||||||
theme="primary"
|
plain="true"
|
||||||
plain="true"
|
disabled="{{isSaving}}"
|
||||||
disabled="{{isSaving}}"
|
bind:tap="addMedia"
|
||||||
bind:tap="addMedia"
|
>
|
||||||
>
|
<t-icon name="add" />
|
||||||
<t-icon name="add" />
|
</t-button>
|
||||||
</t-button>
|
</view>
|
||||||
</view>
|
</t-cell>
|
||||||
</view>
|
</t-cell-group>
|
||||||
|
|
||||||
<!-- 上传进度提示 -->
|
<!-- 上传进度提示 -->
|
||||||
<view wx:if="{{isUploading}}" class="section upload">
|
<view wx:if="{{isUploading}}" class="section upload">
|
||||||
|
|||||||
Reference in New Issue
Block a user