页码监听

YM

2024-05-17 67d22fb0aeb9fe90b766abae0e41cb04aebc1296

页码监听

 src/assets/js/toolClass.js

@@ -1,75 +1,76 @@
import SparkMD5 from 'spark-md5'
import { getPublicImage } from '@/assets/js/middleGround/tool.js'
import SparkMD5 from "spark-md5";
import { getPublicImage } from "@/assets/js/middleGround/tool.js";
// import moment from "moment";

var tool = {
  secondToTime(second) {
    var minute = Math.floor(second / 60)
    var sec = second % 60
    var time
    var minute = Math.floor(second / 60);
    var sec = second % 60;
    var time;
    if (second < 60) {
      time = second + '"'
      time = second + '"';
    } else {
      time = sec === 0 ? minute + "'" : minute + "'" + sec + '"'
      time = sec === 0 ? minute + "'" : minute + "'" + sec + '"';
    }
    return time
    return time;
  },
  setCookie: function (c_name, value, expiredays, path) {
    var exdate = new Date()
    exdate.setDate(exdate.getDate() + expiredays)
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + expiredays);
    document.cookie =
      c_name +
      '=' +
      "=" +
      escape(value) +
      (expiredays == null ? '' : ';expires=' + exdate.toGMTString()) +
      (path ? ';path=' + path : '')
      (expiredays == null ? "" : ";expires=" + exdate.toGMTString()) +
      (path ? ";path=" + path : "");
  },
  getCookie: function (c_name) {
    if (document.cookie.length > 0) {
      var c_start = document.cookie.indexOf(c_name + '=')
      var c_start = document.cookie.indexOf(c_name + "=");
      if (c_start != -1) {
        c_start = c_start + c_name.length + 1
        var c_end = document.cookie.indexOf(';', c_start)
        if (c_end == -1) c_end = document.cookie.length
        return unescape(document.cookie.substring(c_start, c_end))
        c_start = c_start + c_name.length + 1;
        var c_end = document.cookie.indexOf(";", c_start);
        if (c_end == -1) c_end = document.cookie.length;
        return unescape(document.cookie.substring(c_start, c_end));
      }
    }
    return ''
    return "";
  },
  delCookie: function (name) {
    var exp = new Date()
    exp.setTime(exp.getTime() - 1)
    var cval = tool.getCookie(name)
    if (cval != null) document.cookie = name + '=' + cval + ';expires=' + exp.toGMTString()
    var exp = new Date();
    exp.setTime(exp.getTime() - 1);
    var cval = tool.getCookie(name);
    if (cval != null)
      document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
  },
  // 强制保留2位小数，如：2，会在2后面补上00.即2.00
  toDecimal2(x) {
    var f
    f = parseFloat(x)
    var f;
    f = parseFloat(x);
    if (isNaN(f)) {
      return false
      return false;
    }
    f = Math.round(x * 100) / 100
    var s = f.toString()
    var rs = s.indexOf('.')
    f = Math.round(x * 100) / 100;
    var s = f.toString();
    var rs = s.indexOf(".");
    if (rs < 0) {
      rs = s.length
      s += '.'
      rs = s.length;
      s += ".";
    }
    while (s.length <= rs + 2) {
      s += '0'
      s += "0";
    }
    return s
    return s;
  },
  formateTime(date) {
    var newDate = new Date(+new Date(date) + 8 * 3600 * 1000)
      .toISOString()
      .replace(/T/g, ' ')
      .replace(/\.[\d]{3}Z/, '')
    var time = new Date(newDate)
    return time.getTime()
      .replace(/T/g, " ")
      .replace(/\.[\d]{3}Z/, "");
    var time = new Date(newDate);
    return time.getTime();
  }
}
};

// 处理订单记录
// export function setOrderList(res) {
@@ -138,22 +139,22 @@

//处理表单提交数据
export function worksData(res) {
  let arr = []
  let arr = [];
  for (let i = 0; i < res.length; i++) {
    const item = res[i]
    const item = res[i];
    if (item.typeField) {
      if (item.typeField.config) {
        item.typeField.options = JSON.parse(item.typeField.config).option
        item.typeField.options = JSON.parse(item.typeField.config).option;
      }
      arr.push(item.typeField)
      arr.push(item.typeField);
    }
  }
  return arr
  return arr;
}

export function worksDataBytool(res, value, linkList) {
  let arr = []
  let nrr = []
  let arr = [];
  let nrr = [];
  if (linkList && linkList.length > 0) {
    linkList.forEach((e) =>
      nrr.push({
@@ -161,45 +162,45 @@
        linkType: e.linkType,
        md5: e.md5
      })
    )
    );
  }
  res.forEach((item) => {
    const obj = {
      baseType: item.typeField.baseType,
      order: 0,
      typeFieldId: item.typeField.id,
      sequenceNum: item.config ? JSON.parse(item.config).uuid : '',
      sequenceNum: item.config ? JSON.parse(item.config).uuid : "",
      newDataAndFileLinkListRequest: []
    }
    };
    for (let k in value) {
      if (item.typeField.refCode === k) {
        if (item.typeField.type == 'File') {
        if (item.typeField.type == "File") {
          try {
            obj.strValue = JSON.stringify(value[k].map((citem) => citem.md5))
            obj.strValue = JSON.stringify(value[k].map((citem) => citem.md5));
          } catch (error) {
            obj.strValue = ''
            obj.strValue = "";
          }
          obj.newDataAndFileLinkListRequest = nrr
          obj.newDataAndFileLinkListRequest = nrr;
        } else {
          if (typeof value[k] == 'object') {
            obj.strValue = JSON.stringify(value[k])
          if (typeof value[k] == "object") {
            obj.strValue = JSON.stringify(value[k]);
          } else {
            if (obj.baseType === 'String') {
              obj.strValue = value[k] + ''
            } else if (obj.baseType === 'Text') {
              obj.textValue = value[k] + ''
            if (obj.baseType === "String") {
              obj.strValue = value[k] + "";
            } else if (obj.baseType === "Text") {
              obj.textValue = value[k] + "";
            } else {
              obj.strValue = value[k] + ''
              obj.strValue = value[k] + "";
            }
          }
        }
      }
    }
    // if (obj.strValue || obj.textValue) {
    arr.push(obj)
    arr.push(obj);
    // }
  })
  return arr
  });
  return arr;
}

export function UpdateworksDataBytool(initData, res, value, linkList) {
@@ -223,7 +224,7 @@
        id: updateOldData.id,
        typeFieldId: citem.typeField.id,
        sequenceNum: citem.sequenceNum,
        setDataAndFileLinkListRequest: [],
        setDataAndFileLinkListRequest: []
      };
      for (let k in value) {
        if (citem.typeField.refCode === k) {
@@ -247,7 +248,7 @@
        order: 0,
        typeFieldId: citem.typeField.id,
        sequenceNum: citem.sequenceNum,
        setDataAndFileLinkListRequest: [],
        setDataAndFileLinkListRequest: []
      };
      for (let k in value) {
        if (citem.typeField.refCode === k) {
@@ -266,21 +267,21 @@
  });
  return {
    updateData: arr,
    newData: newArr,
    newData: newArr
  };
}

export function download(url) {
  const iframe = document.createElement('iframe')
  iframe.setAttribute('hidden', 'hidden')
  document.body.appendChild(iframe)
  const iframe = document.createElement("iframe");
  iframe.setAttribute("hidden", "hidden");
  document.body.appendChild(iframe);
  iframe.onload = () => {
    if (iframe) {
      iframe.setAttribute('src', 'about:blank')
      iframe.setAttribute("src", "about:blank");
    }
  }
  };

  iframe.setAttribute('src', url)
  iframe.setAttribute("src", url);
}

/**
@@ -290,66 +291,78 @@
 * @returns {string}
 */
export function uuid(len = 32, radix = 16) {
  const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('')
  const chars =
    "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz".split("");
  let uuid = [],
    i
  radix = radix || chars.length
    i;
  radix = radix || chars.length;

  if (len) {
    // Compact form
    for (i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * radix)]
    for (i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * radix)];
  } else {
    // rfc4122, version 4 form
    let r
    let r;

    // rfc4122 requires these characters
    uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'
    uuid[14] = '4'
    uuid[8] = uuid[13] = uuid[18] = uuid[23] = "-";
    uuid[14] = "4";

    // Fill in random data.  At i==19 set the high bits of clock sequence as
    // per rfc4122, sec. 4.1.5
    for (i = 0; i < 36; i++) {
      if (!uuid[i]) {
        r = 0 | (Math.random() * 16)
        uuid[i] = chars[i === 19 ? (r & 0x3) | 0x8 : r]
        r = 0 | (Math.random() * 16);
        uuid[i] = chars[i === 19 ? (r & 0x3) | 0x8 : r];
      }
    }
  }

  return uuid.join('')
  return uuid.join("");
}

export function getFileMd5(file, chunkSize) {
  return new Promise((resolve, reject) => {
    let blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice
    let chunks = Math.ceil(file.size / chunkSize)
    let currentChunk = 0
    let spark = new SparkMD5.ArrayBuffer()
    let fileReader = new FileReader()
    let blobSlice =
      File.prototype.slice ||
      File.prototype.mozSlice ||
      File.prototype.webkitSlice;
    let chunks = Math.ceil(file.size / chunkSize);
    let currentChunk = 0;
    let spark = new SparkMD5.ArrayBuffer();
    let fileReader = new FileReader();
    fileReader.onload = function (e) {
      spark.append(e.target.result)
      currentChunk++
      spark.append(e.target.result);
      currentChunk++;
      if (currentChunk < chunks) {
        loadNext()
        loadNext();
      } else {
        const md5 = spark.end()
        resolve(md5)
        const md5 = spark.end();
        resolve(md5);
      }
    }
    };
    fileReader.onerror = function (e) {
      reject(e)
    }
      reject(e);
    };

    function loadNext() {
      let start = currentChunk * chunkSize
      let end = start + chunkSize
      let start = currentChunk * chunkSize;
      let end = start + chunkSize;
      if (end > file.size) {
        end = file.size
        end = file.size;
      }
      fileReader.readAsArrayBuffer(blobSlice.call(file, start, end))
      fileReader.readAsArrayBuffer(blobSlice.call(file, start, end));
    }
    loadNext()
  })
    loadNext();
  });
}

export function getParentNodeByClassName(element, className) {
  if (element && element.classList.contains(className)) {
    return element;
  } else {
    return getParentNodeByClassName(element.parentNode, className);
  }
}

// 处理时间，用于显示音视频当前时间
@@ -460,6 +473,7 @@
  worksDataBytool,
  UpdateworksDataBytool,
  getPublicImage,
  worksData
  worksData,
  getParentNodeByClassName
  // parseHtml,
}
};

 src/assets/methods/examination.js

@@ -204,7 +204,6 @@
      citem.number = cindex + 1;
    }
  }
  console.log(cardList.filter(item=>item.infoList.length > 0),"cardList.filter(item=>item.infoList.length > 0)");
  return cardList.filter(item=>item.infoList.length > 0);
};


 src/books/childHealth/view/content/index.vue

@@ -46,7 +46,8 @@
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
      previousScrollTop: 0,
      throttledScrollHandler: null
      throttledScrollHandler: null,
      observer: null
    };
  },
  watch: {
@@ -61,6 +62,10 @@
            showCatalogList: newVal
          });
        }
        // 启动页码观察
        setTimeout(() => {
          this.initObservation();
        }, 500);
      }
    }
  },
@@ -91,6 +96,19 @@
      });
    }

    // 创建一个新的 Intersection Observer 实例，用于观察目标元素和执行相应的回调函数。
    // new IntersectionObserver(callback, options)：使用之前定义的 callback 回调函数和 options 配置选项来初始化 Intersection Observer 实例。
    this.observer = new IntersectionObserver(this.pageChangeCallback, {
      root: null, // 指定根元素，这里设为 null，表示选取整个视窗作为根元素。
      rootMargin: "0px", // 指定根元素的边界，这里设为 "0px"，表示根元素的边界和视窗的边界重合
      threshold: 0.5 // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。
    });

    // 启动页码观察
    setTimeout(() => {
      this.initObservation();
    }, 500);

    // 测试页面跳转
    // setTimeout(() => {
    //   this.gotoPage(5, 100);
@@ -111,6 +129,7 @@
    // }, 3000);
  },
  methods: {
    // 滚动监听
    scrollFun(event) {
      // 判断向上滚动还是向下滚动
      if (event.target.scrollTop > this.previousScrollTop) {
@@ -154,16 +173,8 @@
      // showCatalogList 当前显示的三个章节，watch监听传递给主应用
      // 更新上一次滚动的位置
      this.previousScrollTop = event.target.scrollTop;

      // 返回页码和章节信息
      // if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange)
      //   this.$store.state.qiankun.pageChange({
      //     page: 100,
      //     catalog: 5,
      //     catalogId: "",
      //     catalogName: ""
      //   });
    },
    // 章节、页面跳转
    gotoPage(catalog, page) {
      if (catalog >= 0 && catalog <= this.catalogLength) {
        // 处理渲染章节
@@ -193,6 +204,7 @@
        console.log("章节错误！");
      }
    },
    // 渲染标记
    renderSign(type, data) {
      const existence = (
        this.container ? this.container : document
@@ -228,6 +240,7 @@
        }
      }
    },
    // 删除标记渲染
    delSign({ ids, type }) {
      if (ids && ids.length) {
        for (let i = 0; i < ids.length; i++) {
@@ -253,6 +266,44 @@
          );
        }
      }
    },
    initObservation() {
      const sections = document.querySelectorAll(".page-box");
      //observer 观察每个元素，以便在它们进入或离开视窗时触发回调函数。
      sections.forEach((section) => {
        const isObserver = section.getAttribute("observer");
        if (!isObserver) {
          this.observer.observe(section);
          section.setAttribute("observer", "1");
        }
      });
    },
    pageChangeCallback(entries, observer) {
      //entries：代表观察到的目标元素的集合。 observer：代表观察者对象。
      entries.forEach((entry) => {
        //entry.isIntersecting：检查当前目标元素是否与根元素相交。
        if (entry.isIntersecting) {
          const target = entry.target;
          //entry.target：获取当前目标元素
          const page = target.getAttribute("page");
          const catalogDom = this.tool.getParentNodeByClassName(
            target,
            "chapter"
          );
          const catalog = catalogDom.getAttribute("num");
          console.log("page", page, catalog);
          // 返回页码和章节信息
          if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange)
            this.$store.state.qiankun.pageChange({
              page: page,
              catalog: catalog
            });
          // const sections = Array.from(document.querySelectorAll(".section"));
          //sections：获取所有具有 .section 类名的元素，并转换为数组。
          // let index = sections.findIndex((section) => section === target) + 1;
          //index：查找当前目标元素在 sections 数组中的索引，并加 1，用于确定当前页码。
        }
      });
    }
  },
  components: {

 src/books/childHealth/view/index.vue

@@ -60,7 +60,6 @@
        }
      };
      this.MG.store.getProductDetail(query).then((res) => {
        console.log("图书信息", res.datas);
        this.$data.bookData = res.datas;
        this.$store.commit("setRootCmsItemId", res.datas.rootCmsItemId);
      });
@@ -102,15 +101,6 @@
              y: e.y
            });
          }
          console.log("选中的文字", {
            chapterNum,
            txt,
            selection,
            node,
            page,
            x: e.x,
            y: e.y
          });
        }
      } else {
        if (this.$store.state.qiankun.windowSelection) {

 vue.config.js

@@ -2,8 +2,8 @@
// import {publicCtx} from '@/assets/js/config'
const { defineConfig } = require("@vue/cli-service");
module.exports = defineConfig({
  publicPath: 'http://182.92.203.7:3007/books/book/1',
  // publicPath:'/books/book/1',
  // publicPath: 'http://182.92.203.7:3007/books/book/1',
  publicPath:'/books/book/1',
  transpileDependencies: true,
  lintOnSave: false,
  // devServer: {