card-mini/pages/mine/otherCard/othercarddetail.wxml
2021-08-06 11:33:10 +08:00

392 lines
21 KiB
Plaintext

<cu-custom id="head" isCustom="{{false}}" isBack="{{true}}">
<view slot="content">
<view>
{{nameTxt}}
</view>
</view>
</cu-custom>
<view style="background-color:#F7F7F7;">
<view class="top-box">
<!-- 名片 -->
<view class="card-container"
style="padding-bottom:{{(cardInfo.cardTemplateUseHeight / cardInfo.cardTemplateUseWidth) *100 +'%'}};">
<view class="card"
style="padding-bottom:{{(cardInfo.cardTemplateUseHeight / cardInfo.cardTemplateUseWidth) *100 +'%'}};">
<!-- 背景图 -->
<image src="{{cardUrl}}{{cardInfo.picturesTemplatePictureUrl}}" alt="" class="card-bgImg" mode="widthFix">
</image>
</view>
</view>
<!-- 功能区 -->
<view class="flex flex-direction justify-center align-center bg-white" style="width:100%;">
<view class="mid">
<button open-type="share" class="mid-box">
<view class="flex justify-between align-center" style="width:100%;">
<text style="text-align:center;line-height:30rpx;height:30rpx;font-size:28rpx;color:#CCC;">01/</text>
<image src="/images/ic_share_icon.png"></image>
</view>
<view class="mid-box-text margin-top-xs">分享名片</view>
</button>
<view class="mid-box" bindtap="includedCard">
<view class="flex justify-between align-center" style="width:100%;">
<text style="text-align:center;line-height:30rpx;height:30rpx;font-size:28rpx;color:#CCC;">02/</text>
<image src="/images/ic_phone_icon.png"></image>
</view>
<view class="mid-box-text margin-top-xs">加入卡包</view>
</view>
<view class="mid-box bg-yellow-yellow" bindtap="showBarCode">
<view class="flex justify-between align-center" style="width:100%;">
<text style="text-align:center;line-height:30rpx;height:30rpx;font-size:28rpx;">03/</text>
<image src="/images/ic_code_icon.png"></image>
</view>
<view class="mid-box-text-white margin-top-xs">名片码</view>
</view>
</view>
<view class="mid-btn">
<view class="mid-btn-box" bindtap="makeCall">
<view class="mid-btn-title">
<image class="image" src="/images/ic_call_phone_icon.png"></image>
<text>拨打电话</text>
</view>
<view style="flex:7;text-align: right;">{{phoneTxt}}</view>
</view>
<view class="mid-btn-box" bindtap="copyText" data-text="{{wechateTxt}}">
<view class="mid-btn-title">
<image class="image" src="/images/ic_wechart_icon.png"></image>
<text>添加微信</text>
</view>
<view style="flex:7;text-align: right;">{{wechateTxt}}</view>
</view>
<view class="mid-btn-box" bindtap="copyText" data-text="{{emailTxt}}">
<view class="mid-btn-title">
<image class="image" src="/images/ic_email_icon.png"></image>
<text>邮箱</text>
</view>
<view style="flex:7;text-align: right;">{{emailTxt}}</view>
</view>
<view class="mid-btn-box" bindtap="copyText" data-text="{{addressTxt}}">
<view class="mid-btn-title">
<image class="image" src="/images/ic_address_icon.png"></image>
<text>地址</text>
</view>
<view style="flex:7;text-align: right;">{{addressTxt}}</view>
</view>
</view>
<view class="good">
<view class="good-avatar">
<view class="avatar-list" wx:for="{{browUserList}}" wx:key="index" wx:for-item="user">
<image src="{{user.creatorIcon}}" wx:if="{{user.creatorIcon}}"></image>
<image src="/images/ic_user_default.png" wx:if="{{!user.creatorIcon}}"></image>
</view>
</view>
<view class="good-click">
<view class="view-count">
<image src="/images/view-count.png" mode="scaleToFill"></image>
<text class="margin-left-sm text-center"> {{cardInfo.cardTemplateUseScansNumber >999? '999+' :
cardInfo.cardTemplateUseScansNumber}}</text>
</view>
<view class="view-count-no">
<image src="/images/share_count.png" mode="scaleToFill"></image>
<text class="margin-left-sm text-center">{{cardInfo.cardTemplateUseDispatchNumber>999 ?
'999+':cardInfo.cardTemplateUseDispatchNumber}}</text>
</view>
</view>
</view>
</view>
<!-- 栏目数据 -->
<view wx:if="{{dataList.length>0}}" style="background-color:#F7F7F7;">
<!-- 栏目组 -->
<view wx:for="{{dataList}}" wx:key="index">
<view class="flex flex-direction margin-sm">
<!-- 栏目 -->
<view class="catelog-title margin-top-xs" data-item="{{item}}" data-idx="{{index}}"
data-userid="{{tempUserId}}" bindtap="showMore">
<view class="action">
<view class="title intro-title">
<image src="/images/ic_column_icon.png" mode="scaleToFill" style="width:32rpx;height:32rpx;"></image>
<text>{{item.name}}</text>
</view>
</view>
<view class="action text-gray" style="color:#999999;" wx:if="{{item.mode=='2'}}">
更多<text class="cuIcon-add"></text>
</view>
</view>
<view class="column-content">
<!-- 栏目样式用来展示音频 -->
<view wx:if="{{item.type=='dbc15b23-a1a3-4cb6-b7fa-9b01c9416454'}}" class="flex flex-direction"
style="width:100%;">
<view wx:for="{{item.list}}" wx:for-index="idx" wx:key="idx" wx:for-item="it" class="column-box-row">
<view wx:for="{{it.list}}" wx:for-index="i" wx:for-item="child" wx:key="i" bindtap="showDetail"
data-ctype="{{item.type}}" data-cid="{{item.cId}}" data-id="{{it.uid}}">
<!-- 文本 -->
<view wx:if="{{child.dataType=='1' && child.displayList}}" class="align-center">
<view class="bg-white">
<view class="cu-form-group">
<view id="content" class="padding-left-xs padding-right-xs margin-left-xs margin-right-xs"
style="line-height:40rpx;">
<text class="cuIcon-title">
</text>
<text style="color:#333333;">{{child.value}}</text>
</view>
</view>
</view>
</view>
<!-- 音频 -->
<view wx:if="{{child.dataType=='3' && child.displayList}}" style="width:100%;">
<view class="cu-form-group padding-sm">
<view class="flex align-center margin-left-sm" style="width:100%;" wx:for="{{child.valueList}}"
wx:for-index="a" wx:key="a" wx:for-item="audio">
<image src="{{audio.isPlay? '/images/ic_pause_icon.png': '/images/ic_play_icon.png'}}"
mode="scaleToFill" style="width:64rpx;height:64rpx;margin-left:5rpx;" data-index="{{index}}"
data-i="{{i}}" data-idx="{{idx}}" data-a="{{a}}" data-item="{{audio}}" catchtap="play">
</image>
</view>
</view>
</view>
</view>
</view>
</view>
<view wx:else>
<view wx:for="{{item.list}}" wx:for-index="idx" wx:key="idx" wx:for-item="it" class="column-box">
<!-- 栏目数据 -->
<view wx:for="{{it.list}}" wx:for-index="i" wx:for-item="child" wx:key="i" bindtap="showDetail"
data-ctype="{{item.type}}" data-cid="{{item.cId}}" data-id="{{it.uid}}">
<!-- 栏目样式1或3 -->
<view>
<!-- 具体数据 -->
<!-- 文本 -->
<view wx:if="{{child.dataType=='1' && child.displayList}}" class="align-center">
<view class="bg-white">
<view class="cu-form-group">
<view id="content" class="padding-left-xs padding-right-xs margin-left-xs margin-right-xs"
style="line-height:40rpx;">
<text class="{{item.type=='dda5007c-5fb7-48f2-8537-3cb8ea298242' ? 'cuIcon-title' : ''}}">
</text>
<text style="color:#333333;">{{child.value}}</text>
</view>
</view>
</view>
</view>
<!-- 图片 -->
<view wx:if="{{child.dataType=='2' && child.displayList}}">
<!-- 九宫格 -->
<view wx:if="{{child.dataMode == '95bef6e2-0ab8-442f-b53d-b1f18130bae1'}}"
class="cu-form-group padding-sm">
<view class="grid col-3 grid-square flex-sub">
<view class="bg-img" wx:for="{{child.valueList}}" wx:key="d" wx:for-item="photo"
catchtap="viewImg" data-url="{{photo.path}}">
<image src='{{photo.path}}' mode='scaleToFill'></image>
</view>
</view>
</view>
<!-- 左右滑动 -->
<view
wx:elif="{{child.dataMode=='bae3d6c1-8f6e-4e27-bba2-e42860758db7' || child.dataMode=='179441e3-5ad1-485b-b5af-421bdc383b5e'}}">
<swiper style="width:100%;height:400rpx;margin-top:20rpx;" indicator-dots="{{true}}"
autoplay="{{child.dataMode=='179441e3-5ad1-485b-b5af-421bdc383b5e'}}">
<block wx:for="{{child.valueList}}" wx:key="pIndex" wx:for-index="pIndex" wx:for-item="photo">
<swiper-item style="width:100%;">
<image style="width:100%;border-radius:20rpx;height:400rpx;" src="{{photo.path}}"
mode="scaleToFill">
</image>
</swiper-item>
</block>
</swiper>
</view>
<!-- 上下 -->
<view wx:elif="{{child.dataMode=='121133b0-3596-46f4-a35f-7aaae79cf47a'}}">
<block wx:for="{{child.valueList}}" wx:key="pIndex" wx:for-index="pIndex" wx:for-item="photo">
<image style="width:100%;border-radius:20rpx;margin-top:20rpx;" src="{{photo.path}}"
mode="widthFix">
</image>
</block>
</view>
</view>
<!-- 视频 -->
<view wx:if="{{child.dataType=='4' && child.displayList}}">
<view class="cu-form-group margin-top-sm padding-sm"
style="border:1rpx solid #f9f9f9;border-radius:10rpx;">
<view class="grid col-{{count>3 ? count : 1}} grid-square flex-sub">
<view class="{{count >3 ?'' : 'movie-item'}} bg-img" wx:for="{{child.valueList}}"
wx:for-index="d" wx:key="d" wx:for-item="video" catchtap="viewVideo"
data-url="{{video.path}}">
<image style="width:100%;height:100%;" src='{{video.imgPath}}' mode='scaleToFill'></image>
<view class="{{count > 3 ? 'play-box-arrow-pos':'play-box-arrow-flex'}}">
<image src="/images/ic_video_play.png" mode="scaleToFill"
class="{{count>3? 'image-32' :'image-64'}}"></image>
</view>
</view>
</view>
</view>
</view>
<!-- 音频 -->
<view wx:if="{{child.dataType=='3' && child.displayList}}" style="width:100%;">
<view class="cu-form-group padding-sm">
<view class="flex align-center shadow-box margin-top-xs" style="width:100%;"
wx:for="{{child.valueList}}" wx:for-index="a" wx:key="a" wx:for-item="audio">
<image src="/images/ic_user_default.png" mode="scaleToFill" style="width:80rpx;height:80rpx;">
</image>
<view class="play-box">
<view class="flex justify-between align-center" style="width:80%;">
<text>{{audio.curDurationStr}}</text>
<slider class="flex-sub" bindchange="slider4change" min="{{0}}" max="{{audio.duration}}"
value="{{audio.curDuration}}" backgroundColor="#cacaca" activeColor="#1296db"
data-index="{{index}}" data-idx="{{idx}}" data-i="{{i}}" data-item="{{audio}}"
data-a="{{a}}" block-size="14" block-color="#1296db" />
<text>{{audio.totalDurationStr}}</text>
</view>
<view class="flex justify-between" style="width:80%;">
<image src="/images/ic_audio_rewind.png" mode="scaleToFill" data-index="{{index}}"
data-idx="{{idx}}" data-a="{{a}}" data-i="{{i}}" data-item="{{audio}}"
catchtap="rewind">
</image>
<image src="{{audio.isPlay ? '/images/ic_audio_playing.png':'/images/ic_audio_play.png'}}"
mode="scaleToFill" catchtap="play" data-index="{{index}}" data-i="{{i}}"
data-idx="{{idx}}" data-a="{{a}}" data-item="{{audio}}"></image>
<image src="/images/ic_audio_speed.png" mode="scaleToFill" catchtap="speed"
data-index="{{index}}" data-a="{{a}}" data-idx="{{idx}}" data-i="{{i}}"
data-item="{{audio}}"></image>
</view>
</view>
</view>
</view>
</view>
<!-- 地图定位 -->
<view wx:if="{{child.dataType=='6' && child.displayList}}">
<view class="padding-sm">
<view wx:for="{{child.valueList}}" wx:key="mindex" wx:for-index="mindex" wx:for-item="m"
style="width:100%;" class="margin-top-xs">
<view class="flex justify-between">
<view>
</view>
<view></view>
</view>
<view style="border-radius:10rpx;overflow:hidden;margin-top:10rpx;">
<map style="width:100%;height:300rpx;" longitude="{{m.longitude}}" latitude="{{m.latitude}}"
scale="12" enable-scroll="{{false}}" enable-zoom="{{false}}" enable-rotate="{{false}}"
enable-traffic="{{false}}"
markers="{{[{latitude:m.latitude,longitude:m.longitude}]}}"></map>
</view>
</view>
</view>
</view>
<!-- 文本域 -->
<view wx:if="{{child.dataType == '7' && child.displayList}}">
<view class="bg-white">
<view class="cu-form-group">
<view id="content" class="padding-left-xs padding-right-xs margin-left-xs margin-right-xs"
style="line-height:40rpx;color:#333333">
<text space="emsp" decode="true">&emsp;&emsp;{{child.value}}</text>
</view>
</view>
</view>
</view>
<!-- 单选 -->
<view wx:if="{{child.dataType == '8' && child.displayList}}">
<view class="flex" style="flex-direction:row;">
<view class="cu-bar bg-white">
<view class="action">
<text class="cuIcon-vipcard"></text> <text class="text-black">{{child.comment}}:</text><text
class="margin-left-sm">{{child.selValue}}</text>
</view>
</view>
</view>
</view>
<!-- 多选 -->
<view wx:if="{{child.dataType == '9' && child.displayList}}">
<view class="cu-bar bg-white">
<view class="action">
<text class="cuIcon-vipcard"></text> <text>{{child.comment}}</text>
</view>
</view>
<view class="cu-capsule radius" wx:for="{{child.dictionariesList}}" wx:key="ids"
wx:for-index="ids" wx:for-item="ss">
<view wx:if="{{ss.isSel}}" class="cu-tag bg-blue radius padding-left-sm padding-right-sm">
{{ss.dataName}}
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 评论 收藏 点赞 -->
<!-- <view class="func-box">
<view class="line-gray-ssm">
</view>
<view class="func-items">
<view class="func-item">
<image src="/images/share_count.png" mode="scaleToFill"></image>
<text>转发</text>
</view>
<view class="func-item">
<image src="/images/ic_collect_icon.png" mode="scaleToFill"></image>
<text>收藏</text>
</view>
<view class="func-item">
<image src="/images/ic_comment_icon.png" mode="scaleToFill"></image>
<text>10</text>
</view>
<view class="func-item">
<image src="/images/ic_unfavour.png" mode="scaleToFill"></image>
<text>12</text>
</view>
</view>
</view> -->
</view>
</view>
</view>
</view>
</view>
<view wx:else style="margin-top:200rpx;width:100%;">
<van-empty description="暂无数据" />
</view>
</view>
<!-- 创建名片 -->
<view class="creat-card" bindtap="goList">
<image src="/images/create-btn.png"></image>
</view>
</view>
<view class="bar-code" wx:if="{{isShowBarCode}}" bindtap="hideBarCode">
<view class="content">
<view class="code-title">一段话</view>
<image src="{{cardUrl}}{{cardInfo.cardTemplateUseBarcode}}"></image>
<view class="code-txt">
有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。
</view>
</view>
</view>
<!-- 选择展示的名片 -->
<van-action-sheet show="{{ isShowCard }}" title="请选择" bind:close="onHide" 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;align-items:center;" scroll-y>
<!-- 我的 -->
<view style="width:100%;flex-direction:center;" class="flex align-center" bindtap="changeCard">
<view class="flex align-center justify-center bg-yellow-yellow"
style="width:100%;height:160rpx;border-radius:10rpx;margin-right:10rpx;margin-left:10rpx;">
<text style="font-size:32rpx;color:#FFFFFF;">我的</text>
</view>
</view>
<!-- 浏览历史 -->
<view wx:for="{{otherCardList}}" wx:key="index" wx:for-item="item" class="cu-list menu-avatar solid"
style="margin-left:10rpx;margin-right:10rpx;margin-top:20rpx;" data-item="{{item}}" bindtap="changeCard">
<view class="cu-item bg-yellow-yellow" style="width:100%;height:160rpx;border-radius:10rpx;">
<view class="cu-avatar radius xl round bg-yellow-yellow">
<text style="font-size:14px;">{{item.name}}</text>
</view>
<view class="content" style="width:100%;">
<view class="text-depblack">
<text class="text-cut text-white">电话:{{item.phone}}</text>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut text-white">公司:{{item.department}}</text>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut text-white">地址:{{item.address}}</text>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</van-action-sheet>