<template>
  <div class="bbsl-common-page">
    <div class="bbsl-table-search">
      <el-form v-model="queryParam" :inline="true">
        <!-- <el-form-item label="试卷名称：">
          <el-input
            v-model="querys[0].value"
            clearable
            maxlength="128"
            placeholder="请输入试卷名称"
          >
          </el-input>
        </el-form-item> -->
        <el-form-item label="考试状态：">
          <el-select
            v-model="querys[1].value"
            clearable
            placeholder="请选择考试状态"
          >
            <el-option
              v-for="item in ksztList"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="primary" @click="handleSearch"
            >搜索
          </el-button>

          <!-- <el-button type="text" @click.stop="openMore"
                >更多
                <i
                  :class="showMore ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"
                ></i>
              </el-button> -->
        </el-form-item>
      </el-form>
    </div>
    <div ref="contentPanel" class="bbsl-table-content">
      <div ref="btnPanel" class="bbsl-btn-content"></div>
      <el-table
        ref="multipleSelection"
        v-loading="loading"
        :cell-style="{'text-align': 'center'}"
        :data="tableData"
        :header-cell-style="{'text-align': 'center'}"
        :max-height="tableMaxHeight"
        :style="{width: '100%'}"
        size="mini"
        @row-dblclick="handleDbClick"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column
          label="试卷名称"
          min-width="150"
          prop="paperName"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          label="考试状态"
          min-width="120"
          prop="statusName"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          label="总题目数"
          min-width="100"
          prop="totalNumber"
          show-overflow-tooltip
          sortable
        >
        </el-table-column>
        <el-table-column
          label="得分"
          min-width="70"
          prop="totalScore"
          show-overflow-tooltip
          sortable
        >
        </el-table-column>
        <el-table-column
          label="总分数"
          min-width="90"
          prop="score"
          show-overflow-tooltip
          sortable
        >
        </el-table-column>
        <!-- 	<el-table-column min-width="100" sortable prop="f" label="用时" show-overflow-tooltip>
				</el-table-column> -->

        <el-table-column fixed="right" label="操作" width="200">
          <template #default="scope">
            <el-dropdown
              split-button
              @click="handleClick(scope.row)"
              @command="
                command => {
                  preview(command, scope.row)
                }
              "
            >
              查看试卷
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="0">错题本</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
          <!-- <el-button @click="handleClick(scope.row)" size="small">成绩调整</el-button>
						<el-button @click="handleClick(scope.row)" size="small">查看试卷</el-button> -->
        </el-table-column>
      </el-table>
      <el-pagination
        ref="paginationPanel"
        :current-page="queryParam.pageBean.page"
        :page-size="queryParam.pageBean.pageSize"
        :page-sizes="[20, 30, 40, 50]"
        :total="total"
        align="right"
        background
        class="bbsl-pagination"
        layout="prev, pager, next,total, sizes, jumper"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import {TableMixin} from '@/mixins/tableMixin'
import dictUtils from '@/components/dict/DictSelectUtils.js'
import xlcjMenu from '@/api/examination/xlcjMenu.js'

export default {
  name: 'ypMenu',
  components: {},
  mixins: [TableMixin],
  data() {
    return {
      showMore: false,
      tableData: [],
      total: 0,
      querys: [
        {
          group: 'main',
          operation: 'LIKE',
          parentGroup: '',
          property: 'b.name_',
          relation: 'AND',
          value: ''
        },
        {
          group: 'main',
          operation: 'LIKE',
          parentGroup: '',
          property: ' s.status_',
          relation: 'AND',
          value: ''
        }
      ],
      ksztList: [] //考试状态
    }
  },
  props: {
    names: {
      default: '',
      type: String
    }
  },
  created() {
    this.querys[0].value = this.names
    this.ksztList = dictUtils.getDictItemsFromCache('kszt')
  },
  mounted() {},
  methods: {
    // 打开搜索更多
    openMore() {
      this.showMore = !this.showMore
    },
    // 重置
    clearQuerys() {
      this.querys[0].value = ''
      this.querys[1].value = ''
    },
    // 获取list
    loadData(page) {
      if (page) {
        this.queryParam.pageBean.page = page
      }
      this.loading = true
      this.tableData = []
      this.queryParam.querys = []
      if (this.querys[0].value) {
        this.queryParam.querys.push(this.querys[0])
      }
      if (this.querys[1].value) {
        this.queryParam.querys.push(this.querys[1])
      }
      xlcjMenu.trainingPaperQuery(this.queryParam, res => {
        this.total = res.total
        this.tableData = res.rows
        this.tableData.forEach(e => {
          this.ksztList.forEach(k => {
            if (e.status == k.value) {
              e.statusName = k.name
            }
          })
        })
        this.$set(this.tableData)
        this.loading = false
      })
    },
    handleClick(val) {
      this.$router.push({
        name: 'xlcjPaper',
        params: val
      })
    },
    preview(command, val) {
      this.$router.push({
        name: 'bookOfErrors',
        params: val
      })
    },
    // 导入
    handleAvatarSuccess() {},
    beforeAvatarUpload() {}
  }
}
</script>
<style lang="scss" scoped>
.bbsl-table-content {
  height: 600px;
  overflow: auto;
}
.type-tag {
  margin: 0 2px;
}

::v-deep .el-col-1 {
  margin-left: -15px;
}
</style>
