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

<template>
  <div>
    <el-card>
      <mx-condition :query-params="condition" use-alias-mapping @query="handleQuery"></mx-condition>
      <mx-search-group justify="end" v-model="queryParams.keyword"
                       @search="queryParams.pageNum=1,getList()">
      </mx-search-group>
    </el-card>
    <el-card>
      <dynamic-table :rows="rows" :columns="columns">
        <template #index="{$index}">
          {{ (queryParams.pageNum - 1) * queryParams.pageSize + $index + 1 }}
        </template>
        <template #type="{display}">
          {{ translateType(display) }}
        </template>
        <template #action="{row}">
          <div>
            <el-button v-if="row.type == paperWorkType.value" type="text" icon="el-icon-edit"
                       @click="clickEditPaper(row)">编辑
            </el-button>
            <el-button type="text" icon="el-icon-connection" @click="clickPublish(row)">
              发布
              <template v-if="row.publishedCount">({{ row.publishedCount }})</template>
            </el-button>
          </div>
        </template>
      </dynamic-table>
      <pagination v-if="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
                  @pagination="getList"></pagination>
      <upload-dialog
        v-if="uploadOption.dialogVisible"
        scene="发布"
        :title="uploadOption.title"
        :pageName="uploadOption.pageName"
        :isZdy="false"
        :selectType="uploadOption.selectType"
        :dialogVisible="uploadOption.dialogVisible"
        :default-selected="uploadOption.defaultSelected"
        @handleClose="handleUploadReady"
        @dialogVisibleClose="uploadOption.dialogVisible=false"
      ></upload-dialog>
    </el-card>
  </div>
</template>

<script>
import DynamicTable from '@/components/dynamic-table/index'
import { getHomeworks, getHomeworkStudents, publicStudentHomework } from '@/api/webApi/homework'
import consts from '@/common/mx-const'
import { download, listCustomerPaperQeustions } from '@/api/webApi/webQue'
import { mapGetters } from 'vuex'
import MxCondition from '@/components/MxCondition/mx-condition'
import MxSearchGroup from '@/components/MxSearch/mx-search-group'

export default {
  name: 'paper-work-publish',
  components: { MxSearchGroup, MxCondition, DynamicTable },
  data() {
    return {
      extraData: { type: consts.enum.generateScene.paperWork.value },
      paperWorkType: Object.freeze(consts.enum.homeworkTypes.find(t => t.value == 1)),
      condition: { homeworkType: '' },
      conditionOutput: null,
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        keyword: '',
        type: ''
      },
      columns: [
        { prop: 'id', label: '序号', width: '80px', slotBody: 'index' },
        { prop: 'type', label: '类型', width: '120px', slotBody: 'type' },
        { prop: 'title', label: '标题' },
        { prop: 'createTime', label: '创建时间', width: '180px' },
        { prop: 'action', label: '操作', width: '180px', slotBody: 'action' }],
      rows: [],
      total: 0,
      uploadWork: null,
      uploadOption: {
        title: '发布作业',
        pageName: '',
        selectType: '',
        defaultSelected: [],
        dialogVisible: false
      }
    }
  },
  computed: {
    ...mapGetters(['period'])
  },
  mounted() {
    this.getList()
  },
  methods: {
    handleQuery(model) {
      this.queryParams.pageNum = 1
      this.conditionOutput = model
      this.getList()
    },
    async getList() {
      const query = Object.assign(this.queryParams, this.conditionOutput)
      const res = await getHomeworks(query)
      this.rows = res.rows || res.data
      this.total = res.total || this.rows.length
    },
    translateType(type) {
      const enumType = consts.enum.homeworkTypes.find(t => t.value == type)
      return enumType?.label || type
    },
    clickEditPaper(paper) {
      listCustomerPaperQeustions(paper.content).then((res) => {
        localStorage.setItem(
          'paperData',
          JSON.stringify({
            paperId: paper.content,
            paperTitle: paper.name || paper.title,
            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 clickPublish(work) {
      const res = await getHomeworkStudents({ workId: work.id })
      this.uploadWork = work
      this.uploadOption.selectType = 'student'
      this.uploadOption.defaultSelected = res.data.map(item => item.customerCode) || []
      this.uploadOption.dialogVisible = true
    },
    async handleUploadReady(type, name, selectData) {
      const commit = {
        workId: this.uploadWork.id,
        stuIds: selectData.checkedStudent,
        remark: selectData.remark
      }
      await publicStudentHomework(commit)
      this.uploadOption.dialogVisible = false
      this.msgSuccess('发布成功')
      await this.getList()
    }
  }
}
</script>

<style scoped>

</style>