<template>
  <div class="page">
    <Modal v-model="showImage" width="60%" :styles="{top: '20px'}" footer-hide>
      <img :src="path" v-if="showImage" style="width: 100%" />
    </Modal>

    <div class="header">{{ formInfo.creator }}提交的{{ formInfo.title }}</div>
    <div class="content">
      <div v-for="(item, index) in formInfo.formList" :key="index">
        <div
          v-if="item.set.control == 'datepicker' && item.set.type == 'range'"
        >
          <div class="title">
            {{ item.set.title }}
          </div>
          <div class="info">
            {{ item.set.start }}
            <span v-if="item.set.isTil">{{
              " " + dateDay[item.set.startIndex].title
            }}</span>
          </div>

          <div class="title">
            {{ item.set.title2 }}
          </div>
          <div class="info">
            {{ item.set.end }}
            <span v-if="item.set.isTil">{{
              " " + dateDay[item.set.endIndex].title
            }}</span>
          </div>

          <div v-if="item.set.isDuration">
            <div class="title">
              {{
                item.set.timeLongTitle +
                (item.set.unit == "datetime" ? "（小时）" : "（天）")
              }}
            </div>
            <div class="info">
              {{ getInfo(item.set) }}
            </div>
          </div>
        </div>
        <div v-else>
          <div class="title">
            {{ item.set.title }}
          </div>
          <div class="info" v-if="item.set.control == 'upload'">
            <Row class="filelist" :gutter="32">
              <Col
                v-if="
                  item.set.type == null ||
                  item.set.type.length == 0 ||
                  item.set.type == 'image'
                "
                :span="6"
                v-for="(image, indexi) in getInfo(item.set)"
                :key="indexi"
              >
                <div class="cameraadd">
                  <img
                    :src="image"
                    mode="aspectFill"
                    @click="preImage(image)"
                  />
                </div>
              </Col>

              <Col
                v-else-if="item.set.type == 'file'"
                :span="24"
                v-for="(file, indexi) in getInfo(item.set)"
                :key="indexi"
              >
                <!-- @click="preFile(file)" -->
                <div class="fileInfo">
                  <img :src="getFileIcon(file.fullPath)" />
                  <!-- <div class="name">{{ file.name }}</div> -->
                  <a :href="file.fullPath" :download="file.name">{{
                    file.name
                  }}</a>
                </div>
              </Col>
            </Row>
          </div>
          <div class="info" v-else-if="item.set.control == 'xb_editor'">
            <p v-html="getInfo(item.set)"></p>
          </div>
          <div class="info" v-else style="white-space:pre-wrap">
            {{ getInfo(item.set) }}
          </div>
        </div>
      </div>
    </div>

    <image
      v-if="form.type != 2"
      class="icon"
      :src="getIcon(formInfo.status, formInfo.action)"
      mode="aspectFit"
    />

    <div
      class="flow"
      v-if="form.type != 2 && formInfo.flows && formInfo.flows.length > 0"
    >
      <div class="title">流程</div>
      <div class="content_form">
        <div v-for="(item, index) in formInfo.flows" :key="index">
          <div class="flowItem">
            <div class="" style="position: relative">
              <image
                class="tx"
                src="../../../static/tx.png"
                mode="widthFix"
              ></image>
              <image
                class="tagIcon"
                :src="getFlowType(item.status, item.actoins)"
                mode="widthFix"
              >
              </image>
              <div class="line"></div>
            </div>
            <div class="flowcontent">
              <div class="header_flow">
                <div>
                  {{ item.flowTitle }}
                </div>
                <div class="time">
                  {{ dateFormatter(item.createTime) }}
                </div>
              </div>
              <div class="nameList">
                <div
                  class="name"
                  v-for="(user, i) in formatterFlow(
                    item.status,
                    item.actoins,
                    item.flowType,
                    item.users
                  )"
                  :key="i"
                >
                  {{ user.title }}
                  <Icon
                    type="ios-close"
                    v-if="
                      user.isSelfSelect &&
                      item.index > flow.index &&
                      (flow.flowType == 1 || flow.flowType == 3)
                    "
                    @click="removeUser(i, index, item)"
                  />
                </div>
                <Yn-multipeo
                  v-if="
                    item.ccSelfSelectFlag &&
                    item.index > flow.index &&
                    (flow.flowType == 1 || flow.flowType == 3)
                  "
                  identity="admin"
                  @on-select="selectObj(item, arguments)"
                  :targetList="targetList"
                  title="自选人员"
                ></Yn-multipeo>
              </div>
            </div>
          </div>
        </div>
        <div v-if="formInfo.status == 1">
          <div class="flowItem" style="align-items: center">
            <div class="">
              <image
                class="tx"
                src="https://www.rayscloud.cn/oa/tag/ty_icon.png"
                mode="widthFix"
              ></image>
            </div>
            <div class="flowcontent">
              <div class="header_flow">
                <div>完成</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="exam_mark flow" v-if="flow.flowType == 1 || flow.flowType == 3">
      <Input
        type="textarea"
        v-model="mark"
        :placeholder="flow.flowType == 1 ? '请输入审核意见' : '请输入办理说明'"
      >
      </Input>
    </div>

    <div class="demo-drawer-footer">
      <div v-if="flow.flowType == 1" class="exam">
        <Button type="error" :loading="loading" class="btn" @click="exam(3)">拒绝</Button>
        <Button type="primary" :loading="loading"  class="btn" @click="exam(2)">同意</Button>
      </div>
      <!-- 办理功能 -->
      <div v-if="flow.flowType == 3" class="exam">
        <!-- <button type="warn" class="btn" @click="exam(6)">拒绝办理</button> -->
        <Button type="primary" :loading="loading"  class="btn" @click="exam(5)">完成</Button>
      </div>
    </div>
  </div>
</template>

<script>
import "./index.less";
import index from "./index.js";
export default index;
</script>
