<!--plan-new.wxml-->
<navigation-bar title="计划详情" back="{{true}}" color="black" background="white"></navigation-bar>

<view class="padder" />
<view class="card">
  <view class="status pending" wx:if="{{status === 'pending'}}">
    <text class="status-text">待审核</text>
    <image class="status-icon" src="{{ALI_OSS_ROOT}}/wx/right-circle-yellow.png" />
  </view>
  <view class="status approved" wx:elif="{{status === 'approved'}}">
    <text class="status-text">已通过</text>
    <image class="status-icon" src="{{ALI_OSS_ROOT}}/wx/right-circle-green.png" />
  </view>
  <view class="status denied" wx:elif="{{status === 'denied'}}">
    <text class="status-text">已驳回</text>
    <image class="status-icon" src="{{ALI_OSS_ROOT}}/wx/right-circle-red.png" />
  </view>
  <view class="status done" wx:elif="{{status === 'done'}}">
    <text class="status-text">已完成</text>
    <image class="status-icon" src="{{ALI_OSS_ROOT}}/wx/right-circle-green.png" />
  </view>
  <view class="card-essential">
    <view class="card-title">
      基础信息
    </view>
    <block wx:if="{{status === 'done'}}">
      <view class="box flex flex-between">
        <view class="box-item box-label">所属项目</view>
        <view class="box-item box-value">{{projectinfo.name}}</view>
      </view>
      <view class="box flex flex-between" >
        <view class="box-item box-label">计划日期</view>
        <view class="box-item box-value text-clamp-2">
          <block wx:for="{{dates}}" wx:for-item="d" wx:key="index">
            <text class="date">{{d}}</text>
          </block>
        </view>
      </view>
      <view class="box flex flex-between">
        <view class="box-item box-label">备注</view>
        <view class="box-item box-value">
          {{remark}}
        </view>
      </view>
    </block>
    <block wx:else>
      <view class="box flex flex-between"  bindtap="handleRedirectProject">
        <view class="box-item box-label">选择项目</view>
        <view class="box-item box-value">{{projectinfo.name || '请选择'}}</view>
        <view class="box-item box-icon">
          <image class="img-arrow" src="{{ALI_OSS_ROOT}}/wx/right-outlined.png" alt="" />
        </view>
      </view>
      <view class="box flex flex-between" data-attr="date"  bindtap="handleShow">
        <view class="box-item box-label">计划日期</view>
        <view class="box-item box-value" wx:if="{{dates.length === 0}}">请选择</view>
        <view class="box-item box-value text-clamp-2" wx:else>
          <block wx:for="{{dates}}" wx:for-item="d" wx:key="index">
            <text class="date">{{d}}</text>
          </block>
        </view>
        <view class="box-item box-icon">
          <image class="img-cal" src="{{ALI_OSS_ROOT}}/wx/calendar.png" alt="" />
        </view>
      </view>
      <view class="box flex flex-between">
        <view class="box-item box-label">备注</view>
        <view class="box-item box-value">
          <textarea class="value textarea-input" value="{{remark}}" data-attr="remark" bindinput="handleTicketInput" auto-height placeholder="请输入" />
        </view>
      </view>
      <view class="box flex flex-between" wx:if="{{status === 'denied'}}">
        <view class="box-item box-label">驳回原因</view>
        <view class="box-item box-value text-danger">{{reason}}</view>
      </view>
    </block>
  </view>
</view>

<view class="card">
  <view class="card-essential pad">
    <view class="card-title">
      常规检查
    </view>

    <view class="card-body">
      <t-checkbox-group t-class="box" data-attr="patrols" bind:change="handleCheckChange" value="{{patrolsSelected}}">
        <t-row gutter="16">
          <t-col span="12" wx:for="{{patrols}}" wx:for-item="item" wx:key="id">
            <t-checkbox block="{{false}}" icon="rectangle" value="{{item.id}}" label="{{item.name}}" />
          </t-col>
        </t-row>
      </t-checkbox-group>
    </view>
  </view>
</view>

<view class="card">
  <view class="card-essential pad">
    <view class="card-title">
      点位选择
    </view>

    <view class="card-body">
      <t-checkbox-group t-class="box" data-attr="points" bind:change="handleCheckChange" value="{{pointsSelected}}">
        <t-row gutter="16">
          <t-col span="12" wx:for="{{points}}" wx:for-item="item" wx:key="id">
            <t-checkbox block="{{false}}" icon="rectangle" value="{{item.id}}" label="{{item.name}}" />
          </t-col>
        </t-row>
      </t-checkbox-group>
    </view>
  </view>
</view>

<view class="btn flex flex-v-center">
  <block wx:if="{{ status == 'denied' }}">
    <t-button class="btn-item submit" theme="primary" size="large" bindtap="doneSubmit" loading="{{btnLoading}}">提交</t-button>
  </block>
  <block wx:else>
    <t-button class="btn-item save {{operator.disabledBtn ? 'disabled' : ''}}" data-attr="reject" theme="primary" size="large" variant="outline" bindtap="handleShow" loading="{{btnStatus == 'denied' && btnLoading}}" disabled="{{operator.disabledBtn}}">驳回</t-button>
    <t-button class="btn-item submit {{operator.disabledBtn ? 'disabled' : ''}}" data-status="done" theme="primary" size="large" bindtap="doneApprove" loading="{{btnStatus == 'done' && btnLoading}}" disabled="{{operator.disabledBtn}}">通过</t-button>
  </block>
</view>
<view class="padder" />
<view class="padder" />

<t-image-viewer
  showIndex="{{true}}"
  visible="{{previewVisible}}"
  images="{{previewImages}}"
  bind:close="onPreviewClose"
></t-image-viewer>

<date-picker visible="{{dateVisible}}" bind:hide="handleDateSelect" dates="{{dates}}" />

<t-popup visible="{{rejectVisible}}" placement="bottom">
  <view class="popup short">
    <view class="popup-title flex flex-v-center flex-between">
      <view class="popup-btn" data-attr="reject" bindtap="handleHide">Cancel</view>
      <view class="popup-txt">驳回原因</view>
      <view class="popup-btn" data-attr="reject" bindtap="doneReject">Confirm</view>
    </view>
    <view class="popup-search">
      <textarea class="popup-textarea-input" value="{{reason}}" data-attr="reason" bindinput="handleTicketInput" auto-height placeholder="请输入驳回原因" />
    </view>
  </view>
</t-popup>

<t-picker
  visible="{{propertyVisible}}"
  value="{{property}}"
  data-key="property"
  title="项目属性"
  cancelBtn="取消"
  confirmBtn="确认"
  bindchange="onPickerChange"
  bindcancel="onPickerCancel"
  bindconfirm="onPickerConfirm"
>
  <t-picker-item options="{{propOptions}}" />
</t-picker>