PreviewPaperStructureDialog.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <template>
  2. <el-dialog
  3. class="preview-paper-structure-dialog"
  4. :visible.sync="modalIsShow"
  5. title="试卷结构"
  6. top="0"
  7. width="800px"
  8. :close-on-click-modal="false"
  9. :close-on-press-escape="false"
  10. append-to-body
  11. fullscreen
  12. @open="visibleChange"
  13. >
  14. <div class="mb-4 tab-btns">
  15. <el-button
  16. v-for="tab in dataList"
  17. :key="tab.paperType"
  18. size="medium"
  19. :type="curTab == tab.paperType ? 'primary' : 'default'"
  20. @click="switchPaper(tab)"
  21. >{{ tab.paperType }}</el-button
  22. >
  23. </div>
  24. <el-table ref="TableList" :data="dataList">
  25. <el-table-column prop="objective" label="题型">
  26. <span slot-scope="scope">
  27. {{ scope.row.objective ? "客观题" : "主观题" }}
  28. </span>
  29. </el-table-column>
  30. <el-table-column prop="mainNumber" label="大题号"></el-table-column>
  31. <el-table-column prop="subNumber" label="小题号"></el-table-column>
  32. <el-table-column prop="mainTitle" label="大题名称"></el-table-column>
  33. <el-table-column prop="totalScore" label="分数"></el-table-column>
  34. <el-table-column prop="answer" label="答案"></el-table-column>
  35. </el-table>
  36. <div slot="footer"></div>
  37. </el-dialog>
  38. </template>
  39. <script>
  40. import { examStructurePreviewStructure } from "../api";
  41. export default {
  42. name: "preview-paper-structure-dialog",
  43. props: {
  44. instance: {
  45. type: Object,
  46. default() {
  47. return {};
  48. }
  49. }
  50. },
  51. data() {
  52. return {
  53. modalIsShow: false,
  54. dataList: [],
  55. curTab: "",
  56. paperList: []
  57. };
  58. },
  59. methods: {
  60. visibleChange() {
  61. this.getData();
  62. },
  63. async getData() {
  64. this.dataList = [];
  65. const data = await examStructurePreviewStructure(this.instance.id);
  66. this.dataList = data || [];
  67. },
  68. cancel() {
  69. this.modalIsShow = false;
  70. },
  71. open() {
  72. this.modalIsShow = true;
  73. },
  74. switchPaper(paper) {
  75. this.curTab = paper.paperType;
  76. this.paperList = paper.content;
  77. }
  78. }
  79. };
  80. </script>