<!--packageD/mycomponent/invoice-pop/invoice-pop.wxml-->

<view class="invoice" wx:if="{{pluginShow}}" catchtap="setPopShow">
  <view class="left">
    <view class="span">发票</view>
  </view>
  <view class="right">
    <van-icon name="arrow" color="#333" size='32rpx' />
  </view>
</view>


<van-popup show="{{popShow}}" position="bottom" round bind:close="setPopShow">

  <view class="invoice-pop">
    <view class="invoice-title">
      <view class="title-text">发票</view>
      <view class="title-right">
        <i class="iconfont icon-fontclass-gantanhao"></i>
        <text class="text" bindtap="setExplainShow">发票须知</text>
        <i bindtap="setPopShow" class="iconfont icon-guanbi"></i>
      </view>
    </view>
    <view class="invoice-container">

      <view class="invoice-tabs">
        <view class="blod-title">发票类型</view>
        <view class="tabs-items">
          <view class="tabs-item {{item.value==invoice_type_index ? 'active' : ''}}" data-value="{{item.value}}" data-name="invoice_type_index" bindtap="setTabsIndex" wx:for="{{invoice_type_arr}}" wx:key="value">{{item.name}}</view>
        </view>
      </view>

      <view class="invoice-desc-text">平台启用电子发票，与纸质发票具备同等法律效力。</view>

      <view class="invoice-tabs" style="margin-top:48rpx;">
        <view class="blod-title">发票抬头</view>
        <view class="tabs-items" wx:if="{{invoice_type_index!=2}}">
          <view class="tabs-item {{item.value==invoice_header_index ? 'active' : ''}}" data-value="{{item.value}}" data-name="invoice_header_index" bindtap="setTabsIndex" wx:for="{{invoice_header_arr}}" wx:key="value">{{item.name}}</view>
        </view>
      </view>

      <block>
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao"></i>
          <view class="field-cell-title">{{(invoice_header_index == 0 || invoice_type_index==2) ? '单位' : '发票抬头'}}</view>
          <input model:value="{{collect_name}}" type="text" data-name="collect_name" bindblur="inputBlur" bindfocus="inputFocus" placeholder="{{(invoice_header_index == 0 || invoice_type_index==2) ? '请填写单位名称' : '请填写需要开具发票的姓名'}}" />
          <icon size="16px" wx:if="{{inputFocusName=='collect_name' && collect_name}}" catch:touchstart="clearInputText" data-name="collect_name" class="iconfont icon-adsystem_icon_cancle"></icon>

          <view  class="fa-angle-right-box" wx:if="{{collect_name==''}}" bindtap="setInvoiceHeaderListShow">
            <block wx:if="{{invoice_header_index == 0 || invoice_type_index==2}}">
              <i class="fa fa-angle-right" wx:if="{{invoice_header_list && invoice_header_list.company && invoice_header_list.company.length}}" style="font-size:22px;"></i>
            </block>
            <block wx:else>
              <i class="fa fa-angle-right" wx:if="{{invoice_header_list && invoice_header_list.personal && invoice_header_list.personal.length}}" style="font-size:20px;"></i>
            </block>
          </view>

        </view>
      </block>

      <block wx:if="{{invoice_header_index==0 || invoice_type_index==2}}">
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao"></i>
          <view class="field-cell-title">税号</view>
          <input model:value="{{gmf_taxpayer}}" type="text" placeholder="请填写纳税人识别号" data-name="gmf_taxpayer" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='gmf_taxpayer' && gmf_taxpayer}}" catch:touchstart="clearInputText" data-name="gmf_taxpayer" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
        <view class="split-line" wx:if="{{invoice_type_index!=2}}" style="margin-top:40rpx;margin-bottom:-17rpx;"></view>
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao" wx:if="{{invoice_type_index==2}}"></i>
          <view class="field-cell-title">开户银行</view>
          <input model:value="{{gmf_bank}}" type="text" placeholder="请填写单位开户银行{{invoice_type_index!=2 ? '(选填)' : ''}}" data-name="gmf_bank" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='gmf_bank' && gmf_bank}}" catch:touchstart="clearInputText" data-name="gmf_bank" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao" wx:if="{{invoice_type_index==2}}"></i>
          <view class="field-cell-title">银行账号</view>
          <input model:value="{{gmf_bank_admin}}" type="text" placeholder="请填写单位银行账号{{invoice_type_index!=2 ? '(选填)' : ''}}" data-name="gmf_bank_admin" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='gmf_bank_admin' && gmf_bank_admin}}" catch:touchstart="clearInputText" data-name="gmf_bank_admin" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao" wx:if="{{invoice_type_index==2}}"></i>
          <view class="field-cell-title">注册地址</view>
          <input model:value="{{gmf_address}}" type="text" placeholder="请填写注册地址{{invoice_type_index!=2 ? '(选填)' : ''}}" data-name="gmf_address" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='gmf_address' && gmf_address}}" catch:touchstart="clearInputText" data-name="gmf_address" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
        <view class="field-cell" style="margin-top:51rpx;">
          <i class="iconfont icon-fontclass-xinghao" wx:if="{{invoice_type_index==2}}"></i>
          <view class="field-cell-title">注册电话</view>
          <input model:value="{{gmf_mobile}}" type="text" placeholder="请填写注册电话{{invoice_type_index!=2 ? '(选填)' : ''}}" data-name="gmf_mobile" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='gmf_mobile' && gmf_mobile}}" catch:touchstart="clearInputText" data-name="gmf_mobile" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
      </block>


      <view class="blod-title" style="margin-top:49rpx;">收票人信息</view>

      <!-- 电子发票显示 -->
      <block wx:if="{{invoice_type_index==0}}">
        <view class="field-cell" style="margin-top:51rpx;">
          <view class="field-cell-title">手机号</view>
          <input model:value="{{col_mobile}}" type="text" placeholder="请输入手机号(选填)" data-name="col_mobile" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='col_mobile' && col_mobile}}" catch:touchstart="clearInputText" data-name="col_mobile" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
        <view class="field-cell" style="margin-top:51rpx;">
          <view class="field-cell-title">邮箱</view>
          <input model:value="{{email}}" type="text" placeholder="请填入邮箱(选填)" data-name="email" bindblur="inputBlur" bindfocus="inputFocus" />
          <i wx:if="{{inputFocusName=='email' && email}}" catch:touchstart="clearInputText" data-name="email" class="iconfont icon-adsystem_icon_cancle"></i>
        </view>
      </block>

      <block wx:if="{{invoice_type_index==1 || invoice_type_index==2}}">
        <view class="address" bindtap="openAddList">
          <view class="address-container">
            <view wx:if="{{!address}}" class="address-placeholder">请选择收票地址</view>
            <block wx:if="{{address}}">
              <view class="address-name">{{address.realname}}/{{address.mobile}}</view>
              <view class="address-text">收票地址：{{address.col_address}}</view>
            </block>

          </view>
          <i class="iconfont icon-advertise-next"></i>
        </view>
      </block>

      <!-- 专用发票 invoice_type_index=3 不显示 -->
      <block wx:if="{{invoice_type_index !=2}}">
        <view class="invoice-tabs" style="margin-top:49rpx;">
          <view class="blod-title">发票内容</view>
          <view class="tabs-items">
            <view class="tabs-item {{item.value==invoice_content_index ? 'active' : ''}}" data-value="{{item.value}}" data-name="invoice_content_index" bindtap="setTabsIndex" wx:for="{{invoice_content_arr}}" wx:key="value">{{item.name}}</view>
          </view>
        </view>

        <view class="invoice-desc-text">发票金额为实际支付金额，不含折扣，优惠等扣减金额</view>
      </block>

    </view>
    <view class="invoice-btn-wrapper">
      <view class="invoice-btn-item" bindtap="send">确定</view>
    </view>
  </view>

</van-popup>



<van-popup show="{{explainShow}}" position="bottom" closeable round bind:close="setExplainShow">
  <view class="explain">
    <view class="explain-title">
      发票须知
    </view>
    <view class="explain-container">
      <!-- <rich-text nodes="{{invoice_explain}}"></rich-text> -->
      <mp-html style="width: 100%;" content="{{invoice_explain}}"></mp-html>
    </view>
    <view class="explain-btn-wrapper">
      <view class="explain-btn-item" bindtap="setExplainShow">我知道了</view>
    </view>
  </view>
</van-popup>

<van-popup show="{{invoice_header_list_show}}" position="bottom" closeable round bind:close="setInvoiceHeaderListShow">
  <view class="explain">
    <view class="explain-title">
      发票抬头
    </view>
    <view class="invoice-header-list-container">
      <block wx:if="{{invoice_header_index == 0 || invoice_type_index==2}}">
        <view class="item" wx:for="{{invoice_header_list.company}}" wx:key="index" data-content="{{item}}" bindtap="setInvoiceHeader">{{item.collect_name}}</view>
      </block>
      <block wx:else>
        <view class="item" wx:for="{{invoice_header_list.personal}}" wx:key="index" data-content="{{item}}" bindtap="setInvoiceHeader">{{item.collect_name}}</view>
      </block>
    </view>
    <!-- <view class="explain-btn-wrapper">
      <view class="explain-btn-item" bindtap="setExplainShow">我知道了</view>
    </view> -->
  </view>
</van-popup>