数学优化

闫增涛

2024-06-13 1e306ec496dec8d938e71e28d218606dc6ec87e4

 src/books/mathBook/view/components/chapter001.vue

@@ -149,7 +149,12 @@
          </p>
          <p class="img fl fl-cn ju-cn">
            <span>图3-15</span>
            <el-tooltip class="item" effect="dark" :content="chapterData.isCollectImg ? '点击取消' : '点击收藏'" placement="top-start">
            <el-tooltip
              class="item"
              effect="dark"
              :content="chapterData.isCollectImg ? '点击取消' : '点击收藏'"
              placement="top-start"
            >
              <img
              :src="chapterData.isCollectImg ? collectCheck : collectImg"
              alt=""
@@ -172,7 +177,12 @@
          ></video>
          <p class="img fl fl-cn ju-cn">
            <span>视频：判数函数奇偶性的方法和步骤 </span>
            <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo ? '点击取消' : '点击收藏'" placement="top-start">
            <el-tooltip
              class="item"
              effect="dark"
              :content="chapterData.isCollectVideo ? '点击取消' : '点击收藏'"
              placement="top-start"
            >
              <img
              :src="chapterData.isCollectVideo ? collectCheck : collectImg"
              alt=""
@@ -574,14 +584,8 @@
      <iframe
        src="https://www.geogebra.org/calculator"
        frameborder="0"
        style="  width: 100%;min-height: 800px;"
        style="width: 100%; min-height: 800px"
      ></iframe>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 解题思路弹窗 -->
    <el-dialog
@@ -592,12 +596,29 @@
    >
      <ul>
        <li v-for="(item, index) in thinkOne" :key="index">
          <div v-if="item.isShow">
          <div v-if="item.isShow" style="display: flex">
            <span class="step-num">
              <span class="step-num-box">{{ index + 1 }}</span>
              <img
                src="../../assets/images/icon/blue-group.png"
                alt=""
                style="margin-right: 10px"
                v-if="index < thinkOne.length - 1"
              />
              <img
                src="../../assets/images/icon/blue.png"
                alt=""
                v-if="index == thinkOne.length - 1"
                style="margin-right: 10px"
              />
            </span>
            <p class="txt-p">{{ item.txt }}</p>
            <div style="text-align: center">
          </div>
        </li>
      </ul>
      <div class="bottom-btn" @click="showNext(thinkIndex)">
        <img src="../../assets/images/icon/mouse.png" alt="" v-if="thinkIndex != 3" />
              <svg
                @click="showNext(index + 1)"
                v-if="index != thinkOne.length - 1"
                xmlns="http://www.w3.org/2000/svg"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                t="1710234570135"
@@ -620,16 +641,6 @@
                />
              </svg>
            </div>
          </div>
        </li>
      </ul>

      <span slot="footer" class="dialog-footer">
        <el-button @click="thinkingDialog = false">取 消</el-button>
        <el-button type="primary" @click="thinkingDialog = false"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 解题步骤弹窗 -->
    <el-dialog
@@ -640,12 +651,29 @@
    >
      <ul>
        <li v-for="(item, index) in stepOne" :key="index">
          <div v-if="item.isShow">
          <div v-if="item.isShow" style="display: flex">
            <span class="step-num">
              <span class="step-num-box">{{ index + 1 }}</span>
              <img
                src="../../assets/images/icon/blue-group.png"
                alt=""
                style="margin-right: 10px"
                v-if="index < stepOne.length - 1"
              />
              <img
                src="../../assets/images/icon/blue.png"
                alt=""
                v-if="index == stepOne.length - 1"
                style="margin-right: 10px"
              />
            </span>
            <p class="txt-p">{{ item.txt }}</p>
            <div style="text-align: center">
          </div>
        </li>
      </ul>
      <div class="bottom-btn" @click="showNextChange(stepIndex)">
        <img src="../../assets/images/icon/mouse.png" alt="" v-if="stepIndex != 2" />
              <svg
                @click="showNextChange(index + 1)"
                v-if="index != thinkOne.length - 1"
                xmlns="http://www.w3.org/2000/svg"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                t="1710234570135"
@@ -668,14 +696,6 @@
                />
              </svg>
            </div>
          </div>
        </li>
      </ul>

      <span slot="footer" class="dialog-footer">
        <el-button @click="stepDialog = false">取 消</el-button>
        <el-button type="primary" @click="stepDialog = false">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
@@ -715,6 +735,8 @@
      stepDialog: false,
      videoPath: "",
      questionData: [],
      stepIndex: 1,
      thinkIndex:1,
      chapterData: {
        isCollectImg: false,
        isCollectVideo: false,
@@ -811,10 +833,16 @@
      const number = this.thinkOne.findIndex((item, index) => index == num);
      console.log(number);
      this.thinkOne[number].isShow = true;
      if(this.thinkIndex <= 2) {
        this.thinkIndex ++
      }
    },
    showNextChange(num) {
      const number = this.stepOne.findIndex((item, index) => index == num);
      this.stepOne[number].isShow = true;
      if(this.stepIndex < 2) {
        this.stepIndex ++ 
      }
    },
  },
};
@@ -829,14 +857,28 @@
  width: 100%;
  min-height: 800px;
  border: 1px solid #00a1e9;
  border-radius:10px
  border-radius: 10px;
}
li {
  list-style: none;
}
.txt-p {
  margin-top: 0;
  border-bottom: 1px dashed #000;
  padding: 10px 0;
}
.bottom-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.step-num {
  position: relative;
  .step-num-box {
    position: absolute;
    top: 16px;
    left: 13px;
    color: #fff;
  }
}
</style>