card-mini/packagecard/moments/publish/momentpublish.wxml
2021-09-03 15:03:38 +08:00

426 lines
24 KiB
Plaintext

<cu-custom isBack="{{true}}">
<view slot="content">内容发布</view>
</cu-custom>
<view id="top-box" class="page-box-2" bindtap="hideEditBox" style="position: fixed;z-index: 1;margin-top: 0rpx;">
<view class="cu-bar bg-white" catchtap="showDisplayType" style="width: 100%;">
<view style="font-size: 32rpx;color:#000;">
本栏目可以发布
</view>
</view>
<view class="type-box">
<block wx:for="{{fieldList}}" wx:key="index">
<view wx:if="{{item.type=='text' || item.type== 'textarea'}}" class="item" catchtap="showType"
data-type="{{item.type}}">
<image src="/images/txt.png" mode="scaleToFill"></image>
<view>文本</view>
</view>
<view wx:elif="{{item.type=='photo'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/jpg.png" mode="scaleToFill"></image>
<view>图片</view>
</view>
<view wx:elif="{{item.type=='video'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/mp4.png" mode="scaleToFill"></image>
<view>视频</view>
</view>
<view wx:elif="{{item.type=='audio'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/mp3.png" mode="scaleToFill"></image>
<view>音频</view>
</view>
<view wx:elif="{{item.type=='select'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/lib.png" mode="scaleToFill"></image>
<view>选项</view>
</view>
<view wx:elif="{{item.type=='map'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/map.png" mode="scaleToFill"></image>
<view>定位</view>
</view>
<view wx:elif="{{item.type=='link'}}" class="item" catchtap="showType" data-type="{{item.type}}">
<image src="/images/htm.png" mode="scaleToFill"></image>
<view>链接</view>
</view>
<view wx:if="{{index != fieldList.length - 1}}">+</view>
</block>
</view>
</view>
<view class="page-box-2" bindtap="hideEditBox" style="margin-top: {{topBoxHeight}}px;">
<!-- 输入的内容 -->
<block wx:if="{{valueList.length>0}}">
<view wx:for="{{valueList}}" wx:key="index" style="margin-top: 15rpx;width: 100%;">
<!-- 文本域 -->
<view wx:if="{{item.type=='text' || item.type=='textarea'}}" catchtap="showEditBox" class="item-box"
data-idx="{{index}}">
<view style="width: 100%;text-align: {{item.textAlign}};font-size: 32rpx;">{{item.value}}</view>
</view>
<!-- 图片 -->
<view wx:if="{{item.type=='photo'}}" catchtap="showEditBox" class="item-box" data-idx="{{index}}">
<!-- 九宫格 -->
<view class="grid col-3 grid-square flex-sub" wx:if="{{item.displayType=='1'}}" style="width: 100%;">
<view class="bg-img" wx:for="{{item.valueList}}" wx:key="idx" wx:for-item="photo">
<image src='{{photo.path}}' mode='aspectFill'></image>
</view>
</view>
<!-- 轮播 -->
<swiper style="width:100%;height:400rpx;" indicator-dots="{{true}}"
wx:elif="{{item.displayType=='2' || item.displayType=='3'}}" autoplay="{{item.displayType=='3'}}">
<block wx:for="{{item.valueList}}" wx:key="pIndex" wx:for-index="pIndex" wx:for-item="photo">
<swiper-item style="width:100%;">
<image style="width:100%;border-radius:5rpx;height:400rpx;" src="{{photo.path}}"
mode="aspectFill">
</image>
</swiper-item>
</block>
</swiper>
<!-- 平铺 -->
<view wx:elif="{{item.displayType=='4'}}" style="width: 100%;">
<block wx:for="{{item.valueList}}" wx:key="pIndex" wx:for-index="pIndex" wx:for-item="photo">
<image style="width:100%;border-radius:5rpx;" src="{{photo.path}}" mode="widthFix">
</image>
</block>
</view>
</view>
<!-- 视频 -->
<view wx:if="{{item.type=='video'}}" catchtap="showEditBox" class="item-box" data-idx="{{index}}">
<!-- 九宫格 -->
<view class="grid col-3 grid-square flex-sub" wx:if="{{item.displayType=='1'}}" style="width: 100%;">
<view class="bg-img" wx:for="{{item.valueList}}" wx:key="idx" wx:for-item="video">
<image src='{{video.coverPath}}' mode='aspectFill'></image>
<image src="/images/ic_video_play.png" mode="scaleToFill"
style="width: 48rpx;height:48rpx;position: absolute;top:40%;left:40%;">
</image>
</view>
</view>
<block wx:if="{{item.displayType=='2'}}">
<view class="movie-box" wx:for="{{item.valueList}}" wx:key="index" wx:for-item="video">
<image src='{{video.coverPath}}' mode='scaleToFill'></image>
<view class="play-box-arrow-flex">
<image src="/images/ic_video_play.png" mode="scaleToFill"
style="width: 96rpx;height:96rpx;">
</image>
</view>
</view>
</block>
</view>
<!-- 音频 -->
<view wx:if="{{item.type=='audio'}}" catchtap="showEditBox" class="item-box" data-idx="{{index}}">
<view class="play-box-shadow-little">
<view class="flex justify-between align-center" style="width:80%;">
<text>{{item.value.curDurationStr}}</text>
<slider class="flex-sub" bindchange="slider4change" min="{{0}}" max="{{item.value.duration}}"
value="{{item.value.curDuration}}" backgroundColor="#cacaca" activeColor="#1296db"
block-size="14" data-item="{{item.value}}" block-color="#1296db" data-idx="{{index}}" />
<text>{{item.value.totalDurationStr}}</text>
</view>
<view class="flex justify-between" style="width:80%;">
<image src="/images/ic_audio_rewind.png" mode="scaleToFill" catchtap="rewind"
data-idx="{{index}}" data-item="{{item.value}}">
</image>
<image src="{{item.value.isPlay ? '/images/ic_audio_playing.png':'/images/ic_audio_play.png'}}"
data-idx="{{index}}" mode="scaleToFill" catchtap="play" data-item="{{item.value}}">
</image>
<image src="/images/ic_audio_speed.png" mode="scaleToFill" catchtap="speed" data-idx="{{index}}"
data-item="{{item.value}}">
</image>
</view>
</view>
</view>
<!-- 地图 -->
<view wx:if="{{item.type=='map'}}" catchtap="showEditBox" class="item-box" data-idx="{{index}}">
<view class="flex flex-direction align-center bg-white radius item-padding">
<view style="width: 100%;">
<view class="flex justify-between">
<view>
{{item.value.name}}-{{item.value.address}}
</view>
</view>
<view style="border-radius:10rpx;overflow:hidden;margin-top:10rpx;width: 100%;">
<map style="width:100%;height:300rpx;" longitude="{{item.value.longitude}}"
latitude="{{item.value.latitude}}" scale="12"
markers="{{[{latitude:item.value.latitude,longitude:item.value.longitude}]}}"></map>
</view>
</view>
</view>
</view>
<!-- 链接 -->
<view wx:if="{{item.type=='link'}}" catchtap="showEditBox" class="item-box" data-idx="{{index}}">
<view style="width: 100%;font-size: 32rpx;">{{item.value}}</view>
</view>
<!-- 选项 -->
<view wx:if="{{item.type=='select'}}" catchtap="showEditBox"
class="item-box {{currentIndex==index ? 'sel-border':''}}" data-idx="{{index}}">
<view
style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;flex-wrap: wrap;width: 100%;">
<block wx:for="{{item.valueList}}" wx:key="index" wx:for-item="options">
<view class="cu-tag bg-blue" style="margin:15rpx 15rpx 0rpx 15rpx;">
{{options.name}}
</view>
</block>
</view>
</view>
<view wx:if="{{currentIndex == index}}">
<view class="control-box">
<view class="item" catchtap="editItem" data-index="{{index}}" data-type="{{item.type}}">
<text class="cuIcon-edit bg-yellow-light"></text>
<text style="margin-left: 15rpx;">编辑</text>
</view>
<view class="item" catchtap="insertItem" data-type="{{item.type}}" data-index="{{index}}">
<text class="cuIcon-write bg-yellow-light"></text>
<text style="margin-left: 15rpx;">插入</text>
</view>
<view class="item" catchtap="delItem" data-type="{{item.type}}" data-index="{{index}}">
<text class="cuIcon-roundclose bg-yellow-light"></text>
<text style="margin-left: 15rpx;">删除</text>
</view>
</view>
<!-- 插入框 -->
<view style="width: 100%;" wx:if="{{isInsert}}">
<view class="dir-parent-box">
<view class="title">方向:</view>
<view class="dir-box">
<view class="cu-capsule radius" catchtap="chooseDirection" data-idx="1">
<view class="cu-tag {{selDirection=='1' ? 'bg-yellowlight':'bg-grey'}}">
<text class="{{selDirection=='1' ? 'cuIcon-apps':'cuIcon-apps'}}"></text>
</view>
<view class="cu-tag {{selDirection=='1' ? 'line-yellowlight2':'line-black'}}">
插入到下面
</view>
</view>
<view class="cu-capsule radius" style="margin-left: 15rpx;" catchtap="chooseDirection"
data-idx="2">
<view class="cu-tag {{selDirection== '2' ? 'bg-yellowlight':'bg-grey'}}">
<text class="{{selDirection== '2' ? 'cuIcon-apps':'cuIcon-apps'}}"></text>
</view>
<view class="cu-tag {{selDirection=='2' ? 'line-yellowlight2':'line-black'}}">
插入到上面
</view>
</view>
</view>
</view>
<view class="dir-parent-box">
<view class="title">类型:</view>
<view class="choose-box">
<block wx:for="{{fieldList}}" wx:for-index="idx" wx:key="idx">
<view catchtap="chooseFieldType" data-type="{{idx}}" class="item">
<text
class="{{curFieldType == idx ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curFieldType == idx ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">{{item.type}}</text>
</view>
</block>
</view>
</view>
<button class="cu-btn bg-blue" style="width:100%;margin-top:15rpx;"
catchtap="doInsert">确定插入</button>
</view>
</view>
</view>
</block>
<view wx:else style="margin-top:15rpx;width:100%;">
<van-empty description="点击图标进行添加内容" />
</view>
</view>
<!-- 文本输入框 -->
<van-popup show="{{ isShowInput }}" position="top" bind:close="onClose">
<view style="margin-top: {{maringHeight}}px;" class="input-box">
<view class="title">
文本
</view>
<view class="cu-bar bg-white choose-box">
<view catchtap="chooseTextAlign" data-type="1" class="item">
<text
class="{{curTextAlign=='1' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curTextAlign=='1' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">文字居左</text>
</view>
<view catchtap="chooseTextAlign" data-type="2" class="item">
<text
class="{{curTextAlign=='2' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curTextAlign=='2' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">文字居中</text>
</view>
<view catchtap="chooseTextAlign" data-type="3" class="item">
<text
class="{{curTextAlign=='3' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curTextAlign=='3' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">文字居右</text>
</view>
</view>
<textarea placeholder="请输入内容" bindinput="inputWatch" value="{{curTextValue}}"
placeholder-style="color:#333333;"></textarea>
<view style="width: 100%;margin-top: 15rpx;">
<button class="cu-btn bg-blue" style="width:100%" bindtap="doConfirmInput">确定</button>
</view>
</view>
</van-popup>
<!-- 链接输入框 -->
<van-popup show="{{ isShowLink }}" position="top" bind:close="onClose">
<view style="margin-top: {{maringHeight}}px;" class="input-box">
<view class="title">
链接
</view>
<input placeholder="请输入链接地址" bindinput="inputLink" value="{{curLinkText}}" class="item-input"
placeholder-style="color:#333333;"></input>
<view style="width: 100%;margin-top: 15rpx;">
<button class="cu-btn bg-blue" style="width:100%" bindtap="doConfirmLink">确定</button>
</view>
</view>
</van-popup>
<!-- 语音弹框 -->
<van-action-sheet show="{{ isShowAudio }}" title="语音" bind:close="closePop" data-type="audio"
close-on-click-overlay="{{false}}" overlay="{{true}}" style="padding-bottom:180rpx;">
<view class="audio-box">
<view class="flex flex-direction align-center" style="margin-top:10rpx;padding-bottom:80rpx;width: 100%;"
wx:if="{{audioFile==null}}">
<image src="{{isRecording? '/images/ic_voice_record.gif':'/images/ic_record_start.png'}}" mode="heightFix"
style="width:300rpx;height:300rpx;"></image>
<text>00:{{audioDuration > 9 ? audioDuration : '0'+ audioDuration}}</text>
<view class="cu-btn bg-blue radius margin-top-sm" style="width:70%;" bindtouchstart="startRecord"
bindtouchend="doEndRecord">长按录音</view>
</view>
<!-- 存在录音文件 -->
<view style="width: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;"
wx:else>
<view class="play-box-shadow">
<view class="flex justify-between align-center" style="width:80%;">
<text>{{audioFile.curDurationStr}}</text>
<slider class="flex-sub" bindchange="slider4change" min="{{0}}" max="{{audioFile.duration}}"
value="{{audioFile.curDuration}}" backgroundColor="#cacaca" activeColor="#1296db"
block-size="14" data-item="{{audioFile}}" block-color="#1296db" />
<text>{{audioFile.totalDurationStr}}</text>
</view>
<view class="flex justify-between" style="width:80%;">
<image src="/images/ic_audio_rewind.png" mode="scaleToFill" bindtap="rewind"
data-item="{{audioFile}}">
</image>
<image src="{{audioFile.isPlay ? '/images/ic_audio_playing.png':'/images/ic_audio_play.png'}}"
mode="scaleToFill" bindtap="play" data-item="{{audioFile}}">
</image>
<image src="/images/ic_audio_speed.png" mode="scaleToFill" bindtap="speed"
data-item="{{audioFile}}">
</image>
</view>
<text class="cuIcon-roundclose" catchtap="delAudio"
style="position: absolute;top: -15rpx;right:-15rpx;font-size: 50rpx;color: #1296db;"></text>
</view>
<button class="cu-btn bg-blue" style="width:80%;margin-top: 15rpx;" bindtap="doConfirmAudio">确定</button>
</view>
</view>
</van-action-sheet>
<!-- 图片确定弹框 -->
<van-action-sheet show="{{ isShowPhoto }}" title="图片" bind:close="closePop" data-type="1"
style="padding-bottom:180rpx;">
<scroll-view scroll-y style="width: 100%;height: 500rpx;padding: 15rpx;">
<view class="cu-bar bg-white">
<view class="action">
<text>图片 {{photoList.length}}/9</text>
</view>
<view class="action">
<button class="cu-btn bg-blue" style="width:100%;height: 60rpx;" catchtap="confirmPhoto">确定</button>
</view>
</view>
<view class="cu-bar bg-white choose-box">
<view catchtap="choosePhotoDisplay" data-type="1" class="item">
<text
class="{{curSelPhotoDisplay=='1' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curSelPhotoDisplay=='1' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">九宫格</text>
</view>
<view catchtap="choosePhotoDisplay" data-type="2" class="item">
<text
class="{{curSelPhotoDisplay=='2' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curSelPhotoDisplay=='2' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">轮播</text>
</view>
<view catchtap="choosePhotoDisplay" data-type="3" class="item">
<text
class="{{curSelPhotoDisplay=='3' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curSelPhotoDisplay=='3' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">轮播(自动)</text>
</view>
<view catchtap="choosePhotoDisplay" data-type="4" class="item">
<text
class="{{curSelPhotoDisplay=='4' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curSelPhotoDisplay=='4' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">平铺</text>
</view>
</view>
<view class="cu-form-group item-padding" style="margin-top: 15rpx;">
<view class="grid col-3 grid-square flex-sub">
<view class="bg-img" wx:for="{{photoList}}" wx:for-index="idx" wx:key="idx" catchtap="viewPhoto"
wx:for-item="photo" data-url="{{photo.path}}">
<image src='{{photo.path}}' mode='aspectFill'></image>
<view class="cu-tag bg-red" catchtap="delPhoto" data-index="{{idx}}">
<text class="cuIcon-close"></text>
</view>
</view>
<view class="solids" catchtap="chooseImg" data-item="{{item}}" data-index="{{index}}"
wx:if="{{photoList.length<9}}">
<text class="cuIcon-cameraadd"></text>
</view>
</view>
</view>
</scroll-view>
</van-action-sheet>
<!-- 视频确定弹框 -->
<van-action-sheet show="{{ isShowVideo }}" title="视频" bind:close="closePop" data-type="1"
style="padding-bottom:180rpx;">
<scroll-view scroll-y style="width: 100%;height: 500rpx;padding: 15rpx;">
<view class="cu-bar bg-white">
<view class="action">
<text>视频 {{videoList.length}}/9</text>
</view>
<view class="action">
<button class="cu-btn bg-blue" style="width:100%;height: 60rpx;" catchtap="confirmVideo">确定</button>
</view>
</view>
<view class="cu-bar bg-white choose-box">
<view catchtap="chooseVideoDisplay" data-type="1" class="item">
<text
class="{{curVideoDisplay=='1' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curVideoDisplay=='1' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">九宫格</text>
</view>
<view catchtap="chooseVideoDisplay" data-type="2" class="item">
<text
class="{{curVideoDisplay=='2' ? 'bg-yellow-light cuIcon-roundcheck' : 'text-gray2 cuIcon-round'}}"></text>
<text class="{{curVideoDisplay=='2' ? 'bg-yellow-light' : 'text-gray2'}}"
style="margin-left: 6rpx;">平铺</text>
</view>
</view>
<view class="cu-form-group item-padding" style="margin-top: 15rpx;">
<view class="grid col-3 grid-square flex-sub">
<view class="bg-img" wx:for="{{videoList}}" wx:for-index="idx" wx:key="idx" wx:for-item="video">
<image src='{{video.coverPath}}' mode='aspectFill'></image>
<view class="cu-tag bg-red" catchtap="delImg" data-index="{{idx}}" data-itemIndex="{{index}}">
<text class="cuIcon-close"></text>
</view>
</view>
<view class="solids" catchtap="chooseVideo" wx:if="{{videoList.length<9}}">
<text class="cuIcon-cameraadd"></text>
</view>
</view>
</view>
</scroll-view>
</van-action-sheet>
<!-- 多选 -->
<van-action-sheet show="{{ isShowSelect }}" title="请选择" bind:close="closePop" data-type="8"
style="padding-bottom:180rpx;">
<view class="flex flex-direction align-center" style="margin-top:10rpx;padding-bottom:30rpx;">
<scroll-view style="height:320rpx;max-height:320rpx;padding:0rpx 20rpx;" scroll-y>
<view class="cu-capsule radius sel-item" wx:for="{{optionsList}}" wx:key="index">
<view class="cu-tag {{item.isSel ? 'bg-blue' : 'bg-gray' }}" catchtap="chooseTags" data-idx="{{index}}"
data-item="{{item}}">
{{item.name}}
</view>
</view>
</scroll-view>
<view style="width: 60%;margin-top: 15rpx;">
<button class="cu-btn bg-blue" style="width:100%" bindtap="doConfirmSel">确定</button>
</view>
</view>
</van-action-sheet>