HKRentingMiniprogram/pages/appeal/appeal.wxml

<!--pages/appeal/appeal.wxml-->
<block wx:if="{{ !loding }}">
  <view class="container">
    <header-nav notShowIndex="true">申诉</header-nav>
    <!-- 申诉事项 -->
    <view class="appeal-matter">
      <view class="title">
        <view class="yellowDot"></view>申诉事项
      </view>
      <view class="appeal-box">
        <view class="appeal-item">
          <view>{{ matters }}</view>
          <image class="appeal-matter-img" src="/img/u5.svg" mode="widthFix"></image>
        </view>
      </view>
    </view>

    <!-- 联系方式 -->
    <view class="appeal-relation">
      <view class="title">
        <view class="yellowDot"></view>房源的联系方式
      </view>
      <view class="appeal-box">
        <view class="appeal-item" wx:if="{{ housingresource.wechatdata.url }}">
          <view class="relation-name">微信二维码</view>
          <image class="copy" bindtap="openQRCode" src="https://app.gter.net/image/miniApp/HKRenting/u16.svg"></image>
        </view>
        <view class="appeal-item" wx:if="{{ housingresource.wechat }}">
          <view class="relation-name">微信号</view>
          <text>{{ housingresource.wechat }}</text>
        </view>
        <view class="appeal-item" wx:if="{{ housingresource.whatsapp }}">
          <view class="relation-name">WhatsApp</view><text>{{housingresource.whatsapp }}</text>
        </view>
        <view class="appeal-item" wx:if="{{ housingresource.tel }}">
          <view class="relation-name">tel</view><text>{{housingresource.tel }}</text>
        </view>
      </view>
    </view>

    <!-- 申诉理由 -->
    <view class="appeal-reason">
      <view class="title">
        <view class="yellowDot"></view>申诉理由<text style="color: #c54235;margin-left: 10rpx;">*</text>
      </view>
      <view class="annotation">如果你需要举证某个房源，请提供房源ID，在房源底部复制即可，便于管理团队快速查看</view>
      <view class="appeal-box">
        <textarea class="reason-textarea" bindfocus="bindfocusfocus" bindblur="bindblurblur" focus="{{focusState}}" maxlength="200" placeholder="请输入" disable-default-padding="{{ true }}" bindinput="popUpInput" value="{{ complaintReason }}" cursor-spacing="40">
                <keyboard-accessory>
					<cover-view class="keyboard" catchtap="popUpNextStep" data-field="{{ item.field }}">
						<cover-view class="keyboard-view" bindtap="bindblurblur">完成</cover-view>
						<cover-view class="keyboard-view">{{ (200 - complaintReason.length) == 0 ? '0' : 200 - complaintReason.length || 200 }}</cover-view>
					</cover-view>
				</keyboard-accessory>
            </textarea>
        <view class="pageTextarea-numberwords">
          <block wx:if="{{ !focusState }}">{{ (200 - complaintReason.length) == 0 ? '0' : 200 - complaintReason.length || 200 }}</block>
        </view>
      </view>
    </view>

    <!-- 图片凭证 -->
    <view class="appeal-picture">
      <view class="title">
        <view class="yellowDot"></view>你可以上传图片凭证
      </view>
      <view class="picture-box">
        <view class="addPictureBtn-item" wx:for="{{ voucherPictureList }}" wx:key="index">
          <image class="addPictureBtn" mode="aspectFill" src="{{ item.url }}"></image>
          <view class="cross" bindtap="deletePicture" data-index="{{ index }}">
            <view class="g-right"></view>
          </view>
        </view>
        <view class="addPictureBtn" bindtap="addPicture" data-kind="proof" wx:if="{{ voucherPictureList.length < 6 }}">
          <image src="/img/u46.svg" mode="widthFix"></image>
        </view>
      </view>
    </view>

    <view class="appeal-yourContact">
      <view class="title">
        <view class="yellowDot"></view>你的联系方式（仅用于与官方客服联系）<text style="color: #c54235;margin-left: 10rpx;">*</text>
      </view>
      <view class="yourContact-option">
        <view class="yourContact-option-item {{ yourContactStata == 1 ? 'yourContact-option-item-selected' : ''}}" bindtap="cutSelected" data-index="1">
          <view wx:if="{{ yourContactStata != 1 }}" class="yourContact-option-unselected"></view>
          <image wx:else class="yourContact-option-selected" src="/img/u47_selected.svg"></image>
          微信号
        </view>

        <view class="yourContact-option-item {{ yourContactStata == 2 ? 'yourContact-option-item-selected' : ''}}" bindtap="cutSelected" data-index="2">
          <view wx:if="{{ yourContactStata != 2 }}" class="yourContact-option-unselected"></view>
          <image wx:else class="yourContact-option-selected" src="/img/u47_selected.svg"></image>
          上传微信二维码
        </view>

        <view class="yourContact-option-item {{ yourContactStata == 3 ? 'yourContact-option-item-selected' : ''}}" bindtap="cutSelected" data-index="3">
          <view wx:if="{{  yourContactStata != 3 }}" class="yourContact-option-unselected"></view>
          <image wx:else class="yourContact-option-selected" src="/img/u47_selected.svg"></image>
          电话号码
        </view>
      </view>
      <view wx:if="{{yourContactStata != 2}}" class="appeal-box"><input class="yourContact-input" placeholder="请输入" maxlength="30" model:value="{{ contactWayInput }}" /></view>
      <block wx:else>
        <view wx:if="{{ uploadQRCodeSendData.aid == 0 }}" class="addPictureBtn" bindtap="addPicture" data-kind="QRCode">
          <image src="/img/u46.svg" mode="widthFix"></image>
        </view>
        <block wx:else>
          <view class="addPictureBtn-item">
            <image class="addPictureBtn" mode="aspectFill" src="{{ uploadQRCodeSendData.src }}">
            </image>
            <view class="cross" bindtap="contactInformationwechatcut">
              <view class="g-right"></view>
            </view>
          </view>
        </block>
      </block>
    </view>

    <!-- 弹窗未关注服务号的 -->
    <view class="popup" wx:if="{{ popupState == 1 }}">
      <view class="popup-box">
        <view class="popup-top">
          <image class="popup-top-img" src="https://app.gter.net/image/miniApp/HKRenting/u97.png" mode="widthFix"></image>
          <text class="submitted">已提交</text>
        </view>
        <view class="attention-box">
          <text>请关注寄托服务号</text>
          <text>我们会尽快处理，并通过服务号通知你审核结果</text>
          <image class="qrcode" show-menu-by-longpress="true" src="{{ qrcode }}"></image>
          <view class="popup-hint">长按扫码即可关注</view>
        </view>
        <view class="popup-close" bindtap="close">关闭</view>
      </view>
    </view>

    <!-- 弹窗已关注服务号的 -->
    <view class="popup" wx:if="{{ popupState == 2 }}">
      <view class="popup-box">
        <view class="popup-top">
          <image class="popup-top-img" src="https://app.gter.net/image/miniApp/HKRenting/u97.png" mode="widthFix"></image>
          <text class="submitted">已提交</text>
        </view>

        <!-- 提交完成跳转 -->
        <view class="skip">
          <text>我们会尽快处理</text>
          <text>将通过寄托服务号通知你审核结果</text>
          <text>{{ skipTime }}秒后自动跳转</text>
        </view>
      </view>
    </view>

  </view>

  <view class="footer">
    <view class="footer-item" bindtap="abandon">放弃申诉</view>
    <view class="footer-item" bindtap="submit">提交审核</view>
  </view>
</block>

<view class="QRCode" wx:if="{{ QRCodeState }}">
  <image class="QRCode-img" mode="widthFix" show-menu-by-longpress="true" src="{{housingresource.wechatdata.url}}"></image>
  <view class="QRCodeClose" bindtap="openQRCode">
    <image class="QRCodeClose-img" src="/img/plusf.png"></image>
  </view>
</view>


<!-- 提示框 -->
<view class="promptDialog" wx:if="{{ promptDialogState }}">
  <view class="promptDialog-box">
    <view class="promptDialog-title">你的微信号有误</view>
    <view class="promptDialog-content">经核实，凡 wxid_ 开头的微信号均无法添加为好友，建议你上传微信二维码，或修改微信号。</view>
    <view class="promptDialog-btn" bindtap="bindPromptDialog">知道了</view>
  </view>
</view>