实现的是一个展示用户历史打卡数据,其中部分打卡有工作人员点评,而用户可以回复工作人员的点评(仅能回复一条)。
界面效果如下图所示:
简单记录整理一下这个界面的代码。
纠结很久的点在于如何做到像微信朋友圈那样,点击评论按键,弹出输入框和软键盘,并且输入框的位置刚好对准需要评论的内容底下。
我目前只实现了前半部分,输入框的位置还不能很好地对准内容组件的底部,并且使用感并不好,弹出收回输入框和软键盘的过程卡卡的。
后续还要不断优化。
<!-- wxml -->
<block wx:if="{
{items.length==0}}">
<view style="margin-top:40rpx; text-align:center;">暂无历史!</view>
</block>
<block wx:for="{
{items}}" wx:for-item="item" wx:for-index="index2" wx:key="id">
<view class="record">
<view class="record-item-history">
<view class='history-left'>
<view class='history-left-type'>{
{type[index2]}}</view>
<view class='history-left-date'>{
{date[index2][0]}}</view>
</view>
<view class="history-right">
<image src='{
{img[index2]}}' mode="aspectFill"></image>
<view class="history-right-memo">{
{memo[index2]}}</view>
<view class="history-right-pyq">
<view wx:if="{
{feedbacks[index2]==-1}}" style="color: rgb(95, 111, 144);">等待反馈</view>
<view wx:else class="history-right-pyq-doctor" bindtap="showReply" data-cid