TEAMModelOS/TEAMModelOS/ClientApp/src/view/evaluation/bank/TestPaperList.vue

<template>
    <div class="pl-container">
        <!-- 条件筛选部分 -->
        <BaseFilter @onChange="onFilterChange" :isFilterPaper="isFilterPaper"></BaseFilter>

        <!-- 空数据展示 -->
        <div v-if="paperList.length === 0" class="no-data-text">
            <img src="@/assets/icon/no_data.svg" width="120" />
            <span style="margin-top:15px;color:#808080">暂无数据</span>
        </div>

        <!-- 试卷列表页面 -->
        <div class="pl-content-wrap" v-else>
            <Loading :top="100" v-show="dataLoading" type="1" hideMask></Loading>
            <div class="paper-item" v-for="(paper,index) in paperList" :key="index">
                <div class="paper-item-name">
                    <span class="paper-item-tag"  v-if="isSchool">{{ getSubjectName(paper.subjectId) }}</span>
                    <span style="margin-left: 8px;">{{ paper.name }}</span>
                </div>
                <div class="paper-item-info">
                    <span class="info-item" v-if="isSchool">适用学段：<span class="info-bold">{{ getPeriodName(paper.periodId) }}</span></span>
                    <span class="info-item" v-if="isSchool">适用年级：<span class="info-bold" v-for="(grade,gIndex) in paper.gradeIds" :key="gIndex">{{ getGradeName(paper.periodId,grade) }} <span v-show="gIndex !== paper.gradeIds.length - 1"> / </span></span></span>
                    <span class="info-item">题量：<span class="info-bold">{{ paper.scoring ? paper.scoring.length : 0 }}</span></span>
                    <!-- <span class="info-item">难度系数：<span class="info-bold">{{ paper.item ? handleDiffCalc(paper.item) : 0 }}</span></span> -->
                </div>
                <div class="paper-item-tools">
                    <span class="paper-item-tools-edit" @click="goToPaper(paper)"  v-if="$access.can('admin.*|Paper_Edit')">
						<Icon type="ios-create" />
						<span>编辑</span>
					</span>
                    <span class="paper-item-tools-delete"  @click.stop="onDeletePaper(paper)"  v-if="$access.can('admin.*|Paper_Edit')">
						<Icon type="md-trash" />
						<span>删除</span>
					</span>
                </div>
            </div>

            <!-- 底部分页区域 -->
            <Page :total="totalNum"
                  show-sizer
                  show-total
                  :page-size="pageSize"
                  :current="pageNum"
                  @on-page-size-change="pageSizeChange"
                  @on-change="pageChange"
                  :page-size-opts="[5,10,15,20]" />
        </div>
    </div>
</template>
<script>
	import blobTool from '@/utils/blobTool.js'
    import Loading from '@/common/Loading.vue'
    import BaseFilter from '../components/BaseFilter'
    import BaseImport from '../components/BaseImport'
    import AutoCreate from '../../learnactivity/AutoCreate'
    export default {
        components: {
            Loading, BaseFilter, AutoCreate,BaseImport
        },
        data() {
            return {
				containerClient:null,
                schoolCode: '',
                totalNum: 0,
                pageSize: 5,
                pageNum: 1,
                dataLoading: false,
                randomModal: false,
                isFilterPaper:true,
                paperList: [],
                periodList: [],
                gradeList: [],
                subjectList: [],
                filterParams: {},
                findCountParams: {},
                schoolInfo: {},
                filterSort: 'createTime',
                paperInfo: {
                    name: "",
                    score: 100,
                    item: []
                }
            }
        },
        created() {
            // this.getPaperList()

        },
        methods: {

            /** 执行筛选条件获取数据 */
            doFilter() {
                this.dataLoading = true
                this.getPaperList(this.filterParams)
                // this.getResultCount(this.findCountParams)
            },

            onFilterChange(filterParams, findCountParams) {

                this.filterParams = {
                    // '@DESC': this.filterSort,
                    'code': filterParams.code,
					'scope': filterParams.code === this.$store.state.userInfo.schoolCode ? 'school' : 'private',
                    'periodId': filterParams.periodId[0],
                    'gradeIds': filterParams.gradeIds,
                    'subjectId': filterParams.subjectId
                }
                this.findCountParams = findCountParams

                //this.gradeList = this.periodList.filter(item => item.periodCode = filterParams.periodCode[0])[0].grades
                //this.subjectList = this.periodList.filter(item => item.periodCode = filterParams.periodCode[0])[0].subjects
                this.pageChange(1)
            },

            /** 获取试卷列表 */
            getPaperList(params) {
                let that = this
                this.$api.learnActivity.FindExamPaper(params).then(async res => {
                    this.paperList = res.papers
                    setTimeout(() => {
                        that.dataLoading = false
                    }, 1000)
                }).catch(err => {
					setTimeout(() => {
						this.$Message.error('试卷数据获取失败')
					    that.dataLoading = false
					}, 1000)
				})
            },

            /**
             * 点击查看试卷详情
             * @param paper
             */
            async goToPaper(paper) {
				try{
					// 获取完整试卷数据再跳转编辑页面
					let fullPaperJson = await this.$evTools.getFullPaper(paper)
					fullPaperJson.code = paper.code
					console.log(fullPaperJson)
					this.$router.push({
					    name: 'createPaper',
					    params: {
					        paper: fullPaperJson
					    }
					})
				}catch(e){
					console.log(e)
					this.$Message.error('获取试卷数据失败！请稍后再试！')
				}
				
            },

            /**
             * 获取筛选结果数量
             * @param data
             */
            getResultCount(data) {
                this.$api.newEvaluation.FindCount(data).then(res => {
                    this.totalNum = res.result.data[0]
                })
            },

            /**
             * 删除试卷
             * @param item
             */
            onDeletePaper(item) {
                this.$Modal.confirm({
                    title: '提示',
                    content: '<p>确认删除该试卷吗？</p>',
                    okText: '确认',
                    cancelText: '取消',
                    onOk: async () => {
						let blobList = await this.getPaperFiles(item.blob.substring(1))
						let files = blobList.blobList.map(i => i.blob)
                        this.dataLoading = true
                        this.$api.learnActivity.DeleteExamPaper({ id: item.id, code: item.code,scope:item.scope }).then(async res => {
                            if (!res.error) {
								this.onDeleteBlobPaper(files).then(r => {
									this.$Message.success('删除成功')
									this.pageChange(1)
								})
                            } else {
                                this.$Message.warning('删除失败,错误代码：' + res.error.code + ',错误信息:' + res.error.message)
                            }
                        }).catch(err => {
                            console.log(err)
                            this.$Message.warning('删除失败')
                        })
                    }
                })
            },
			
			 getPaperFiles(path){
				return new Promise(async (r,j) => {
					// 获取初始化Blob需要的数据
					let sasData = this.isSchool ? await this.$tools.getSchoolSas() : await this.$tools.getPrivateSas()
					//初始化Blob
					let containerClient = new blobTool(sasData.url, sasData.name, sasData.sas , this.isSchool ? 'school' : 'private')
					// 等待blob的返回结果
					containerClient.listBlob({
					    prefix: path
					}).then(
					    (res) => {
					        r(res)
					    },
					    (err) => {
					        this.$Message.error('API Error')
					    }
					)
				})
				
			},
			
			onDeleteBlobPaper(files){
				return new Promise(async (r,j) => {
					// 获取初始化Blob需要的数据
					let sasData = this.isSchool ? await this.$tools.getSchoolSas() : await this.$tools.getPrivateSas()
					//初始化Blob
					let containerClient = new blobTool(sasData.url, sasData.name, sasData.sas , this.isSchool ? 'school' : 'private')
					// 等待blob的返回结果
					containerClient.deleteBlobBatch(files).then(
					    (res) => {
					        r(res)
					    },
					    (err) => {
					        this.$Message.error('API Error')
					    }
					)
				})
				
			},

            /**
            * 切换页码操作
            * @param page
            */
            pageChange(page) {
                this.pageNum = page
                this.doFilter()
            },

            /**
             * 切换每页显示数量
             * @param val
             */
            pageSizeChange(val) {
                this.pageSize = val
                this.pageChange(1)
            },

            /** 前往试卷页面 */
            goCreatePaper() {
                this.$router.push({
                    name: 'testPaper',
                    params: {
                        paper: this.paperInfo
                    }
                })
            },

            /** 前往手动挑题页面 */
            goPickExercises() {
                this.$router.push({
                    name: 'exercisesList'
                })
            },

            // 导入试题
            uploadSuccess(response, file, fileList) {
                let that = this
                this.importLoading = true
                if (response.error === null) {
                    let requestData = { htmlString: response.result.data.HtmlString }
                    this.$api.SaveAnalyzeHtml(requestData).then(res => {
                        if (res.error === null) {
                            setTimeout(function () {
                                that.$Message.success('文件上传解析成功！')
                                that.exerciseList = res.result.data
                                that.importLoading = false
                            }, 1000)
                            // this.saveItemBank(res.result.data);
                        }
                    })
                } else {
                    this.$Message.error('对不起，文档解析失败！')
                }
            },

            /**
             * 根据SubjectCode换取SubjectName
             * @param code
             */
            getSubjectName(code) {
                return this.$jsFn.getSubjectName(this.$store.state.schoolBaseInfo.schoolBaseInfo, code)
            },

            /**
             * 根据SubjectCode换取SubjectName
             * @param code
             */
            getPeriodName(code) {
                return this.$jsFn.getPeriod(this.$store.state.schoolBaseInfo.schoolBaseInfo, code).name
            },

            /**
             * 根据GradeCode换取GradeName
             * @param code
             */
            getGradeName(periodId,code) {
                return this.$store.state.schoolBaseInfo.schoolBaseInfo.period.filter(i => i.id === periodId)[0].grades.filter(j => j.id === code)[0].name
            },

            /**
             * 计算试卷题目平均难度
             * @param arr 试题集合
             */
            handleDiffCalc(arr) {
                let levelArr = arr.map(i => i.level)
                return this._.meanBy(levelArr).toFixed(1)
            }

        },
        mounted() {
            this.schoolInfo = this.$store.state.schoolBaseInfo.schoolBaseInfo
            this.periodList = this.schoolInfo.period
        },
        computed: {
            headers() {
                let hd = {}
                hd['Authorization'] = 'Bearer ' + localStorage.getItem('token')
                return hd
            },
			isSchool(){
				return this.filterParams.scope === 'school' ? true : false
			}
        }
    }
</script>
<style src="./TestPaperList.less" lang="less" scoped>
</style>

<style>
    .pl-content-wrap .ivu-page {
        display: flex;
        flex-direction: row;
        justify-content: center;
        margin: 20px 0;
		color: #fff;
    }

    .pl-container .ivu-checkbox-inner {
        display: none !important;
    }

    .random-pick-modal .question-condition-wrap .question-condition-item .condition-label,
    .random-pick-modal .question-condition-wrap .question-condition-item {
        color: #000;
        font-size: 14px;
    }

    .random-pick-modal .question-num-item .ivu-select-selection {
        color: #333333;
    }

    .random-pick-modal .question-num-item .ivu-input-number,
    .random-pick-modal .question-num-item .ivu-input-number-small input {
        color: #000;
    }

    .random-pick-modal .auto-create-wrap {
        background: transparent;
    }

    .random-pick-modal .auto-create-name {
        color: #515a6e;
        text-align: left;
        font-size: 14px;
        font-weight: normal;
        margin-top: 0;
    }

    .random-pick-modal .question-condition-wrap .ivu-btn {
        height: 40px;
        line-height: 40px;
        margin-top: 0;
    }

    .random-pick-modal .question-condition-wrap {
        overflow: hidden;
    }

    .random-pick-modal .ivu-tag {
        background: transparent !important;
    }

    .random-pick-modal .ivu-tag-color-white {
        color: #515a6e !important;
    }

    .random-pick-modal .ivu-tag .ivu-icon-ios-close {
        color: #515a6e !important;
    }
</style>