MongoDB實現問卷/考試設計

MongoDB的特色

MongoDB是一個面向文檔存儲的數據庫。在MongoDB中，一條記錄叫作document（文檔），由相似於JSON結構的鍵值對組成。

因爲相似於MongoDB直接存儲JSON的特性，MongoDB天生適合做爲存儲結構複雜的數據結構的介質。相似於問卷調查和考試這種需求，用mysql這種關係型數據庫實現起來太過複雜，效率低下；而若是使用MongoDB來實現的話，則會發現異常清晰簡單。

需求分析

在一張試卷中，會有不少個問題，問題的類型大致上能夠分爲單選題、多選題、判斷題、簡答題等。每個問題又會有不少個選項，選項能夠是文字描述也能夠是圖片又或者圖文結合。

那麼一張試卷的JSON格式應該大致上長成這樣：

固然這只是最簡單的數據結構，要完成一張試卷，還須要加入更多的屬性。

結構設計

咱們採用自底向上的結構設計方式，先對每一個選項的數據結構進行設計。

選項設計

public class Option {
    /**
     * 選項類型
     */
    private Integer oType = 1;

    /**
     * 選項內容
     */
    private String text;
    
    /**
     * 選項圖片
     */
    private String img;

    /**
     * 是否正確答案
     */
    private Boolean right;

    /**
     * 用戶是否選擇
     */
    private Boolean selected;
    ...

選項類型oType用來標誌選項是普通文本仍是圖片或者圖文；right用來標誌這個選項是不是正確答案，用於自動判卷；selected用來標誌用戶有沒有選擇這個答案。

問題設計

public class Question extends MongoBean {

    /**
     * 數據的id
     */
    private String dataId;

    /**
     * 題目類型，1判斷題；2單選題；3多選題
     */
    private Integer qType;

    /**
     * 題目標題
     */
    private String title;

    /**
     * 題目選項
     */
    private List<Option> options;
    /**
     * 數據類型
     * @see rmjk.enums.BizTypeEnum
     */
    private Integer dataType;

    /**
     * 數據標題
     */
    private String dataTitle;
    /**
     * 解析
     */
    private String analysis;

    /**
     * 這題是否答對
     */
    private Boolean right;

    /**
     * 這題答的時長
     */
    private Long duration;

    /**
     * 這題的得分
     */
    private Long points;
    ...

dataId用於將這個問題同一個業務數據綁定，dataType用來標誌這個業務數據的類型，這兩個字段方便數據的擴展；dataTitle是業務數據的標題；options是這個問題的選項；analysis問題的解析，用於用戶答題結束後的自查；right用來記錄問題的正確與否。

新增問題

上層接口

提供新增問題的接口：

@PostMapping("/saveOrUpdateQuestion")
public JsonData saveOrUpdateQuestion(@RequestBody Question data) {
    questionService.saveOrUpdateQuestion(data);
    return JsonData.success();
}

QuestionService：

public void saveOrUpdateQuestion(Question data) {
    if (StringUtils.isEmpty(data.getId())) {// 新增
        writer.insert(manager.getExamDataBase(), ExamConstant.QUESTION_COLLECT, data);
    } else {//修改
        writer.updateDocument(data, ExamConstant.QUESTION_COLLECT);
    }
}

DAO

Writer：

public void insert(String dataBase, String collect, MongoBean data) {
    if (data.getId() == null) {
        data.setId(BsonTool.uuid());
    }
    MongoCollection<Document> collection = getCollection(dataBase, collect);
    collection.insertOne(Document.parse(JSONObject.toJSONString(data)));
}

public Document updateDocument(MongoBean data, String questionCollect) {
    Document filter = new Document();
    filter.put("id", data.getId());
    Document res = new Document();
    res.put("$set", BsonDocument.parse(JSONObject.toJSONString(data)));
    update(manager.getExamDataBase(), questionCollect, filter, res);
    return res;
}
public boolean update(String dataBase, String collect, Bson filter, Bson update) {
    MongoCollection<Document> collection = getCollection(dataBase, collect);
    UpdateResult ur = collection.updateOne(filter, update);
    return ur.getModifiedCount() > 0;
}

這樣後端的工做就所有完成了，接下來就是前端怎麼給後端提供這樣的數據結構了。

前端實現數據結構

前端使用vue實現JSON的構造：

<Modal title="問題編輯" v-model="showEdit" :closable="false" :mask-closable="false">
    <Form ref="question" :model="question" :rules="ruleValidate">
        <FormItem label="題目類型：" prop="qType">
            <Select v-model="question.qType" class="input-180" placeholder="題目類型" @on-change="changeQType(question)">
                <Option v-for="d in qTypes" :value="d.value" :key="d.value">{{ d.label }}</Option>
            </Select>
        </FormItem>
        <FormItem label="題目：" prop="title">
            <Input
                   class="input-95-per"
                   v-model="question.title"
                   type="textarea"
                   row="1"
                   placeholder="題目"
                   ></Input>
        </FormItem>
        <FormItem label="選項：">
            <div v-for="(o, i2) in question.options" :key="i2" style="display:flex">
                <Input class="input-95-per margin-bot-8 margin-right-10" v-model="o.text">
                    <span slot="prepend">{{i2+1}}:</span>
                </Input>
                <Button size="small" @click="addOpt(question)" v-if="i2===0">+</Button>
                <Button size="small" @click="delOpt(question, o)" v-if="i2">-</Button>
                <Checkbox v-model="o.right">正確答案</Checkbox>
            </div>
        </FormItem>
        <FormItem label="答案解析：">
            <Input
                   class="input-95-per"
                   v-model="question.analysis"
                   type="textarea"
                   row="1"
                   placeholder="答案解析"
                   ></Input>
        </FormItem>
    </Form>
    <div slot="footer">
        <Button type="text" @click="cancelQuestion">取消</Button>
        <Button type="primary" :loading="saveLoading" @click="saveQuestion">保存</Button>
    </div>
</Modal>

這裏綁定的question就是一個問題了。而一張試卷則是由多個問題，再加上試卷的額外屬性構成的。

在question上的dataId恰好就能綁定上試卷的id

Exam exam = new Exam();
List<Question> questions = reader.findRandom(manager.getExamDataBase(), ExamConstant.QUESTION_COLLECT, new Document(), Question.class, no);
exam.setTitle(title);
exam.setDuration(dutation);
return exam;

轉評贊就是最大的鼓勵