题库组件优化

闫增涛

2024-07-01 34f53c3ca69833ddf0649700d26da9ed91c5f1c3

 src/views/examination/components/list.vue

@@ -238,13 +238,14 @@
                    style="margin-left: 20px"
                  >
                    <span>您的答案：</span>
                    <span class="errorBox" v-if="isHaveAnswer(value.userAnswer)">{{
                      arrayToString(value.userAnswer)
                    <span class="errorBox" >{{
                      arrayToString(value.userAnswer) ? arrayToString(value.userAnswer) : '-'
                    }}</span>

                  </p>
                </li>
                <li>
                  <p class="difficulty" v-if="value.difficulty">
                  <div class="difficulty" v-if="value.difficulty">
                        <span style="color: #333">难度等级：</span>
                        <el-rate
                          v-model="value.difficulty"
@@ -253,7 +254,7 @@
                          disabled
                          disabled-void-color="#949494"
                        />
                      </p>
                      </div>
                </li>
              </ul>
              <el-collapse
@@ -339,7 +340,7 @@
  // if (props.collectList) presentId.value = props.collectList[0]
})
// 数组转为字符串方法
const arrayToString = (data) => {
const arrayToString = (data:any) => {
  // 检查是否为数组
  if (Array.isArray(data)) {
    // 使用 join 方法将数组转换为字符串，默认使用逗号分隔
@@ -349,7 +350,7 @@
    return data.replace(/<[^>]*>/g, '')
  }
}
const isHaveAnswer = (data) => {
const isHaveAnswer = (data:any) => {
  if (typeof data == 'string') {
    data = data
      .replace(/<[^>]*>/g, '')
@@ -370,7 +371,7 @@
  }
}
// 收藏按钮
const handleCollect = (num,number) => {
const handleCollect = (num:number,number:number) => {
  emits('setCollect',num,number)
}
// 单选框输入
@@ -380,6 +381,9 @@
</script>

<style lang="less" scoped>
.catalogName {
  margin-top: 40px;
}
.collect-png {
  cursor: pointer;
  width: 24px;
@@ -444,6 +448,7 @@
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  .titleContent {
    width: 95%;
    display: flex;
@@ -592,7 +597,7 @@
  color: #fff;
  .mark-error,.mark-correct {
    white-space: nowrap;
    height: 20px;
    min-height: 20px;
    line-height: 18px;
    padding: 2px 8px;
    margin-right: 5px;
@@ -624,6 +629,10 @@
        color: #FF5E5E;
      }
    }
.difficulty {
  display: flex;
  align-items: center;
}
.analysis-box {
  padding: 10px 0;
}