<template>
  <div class="app-container">
    <el-form
      v-show="showSearch"
      ref="queryForm"
      class="queryFrom"
      :model="queryParams"
      size="small"
      :inline="true"
      label-width="68px"
    >
      <el-form-item label="姓名" prop="xm" class="query">
        <el-input
          v-model="queryParams.xm"
          placeholder="请输入姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="学号" prop="xh" class="query">
        <el-input
          v-model="queryParams.xh"
          placeholder="请输入学号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="审核状态" prop="status" class="query">
        <el-select
          v-model="queryParams.status"
          clearable
          placeholder="请选择"
          @change="handleQuery"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="学年" prop="applyYear" label-width="100px">
        <el-select v-model="queryParams.applyYear" clearable placeholder="请选择" @change="handleQuery">
          <el-option
            v-for="item in yearOptions"
            :key="item.stuYearName"
            :label="item.stuYearName"
            :value="item.stuYearName"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
        >搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <!--   v-hasPermi="['system:record:export']" -->
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
        >导出</el-button>
      </el-col>
      <right-toolbar
        :show-search.sync="showSearch"
        @queryTable="getList"
      />
    </el-row>

    <el-table
      v-loading="loading"
      :data="list"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="学年" align="center" prop="applyYear" />
      <el-table-column label="申请人" align="center" prop="xm" />
      <el-table-column label="学号" align="center" prop="xh" />
      <el-table-column label="学院" align="center" prop="xy" />
      <el-table-column label="专业" align="center" prop="zy" />
      <el-table-column label="班级" align="center" prop="bj" />
      <el-table-column label="辅导员审核" align="center" prop="status1">
        <template slot-scope="scope">
          <span v-if="scope.row.status1 == '拒绝'" style="color: #f56c6c">拒绝</span>

          <span v-else-if="scope.row.status1 == '通过'">
            <div v-if="scope.row.bjyjdj == '1'" style="color: #67c23a">
              一等国家助学金
            </div>
            <div v-else-if="scope.row.bjyjdj == '2'" style="color: #67c23a">
              二等国家助学金
            </div>
            <div v-else-if="scope.row.bjyjdj == '3'" style="color: #67c23a">
              三等国家助学金
            </div>
            <div v-else>未审核</div>
          </span>

          <span v-else-if="scope.row.status1 == '驳回'" style="color: #e6a23c">驳回
          </span>
          <span v-else>未审核</span>
        </template>
      </el-table-column>
      <el-table-column label="二级学院审核" align="center" prop="status2">
        <template slot-scope="scope">
          <span v-if="scope.row.status2 == '拒绝'" style="color: #f56c6c">拒绝</span>
          <span v-else-if="scope.row.status2 == '通过'">
            <div v-if="scope.row.ejxyyjdj == '1'" style="color: #67c23a">
              一等国家助学金
            </div>
            <div v-else-if="scope.row.ejxyyjdj == '2'" style="color: #67c23a">
              二等国家助学金
            </div>
            <div v-else-if="scope.row.ejxyyjdj == '3'" style="color: #67c23a">
              三等国家助学金
            </div>
            <div v-else>未审核</div>
          </span>
          <span v-else-if="scope.row.status2 == '驳回'" style="color: #e6a23c">驳回
          </span>
          <span v-else>未审核</span>
        </template>
      </el-table-column>
      <el-table-column label="学校意见" align="center" prop="status3">
        <template slot-scope="scope">
          <span v-if="scope.row.status3 == '拒绝'" style="color: #f56c6c">拒绝</span>
          <span v-else-if="scope.row.status3 == '通过'">
            <div v-if="scope.row.zzdj == '1'" style="color: #67c23a">
              一等国家助学金
            </div>
            <div v-else-if="scope.row.zzdj == '2'" style="color: #67c23a">
              二等国家助学金
            </div>
            <div v-else-if="scope.row.zzdj == '3'" style="color: #67c23a">
              三等国家助学金
            </div>
            <div v-else>未审核</div>
          </span>
          <span v-else-if="scope.row.status3 == '驳回'" style="color: #e6a23c">驳回
          </span>
          <span v-else>未审核</span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="当前步骤" align="center" prop="status">
          <template slot-scope="scope">
            <span v-if="scope.row.step == 0">学生提交</span>
            <span v-if="scope.row.step == 1">学生提交</span>
            <span v-if="scope.row.step == 2">辅导员审核 </span>
            <span v-if="scope.row.step == 3">二级学院审核</span>
            <span v-if="scope.row.step == 4"> 学校意见</span>
          </template>
      </el-table-column> -->
      <!-- <el-table-column label="状态" align="center" prop="status">
           <template slot-scope="scope">
            <span v-if="scope.row.status == 0" style="color:#F56C6C;">拒绝</span>
             <span v-if="scope.row.status == 1 && scope.row.step ==1" style="color:#67C23A;">学生提交</span>
            <span v-if="scope.row.status == 1 && scope.row.step !=1" style="color:#67C23A;">通过</span>
            <span v-if="scope.row.status == 2" style="color:#E6A23C;">驳回 </span>
          </template>
      </el-table-column> -->
      <el-table-column label="处分是否解除" align="center">
        <template slot-scope="scope">
          <span v-if="scope.row.penaltyStatus0 == 1" style="color: red">否</span>
          <span v-else-if="scope.row.penaltyStatus1 == 1">是</span>
          <!-- <span  v-else-if="scope.row.penaltyStatus3 == 3 ">处分申请中</span> -->
          <span v-else>无处分记录</span>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="handleDetail(scope.row)">审批详情</el-button>

          <el-button
            v-if="scope.row.step >= 2 || scope.row.step == -1"
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleRevoke(scope.row)"
          >撤回</el-button>

          <!-- <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['system:record:edit']"
          >修改</el-button>
          
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:record:remove']"
          >删除</el-button> -->

          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="openEditSqly(scope.row)"
          >修改申请理由</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改【请填写功能名称】对话框 -->
    <el-dialog
      class="dialog"
      :title="title"
      :visible.sync="open"
      fullscreen
      :close-on-click-modal="false"
      append-to-body
    >
      <el-row :gutter="20" class="dialog-body">
        <el-col :span="12" class="dialog-content">
          <el-scrollbar style="height: 100%">
            <el-form
              ref="formData"
              :disabled="true"
              :model="formData"
              label-width="0px"
              size="mini"
            >
              <table id="apply" class="full-width">
                <!-- 姓名性别民族 -->
                <!-- <tr>
                <td colspan="13" style="border: 0px">
                  <h1>广西水利电力职业技术学院国家助学金申请表</h1>
                </td>
              </tr> -->
                <tr>
                  <td class="table-label" rowspan="4">基本信息</td>
                  <td class="table-label">姓名</td>
                  <td class="table-input">
                    <el-form-item prop="xm">
                      <el-input
                        v-model="formData.xm"
                        placeholder="请输入内容"
                      />
                    </el-form-item>
                  </td>
                  <td class="table-label">性别</td>
                  <td class="table-input">
                    <el-form-item prop="xb">
                      <el-input
                        v-model="formData.xb"
                        placeholder="请输入内容"
                      />
                    </el-form-item>
                  </td>

                  <td class="table-label">民族</td>
                  <td class="table-input">
                    <el-form-item prop="mz" :rules="rules">
                      <el-select
                        v-model="formData.mz"
                        filterable
                        placeholder="请选择"
                      />
                    </el-form-item>
                  </td>

                  <td class="image-input" rowspan="3">
                    <img :src="baseurl + formData.zp" class="avatar">
                  </td>
                </tr>
                <!-- 政治面貌学号入学时间 -->
                <tr>
                  <td class="table-label">政治面貌</td>
                  <td class="table-input">
                    <el-form-item prop="zzmm" :rules="rules">
                      <el-select v-model="formData.zzmm" placeholder="政治面貌">
                        <el-option label="群众" value="群众" />
                        <el-option
                          label="共青团员"
                          value="共青团员"
                        />
                        <el-option label="党员" value="党员" />
                      </el-select>
                    </el-form-item>
                  </td>
                  <td class="table-label">学号</td>
                  <td class="table-input">
                    <el-form-item prop="xh" :rules="rules">
                      <el-input
                        v-model="formData.xh"
                        placeholder="请输入内容"
                      />
                    </el-form-item>
                  </td>

                  <td class="table-label">入学时间</td>
                  <td class="table-input date">
                    <el-form-item prop="rxsj" :rules="rules">
                      <el-date-picker
                        v-model="formData.rxsj"
                        type="month"
                        :editable="false"
                        format="yyyy-MM"
                        placeholder="选择日期"
                      />
                      <!-- <el-input v-model="formData.rxsj" placeholder="请输入内容"></el-input> -->
                    </el-form-item>
                  </td>
                </tr>
                <!-- 出生年月电话年级-->
                <tr>
                  <td class="table-label">出生年月</td>
                  <td class="table-input date">
                    <el-form-item prop="csny" :rules="rules">
                      <el-date-picker
                        v-model="formData.csny"
                        format="yyyy-MM"
                        type="month"
                        :editable="false"
                        placeholder="选择日期"
                      />
                    </el-form-item>
                  </td>
                  <td class="table-label">电话</td>
                  <td class="table-input">
                    <el-form-item prop="dh" :rules="rules">
                      <el-input
                        v-model="formData.dh"
                        placeholder="请输入内容"
                      />
                    </el-form-item>
                  </td>

                  <td class="table-label">年级</td>
                  <td class="table-input">
                    <el-form-item prop="nj" :rules="rules">
                      <el-input
                        v-model="formData.nj"
                        placeholder="请输入内容"
                      />
                    </el-form-item>
                  </td>
                </tr>
                <!-- 学院 - 专业 - 班级信息 -->
                <tr>
                  <td class="table-input" colspan="7">
                    <div class="class-info">
                      <div>
                        <div class="xy">
                          <el-form-item prop="xy" :rules="rules">
                            <el-input
                              v-model="formData.xy"
                              placeholder="请输入内容"
                            />
                          </el-form-item>
                        </div>
                        <span>学院</span>
                      </div>
                      <div>
                        <div class="zy">
                          <el-form-item prop="zy" :rules="rules">
                            <el-input
                              v-model="formData.zy"
                              placeholder="请输入内容"
                            />
                          </el-form-item>
                        </div>
                        <span>专业</span>
                      </div>
                      <div>
                        <div class="bj">
                          <el-form-item prop="bj" :rules="rules">
                            <el-input
                              v-model="formData.bj"
                              placeholder="请输入内容"
                            />
                          </el-form-item>
                        </div>
                        <span>班级</span>
                      </div>
                    </div>
                  </td>
                </tr>
                <!-- 资助历史 -->
                <tr>
                  <td class="table-label" colspan="3">
                    前一段时间收到何等资助
                  </td>
                  <td class="table-input" colspan="5">
                    <div>
                      <el-form-item prop="zzls" :rules="rules">
                        <el-input
                          v-model="formData.zzls"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                </tr>
                <!-- 困难类型 -->
                <tr class="type">
                  <td class="table-label">困难类型</td>
                  <td class="table-input table-align-left" colspan="7">
                    <div>
                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'1'">脱贫家庭学生</el-radio>
                          </el-radio-group>
                        </div>
                        <div v-show="formData.knlx == '1'">
                          <span style="margin-right: 10px">脱贫年份: </span>
                          <el-radio-group v-model="formData.knlx2">
                            <el-radio :label="'1'">2014年/2015年</el-radio>
                            <el-radio :label="'2'">2016年</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>
                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'2'">监测对象家庭学生</el-radio>
                          </el-radio-group>
                        </div>
                        <div v-show="formData.knlx == '2'">
                          <el-radio-group v-model="formData.knlx2">
                            <el-radio :label="'1'">脱贫不稳定家庭学生</el-radio>
                            <el-radio :label="'2'">边缘易致贫家庭学生</el-radio>
                            <el-radio :label="'3'">突发严重困难家庭学生</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>
                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'3'">最低生活保障家庭学生</el-radio>
                          </el-radio-group>
                        </div>

                        <div v-show="formData.knlx == '3'">
                          <el-radio-group v-model="formData.knlx2">
                            <el-radio :label="'1'">城市</el-radio>
                            <el-radio :label="'2'">农村</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>

                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="4">特困救助供养学生</el-radio>
                          </el-radio-group>
                        </div>

                        <div v-show="formData.knlx == '4'">
                          <el-radio-group v-model="formData.knlx2">
                            <el-radio :label="'1'">城市</el-radio>
                            <el-radio :label="'2'">农村</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>

                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'5'">家庭经济困难残疾学生</el-radio>
                          </el-radio-group>

                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'6'">家庭经济困难残疾人子女</el-radio>
                          </el-radio-group>
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'7'">孤儿</el-radio>
                          </el-radio-group>

                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'8'">事实无人抚养儿童</el-radio>
                          </el-radio-group>
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'9'">烈士子女</el-radio>
                          </el-radio-group>

                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'10'">建档困难职工家庭学生</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>
                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'11'">低收入对象</el-radio>
                          </el-radio-group>
                        </div>
                        <div v-show="formData.knlx == '11'">
                          <el-radio-group v-model="formData.knlx2">
                            <el-radio :label="'1'">低保边缘家庭学生</el-radio>
                            <el-radio :label="'2'">支出型困难家庭学生</el-radio>
                          </el-radio-group>
                        </div>
                      </el-row>

                      <el-row class="radio-group-row">
                        <div class="radio-group">
                          <el-radio-group v-model="formData.knlx">
                            <el-radio :label="'12'">其他家庭经济困难学生</el-radio>
                          </el-radio-group>
                        </div>
                        <div v-show="formData.knlx == '12'">
                          （请简述原因）
                          <el-input
                            v-model="formData.knlx2"
                            placeholder="请输入内容"
                          />
                        </div>
                      </el-row>
                    </div>
                  </td>
                </tr>
                <!-- 困难等级 -->
                <tr>
                  <td class="table-label">困难等级</td>
                  <td class="table-input table-align-left" colspan="7">
                    <div>
                      <el-form-item prop="kndj" :rules="rules">
                        <el-radio-group v-model="formData.kndj">
                          <el-radio :label="'1'">特别困难</el-radio>
                          <el-radio :label="'2'">比较困难</el-radio>
                          <el-radio :label="'3'">一般困难</el-radio>
                        </el-radio-group>
                      </el-form-item>
                    </div>
                  </td>
                </tr>
                <!-- 家庭经济情况 -->
                <tr>
                  <td class="table-label" rowspan="4">家庭经济情况</td>
                </tr>
                <tr>
                  <td class="table-label" colspan="2">家庭人口总数</td>
                  <td class="table-input" colspan="5">
                    <div>
                      <el-form-item>
                        <el-input
                          v-model="formData.rkzs"
                          prop="rkzs"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="table-label" colspan="2">家庭月总收入</td>
                  <td class="table-input" colspan="1">
                    <div>
                      <el-form-item prop="yzsr" :rules="rules">
                        <el-input
                          v-model="formData.yzsr"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                  <td class="table-label" colspan="1">人均月收入</td>
                  <td class="table-input" colspan="1">
                    <div>
                      <el-form-item prop="rjyr" :rules="rules">
                        <el-input
                          v-model="formData.rjyr"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                  <td class="table-label" colspan="1">收入来源</td>
                  <td class="table-input" colspan="1">
                    <div>
                      <el-form-item prop="srly" :rules="rules">
                        <el-input
                          v-model="formData.srly"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="table-label" colspan="2">家庭详细地址</td>
                  <td class="table-input" colspan="3">
                    <div>
                      <el-form-item prop="dz" :rules="rules">
                        <el-input
                          v-model="formData.dz"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                  <td class="table-label" colspan="1">邮编</td>
                  <td class="table-input" colspan="1">
                    <div>
                      <el-form-item prop="yb" :rules="rules">
                        <el-input
                          v-model="formData.yb"
                          placeholder="请输入内容"
                        />
                      </el-form-item>
                    </div>
                  </td>
                </tr>
                <!-- 申请理由 -->
                <tr>
                  <td class="table-label">申请理由</td>
                  <td class="table-input" colspan="7">
                    <div>
                      <div class="content">
                        <el-form-item prop="sqly">
                          <el-input
                            v-model="formData.sqly"
                            type="textarea"
                          />
                        </el-form-item>
                      </div>
                      <div class="signature">
                        <div>
                          <span>签名：</span>
                          <img
                            v-if="formData.xsqm"
                            :src="baseurl + formData.xsqm"
                            class="signature-img"
                          >
                        </div>
                        <div>
                          {{ this.formData.xsqmrq }}
                        </div>
                      </div>
                    </div>
                  </td>
                </tr>

                <!-- 家庭成员情况 -->
                <tr>
                  <td class="table-label">家庭成员情况</td>
                  <td colspan="7" style="padding: 0px">
                    <el-table
                      style="width: 100%"
                      :data="formData.jtcyObj"
                      width="100%"
                      :border="true"
                      align="center"
                      element-loading-text="数据加载中..."
                    >
                      <el-table-column
                        label="姓名"
                        header-align="center"
                        min-width="120"
                      >
                        <template slot-scope="{ row, $index }">
                          <el-form-item
                            label-width="0px"
                            :prop="'jtcyObj[' + $index + '].xm'"
                            :rules="rules"
                          >
                            <el-input
                              v-model="row.xm"
                              placeholder="请输入姓名"
                            />
                          </el-form-item>
                        </template>
                      </el-table-column>
                      <el-table-column
                        label="年龄"
                        header-align="center"
                        min-width="120"
                      >
                        <template slot-scope="{ row, $index }">
                          <el-form-item
                            label-width="0px"
                            :prop="'jtcyObj[' + $index + '].nl'"
                            :rules="rules"
                          >
                            <el-input
                              v-model="row.nl"
                              placeholder="年龄"
                            />
                          </el-form-item>
                        </template>
                      </el-table-column>
                      <el-table-column
                        label="与本人关系"
                        header-align="center"
                        min-width="120"
                      >
                        <template slot-scope="{ row, $index }">
                          <el-form-item
                            label-width="0px"
                            :prop="'jtcyObj[' + $index + '].gx'"
                            :rules="rules"
                          >
                            <el-input
                              v-model="row.gx"
                              placeholder="与本人关系"
                            />
                          </el-form-item>
                        </template>
                      </el-table-column>
                      <el-table-column
                        label="学习或工作单位"
                        header-align="center"
                        min-width="120"
                      >
                        <template slot-scope="{ row, $index }">
                          <el-form-item
                            label-width="0px"
                            :prop="'jtcyObj[' + $index + '].dw'"
                            :rules="rules"
                          >
                            <el-input
                              v-model="row.dw"
                              placeholder="学习或工作单位"
                            />
                          </el-form-item>
                        </template>
                      </el-table-column>
                      <el-table-column
                        label="联系电话"
                        header-align="center"
                        min-width="120"
                      >
                        <template slot-scope="{ row, $index }">
                          <el-form-item
                            label-width="0px"
                            :prop="'jtcyObj[' + $index + '].lxdh'"
                            :rules="rules"
                          >
                            <el-input
                              v-model="row.lxdh"
                              placeholder="联系电话"
                            />
                          </el-form-item>
                        </template>
                      </el-table-column>
                    </el-table>
                  </td>
                </tr>
                <!-- 班级意见 -->
                <tr>
                  <td class="table-label">班级意见</td>
                  <td class="table-input" colspan="3">
                    <div class="qm">
                      <span>辅导员（班主任）:</span>
                      <div class="avatar-uploader">
                        <img
                          :src="baseurl + formData.fdyqm"
                          class="signature-img"
                        >
                      </div>

                      <div>
                        {{ this.formData.fdyqmrq }}
                      </div>
                    </div>
                  </td>
                  <td class="table-label">二级学院意见</td>
                  <td class="table-input" colspan="3">
                    <div style="overflow: hidden; margin-bottom: 10px">
                      <div style="float: left; padding: 0px 12px">
                        经初审，同意该同学申请：
                      </div>
                      <el-form-item style="float: left; padding: 0px 12px">
                        <el-radio-group v-model="formData.csdj">
                          <el-radio :label="'1'">一等</el-radio>
                          <el-radio :label="'2'">二等</el-radio>
                          <el-radio :label="'3'">三等</el-radio>
                        </el-radio-group>
                      </el-form-item>
                      <div
                        style="
                          float: left;
                          padding: 0px 12px;
                          height: 28px;
                          line-height: 28px;
                        "
                      >
                        国家助学金
                      </div>
                    </div>
                    <div class="qm">
                      <span style="width: 300px">二级学院领导签字（公章）</span>
                      <div class="avatar-uploader">
                        <img
                          :src="baseurl + formData.ejxyldqm"
                          class="signature-img"
                        >
                      </div>
                      <div>
                        {{ this.formData.ejxyldqmrq }}
                      </div>
                    </div>
                  </td>
                </tr>
                <!--学校意见-->
                <tr>
                  <td class="table-label">学校意见</td>
                  <td class="table-input" colspan="7">
                    <div style="overflow: hidden; margin-bottom: 10px">
                      <div style="padding: 0px 12px; text-align: left">
                        经评审，并在校内公示 5 个工作日，无异议，同意该同学申请:
                      </div>
                      <el-form-item style="float: left; padding: 0px 12px">
                        <el-radio-group v-model="formData.zzdj">
                          <el-radio :label="'1'">一等</el-radio>
                          <el-radio :label="'2'">二等</el-radio>
                          <el-radio :label="'3'">三等</el-radio>
                        </el-radio-group>
                      </el-form-item>
                      <div
                        style="
                          float: left;
                          padding: 0px 12px;
                          height: 28px;
                          line-height: 28px;
                        "
                      >
                        国家助学金
                      </div>
                    </div>
                    <div class="signature">
                      <div style="margin-right: 50px">
                        广西水利电力职业技术学院
                      </div>
                      <div>
                        {{ this.formData.xxyjrq }}
                      </div>
                    </div>
                  </td>
                </tr>
                <!-- 佐证材料上传 -->
                <tr>
                  <td class="table-label">佐证材料</td>
                  <td class="table-input" colspan="7">
                    <Affix
                      v-model="formData.affixId"
                      :disabled="true"
                      @input="handleAffix"
                    />
                  </td>
                </tr>
              </table>
            </el-form>
            <div class="print">
              <el-button v-print="printobj" type="success">打印</el-button>
            </div>
          </el-scrollbar>
        </el-col>

        <el-col :span="12" class="dialog-content">
          <el-scrollbar style="height: 100%">
            <el-timeline v-loading="recordLoading">
              <el-timeline-item
                v-for="(item, index) in recordList"
                :key="index"
                :icon="item.icon"
                size="large"
                :type="item.type"
                :timestamp="item.createTime"
                placement="top"
              >
                <el-card>
                  <h3 v-if="item.step == 0">保存</h3>
                  <h3 v-if="item.step == 1">提交申请</h3>
                  <h3 v-if="item.step == 2">
                    <p>
                      <span>辅导员审核：</span>
                      <span>{{ item.result }}</span>
                      <span class="gap" />
                      <span v-if="item.remark">原因：{{ item.remark }}</span>
                    </p>
                  </h3>
                  <h3 v-if="item.step == 3">
                    <p>
                      <span>二级学院审核：</span>
                      <span>{{ item.result }}</span>
                      <span class="gap" />
                      <span v-if="item.remark">原因：{{ item.remark }}</span>
                    </p>
                  </h3>
                  <h3 v-if="item.step == 4">
                    <p>
                      <span>学校审核：</span>
                      <span>{{ item.result }}</span>
                      <span class="gap" />
                      <span v-if="item.remark">原因：{{ item.remark }}</span>
                    </p>
                  </h3>
                  <p>操作人：{{ item.operator }}</p>
                </el-card>
              </el-timeline-item>
            </el-timeline>
          </el-scrollbar>
        </el-col>
      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">关闭</el-button>
      </div>
    </el-dialog>

    <el-dialog
      class="edit-reason-dialog"
      title="修改申请理由"
      :visible.sync="editReasonVisible"
      width="600px"
      :close-on-click-modal="false"
      append-to-body
    >
      <el-form :model="editReasonForm" label-width="90px">
        <el-form-item label="申请理由">
          <el-input class="with-border" v-model="editReasonForm.sqly" type="textarea" :rows="6" placeholder="请输入申请理由" />
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="editReasonVisible=false">取消</el-button>
        <el-button type="primary" :loading="editReasonLoading" @click="submitEditSqly">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {list} from '@/api/stuYear/index'
import { listFdyView } from '@/api/zxj/record'
import { revoke, updateApply, getApply, updateSqly } from '@/api/zxj/apply'
import { listRecord } from '@/api/zxj/record'
export default {
  name: 'Record',
  data() {
    return {
		yearOptions:[],	
      options: [
        {
          value: '通过',
          label: '通过',
        },
        {
          value: '驳回',
          label: '驳回',
        },
        {
          value: '拒绝',
          label: '拒绝',
        },
      ],
      recordLoading: false,
      baseurl: process.env.VUE_APP_BASE_API + '/',
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 【审核记录】表格数据
      recordList: [],
      list: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      editReasonVisible: false,
      editReasonLoading: false,
      editReasonForm: { id: null, sqly: '' },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        xm: null,
        xh: null,
      },
      // 表单参数
      formData: {},
      // 表单校验
      rules: {},
      //打印
      printobj: {
        id: 'apply',
        popTitle: '打印', // 打印配置页上方标题
        extraHead: '<style>@media print{ #apply .signature{display:none!important;} #apply .signature img{display:none!important;} }</style>', //最上方的头部文字，附加在head标签上的额外标签,使用逗号分隔
        preview: '', // 是否启动预览模式，默认是false（开启预览模式，可以先预览后打印）
        previewTitle: '', // 打印预览的标题（开启预览模式后出现）,
        previewPrintBtnLabel: '', // 打印预览的标题的下方按钮文本，点击可进入打印（开启预览模式后出现）
        zIndex: '', // 预览的窗口的z-index，默认是 20002（此值要高一些，这涉及到预览模式是否显示在最上面）
        previewBeforeOpenCallback() {}, //预览窗口打开之前的callback（开启预览模式调用）
        previewOpenCallback() {}, // 预览窗口打开之后的callback（开启预览模式调用）
        beforeOpenCallback() {}, // 开启打印前的回调事件
        openCallback() {}, // 调用打印之后的回调事件
        closeCallback() {}, //关闭打印的回调事件（无法确定点击的是确认还是取消）
        url: '',
        standard: '',
        extraCss: '',
      },
    }
  },
  created() {
    this.getList()
	this.listAllYear()
  },
  methods: {
	listAllYear(){
		list().then(res=>{
			this.yearOptions = res.data
		})
	},
    getRecordList(id) {
      // 查询审批流程
      this.recordLoading = true
      listRecord({ applyId: id }).then((response) => {
        this.recordList = []
        let rows = response.rows
        for (let idx = 0; idx < rows.length; idx++) {
          let row = rows[idx]
          if (row.step == 0) {
            row['text'] = '保存'
          }
          if (row.step == 1) {
            row['text'] = '提交申请'
          }
          if (row.step == 2) {
            row['text'] = '辅导员审核'
          }
          if (row.step == 3) {
            row['text'] = '二级学院审核'
          }
          if (row.step == 4) {
            row['text'] = '学校审核'
          }
          //el-icon-remove-outline el-icon-circle-check el-icon-circle-close
          if (row.status == '0') {
            //拒绝
            row['icon'] = 'el-icon-circle-close'
            row['color'] = '#F56C6C'
            row['type'] = 'danger'
            row['result'] = '拒绝'
          }
          if (row.status == '1') {
            //通过
            row['icon'] = 'el-icon-circle-check'
            row['color'] = '#67C23A'
            row['type'] = 'success'
            row['result'] = '审核通过'
          }

          if (row.status == '2') {
            // 驳回
            row['icon'] = 'el-icon-remove-outline'
            row['color'] = '#E6A23C'
            row['type'] = 'warning'
            row['result'] = '驳回'
          }

          this.recordList.push(row)
        }
        this.recordLoading = false
      })
    },
    //附件id
    handleAffix(affixId) {
      this.formData.affixId = affixId
    },
    /** 查询【请填写功能名称】列表 */
    getList() {
      this.loading = true
      listFdyView(this.queryParams).then((response) => {
        this.list = response.rows
        for (let idx = 0; idx < this.list.length; idx++) {
          let row = this.list[idx]
          // if(row.status == '0'){
          //   re
          // }
          // if(row.step == -1){

          //   // listRecord({ applyId: row.id }).then((response) => {
          //   //      let  rows = response.rows
          //   //      row.step = rows[rows.length - 1].step;
          //   //      row.status = "拒绝"
          //   //   });
          // }
          // if(row.step == 1){
          //   row.status = "提交申请";
          // }
          // if(row.step == 2){
          //   row.status =row.status1;
          // }
          // if(row.step == 3){
          //   row.status =row.status2;
          // }
          // if(row.step == 4){
          //   row.status =row.status3;
          // }
          // if(row.step == 0){
          //     // listRecord({ applyId:  row.id }).then((response) => {
          //     //    let  rows = response.rows
          //     //    row.step = rows[rows.length - 1].step;
          //     //    row.status = "驳回"
          //     // });
          // }
        }
        this.total = response.total
        this.loading = false
      })
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.formData = {}
      this.resetForm('form')
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    handleRevoke(row) {
      this.$modal
        .confirm('是否确认撤回该记录？')
        .then(function () {
          return revoke(row)
        })
        .then((res) => {
          this.getList()
        })
        .catch(() => {})
    },
    openEditSqly(row) {
      this.editReasonLoading = true
      getApply(row.id).then(res => {
        const data = res.data || {}
        this.editReasonForm = {
          id: data.id,
          sqly: data.sqly || ''
        }
        // 备份完整对象用于提交
        this._fullApplyData = data
        this.editReasonVisible = true
        this.editReasonLoading = false
      }).catch(() => { this.editReasonLoading = false })
    },
    submitEditSqly() {
      const payload = { id: this.editReasonForm.id, sqly: this.editReasonForm.sqly }
      this.editReasonLoading = true
      updateSqly(payload)
        .then((res) => {
          this.editReasonLoading = false
          const ok = res && res.code !== 500
          if (ok) {
            this.editReasonVisible = false
            this.$modal && this.$modal.msgSuccess ? this.$modal.msgSuccess('已更新申请理由') : this.$message.success('已更新申请理由')
            this.getList()
          } else {
            const msg = (res && res.msg) || '操作失败'
            this.$message.error(msg)
          }
        })
        .catch((err) => {
          this.editReasonLoading = false
          const msg = (err && err.message) || '操作失败'
          this.$message.error(msg)
        })
    },
    /** 修改按钮操作 */
    handleDetail(row) {
      const nid = row.id || this.ids
      this.$router.push({
        path: 'proverty_examine',
        query: { id: nid, action: 3 },
      })
    },
    // handleDetailApply(id,action){

    //   this.$router.push({ path: "proverty_examine", query: { "id": id,"action":action } });
    // },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        '/comprehensive/apply/record/export',
        {
          ...this.queryParams,
        },
        `record_${new Date().getTime()}.xlsx`
      )
    },
  },
}
</script>
<style scoped>
#apply .avatar {
  width: 117px;
  height: 156px;
}
#apply .el-divider--horizontal {
  margin: 10px 0;
}
.subTitle {
  color: #409eff;
}
.query >>> .el-input__inner {
  border-width: 1px;
}
#apply .detail >>> .el-input.is-disabled .el-input__inner {
  background-color: #fff;
  border-color: #dfe4ed;
  color: #c0c4cc;
  cursor: not-allowed;
}
#apply .detail >>> .el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff;
  border-color: #dfe4ed;
  color: #c0c4cc;
  cursor: not-allowed;
}
.form-blok {
  margin: 0 auto;

  /* border: 1px solid #ebebeb; */
  border-radius: 3px;
  transition: 0.2s;
}
.source {
  text-align: center;
}
/* 表格样式 */
.full-width {
  border-collapse: collapse;
}
td {
  padding: 8px 10px 8px 10px;
  min-width: 120px;
  max-width: 110px;
  box-sizing: border-box;
  text-overflow: ellipsis;
  vertical-align: middle;
  position: relative;
  text-align: center;
  border: 1px solid #000;
}
.table-label {
  min-width: 100px;
  background: #ededed;
}
.table-input {
  min-width: 100px;

  padding: 8px 4px;
}
.table-input >>> .el-input__inner {
  padding-right: 0;
  width: 100px;
}
.table-align-left {
  padding: 8px 8px;
  text-align: left;
}
.date >>> .el-date-editor {
  width: 120px;
}
.xy >>> .el-input .el-input__inner {
  width: 105px;
}
.zy >>> .el-input .el-input__inner {
  width: 240px;
}
.bj >>> .el-input .el-input__inner {
  width: 255px;
}
@media print {
  #apply .signature { display: none !important; }
  #apply .signature img { display: none !important; }
}
.class-info >>> .el-input__inner {
  padding: 0px 10px;
  text-align: right;
}

/* 学院专业班级信息 */
.class-info {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
}
.class-info >>> .el-input__inner {
  /* text-align: right; */
}
.class-info div {
  height: 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.class-info div span {
  line-height: 25px;
}
/* 输入样式统一 */
/deep/ .el-input__inner {
  border-width: 0px;
}
/* 表单样式统一 */
/deep/ .el-form-item {
  margin-bottom: 0;
}
/deep/ .el-textarea__inner {
  border-width: 0px;
}
/deep/ .el-date-editor {
  width: 140px;
}
/deep/ .el-form-item__error {
  padding-left: 12px;
  position: relative;
  text-align: left;
}
.radio-group /deep/ .el-radio-group {
  width: 180px;
}
/*  */
.radio-group-row {
  display: flex;
  flex-direction: row;
  justify-content: left;
  align-content: center;
  font-size: 14px;
  line-height: 20px;
}
.signature {
  display: flex;
  flex-direction: row;
  justify-content: right;
  align-content: center;
  margin-right: 40px;
  flex-wrap: wrap;
}
.signature span {
  display: block;
  min-width: 50px;
  /* height: 36px;
        line-height: 36px; */
}
.signature > div {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
}
.avatar {
  width: 117px;
  height: 156px;
}
/deep/ .el-upload {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.image-input {
  padding: 0;
  width: 120px;
  height: 160px;
}
.signature-img {
  width: 160px;
  height: 50px;
}
.signature-tip {
  width: 160px;
  cursor: pointer;
  color: #1890ff;
  text-align: left;
}
.qm {
  display: flex;
  flex-direction: column;
  align-content: center;
}
.qm > span {
  text-align: left;
  padding-left: 12px;
}
.qm > div {
  text-align: right;
  padding-right: 12px;
}

.qm > .avatar-uploader {
  padding: 12px 0px;
  text-align: center;
}
/deep/ .el-input.is-disabled .el-input__inner {
  background-color: #fff;
  color: #000;
}

.list .item span {
  padding: 10px;
}
/* 间隔 */
.gap {
  padding: 0px 20px;
}
.record ul {
  padding-inline-start: 0px !important;
}
.record .title {
  padding: 20px 0px;
}

#apply >>> .el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff;
  border-color: #fff;
  color: #000;
  cursor: not-allowed;
}
.dialog >>> .el-dialog__body {
  height: calc(100% - 54px - 66px);
  overflow-y: scroll;
}
.print {
  display: flex;
  justify-content: center;
  align-items: calc();
  padding: 10px;
}
.queryFrom /deep/ .el-input__inner {
  border-width: 1px;
}
</style>
.edit-reason-dialog >>> .el-textarea__inner {
  border: 1px solid #dcdfe6 !important;
  box-shadow: none !important;
  border-radius: 4px;
}
.edit-reason-dialog >>> .el-input__inner {
  border: 1px solid #dcdfe6 !important;
  box-shadow: none !important;
  border-radius: 4px;
}
.edit-reason-dialog >>> .with-border .el-textarea__inner {
  border: 1px solid #606266 !important;
}
