Explorar el Código

feat: 审核题目的前端操作流程

mjh hace 5 años
padre
commit
d21e1b3b7b
Se han modificado 3 ficheros con 346 adiciones y 413 borrados
  1. 204 196
      src/components/checkQuestionCard.vue
  2. 138 66
      src/views/Bok/Main/Check.vue
  3. 4 151
      src/views/Bok/Main/Collection.vue

+ 204 - 196
src/components/checkQuestionCard.vue

@@ -3,11 +3,11 @@
         <template #header>
             <el-row>
                 <el-col :span="3">
-                    <span><strong>S/N: </strong>{{curNum+1}} / {{totalNum}}</span>
+                    <span><strong>S/N: </strong>{{ curNum + 1 }} / {{ totalNum }}</span>
                 </el-col>
 
                 <el-col :span="5">
-                    <span><strong>题目类型: </strong>{{questionvo.type}}</span>
+                    <span><strong>题目类型: </strong>{{ questionvo.type }}</span>
                 </el-col>
 
                 <el-col :span="6">
@@ -16,9 +16,9 @@
                                 <span><strong>KnowledgeId: </strong></span>
                                 <el-tooltip v-for="item in questionvo.knowledgeId" effect="dark" placement="bottom">
                                     <template #content>
-                                        {{map(item)}}
+                                        {{ map(item) }}
                                     </template>
-                                    <el-tag  effect="dark" style="margin-right: 2px">{{item}}</el-tag>
+                                    <el-tag effect="dark" style="margin-right: 2px">{{ item }}</el-tag>
                                 </el-tooltip>
                             </span>
                         <span v-else>
@@ -47,8 +47,9 @@
                     </div>
                     <div class="stem-extension" v-if="isAll">
                         <div class="bQuestion-card-body-options" v-if="questionvo.type === 'choice'">
-                            <div v-for="(item,index) in questionvo.options" >
-                                <div v-if="questionvo.answer.split('').indexOf(index) !== -1" class="underline-correct-answer">
+                            <div v-for="(item,index) in questionvo.options">
+                                <div v-if="questionvo.answer.split('').indexOf(index) !== -1"
+                                     class="underline-correct-answer">
                                     <MarkdownText :raw="index+': '+item"></MarkdownText>
                                 </div>
                                 <div v-else>
@@ -57,8 +58,9 @@
                             </div>
                         </div>
                         <div class="bQuestion-card-body-options" v-if="questionvo.type === 'multiple_choice'">
-                            <div v-for="(item,index) in questionvo.options" >
-                                <div v-if="questionvo.answer.split(';').indexOf(index) !== -1" class="underline-correct-answer">
+                            <div v-for="(item,index) in questionvo.options">
+                                <div v-if="questionvo.answer.split(';').indexOf(index) !== -1"
+                                     class="underline-correct-answer">
                                     <MarkdownText :raw="index+': '+item"></MarkdownText>
                                 </div>
                                 <div v-else>
@@ -69,12 +71,12 @@
                         <div class="bQuestion-card-body-blanks" v-if="questionvo.type === 'blank'">
                             <div v-for="index in Object.keys(questionvo.blanks).length">
                                 <div class="correct_answer">
-                                    __{{index}}__: {{questionvo.blanks['__'+index+'__']}}
+                                    __{{ index }}__: {{ questionvo.blanks['__' + index + '__'] }}
                                 </div>
                             </div>
                         </div>
                         <div class="bQuestion-card-body-true_false" v-if="questionvo.type === 'true_false'">
-                            <div class="correct_answer"> {{questionvo.answer}}</div>
+                            <div class="correct_answer"> {{ questionvo.answer }}</div>
                         </div>
                     </div>
                 </div>
@@ -85,15 +87,15 @@
                     <div class="info-block">
                         <el-row>
                             <el-col :span="10">
-                                <strong>KeyPoints: </strong>{{questionvo.keyPoints}}
+                                <strong>KeyPoints: </strong>{{ questionvo.keyPoints }}
                             </el-col>
                             <el-col :span="6">
-                                <strong>题目难度: </strong>{{questionvo.weight}}/5
+                                <strong>题目难度: </strong>{{ questionvo.weight }}/5
                             </el-col>
                             <el-col :span="4">
                                 <span><strong>Tags: </strong></span>
                                 <span v-if="questionvo.tags && questionvo.tags.length !== 0">
-                                    <el-tag v-for="(item, index) in questionvo.tags" effect="dark">{{item}}</el-tag>
+                                    <el-tag v-for="(item, index) in questionvo.tags" effect="dark">{{ item }}</el-tag>
                                 </span>
                                 <span v-else>
                                     <span>no tags</span>
@@ -120,7 +122,8 @@
                         <div class="info-block" v-if="questionvo.type === 'blank' && questionvo.analysis.length > 5">
                             <MarkdownText :raw="'<strong>解析: </strong>'+questionvo.analysis"></MarkdownText>
                         </div>
-                        <div class="info-block" v-if="questionvo.type === 'short_answer' && questionvo.analysis.length > 5">
+                        <div class="info-block"
+                             v-if="questionvo.type === 'short_answer' && questionvo.analysis.length > 5">
                             <MarkdownText :raw="'<strong>解析: </strong>'+questionvo.analysis"></MarkdownText>
                         </div>
                     </div>
@@ -133,25 +136,25 @@
                 <div class="footer">
                     <el-row>
                         <el-col :span="3">
-                            <div><strong>状态: </strong>{{questionvo.state}}</div>
+                            <div><strong>状态: </strong>{{ questionvo.state }}</div>
                         </el-col>
                         <el-col :span="5">
-                            <div><strong>申请人: </strong>{{savedUserName}}</div>
+                            <div><strong>申请人: </strong>{{ savedUserName }}</div>
                         </el-col>
                         <el-col :span="10"></el-col>
                         <el-col :span="6">
                             <div>
-                                <strong>申请日期: </strong> {{toMyDate(questionvo.createdTime)}}
+                                <strong>申请日期: </strong> {{ toMyDate(questionvo.createdTime) }}
                             </div>
                         </el-col>
                     </el-row>
                 </div>
                 <div class="footer" v-if="recordList.length !== 0">
                     <el-table :data="recordTable" style="width: 100%;background-color: transparent" height="100">
-                        <el-table-column prop="序号" label="序号" width="240" />
-                        <el-table-column prop="操作时间" label="操作时间" width="360" />
-                        <el-table-column prop="操作人" label="操作人" width="240" />
-                        <el-table-column prop="操作类型" label="操作类型" />
+                        <el-table-column prop="序号" label="序号" width="240"/>
+                        <el-table-column prop="操作时间" label="操作时间" width="360"/>
+                        <el-table-column prop="操作人" label="操作人" width="240"/>
+                        <el-table-column prop="操作类型" label="操作类型"/>
                     </el-table>
                 </div>
                 <div class="footer" v-else>
@@ -178,197 +181,202 @@
 </template>
 
 <script>
-    import MarkdownText from "./MarkdownText";
-    import {toMyDate} from "../utils/dateConvertor";
-    import {map} from "../utils/knowledgeMapper";
-    import store from "../store";
+import MarkdownText from "./MarkdownText";
+import {toMyDate} from "../utils/dateConvertor";
+import {map} from "../utils/knowledgeMapper";
+import store from "../store";
 
-    export default {
-        name: "checkCard",
-        components:{
-            MarkdownText,
-        },
-        props: {
-            questionvo: Object,
-            curNum: Number,
-            totalNum: Number,
+export default {
+    name: "checkCard",
+    components: {
+        MarkdownText,
+    },
+    props: {
+        questionvo: Object,
+        curNum: Number,
+        totalNum: Number,
+    },
+    data() {
+        return {
+            isAll: false,
+            savedUserName: '',
+            // 审核dialog的可视化
+            checkDialogVisible: false,
+            // 审核失败的原因
+            failCheckOption: [
+                '题目中存在错误', '题目与相关内容无关', '题目中存在敏感词', '其他'
+            ],
+            // 详细解释
+            failCheckInput: "",
+            failCheckList: [],
+            recordList: [],
+            recordNameDict: {},
+        }
+    },
+    computed: {
+        recordTable() {
+            let recordTable1 = [];
+            let length = this.recordList.length;
+            for (let i = 0; i < length; i++) {
+                let recordDict = {};
+                recordDict["序号"] = i + 1;
+                recordDict["操作时间"] = this.toMyDate(this.recordList[length - i - 1].time);
+                recordDict["操作人"] = this.recordNameDict[this.recordList[length - i - 1].userId];
+                recordDict["操作类型"] = this.recordList[length - i - 1].operationType;
+                recordTable1.push(recordDict);
+            }
+            return recordTable1;
         },
-        data(){
-            return{
-                isAll: false,
-                savedUserName: '',
-                // 审核dialog的可视化
-                checkDialogVisible: false,
-                // 审核失败的原因
-                failCheckOption: [
-                    '题目中存在错误','题目与相关内容无关','题目中存在敏感词','其他'
-                ],
-                // 详细解释
-                failCheckInput: "",
-                failCheckList: [],
-                recordList: [],
-                recordNameDict: {},
+        denyReason() {
+            let denyReason = "";
+            for (let reason of this.failCheckList) {
+                denyReason += reason + ", ";
+            }
+            denyReason += this.failCheckInput;
+            return denyReason;
+        }
+    },
+    methods: {
+        map,
+        toMyDate,
+        expand() {
+            if (!this.isAll) {
+                this.isAll = true;
             }
         },
-        computed: {
-            recordTable(){
-                let recordTable1 = [];
-                let length = this.recordList.length;
-                for (let i = 0; i < length; i++) {
-                    let recordDict = {};
-                    recordDict["序号"] = i+1;
-                    recordDict["操作时间"] = this.toMyDate(this.recordList[length-i-1].time);
-                    recordDict["操作人"] = this.recordNameDict[this.recordList[length-i-1].userId];
-                    recordDict["操作类型"] = this.recordList[length-i-1].operationType;
-                    recordTable1.push(recordDict);
-                }
-                return recordTable1;
-            },
-            denyReason(){
-                let denyReason = "";
-                for (let reason of this.failCheckList) {
-                    denyReason += reason+", ";
-                }
-                denyReason += this.failCheckInput;
-                return denyReason;
+        withdraw() {
+            if (this.isAll) {
+                this.isAll = false;
             }
         },
-        methods: {
-            map,
-            toMyDate,
-            expand(){
-                if(!this.isAll){
-                    this.isAll = true;
-                }
-            },
-            withdraw(){
-                if(this.isAll){
-                    this.isAll = false;
-                }
-            },
-            approve(){ // 通过审核
-                this.questionvo.state = "APPROVED";
-                let record = {
-                    userId: store.state.user.id,
-                    operationType: "Approve",
-                }
-                this.$api.updateQuestion(this.questionvo)
-                    .then(res => {
-                        this.$message({
-                            type: 'success',
-                            message: '通过成功!'
-                        });
-                        console.log("checkQuestionCard-approve");
-                        console.log(res);
-                        record.questionId = res.data.result.id;
-                        record.time = new Date();
-                        // 审核通过,添加操作记录
-                        this.$api.createRecord(record)
-                            .then(res1 => {
-                                console.log("checkQuestionCard-approve-createRecord");
-                                console.log(res1);
-                            }).catch(err1 => {
-                            console.log(err1);
-                        })
+
+        approve() { // 通过审核
+            this.questionvo.state = "APPROVED";
+            let record = {
+                userId: store.state.user.id,
+                operationType: "Approve",
+            }
+            this.$api.updateQuestion(this.questionvo)
+                .then(res => {
+                    this.$message({
+                        type: 'success',
+                        message: '通过成功!'
+                    });
+                    console.log("checkQuestionCard-approve");
+                    console.log(res);
+                    record.questionId = res.data.result.id;
+                    record.time = new Date();
+                    // 审核通过,添加操作记录
+                    this.$api.createRecord(record)
+                        .then(res1 => {
+                            console.log("checkQuestionCard-approve-createRecord");
+                            console.log(res1);
+                        }).catch(err1 => {
+                        console.log(err1);
                     })
-                    .catch(err => {
-                        this.$notify.error({
-                            title: '错误',
-                            message: '通过失败'
-                        });
-                        console.log(err);
                 })
-            },
-            deny(){ // 拒绝通过
-                let reason = this.denyReason
-                this.questionvo.state = "REFUSED";
-                let record = {
-                    userId: store.state.user.id,
-                    operationType: "Refuse",
-                }
-                this.$api.updateQuestion(this.questionvo)
-                    .then(res => {
-                        this.$message({
-                            type: 'success',
-                            message: '拒绝成功!'
-                        });
-                        console.log("checkQuestionCard-deny")
-                        console.log(res);
-                        record.questionId = res.data.result.id;
-                        record.time = new Date();
-                        // todo 这里直接调用denyReason就为空?
-                        record.remark = reason;
-                        // 审核通过,添加操作记录
-                        this.$api.createRecord(record)
-                            .then(res1 => {
-                                console.log("checkQuestionCard-deny-createRecord");
-                                console.log(res1);
-                            }).catch(err1 => {
-                            console.log(err1);
-                        })
-                    })
-                    .catch(err => {
-                        this.$notify.error({
-                            title: '错误',
-                            message: '拒绝失败'
-                        });
-                        console.log(err);
-                    })
-                this.failCheckList = []
-                this.failCheckInput = ""
-                this.checkDialogVisible = false
-            },
-            // 关闭审核dialog前的方法
-            handleCheckDialogClose(done){
-                const _this = this
-                _this.$confirm('此操作将丢失填写信息, 是否继续?', '提示')
-                    .then(() => {
-                        _this.failCheckList = []
-                        _this.failCheckInput = ""
-                        done()})
-                    .catch(()=>{})
-            },
-        },
-        mounted() {
-            if(this.questionvo.savedUserId){
-                this.$api.getUserById(this.questionvo.savedUserId)
-                    .then(res => {
-                        if(res.data.result.name){
-                            this.savedUserName =  res.data.result.name;
-                        }
-                    }).catch(err => {
+                .catch(err => {
+                    this.$notify.error({
+                        title: '错误',
+                        message: '通过失败'
+                    });
                     console.log(err);
                 })
-            }
+            this.$emit("approved")
+        },
 
-            this.$api.getRecordByQid(this.questionvo.id) // 异步函数2:根据题目id获得ope_record
-                .then(res1 => {
-                    let tempList = res1.data.result.content;
-                    this.recordList = tempList;
-                    for (let record of tempList) { //这里换成this.recordList是没问题的
-                        if(!this.recordNameDict[record.userId]){
-                            this.$api.getUserById(record.userId) //异步函数3:根据记录中的用户ID获得其name
-                                .then(res2 => {
-                                    if(res2.data.result.name){
-                                        this.recordNameDict[record.userId] = res2.data.result.name;
-                                    }
-                                }).catch(err2 => {
-                                console.log(err2);
-                            })
-                        }
+        deny() { // 拒绝通过
+            let reason = this.denyReason
+            this.questionvo.state = "REFUSED";
+            let record = {
+                userId: store.state.user.id,
+                operationType: "Refuse",
+            }
+            this.$api.updateQuestion(this.questionvo)
+                .then(res => {
+                    this.$message({
+                        type: 'success',
+                        message: '拒绝成功!'
+                    });
+                    console.log("checkQuestionCard-deny")
+                    console.log(res);
+                    record.questionId = res.data.result.id;
+                    record.time = new Date();
+                    // todo 这里直接调用denyReason就为空?
+                    record.remark = reason;
+                    // 审核通过,添加操作记录
+                    this.$api.createRecord(record)
+                        .then(res1 => {
+                            console.log("checkQuestionCard-deny-createRecord");
+                            console.log(res1);
+                        }).catch(err1 => {
+                        console.log(err1);
+                    })
+                })
+                .catch(err => {
+                    this.$notify.error({
+                        title: '错误',
+                        message: '拒绝失败'
+                    });
+                    console.log(err);
+                })
+            this.failCheckList = []
+            this.failCheckInput = ""
+            this.checkDialogVisible = false
+        },
+        // 关闭审核dialog前的方法
+        handleCheckDialogClose(done) {
+            const _this = this
+            _this.$confirm('此操作将丢失填写信息, 是否继续?', '提示')
+                .then(() => {
+                    _this.failCheckList = []
+                    _this.failCheckInput = ""
+                    done()
+                })
+                .catch(() => {
+                })
+        },
+    },
+    mounted() {
+        if (this.questionvo.savedUserId) {
+            this.$api.getUserById(this.questionvo.savedUserId)
+                .then(res => {
+                    if (res.data.result.name) {
+                        this.savedUserName = res.data.result.name;
                     }
-                }).catch(err1 => {
-                console.log(err1);
-            });
+                }).catch(err => {
+                console.log(err);
+            })
         }
+
+        this.$api.getRecordByQid(this.questionvo.id) // 异步函数2:根据题目id获得ope_record
+            .then(res1 => {
+                let tempList = res1.data.result.content;
+                this.recordList = tempList;
+                for (let record of tempList) { //这里换成this.recordList是没问题的
+                    if (!this.recordNameDict[record.userId]) {
+                        this.$api.getUserById(record.userId) //异步函数3:根据记录中的用户ID获得其name
+                            .then(res2 => {
+                                if (res2.data.result.name) {
+                                    this.recordNameDict[record.userId] = res2.data.result.name;
+                                }
+                            }).catch(err2 => {
+                            console.log(err2);
+                        })
+                    }
+                }
+            }).catch(err1 => {
+            console.log(err1);
+        });
     }
+}
 </script>
 
 <style>
-    .cQuestion-card{
-        margin: 20px;
-        font-size: 18px;
-        background-color: #eef7f2;
-    }
+.cQuestion-card {
+    margin: 20px;
+    font-size: 18px;
+    background-color: #eef7f2;
+}
 
 </style>

+ 138 - 66
src/views/Bok/Main/Check.vue

@@ -1,83 +1,155 @@
 <template>
     <div>
         <h1>题目审查</h1>
-
-        <div class="el-pagination-body">
-            <el-pagination
-                    @size-change="handleSizeChange"
-                    @current-change="handleCurrentChange"
-                    :current-page="currentPage"
-                    :page-sizes="[5, 10, 15, 20]"
-                    :page-size="pageSize"
-                    layout="total, sizes, prev, pager, next, jumper"
-                    :total=this.totalNum
-                    v-if="this.questionList.length !== 0"
-            >
-            </el-pagination>
-        </div>
-
-        <div>
-            <checkQuestionCard v-for="(item, index) in questionList"
-                               :questionvo="item"
-                               :key="item.id"
-                               :cur-num="index+(currentPage-1)*pageSize"
-                               :total-num="totalNum"
-            ></checkQuestionCard>
-        </div>
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+            <el-tab-pane label="未审核" name="checking">
+                <div class="el-pagination-body">
+                    <el-pagination
+                        @size-change="handleSizeChange"
+                        @current-change="handleCurrentChange(currentPage, questionList, 'CHECKING')"
+                        :current-page="currentPage"
+                        :page-sizes="[5, 10, 15, 20]"
+                        :page-size="pageSize"
+                        layout="total, sizes, prev, pager, next, jumper"
+                        :total=this.totalNum
+                        v-if="this.questionList.length !== 0"
+                    >
+                    </el-pagination>
+                </div>
+                <div>
+                    <checkQuestionCard v-for="(item, index) in questionList"
+                                       :questionvo="item"
+                                       :key="item.id"
+                                       :cur-num="index+(currentPage-1)*pageSize"
+                                       :total-num="totalNum"
+                                       @approved="handleApproved(item)"
+                    ></checkQuestionCard>
+                </div>
+            </el-tab-pane>
+            <el-tab-pane label="未通过" name="refused">
+                <div class="el-pagination-body">
+                    <el-pagination
+                        @size-change="handleSizeChange"
+                        @current-change="handleCurrentChange(refusedCurrentPage, refusedQuestionList, 'REFUSED')"
+                        :current-page="refusedCurrentPage"
+                        :page-sizes="[5, 10, 15, 20]"
+                        :page-size="pageSize"
+                        layout="total, sizes, prev, pager, next, jumper"
+                        :total=refusedTotalNum
+                        v-if="refusedQuestionList.length !== 0"
+                    >
+                    </el-pagination>
+                </div>
+                <div>
+                    <checkQuestionCard v-for="(item, index) in refusedQuestionList"
+                                       :questionvo="item"
+                                       :key="item.id"
+                                       :cur-num="index+(refusedCurrentPage-1)*pageSize"
+                                       :total-num="refusedTotalNum"
+                                       @approved="handleApproved(item, refusedQuestionList)"
+                    ></checkQuestionCard>
+                </div>
+            </el-tab-pane>
+        </el-tabs>
 
     </div>
 </template>
 
 <script>
-    import checkQuestionCard from "../../../components/checkQuestionCard";
-    export default {
-        name: "Check",
-        components:{
-            checkQuestionCard,
+import checkQuestionCard from "../../../components/checkQuestionCard";
+
+export default {
+    name: "Check",
+    components: {
+        checkQuestionCard,
+    },
+    data() {
+        return {
+            questionList: [],
+            currentPage: 1,
+            pageSize: 20,
+            totalNum: 0,
+
+            // 分页所需数据
+            activeName: "checking",
+
+            // 未通过审核题目列表
+            refusedQuestionList: [],
+            refusedCurrentPage: 1,
+            refusedTotalNum: 0,
+        }
+    },
+    methods: {
+        handleSizeChange(val) {
+            console.log(`QuestionRepository/index-handleSizeChange 每页 ${val} 条`);
+            this.pageSize = val;
+        },
+        handleCurrentChange(val, currentPage, questionList, states) { // 当点击新的页面时才请求新的数据
+            console.log(`Check-handleCurrentChange 当前页: ${val}`);
+            currentPage = val;
+            this.$api.getStateQuestion(states, val - 1, this.pageSize)
+                .then(res => {
+                    console.log("handleCurrentChange-check");
+                    console.log(res);
+                    questionList = res.data.result.content;
+                }).catch(error => {
+                console.log(error);
+            })
         },
-        data(){
-            return{
-                questionList: [],
-                currentPage: 1,
-                pageSize: 20,
-                totalNum: 0,
+
+        // 切换分页
+        handleClick(tab, event) {
+            switch (tab.props.name){
+                case "checking":
+                    this.$api.getStateQuestion(tab.props.name.toUpperCase(), 0, this.pageSize)
+                        .then(res => {
+                            console.log("getStateQuestion-CHECKING");
+                            console.log(res);
+                            this.questionList = res.data.result.content;
+                            this.totalNum = res.data.result.totalElements;
+                        }).catch(err => {
+                        console.log(err);
+                    })
+                    break;
+                case "refused":
+                    this.$api.getStateQuestion(tab.props.name.toUpperCase(), 0, this.pageSize)
+                        .then(res => {
+                            console.log("getStateQuestion-REFUSED");
+                            console.log(res);
+                            this.refusedQuestionList = res.data.result.content;
+                            this.refusedTotalNum = res.data.result.totalElements;
+                        }).catch(err => {
+                        console.log(err);
+                    })
+                    break;
             }
         },
-        methods:{
-            handleSizeChange(val) {
-                console.log(`QuestionRepository/index-handleSizeChange 每页 ${val} 条`);
-                this.pageSize = val;
-            },
-            handleCurrentChange(val) { // 当点击新的页面时才请求新的数据
-                console.log(`Check-handleCurrentChange 当前页: ${val}`);
-                this.currentPage = val;
-                let states = 'CHECKING';
-                this.$api.getStateQuestion(states, val-1, this.pageSize)
-                    .then(res => {
-                        console.log("handleCurrentChange-check");
-                        console.log(res);
-                        this.questionList = res.data.result.content;
-                    }).catch(error => {
-                    console.log(error);
-                })
-            },
 
+        // 处理题目审核通过
+        handleApproved(item, questionList){
+            questionList = questionList.filter(function (q, index){
+                return q !== item
+            })
         },
-        mounted() {
-            let states = 'CHECKING';
-            this.$api.getStateQuestion(states, 0, this.pageSize)
-                .then(res => {
-                    console.log("getStateQuestion-CHECKING");
-                    console.log(res);
-                    this.questionList = res.data.result.content;
-                    this.totalNum = res.data.result.totalElements;
-                }).catch(err => {
-                    console.log(err);
-                })
-        }
+    },
+    mounted() {
+        let states = "CHECKING"
+        this.$api.getStateQuestion(states, 0, this.pageSize)
+            .then(res => {
+                console.log("getStateQuestion-CHECKING");
+                console.log(res);
+                this.questionList = res.data.result.content;
+                this.totalNum = res.data.result.totalElements;
+            }).catch(err => {
+            console.log(err);
+        })
     }
+}
 </script>
 
-<style scoped>
-
+<style>
+.el-tabs__header{
+    padding-left: 20px;
+    padding-right: 20px;
+}
 </style>

+ 4 - 151
src/views/Bok/Main/Collection.vue

@@ -1,160 +1,13 @@
 <template>
-    <h1>Collection</h1>
-    <el-button @click="createQuestion">新建题目</el-button>
-    <el-button @click="createQuestionByGruop">新建题目组</el-button>
-
-    <div class="QuestionBody">
-      <BriefQuestionCard v-for="(item,index) in questionList.slice((currentPage-1)*pageSize,currentPage*pageSize)"
-                         :questionvo="item" :total-num="questionList.length" :cur-num="index+(currentPage-1)*pageSize" />
-    </div>
-
-
-    <div class="el-pagination">
-      <el-pagination
-              @size-change="handleSizeChange"
-              @current-change="handleCurrentChange"
-              :current-page="currentPage"
-              :page-sizes="[5, 10, 15, 20]"
-              :page-size="pageSize"
-              layout="total, sizes, prev, pager, next, jumper"
-              :total=this.questionList.length
-              v-if="this.questionList.length !== 0"
-      >
-      </el-pagination>
-    </div>
-
-    <el-drawer
-            title="新建题目"
-            :before-close="handleClose"
-            v-model="dialog"
-            direction="rtl"
-            custom-class="question-drawer"
-            ref="drawer"
-            size="35%"
-    >
-      <QuestionCreater :dialog="dialog" @closeDialog="closeDialog"/>
-
-    </el-drawer>
-
-    <el-drawer
-            title="批量新建题目"
-            :before-close="handleClose"
-            v-model="dialog1"
-            direction="rtl"
-            custom-class="questionGroup-drawer"
-            ref="drawer"
-            size="35%"
-    >
-      <QuestionGroupCreater :dialog="dialog1" @closeDialog="closeDialog1"/>
-
-    </el-drawer>
-
-
+  <div>collection</div>
 </template>
 
-<script lang="ts">
-
-import axios from "axios";
-import QuestionCreater from "../../../components/QuestionCreater.vue";
-import QuestionGroupCreater from "../../../components/QuestionGroupCreater.vue";
-import BriefQuestionCard from "../../../components/BriefQuestionCard.vue";
-
+<script>
 export default {
-  name: "Collection",
-  components: {
-    QuestionCreater,
-    QuestionGroupCreater,
-    BriefQuestionCard,
-  },
-  data() {
-    return{
-      info: null,
-      questionList: [],
-      dialog:false,
-      dialog1:false,
-      currentPage: 1,
-      pageSize: 10,
-    }
-  },
-  mounted() {
-    axios.get("/api/api/question")
-            .then(res => {
-              this.info = res;
-              this.questionList = res.data.content
-              console.log(res);
-            }).catch(error => {
-              console.log(error);
-            }).finally(() => {
-              console.log("mounted completed");
-    })
-  },
-  computed: {
-  },
-  methods: {
-    createQuestion(){
-      this.dialog = true;
-    },
-    createQuestionByGruop(){
-      this.dialog1 = true;
-    },
-    handleClose(done) {
-      if (this.loading) {
-        return;
-      }
-      this.$confirm('确定要提交表单吗?')
-              .then(_ => {
-                this.loading = true;
-                this.timer = setTimeout(() => {
-                  done();
-                  // 动画关闭需要一定的时间
-                  setTimeout(() => {
-                    this.loading = false;
-                  }, 400);
-                }, 2000);
-              })
-              .catch(_ => {});
-    },
-    cancelForm() {
-      this.loading = false;
-      this.dialog = false;
-      clearTimeout(this.timer);
-    },
-    closeDialog(){
-      this.dialog = false;
-    },
-    closeDialog1(){
-      this.dialog1 = false;
-    },
-    handleSizeChange(val) {
-      console.log(`每页 ${val} 条`);
-      this.pageSize = val;
-    },
-    handleCurrentChange(val) {
-      console.log(`当前页: ${val}`);
-      this.currentPage = val;
-    },
-
-  },
-  watch: {
-    // questionList: function () {
-    //   axios.get("/api/api/question")
-    //           .then(res => {
-    //             this.info = res;
-    //             this.questionList = res.data.content
-    //             console.log(res);
-    //           }).catch(error => {
-    //     console.log(error);
-    //   }).finally(() => {
-    //     console.log("watch completed");
-    //   })
-    // }
-  }
+  name: "Collection"
 }
 </script>
 
 <style scoped>
-  .el-pagination{
-    margin: 20px;
-  }
 
-</style>
+</style>