From 38cdff1163573261e36f9d7f8920e1578e1172c8 Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期五, 22 十一月 2024 10:55:33 +0800 Subject: [PATCH] 数学书收藏功能优化 --- src/components/examinations/index.vue | 77 +++++++++++++++++++++++++------------- 1 files changed, 50 insertions(+), 27 deletions(-) diff --git a/src/components/examinations/index.vue b/src/components/examinations/index.vue index 6af119d..35925bb 100644 --- a/src/components/examinations/index.vue +++ b/src/components/examinations/index.vue @@ -7,12 +7,21 @@ v-show="item.infoList.length" > <p class="catalogName" :style="{ color: primaryColor }"> - <span v-if="nindex == 0">涓�銆�</span> - <span v-if="nindex == 1">浜屻��</span> - <span v-if="nindex == 2">涓夈��</span> - <span v-if="nindex == 3">鍥涖��</span> - <span v-if="nindex == 4">浜斻��</span> - <span v-html="item.catalogName"></span> + <span class="catalogName-box" > + <span v-if="nindex == 0">涓�銆�</span> + <span v-if="nindex == 1">浜屻��</span> + <span v-if="nindex == 2">涓夈��</span> + <span v-if="nindex == 3">鍥涖��</span> + <span v-if="nindex == 4">浜斻��</span> + <span v-html="item.catalogName"></span> + </span> + <img + :src="item.isCollect ? isHeart : heart" + alt="" + class="collect-png" + @click="setCollect(nindex, index)" + v-if="!hideCollect && item.type == 'material'" + /> </p> <el-image v-if="item.catalogImage" @@ -79,21 +88,22 @@ v-html="itemText" class="input-txt" ></span> - <input + <!-- <input v-else type="text" class="input" v-model.trim="value.userAnswer[itemText.num]" :disabled="value.isComplete" :style="{ backgroundColor: inputBc }" - /> - <!-- <math-field - v-else - class="mathField" + /> --> + <math-field + v-else + class="mathField" :menuItems="[]" - @input="onChangeInput" + @input="onChangeInput($event,nindex,index,itemText.num)" > - </math-field> --> + {{ value.userAnswer[itemText.num] }} + </math-field> </span> </p> <!-- 瀵屾枃鏈� --> @@ -129,13 +139,13 @@ </span> </p> </div> - <!-- <img + <img :src="value.isCollect ? isHeart : heart" alt="" class="collect-png" @click="setCollect(nindex, index)" - v-if="!(hideCollect && value.questionType == 'shortAnswer')" - /> --> + v-if="!hideCollect && item.type != 'material'" + /> <!-- 鏀惰棌 --> </div> <div class="questionContent"> @@ -522,7 +532,7 @@ </template> <script> - import { MathfieldElement } from "mathlive" +import { MathfieldElement } from "mathlive"; import { Message } from "element-ui"; import TEditorVue from "../teditor/index.vue"; export default { @@ -608,12 +618,12 @@ getPublicImage(md5, width, height) { if (!md5) return; if (md5.includes("http")) { - if(width) { - return md5 + `?width=${width}` + if (width) { + return md5 + `?width=${width}`; } else { - return md5 + return md5; } - }; + } let src = null; if (md5) { src = process.env.VUE_APP_API_URL + `/file/GetPreViewImage?md5=${md5}`; @@ -816,8 +826,15 @@ }, // 棰樼洰鏀惰棌鎸夐挳,鏀惰棌鍜屽彇娑堝悓涓�鎺ュ彛锛屽彇娑堟暟缁勫噺鍘昏椤筰d setCollect(num, number) { - const item = this.cardData[num].infoList[number]; + let item = null + if(number) { + item = this.cardData[num].infoList[number]; + + } else { + item = this.cardData[num] + } item.isCollect = !item.isCollect; + console.log(111,item); if (this.cardData.length == 0) { this.collectList.push(item.id); } else { @@ -835,7 +852,7 @@ const item = this.allCollect[index]; if (item.type == this.sourceType) item.collectList = this.collectList; } - // console.log(this.allCollect, this.collectList, list); + console.log('鐐瑰嚮鏀惰棌鎸夐挳',this.allCollect) this.MG.identity .setUserKey({ setKeyRequests: [ @@ -862,6 +879,7 @@ .then((res) => { try { const collect = JSON.parse(res[0].value); + console.log('鍏ㄩ儴鏀惰棌id',collect); if (collect.length) { this.collectList = collect.find( (citem) => citem.type == this.sourceType @@ -905,13 +923,12 @@ ).errorList; } } catch (error) {} - console.log("閿欓鍒楄〃", this.allError); }) .catch(() => {}); }, - onChangeInput(e) { - console.log(e.target.value); - } + onChangeInput(e,index,cindex,num) { + this.cardData[index].infoList[cindex].userAnswer[num] = e.target.value + }, }, }; </script> @@ -924,8 +941,13 @@ <style lang="less" scoped> .catalogName { + display: flex; text-indent: 1em !important; font-size: 16px; + .catalogName-box { + display: inline-block; + width: 94%; + } } .catalogImage { width: 50%; @@ -1128,6 +1150,7 @@ } .mathField { min-width: 200px; + max-width: 518px; } } -- Gitblit v1.9.1