<template>
  <div v-loading.fullscreen.lock="fullLoading" :element-loading-text="loadingText" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.3)" class="app-container">

    <el-dialog :visible.sync="lookMoreV">
      <MoreDetail />
    </el-dialog>

    <div class="sign">
      <ol>
        <li>
          关心集体，吃苦在前，以身作则，能起到模范带头作用。
        </li>
        <li>
          具有较强的工作能力和组织能力，工作认真负责，责任心强，团结同学，热心为同学服务，工作效果好。社会实践工作取得较好成绩，在学生中有较高威信。
        </li>
        <li>
          积极参加学校开展的第二课堂活动，第二课堂成绩单学分认定为优秀。在各级各类活动（竞赛）中成绩突出。
        </li>
        <li>
          积极参加体育锻炼及其他文体活动，身体健康，体能考核成绩为良好及以上。
        </li>
        <li>
          参评学年各科平均学分绩为70分以上（含70分），平均学分绩班级排名前40%，学年综合素质测评班级排名前50%。
        </li>
        <li>
          <span style="text-decoration: underline;color: lightskyblue;cursor: pointer;" @click="lookMore">查看更多</span>
        </li>
      </ol>
    </div>

    <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addVClick">
            提交申请
          </el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary" plain icon="el-icon-view" size="mini" @click="myScoreVClick">查看我的成绩</el-button>
        </el-col>
      </el-row>

    <el-table v-loading="loading" :data="table_data">
      <!-- <el-table-column label="奖项代码" prop="typeCode" /> -->
      <el-table-column label="奖项" prop="typeName" />
      <el-table-column label="申请学年" prop="stuYearName" />
      <el-table-column label="申请时间" prop="applyTime" />
      <el-table-column label="申请状态">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.audius_detail_type" :value="scope.row.status" />
        </template>
      </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="mini" icon="el-icon-view" @click="lookVClick(scope.row)">查看详情</el-button>
          <el-button v-if="scope.row.status === '1'" type="text" size="mini" icon="el-icon-close"
                     @click="cancelVClick(scope.row)"
          >取消申请
          </el-button>
          <el-button v-if="scope.row.status == '10'" type="text" size="mini" icon="el-icon-refresh"
                     @click="refreshVClick(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 title="申请优秀学生干部" :visible.sync="addV" width="600px" :top="'0'">

      <el-form label-width="160px">
        <el-row>
          <el-col :span="24">
            <!-- <el-form-item label="奖项">
                            <el-select v-model="addForm.typeCode" size="mini" class="addForm-input">
                                <el-option v-for="(v, i) in can_list" :key="i" :label="v.typeName"
                                    :value="v.typeCode"></el-option>
                            </el-select>
                        </el-form-item> -->
            <el-form-item label="政治面貌">
              <el-input v-model="addForm.zzmm" size="mini" class="addForm-input"
                        placeholder="请输入政治面貌(例如：群众、共青团员)"
              />
            </el-form-item>
            <el-form-item label="第二课堂学分认定">
              <el-select v-model="addForm.classtwoSure" size="mini" placeholder="第二学分成绩认定">
                <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="青年大学习学习率">
              <el-input size="mini" class="addForm-input" v-model="addForm.youthPercent"
                placeholder="请输入青年大学学习率，单位为%"></el-input>
            </el-form-item> -->
            <el-form-item label="职务">
              <el-input v-model="addForm.classPost" size="mini" class="addForm-input" placeholder="请输入职务(例如：班长，没有填 无)" />
            </el-form-item>
            <el-form-item label="获奖情况">
              <el-input v-model="addForm.goodHis" type="textarea" :maxlength="1000" :autosize="{ minRows: 10, maxRows: 10 }"
                        class="addForm-input" placeholder="请输入获奖情况"
              />
            </el-form-item>
            <el-form-item label="主要事迹">
              <el-input v-model="addForm.mainHis" type="textarea" :maxlength="1000" :autosize="{ minRows: 10, maxRows: 10 }"
                        class="addForm-input" placeholder="请输入主要事迹，字数100字以上"
              />
            </el-form-item>
            <el-form-item label="">
              <el-button type="primary" size="mini" @click="doApply">提交申请</el-button>

            </el-form-item>
          </el-col>

        </el-row>

      </el-form>
    </el-dialog>

    <el-dialog :visible.sync="myScoreV" title="我的成绩">
      <el-table :data="score_list">
        <el-table-column label="学年" prop="stuYearName" align="center" />
        <el-table-column label="平均学分绩" prop="stuScore" align="center" />
        <el-table-column label="综合素质总成绩" prop="cphScore" align="center" />
        <el-table-column label="体能测试成绩" prop="sportScore" align="center" />
        <el-table-column label="平均学分绩班级排名" align="center">
          <template slot-scope="scope">
            {{ scope.row.stuClassRank + '/' + scope.row.classCount }}
          </template>
        </el-table-column>
        <el-table-column label="综合素质总成绩班级排名" align="center">
          <template slot-scope="scope">
            {{ scope.row.cphClassRank + '/' + scope.row.classCount }}
          </template>
        </el-table-column>
      </el-table>
      <el-table :data="count_list">
        <el-table-column label="学年" prop="stuYearName" align="center" />
        <el-table-column label="课程总门数" prop="courseCount" align="center" />
        <el-table-column label="通过门数" prop="passCount" align="center" />
        <el-table-column label="未通过门数" prop="unpassCount" align="center" />
      </el-table>


      <el-table v-loading="course_loading" :data="course_list">
        <el-table-column label="学期" prop="termName" align="center" />
        <el-table-column label="课程" prop="courseName" align="center" />
        <el-table-column label="成绩" prop="courseScore" align="center" />
        <el-table-column label="是否通过" align="center">
          <template slot-scope="scope">
            {{ scope.row.isPass == 'true' ? '通过' : '未通过' }}
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="courseTotal > 0" :total="courseTotal" :page.sync="courseParams.pageNum"
                  :limit.sync="courseParams.pageSize" @pagination="listOwnCourseScore"
      />
    </el-dialog>


    <el-dialog :visible.sync="lookV" title="查看详情" fullscreen>
      <el-steps :active="getStep(lookForm)">
        <el-step title="学生提交申请" description="" />

        <el-step title="辅导员审核" :status="isEmpty(lookForm.fdyComment) ? 'wait' : getStepStatus(lookForm.fdyComment)">
          <template slot="description">
            <div>
              {{ isEmpty(lookForm.fdyNoName) ? '' : lookForm.fdyNoName }}
            </div>
            <div>
              {{ isEmpty(lookForm.fdyComment) ? '' : lookForm.fdyComment }}
            </div>
            <div>
              {{ isEmpty(lookForm.fdyTime) ? '' : lookForm.fdyTime }}
            </div>
          </template>
        </el-step>

        <el-step title="学院审核" :status="isEmpty(lookForm.deptComment) ? 'wait' : getStepStatus(lookForm.deptComment)">
          <template slot="description">
            <div>
              {{ isEmpty(lookForm.deptNoName) ? '' : lookForm.deptNoName }}
            </div>
            <div>
              {{ isEmpty(lookForm.deptComment) ? '' : lookForm.deptComment }}
            </div>
            <div>
              {{ isEmpty(lookForm.deptTime) ? '' : lookForm.deptTime }}
            </div>
          </template>
        </el-step>

        <el-step title="学工审核" :status="isEmpty(lookForm.finalComment) ? 'wait' : getStepStatus(lookForm.finalComment)">
          <template slot="description">
            <div>
              {{ isEmpty(lookForm.finalNoName) ? '' : lookForm.finalNoName }}
            </div>
            <div>
              {{ isEmpty(lookForm.finalComment) ? '' : lookForm.finalComment }}
            </div>
            <div>
              {{ isEmpty(lookForm.finalTime) ? '' : lookForm.finalTime }}
            </div>
          </template>
        </el-step>
      </el-steps>
      <hr>
      <el-form label-width="160px">
        <el-form-item label="政治面貌">
          <el-input v-model="lookForm.zzmm" size="mini" class="addForm-input" readonly />
        </el-form-item>
        <el-form-item label="职务">
          <el-input v-model="lookForm.classPost" size="mini" class="addForm-input" readonly />
        </el-form-item>
        <el-form-item label="获奖情况">
          <el-input v-model="lookForm.goodHis" type="textarea" :autosize="{ minRows: 10, maxRows: 10 }"
                    class="addForm-input" readonly
          />
        </el-form-item>
        <el-form-item label="主要事迹">
          <el-input v-model="lookForm.mainHis" type="textarea" :autosize="{ minRows: 10, maxRows: 10 }"
                    class="addForm-input" readonly
          />
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog title="重新提交" :visible.sync="refreshV" width="600px">

      <el-form label-width="160px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="政治面貌">
              <el-input v-model="refreshForm.zzmm" size="mini" class="addForm-input"
                        placeholder="请输入政治面貌(例如：群众、共青团员)"
              />
            </el-form-item>
            <el-form-item label="第二课堂学分认定">
              <el-select v-model="refreshForm.classtwoSure" size="mini" placeholder="第二学分成绩认定">
                <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="青年大学习学习率">
              <el-input size="mini" class="addForm-input" v-model="refreshForm.youthPercent"
                placeholder="请输入青年大学学习率，单位为%"></el-input>
            </el-form-item> -->
            <el-form-item label="职务">
              <el-input v-model="refreshForm.classPost" size="mini" class="addForm-input"
                        placeholder="请输入职务(例如：班长，没有填 无)"
              />
            </el-form-item>
            <el-form-item label="获奖情况">
              <el-input v-model="refreshForm.goodHis" type="textarea" :maxlength="1000" :autosize="{ minRows: 10, maxRows: 10 }"
                        class="addForm-input" placeholder="请输入获奖情况"
              />
            </el-form-item>
            <el-form-item label="主要事迹">
              <el-input v-model="refreshForm.mainHis" type="textarea" :maxlength="1000" :autosize="{ minRows: 10, maxRows: 10 }"
                        class="addForm-input" placeholder="请输入主要事迹，字数100字以上"
              />
            </el-form-item>
            <el-form-item label="">
              <el-button type="primary" size="mini" @click="reApply">提交申请</el-button>
            </el-form-item>
          </el-col>

        </el-row>

      </el-form>
    </el-dialog>


  </div>
</template>
<script>
import {
  addApplyYxgb,
  listApplyXgb
} from '@/api/stuCQS/good/MeritStudentCadres.js'

import {
  isEmpty
} from '@/api/helpFunc'
import lodash from 'lodash'
import {
  listXyjxjCanType, listTermByYear, applyXyjxj, listOwnXyjxjApply, listOwnScoreClassRank
  , listOwnYearCourseScore, countOwnPass, countOwnIam, getOwnPassCountByCode, getOwnIamCountByCode
  , cancelOwnApply
} from '@/api/stuCQS/good/apply'

import MoreDetail from '@/views/stuCQS/good/MoreDetail.vue'
import { verifyApplyYXGB, reApplyYXG } from '@/api/stuCQS/good/MeritStudentCadres'

export default {
  name: 'XyjxyApply',
  dicts: ['audius_detail_type'],
  components: {
    MoreDetail
  },
  data() {
    return {

      isEmpty,
      iSApplication: 3,
      loading_btn: false,
      can_list: [],
      addV: false,
      addForm: {
        applyId: null,
        bornTime: '',
        classTwoSure: '',
        classPost: '',
        goodHis: '',
        mainHis: '',
        material: '',
        typeCode: 'YXXSGB',
        // youthPercent: "",
        zzmm: ''
      },
      stuYearId: '',
      term_list: [],
      fullLoading: false,
            loadingText: '',

      queryParams: {
        pageNum: 1,
        pageSize: 10
      },
      total: 0,
      loading: false,
      table_data: [],

      lookV: false,
      lookForm: {},
      //附件
      material_list: [],

      count_list: [],
      score_list: [],
      myScoreV: false,
      course_list: [],
      courseParams: {
        pageNum: 1,
        pageSize: 10
      },

      courseTotal: 0,
      course_loading: false,

      lookMoreV: false,

      // 第二课堂学分认定
      options: [
        {
          value: '合格',
          label: '合格'
        },
        {
          value: '不合格',
          label: '不合格'
        }
      ],

      refreshForm: {},
      refreshV: false

    }
  },
  created() {
    this.getList()
    this.listCan()
    this.initTerm()
  },
  methods: {
    getStepStatus(data) {
      if ((data.includes('同意') && !data.includes('不同意')) || data.includes('通过') || (data.includes('符合') && !data.includes('不符合'))) {
        return 'success'
      } else {
        return 'error'
      }
    },
    getStep(data) {
      if (!isEmpty(data.finalComment)) {
        return 4
      } else if (!isEmpty(data.deptComment)) {
        return 3
      } else if (!isEmpty(data.fdyComment)) {
        return 2
      } else {
        return 1
      }
    },
    async reApply() {
      let sdata = { ...this.refreshForm }
      if (isEmpty(sdata.zzmm)) {
        this.$message.info('请填写政治面貌')
        return
      }
      if (isEmpty(sdata.classPost)) {
        this.$message.info('请填写职务')
        return
      }
      // if (isEmpty(sdata.youthPercent)) {
      //   this.$message.info("请填写青年大学习学习率");
      //   return;
      // }
      if (isEmpty(sdata.classtwoSure)) {
        this.$message.info('请填写第二课堂学分认定')
        return
      }

      if (isEmpty(sdata.goodHis)) {
        this.$message.info('请填写获奖记录')
        return
      }
      if (isEmpty(sdata.mainHis)) {
        this.$message.info('请填写主要事迹')
        return
      }
      if (sdata.mainHis.length < 100) {
        this.$message.info('主要事迹字数需要100字以上')
        return
      }


      this.fullLoading = true
      sdata.applyId = sdata.id
      let res = await reApplyYXG(sdata)
      this.fullLoading = false
      if (res.code == 200) {
        this.refreshV = false
        this.resetAddForm()
        this.$message.success(res.msg)
        this.getList()
      }
    },
    refreshVClick(v) {
      this.refreshForm = { ...v }
      this.refreshV = true
    },
    lookMore() {
      this.lookMoreV = true
      window.open('http://zhxg.gxsdxy.cn/file/pypxnotify.pdf')
    },
    cancelVClick(v) {
      if (v != null) {
        let id = v.id
        if (!isEmpty(id)) {
          this.$prompt('清输入取消理由', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            inputPattern: /^.+$/,
            inputErrorMessage: '不能为空'
          }).then(async ({ value }) => {
            let sdata = {
              id: id,
              reason: value
            }
            this.fullLoading = true
            let res = await cancelOwnApply(sdata)
            this.fullLoading = false
            if (res.code == 200) {
              this.$message.success(res.msg)
              this.getList()
            }

          }).catch(() => {
            this.$message({
              type: 'info',
              message: '取消输入'
            })
          })

        }
      }
    },
    async countOwnPass() {
      let res = await countOwnPass()
      if (res.code === 200) {
        this.count_list = [...res.data]
      }
    },
    async listOwnCourseScore() {
      this.course_loading = true
      let res = await listOwnYearCourseScore(this.courseParams)
      this.course_loading = false

      if (res.code == 200) {
        this.course_list = [...res.rows]
        this.courseTotal = res.total
      }
    },
    async listOwnScoreClassRank() {
      let res = await listOwnScoreClassRank()
      if (res.code == 200) {
        this.score_list = lodash.cloneDeep(res.data)
        console.log(this.score_list)
        this.stuYearId = this.score_list[0].stuYearId
        console.log(this.stuYearId)
      }
    },

    myScoreVClick() {
      this.countOwnPass()
      this.listOwnScoreClassRank()
      this.listOwnCourseScore()
      this.myScoreV = true
    },

    lookVClick(v) {
      this.lookForm = lodash.cloneDeep(v)
      console.log(v)
      if (!isEmpty(this.lookForm.material)) {
        this.material_list = this.lookForm.material.split(',')
      }
      this.lookV = true
    },

    async getList() {
      this.loading = true
      let res = await listApplyXgb()
      this.loading = false

      if (res.code === 200) {
        this.table_data = lodash.cloneDeep(res.data)
        if (this.table_data.length === 0) {
          this.iSApplication = 0
        }
        let isStatus = this.table_data[this.table_data.length - 1].status
        if (isStatus === '10' || isStatus === '14') {
          this.iSApplication = 1
        } else {
          this.iSApplication = 3
        }

      }
    },

    async listCan() {
      let res = await listXyjxjCanType()
      if (res.code == 200) {
        this.can_list = lodash.cloneDeep(res.data)
      }
    },
    async initTerm() {
      let res1 = await listXyjxjCanType()
      if (res1.code == 200) {
        let data = lodash.cloneDeep(res1.data)
        if (!isEmpty(data) && data != []) {
          let year = data[0].stuYearId
          let res2 = await listTermByYear(year)
          if (res2.code == 200) {
            this.term_list = lodash.cloneDeep(res2.data)
          }
        }
      }

    },
    async addVClick() {
      this.loadingText = '正在校验资格.....'
      this.fullLoading = true
      try {
        if (this.iSApplication === 1) {
          this.addV = true
          this.addForm = lodash.cloneDeep(this.table_data[this.table_data.length - 1])
          this.countOwnPass()
          this.listOwnScoreClassRank()
          this.listOwnCourseScore()
        } else {
          const res = await verifyApplyYXGB()
          if (res.code !== 200) {
            return false
          }
          this.$message.success(res.msg)
          this.addV = true
          this.countOwnPass()
          this.listOwnScoreClassRank()
          this.listOwnCourseScore()
        }
      } finally {
        this.fullLoading = false
        this.loadingText = ''
      }
    },
    async doApply() {
      let sdata = lodash.cloneDeep(this.addForm)
      // 将 stuYearId 添加到 sdata 对象中
      sdata.stuYearId = this.stuYearId
      console.log(sdata)
      if (isEmpty(sdata.zzmm)) {
        this.$message.info('请填写政治面貌')
        return
      }
      // if (isEmpty(sdata.bornTime)) {
      //   this.$message.info("请填写出生年月");
      //   return;
      // }
      // if (isEmpty(sdata.classPost)) {
      //   this.$message.info('请填写职务')
      //   return
      // }
      // if (isEmpty(sdata.bankCard)) {
      //     this.$message.info("请填写中国农业银行银行卡号");
      //     return;
      // }
      // if (isEmpty(sdata.bankAddr)) {
      //     this.$message.info("请填写开户行");
      //     return;
      // }
      if (isEmpty(sdata.goodHis)) {
        this.$message.info('请填写获奖记录')
        return
      }
      if (isEmpty(sdata.mainHis)) {
        this.$message.info('请填写主要事迹')
        return
      }
      if (sdata.mainHis.length < 100) {
        this.$message.info('主要事迹字数需要100字以上')
        return
      }

      this.fullLoading = true
      console.log(sdata)
      let res = await addApplyYxgb(sdata)
      console.log(res)
      this.fullLoading = false
      if (res.code === 200) {
        this.addV = false
        this.resetAddForm()
        this.$message.success(res.msg)
        await this.getList()
        return true
      }
      if (res.code == null) {
        this.$message.error('请勿重复提交申请')
      }
    },
    resetAddForm() {
      this.addForm = {
        typeCode: 'YXXSGB',
        zzmm: '',
        classPost: '',
        goodHis: '',
        mainHis: '',
        bornTime: '',
        material: null
      }
    }

  }
}
</script>
<style lang="scss" scoped>
.addForm-input {
  width: 400px;
}

.el-form-item {
  margin-bottom: 0px;
}

.sign {
  width: 100%;
  border: 1px solid rgb(163, 211, 255);
  font-size: small;
  margin-bottom: 10px;
  border-radius: 2px;
}
</style>
