front/src/views/questioncenter/components/generate-tabs/paper-record.vue

<template>
  <div>
    <el-card>
      <mx-condition :query-params="queryParams" @query="handleQuery" use-alias-mapping></mx-condition>
    </el-card>
    <el-container style="background: #fff; min-height: 500px; display: block">
      <el-table :data="examRecord" style="width: 100%" v-loading="tableLoading">
        <el-table-column type="index" label="序号" width="50px">
        </el-table-column>
        <el-table-column prop="subjectName" label="科目"></el-table-column>
        <el-table-column prop="name" label="试卷标题">
          <template slot-scope="scope">
            <el-link @click="clickEditPaperName(scope.row)"><i class="el-icon-edit"></i>{{ scope.row.name }}</el-link>
          </template>
        </el-table-column>
        <el-table-column prop="remark" label="试卷概要"></el-table-column>
        <el-table-column prop="status" label="状态"></el-table-column>
        <el-table-column prop="createdTime" label="组卷时间"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <div>
              <span style="color: #47c6a2; margin-right: 16px; cursor: pointer"
                    @click="clickEditPaper(scope.row)">编辑</span>
              <span style="color: #ff4e00; margin-right: 16px; cursor: pointer"
                    @click="clickDownloadPaper(scope.row.paperId)">下载</span>
              <i class="el-icon-delete table-delete-icon" @click="clickDeletePopup(scope.row.paperId)"></i>
            </div>
            <div v-hasPermi="['front:generatingPaperCenter:saveToPersonResources']"
                 style="color: #608edf; margin-right: 16px; cursor: pointer"
                 @click="clickSendToResource(scope.row.paperId)">
              发送至个人资源库
            </div>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-if="examRecordTotal > 0" :total="examRecordTotal" :page.sync="pageNum" :limit.sync="pageSize"
                  @pagination="getPaperRecords"/>
    </el-container>
    <el-dialog title="修改试卷标题" :visible.sync="dialogPaperNameVisible" width="400px">
      <el-input v-model="dialogPaperName" placeholder="请输入试卷标题"></el-input>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="savePaperName">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import PaperWorkIdentifierMixin from './paper-work-identifier-mixin'
import MxCondition from '@/components/MxCondition/mx-condition'
import {
  deletePaper,
  download,
  listCustomerPaperQeustions,
  paperRecords,
  saveToPersonResources, updateNameById
} from '@/api/webApi/webQue'
import consts from '@/common/mx-const'
import { mapGetters } from 'vuex'

export default {
  mixins: [PaperWorkIdentifierMixin],
  name: 'paper-record',
  components: { MxCondition },
  data() {
    return {
      queryParams: {
        exeSubject: ''
      },
      queryOutput: null,
      tableLoading: false,
      pageNum: 1,
      pageSize: 20,
      examRecord: [],
      examRecordTotal: 0,
      //
      dialogPaperNameVisible: false,
      dialogPager: null,
      dialogPaperName: ''
    }
  },
  computed: {
    ...mapGetters(['period'])
  },
  methods: {
    handleQuery(model) {
      this.queryOutput = model
      this.pageNum = 1
      this.getPaperRecords()
    },
    getPaperRecords() {
      paperRecords({
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        ...this.queryOutput,
        ...this.extraData
      }).then((res) => {
        this.examRecordTotal = res.total
        this.examRecord = res.rows
      })
    },
    clickEditPaperName(paper) {
      this.dialogPager = paper
      this.dialogPaperName = paper.name
      this.dialogPaperNameVisible = true
    },
    clickEditPaper(paper) {
      listCustomerPaperQeustions(paper.paperId).then((res) => {
        localStorage.setItem(
          'paperData',
          JSON.stringify({
            paperId: paper.paperId,
            paperTitle: paper.name,
            subjectId: paper.subjectid
          })
        )
        localStorage.setItem('questionList', JSON.stringify(res.rows))
        this.$router.push({
          path: '/question-center/generatingPaperCenter/paper',
          query: this.extraData
        })
      })
    },
    clickDownloadPaper(paperId) {
      download(paperId, this.period)
    },
    async clickDeletePopup(paperId) {
      await this.$confirm('是否删除该试卷?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
      await deletePaper({ paperId })
      this.msgSuccess('删除成功!')
      this.getPaperRecords()
    },
    clickSendToResource(paperId) {
      this.tableLoading = true;
      saveToPersonResources(paperId).then((res) => {
        this.tableLoading = false;
        this.msgSuccess("发送成功");
      });
    },
    savePaperName() {
      const paperName = this.dialogPaperName?.trim();
      if (!paperName) {
        this.msgError("试卷标题不能为空");
        return;
      }

      updateNameById(this.dialogPager.paperId, paperName).then((res) => {
        this.dialogPager.name = paperName;
        this.dialogPaperNameVisible = false;
        this.msgSuccess("修改成功");
      });
    }
  }
}
</script>

<style scoped>

</style>