<style>
  .OtherCourseNum {
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    border: 1px solid #2961FE;
    border-radius: 50%;
    cursor: pointer;
    color: #2961FE;
  }

  .OCourseTable {
    width: 400px;
    text-align: center;
  }

  .OCourseTable tr td {
    height: 40px;
  }

  .OCourseTable tr th {
    height: 40px;
    background-color: rgb(238, 238, 239);
  }

</style>
<template>
  <div class="page-body">
    <div class="page-search row items-center">
      <div class="col row wrap q-mr-lg q-col-gutter-md">
        <!-- <div class="col-3">
          <q-select @input="getList" standout="bg-primary text-white" option-value="Id" option-label="Name"
            v-model="msg.tikuName" :options="tikuList" emit-value map-options label="所属题库" />
        </div> -->
        <div class="col-3">
          <q-input @change="getList" clearable filled v-model="msg.PaperName" @clear="getList" maxlength="20"
            label="输入试卷名称、组卷人查找" />
        </div>
      </div>
    </div>
    <div class="page-content">
      <q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat
        class="sticky-column-table sticky-right-column-table" separator="none" :data="dataList" :columns="columns"
        row-key="name">
        <template v-slot:top="props">
          <div class="col-2 q-table__title">试卷管理</div>
          <q-space />
          <q-btn color="accent" size="sm" class="q-mr-md" label="组卷" />
        </template>
        <template v-slot:bottom>
          <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
            :input="true" @input="changePage" />
        </template>
        <template v-slot:body-cell-PaperId="props">
          <q-td :props="props" style="width:100px;">
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="封存" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="预览" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" @click="goExameEdit(props.row)" label="编辑" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="复制" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="发布考试" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="分配管理" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="删除" />
            <q-btn flat size="xs" color="primary" style="font-weight:400" label="详情" />
          </q-td>
        </template>
      </q-table>
    </div>
  </div>
</template>
<script>
  import {
    GetPaperPage
  } from '../../api/teacher/index';
  //获取校区列表
  export default {
    meta: {
      title: "考试管理"
    },
    data() {
      return {
        data: [],
        msg: {
          pageIndex: 1,
          pageSize: 12,
          rowsPerPage: 12,
          PaperName: '' //题库名
        },
        pageCount: 0,
        loading: false,
        tikuList: [{
          Id: 0,
          Name: '全部'
        }, {
          Id: 1,
          Name: '测试题库'
        }, {
          Id: 2,
          Name: '质量管理与可靠性'
        }],
        dataList: [],
        columns: [
          //   {
          //     name: 'PaperId',
          //     label: '序号',
          //     field: 'PaperId',
          //     align: 'left',
          //   },
          {
            name: 'PaperName',
            label: '试卷名称',
            field: 'PaperName',
            align: 'left'
          },
          {
            name: 'CreateTimeStr',
            label: '创建时间',
            field: 'CreateTimeStr',
            align: 'left'
          },

          {
            name: 'CreateByName',
            label: '创建人',
            field: 'CreateByName',
            align: 'left'
          },
          {
            name: 'PaperId',
            label: '操作',
            field: 'PaperId'
          }
        ],
      }
    },
    created() {},
    mounted() {
      this.getList();
    },
    methods: {
      //翻页
      changePage(val) {
        this.msg.pageIndex = val;
        this.getList()
      },
      //获取菜单分页列表
      getList() {
        this.loading = true;
        this.dataList = [];
        GetPaperPage(this.msg).then(res => {
          this.loading = false;
          this.dataList = res.Data.PageData;
          this.pageCount = res.Data.PageCount;
        }).catch(() => {
          this.loading = false
        })
      },
      //刷新页面
      refreshPage() {
        this.getList();
      },
      //点击编辑 跳转
      goExameEdit(item) {
        console.log("item",item);
        this.OpenNewUrl('/exam/examEdit', {
          Id: item.PaperId
        })
      }
    }
  }
</script>
<style lang="sass">
  @import url('~assets/css/table.sass')

</style>
