项目实训第三周03：与前端配合_el-number分值多选-CSDN博客

本文链接：https://blog.csdn.net/weixin_45049311/article/details/118863234

前端相关部分

删除试卷：

<el-button v-waves type="danger" icon="el-icon-delete" size="mini" @click="confirmDeletePaper(row)">
	删除
</el-button>

confirmDeletePaper(row)功能：

confirmDeletePaper(row) {
        this.$confirm('若试卷已有学生考试则无法删除，确定删除该试卷吗?', '提示', {
          confirmButtonText: '确定删除',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.deletePaper(row)
        }).catch(() => {
        })
      },
      async deletePaper(row) {
        let result = await reqDeletePaper(row.paperId)
        if (result.statu === 0) {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
          this.getList()
        } else {
          this.$message({
            message: result.msg,
            type: 'error'
          })
        }
      },

	// 请求删除试卷
	export const reqDeletePaper = (paperId) => ajax(BASE_URL + '/deletePaper', { paperId }, 'POST')

手动组卷：

<!--固定组卷弹出框-->
    <el-dialog :visible.sync="fixedDialogFormVisible" title="固定组卷" style="margin-bottom: 20px">
      <el-form ref="fixedDataForm" :rules="fixRules" :model="temp" label-position="left" label-width="100px" style="width: 400px; margin-left:50px;">
        <el-form-item label="所属科目" prop="langId">
          <el-select v-model="temp.langId" placeholder="选择科目" clearable style="width: 200px;margin-right: 15px;" class="filter-item" @change="fixedLangIdChange">
            <el-option v-for="item in langOptions" :key="item.key" :label="item.label" :value="item.key" />
          </el-select>
        </el-form-item>
        <el-form-item label="试卷名称" prop="paperName">
          <el-input v-model="temp.paperName" />
        </el-form-item>
        <el-form-item label="考试时长" prop="paperDuration">
          <el-time-select
            v-model="temp.paperDuration"
            :picker-options="{
              start: '00:10',
              step: '00:10',
              end: '05:00'
            }"
            placeholder="选择时间(时:分)"/>
        </el-form-item>
        <el-form-item label="难度系数" prop="paperDifficulty">
          <el-rate v-model="temp.paperDifficulty" style="margin-top: 10px"/>
        </el-form-item>
        <el-form-item label="注意事项" prop="paperAttention">
          <el-input v-model="temp.paperAttention" type="textarea" />
        </el-form-item>
        <el-form-item label="单选题分值" prop="singleScore">
          <el-input-number v-model="temp.singleScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="多选题分值" prop="multipleScore">
          <el-input-number v-model="temp.multipleScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="判断题分值" prop="judgeScore">
          <el-input-number v-model="temp.judgeScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="填空题分值" prop="fillScore">
          <el-input-number v-model="temp.fillScore" :min="1" :max="99"/>
        </el-form-item>
        <div style="width: 600px">
          <el-input v-model="fixedFilterText" placeholder="查找试卷问题关键字" style="margin-bottom:30px;" />
          <el-tree
            ref="fixedPaperDataTree"
            :data="fixedPaperData"
            :props="defaultProps"
            :filter-node-method="filterNode"
            show-checkbox
            class="filter-tree"
          />
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="fixedDialogFormVisible = false">
          取消
        </el-button>
        <el-button type="primary" @click="fixedCreateData">
          确认发布
        </el-button>
      </div>
    </el-dialog>

fixedCreateData()功能：

fixedCreateData() {
        this.$refs['fixedDataForm'].validate((valid) => {
          if (valid) {
            let checkedData = this.$refs.fixedPaperDataTree.getCheckedNodes()
            // 过滤掉单选题列表多选题列表判断题列表填空题列表四个id值
            let filtercheckedData = checkedData.filter(item => {
              return item.id > 4
            })
            if (filtercheckedData.length > 0) {
              let singleNum = []
              let multipleNum = []
              let judgeNum = []
              let fillNum = []
              filtercheckedData.forEach((item, index) => {
                let firstStr = (String)(item.id).substring(0, 1)
                let restStr = (String)(item.id).substring(1)
                if (firstStr === '1') {
                  singleNum.push((Number)(restStr))
                }
                if (firstStr === '2') {
                  multipleNum.push((Number)(restStr))
                }
                if (firstStr === '3') {
                  judgeNum.push((Number)(restStr))
                }
                if (firstStr === '4') {
                  fillNum.push((Number)(restStr))
                }
              })
              if (!singleNum.length) {
                this.$message({
                  message: '请选择至少一道单选题',
                  type: 'error'
                })
              } else if (!multipleNum.length) {
                this.$message({
                  message: '请选择至少一道多选题',
                  type: 'error'
                })
              } else if (!judgeNum.length) {
                this.$message({
                  message: '请选择至少一道判断题',
                  type: 'error'
                })
              } else if (!fillNum.length) {
                this.$message({
                  message: '请选择至少一道填空题',
                  type: 'error'
                })
              } else {
                this.temp.singleNum = singleNum
                this.temp.multipleNum = multipleNum
                this.temp.judgeNum = judgeNum
                this.temp.fillNum = fillNum
                this.fixedInsertPaperInfo()
              }
            } else {
              this.$message({
                message: '请勾选题目，如果该科目题目紧缺请选择其他科目组卷',
                type: 'error'
              })
            }
          }
        })
      },
      async fixedInsertPaperInfo() {
        let arr = this.temp.paperDuration.split(":")
        this.temp.paperDuration = parseInt(arr[0])*60*60 + parseInt(arr[1])*60
        let result = await reqFixedInsertPaperInfo(this.temp)
        if (result.statu === 0){
          this.fixedDialogFormVisible = false
          this.$notify({
            title: '成功',
            message: '试卷发布成功',
            type: 'success',
            duration: 2000
          })
          this.getList()
        } else {
          this.$notify({
            title: '失败',
            message: result.msg,
            type: 'error',
            duration: 2000
          })
        }
      },

// 请求固定组卷，插入试卷数据，即发布试卷
export const reqFixedInsertPaperInfo = (temp) => ajax(BASE_URL + '/fixedInsertPaperInfo', temp, 'POST')

随机组卷：

<!--随机组卷弹出框-->
    <el-dialog :visible.sync="dialogFormVisible" title="随机组卷" style="margin-bottom: 20px">
      <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="100px" style="width: 400px; margin-left:50px;">
        <el-form-item label="所属科目" prop="langId">
          <el-select v-model="temp.langId" placeholder="选择科目" clearable style="width: 200px;margin-right: 15px;" class="filter-item">
            <el-option v-for="item in langOptions" :key="item.key" :label="item.label" :value="item.key" />
          </el-select>
        </el-form-item>
        <el-form-item label="试卷名称" prop="paperName">
          <el-input v-model="temp.paperName" />
        </el-form-item>
        <el-form-item label="考试时长" prop="paperDuration">
          <el-time-select
            v-model="temp.paperDuration"
            :picker-options="{
              start: '00:10',
              step: '00:10',
              end: '05:00'
            }"
            placeholder="选择时间(时:分)"/>
        </el-form-item>
        <el-form-item label="难度系数" prop="paperDifficulty">
          <el-rate v-model="temp.paperDifficulty" style="margin-top: 10px"/>
        </el-form-item>
        <el-form-item label="注意事项" prop="paperAttention">
          <el-input v-model="temp.paperAttention" type="textarea" />
        </el-form-item>
        <el-form-item label="单选题分值" prop="singleScore">
          <el-input-number v-model="temp.singleScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="单选题数目" prop="singleNum">
          <el-input-number v-model="temp.singleNum" :min="1" :max="30"/>
        </el-form-item>
        <el-form-item label="多选题分值" prop="multipleScore">
          <el-input-number v-model="temp.multipleScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="多选题数目" prop="multipleNum" >
          <el-input-number v-model="temp.multipleNum" :min="1" :max="10"/>
        </el-form-item>
        <el-form-item label="判断题分值" prop="judgeScore">
          <el-input-number v-model="temp.judgeScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="判断题数目" prop="judgeNum">
          <el-input-number v-model="temp.judgeNum" :min="1" :max="20"/>
        </el-form-item>
        <el-form-item label="填空题分值" prop="fillScore">
          <el-input-number v-model="temp.fillScore" :min="1" :max="99"/>
        </el-form-item>
        <el-form-item label="填空题数目" prop="fillNum">
          <el-input-number v-model="temp.fillNum" :min="1" :max="30"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">
          取消
        </el-button>
        <el-button type="primary" @click="createData">
          确认发布
        </el-button>
      </div>
    </el-dialog>

createData()功能：

createData(){
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.randomInsertPaperInfo()
          }
        })
      },
      async randomInsertPaperInfo(){
        let arr = this.temp.paperDuration.split(":")
        this.temp.paperDuration = parseInt(arr[0])*60*60 + parseInt(arr[1])*60
        let result = await reqRandomInsertPaperInfo(this.temp)
        if (result.statu === 0){
          this.dialogFormVisible = false
          this.$notify({
            title: '成功',
            message: '试卷发布成功',
            type: 'success',
            duration: 2000
          })
          this.getList()
        } else {
          this.$notify({
            title: '失败',
            message: result.msg,
            type: 'error',
            duration: 2000
          })
        }
      },


// 请求随机组卷，插入试卷数据，即发布试卷
export const reqRandomInsertPaperInfo = (temp) => ajax(BASE_URL + '/randomInsertPaperInfo', temp, 'POST')