详情页bug修改，资源购买页添加骨架屏

闫增涛

2024-04-15 cb6bb8bda31df75afe5a5bd50fe8e3ff6a3d34e2

 packageBookService/pages/bookServices/detail/components/tree/index.js

@@ -1,31 +1,33 @@
const util = require('./components/util') // 引入封装过的加载提示
const util = require("./components/util"); // 引入封装过的加载提示
import {
  loginInfo
} from '../../../../../../assets/js/login'
const app = getApp()
} from "../../../../../../assets/js/login";
const app = getApp();
Component({
  // checked: false,

  properties: {
    treeList: {
      type: Array,
      value: [],
    },
    learnList: {
      type: Array,
      value: []
    },
    bookInfo: {
      type: Object,
      value: {}
      value: {},
    },
    buyIds: {
      type: Array,
      value: []
      value: [],
    },
    tab: {
      type: String,
      value: ''
      value: "",
    },
    applyState: {
      type: String,
      value: ''
      value: "",
    },
    openIds: {
      type: Array,
@@ -42,52 +44,49 @@
    superior: {
      type: Boolean,
      value: false,
    }
    },
    checkAllState: {
      type: Boolean,
    },
  },
  data: {
    sonPurchaseSaleMethodId: '',
    sonPurchaseSaleMethodId: "",
    superiorPurchaseSaleMethodId: [],
    activeValues: [1, 2],
    webpageSrc: '',
    webpageSrc: "",
    cloudShoppingCart: [],
    selectAll: [],
    shoppingCart: true
    shoppingCart: true,
    stop: false,
    cart: true
  },
  ready() {
    this.setData({

    })
    console.log('准备');
  },
  ready() {},

  onLoad() {
    this.setData({
      sonPurchaseSaleMethodId: []
    })
    console.log(this.data.sonPurchaseSaleMethodId, 'sonPurchaseSaleMethodId789');
      sonPurchaseSaleMethodId: [],
    });
  },
  observers: {
    'openIds': function (newValue) {
      // var myEventDetail = {
      // }
      // var myEventOption = {
      //   bubbles: true,
      //   composed: true
      // }
      // this.triggerEvent('handleTree', myEventDetail, myEventOption)
    }
    treeList: function (newValue) {
      const list = [];
      let checked = "";
      this.properties.treeList.forEach((item) => {
        if (item.children && item.children.length > 0) {
          list.push(...this.flattenTree([item]));
        }
      });
      const flag = list.findIndex((item) => item.checked == true);
    },
  },

  methods: {

    handleList(tree) {
      for (let index = 0; index < tree.length; index++) {
        const item = tree[index];
        if (item.sysType == 'CmsItem' && !item.checked) {

        }
        if (item.sysType == "CmsItem" && !item.checked) {}
        if (item.children && item.children.length > 0) {
          this.handleList(item.children)
          this.handleList(item.children);
        }
      }
    },
@@ -100,103 +99,108 @@
    handleCheck(data) {
      for (let index = 0; index < data.length; index++) {
        const element = data[index];
        element.checked = true
        element.checked = true;
        if (element.childrenCount && element.type == "productFolder") {
          handleCheck(element.children)
          handleCheck(element.children);
        }
      }
    },
    downloadTeach(e) {
      const value = e.currentTarget.dataset.value
      const value = e.currentTarget.dataset.value;
      var myEventDetail = {
        value,
      } // detail对象，提供给事件监听函数
      }; // detail对象，提供给事件监听函数
      var myEventOption = {
        bubbles: true,
        composed: true
      } // 触发事件的选项
      this.triggerEvent('downloadTeach', myEventDetail, myEventOption)

        composed: true,
      }; // 触发事件的选项
      this.triggerEvent("downloadTeach", myEventDetail, myEventOption);
    },
    // 判断资源是否购买
    resourceIsBuy(data) {
      if (data.saleMethod && data.saleMethod.length) {
        if (data.saleMethod[0].State == 'Disable') return false
        const isSHow = this.properties.buyIds.some((item) => item == data.saleMethod[0].Id)
        return !isSHow
        if (data.saleMethod[0].State == "Disable") return false;
        const isSHow = this.properties.buyIds.some(
          (item) => item == data.saleMethod[0].Id
        );
        return !isSHow;
      } else {
        return false
        return false;
      }
    },
    // 跳转音视频播放器
    goPlayer(e) {
      // 检查登录状态
      const token = wx.getStorageSync(app.config.tokenKey)
      if (!token) {
        loginInfo(app, (data) => {
          // 如果不是第一次登录，会执行回调
          if (data) {
            // 登录成功，自动记录token和用户信息，并返回true
          } else {
            // 出现错误，返回false
          }
        })
      } else {
        if (this.properties.isShowCheck) return true
        const item = e.currentTarget.dataset.item
        const parent = e.currentTarget.dataset.parent
        let url
        if (item.selectType == 'video' || item.learnSelectType == 'video') {
          url = '/packageDomain/pages/resourceDetails/myVideo/index'
        } else if (item.selectType == 'audio' || item.learnSelectType == 'audio') {
          url = '/packageDomain/pages/resourceDetails/myAudio/index'
        } else if (item.selectType == 'picture' || item.selectType == 'zip') {
          url = '/packageDomain/pages/resourceDetails/document/index'
      const token = wx.getStorageSync(app.config.tokenKey);

      if (token) {
        const item = e.currentTarget.dataset.item;
        const parent = e.currentTarget.dataset.parent;
        const parentProductLinkPath = parent ? parent.productLinkPath : wx.getStorageSync('teachResourcesPath')
        const parentName = parent ? parent.name : '教学资源'
        let url;
        if (this.properties.isShowCheck && this.resourceIsBuy(item)) {
          return false;
        }
        if (this.properties.tab == 'jsek_cloudLearning' && this.resourceIsBuy(item)) {
        if (item.selectType == "video" || item.learnSelectType == "video") {
          url = "/packageDomain/pages/resourceDetails/myVideo/index";
        } else if (
          item.selectType == "audio" ||
          item.learnSelectType == "audio"
        ) {
          url = "/packageDomain/pages/resourceDetails/myAudio/index";
        } else if (item.selectType == "picture" || item.selectType == "zip") {
          url = "/packageDomain/pages/resourceDetails/document/index";
        }
        if (
          this.properties.tab == "jsek_cloudLearning" &&
          this.resourceIsBuy(item)
        ) {
          return wx.showToast({
            icon: 'error',
            title: '请先购买该资源',
          })
            icon: "error",
            title: item.saleMethod[0].Price > 0 ?
              "请先购买该资源" : "请先点击领取查看按钮",
          });
        }
        wx.navigateTo({
          url: `${url}?productLinkPath=${item.productLinkPath}&parentProductLinkPath=${parent.productLinkPath}&parentName=${parent.name}&activeId=${item.id}&bookId=${this.properties.bookInfo.id}&bookName=${this.properties.bookInfo.name}&cmsId=${this.properties.bookInfo.rootCmsItemId}`,
        })
        if (item.selectType == 'document' || item.selectType == 'pdf') {
          const fileLink = app.config.requestCtx + '/file/api/ApiDownload?md5=' + item.file
          console.log(fileLink, 'fileLink');
          url: `${url}?productLinkPath=${item.productLinkPath}&parentProductLinkPath=${parentProductLinkPath}&parentName=${parentName}&activeId=${item.id}&bookId=${this.properties.bookInfo.id}&bookName=${this.properties.bookInfo.name}&cmsId=${this.properties.bookInfo.rootCmsItemId}&formPath=${this.properties.tab}`,
        });
        if (item.selectType == "document" || item.selectType == "pdf") {
          const fileLink =
            app.config.requestCtx + "/file/api/ApiDownload?md5=" + item.file;
          console.log(fileLink, "fileLink");
          //提示加载中
          util.showLoading()
          util.showLoading();
          // 单次下载允许的最大文件为 200MB
          wx.downloadFile({
            url: fileLink, // 地址已打码，自己换个其他的地址（"https://www.xxxxx.com/file/测试通知.pdf"）
            success: function (res) {
              console.log(res, "wx.downloadFile success res")
              console.log(res, "wx.downloadFile success res");
              if (res.statusCode != 200) {
                util.hideLoadingWithErrorTips()
                return false
                util.hideLoadingWithErrorTips();
                return false;
              }
              var Path = res.tempFilePath //返回的文件临时地址，用于后面打开本地预览所用
              var Path = res.tempFilePath; //返回的文件临时地址，用于后面打开本地预览所用
              wx.openDocument({
                filePath: Path,
                showMenu: true,
                success: function (res) {
                  console.log('打开成功');
                  util.hideLoading()
                }
              })
                  console.log("打开成功");
                  util.hideLoading();
                },
              });
            },
            fail: function (err) {
              console.log(err, "wx.downloadFile fail err");
              util.hideLoadingWithErrorTips()
            }
          })
              util.hideLoadingWithErrorTips();
            },
          });
        }
        if (item.selectType == 'webpage') {
        if (item.selectType == "webpage") {
          this.setData({
            webpageSrc: item.jsek_link
          })
          console.log(this.data.webpageSrc, 'webpageSrc');
            webpageSrc: item.jsek_link,
          });
          console.log(this.data.webpageSrc, "webpageSrc");
        }
      }
    },
@@ -207,13 +211,13 @@
      function findChildren(item) {
        if (item.id === id) {
          if (item.children && item.children.length > 0) {
            item.children.forEach(child => {
            item.children.forEach((child) => {
              findChildren(child);
            });
          }
        } else {
          if (item.children && item.children.length > 0) {
            item.children.forEach(child => {
            item.children.forEach((child) => {
              findChildren(child);
            });
          }
@@ -222,8 +226,8 @@
          result.push(...item.children);
        }
      }
      console.log(this.properties.treeList, 'this.properties.treeList');
      this.properties.treeList.forEach(item => {
      console.log(this.properties.treeList, "this.properties.treeList");
      this.properties.treeList.forEach((item) => {
        findChildren(item);
      });
      return result;
@@ -235,25 +239,24 @@
      function flatten(node) {
        result.push(node);
        if (node.children && node.children.length > 0) {
          node.children.forEach(child => {
          node.children.forEach((child) => {
            flatten(child);
          });
        }
      }
      tree.forEach(node => {

      tree.forEach((node) => {
        flatten(node);
      });
      // console.log(result, 'result');
      return result
      return result;
    },

    // 变为true
    findAndUpdateItemsByIds(tree, ids) {
    findAndUpdateItemsByIds(tree, ids, state) {
      function findAndUpdate(node) {
        if (ids.includes(node.id)) {
          // console.log(node, 'node');
          node.checked = !node.checked // 将目标项的 check 属性设置为 true
          node.checked = state; // 将目标项的 check 属性设置为 true
        }
        if (node.children && node.children.length > 0) {
          for (let child of node.children) {
@@ -261,9 +264,7 @@
          }
        }
      }

      for (let node of tree) {

        findAndUpdate(node); // 对每个顶层节点执行查找和更新操作
      }
      // console.log(tree, 'tree345');
@@ -272,13 +273,13 @@

    checkResoucrceInfo(tree, id) {
      function findAndUpdate(node) {
        if (node.sysType == 'CmsFolder' && node.children.length > 0) {
        if (node.sysType == "CmsFolder" && node.children.length > 0) {
          for (let index = 0; index < node.children.length; index++) {
            const element = node.children[index];
            findAndUpdate(element)
            findAndUpdate(element);
          }
        } else if (id == node.id && node.sysType == "CmsItem") {
          node.checked = !node.checked // 将目标项的 check 属性设置为 true
          node.checked = !node.checked; // 将目标项的 check 属性设置为 true
        }
      }
      for (let node of tree) {
@@ -286,153 +287,283 @@
      }
      return tree; // 返回修改后的完整数组
    },

    // 全选
    checkAll() {
      const ids = []
      const list = []
      let checked = ''
      this.properties.treeList.forEach(item => {
      const ids = [];
      const list = [];
      let checked = "";
      this.properties.treeList.forEach((item) => {
        if (item.children && item.children.length > 0) {
          list.push(...this.flattenTree([item]))
          list.push(...this.flattenTree([item]));
        }
      })
      list.forEach(item => {
        ids.push(item.id)
      });
      list.forEach((item) => {
        ids.push(item.id);
        checked = item.checked;
      });
      // const flag =
      //   list.findIndex((item) => item.checked == false) > -1 ? true : false;
      const flag = this.properties.checkAllState;
      // const updataList = this.findAndUpdateItemsByIds(
      //   this.properties.treeList,
      //   ids,
      //   flag
      // );
      // this.setData({
      //   treeList: updataList,
      // });

        checked = item.checked
      })
      var myEventDetail = {
        ids,
        flag,
      }; // detail对象，提供给事件监听函数
      var myEventOption = {
        bubbles: true,
        composed: true,
      }; // 触发事件的选项
      this.triggerEvent("changeListChecked", myEventDetail, myEventOption);


      const updataList = this.findAndUpdateItemsByIds(this.properties.treeList, ids);

      console.log(checked, 'list');
      if (!checked) {
        this.setData({
          selectAll: list
        })

          selectAll: list,
        });
      }

      this.setData({
        treeList: updataList
      })
      var myEventDetail = {
        value: !flag,
      }; // detail对象，提供给事件监听函数
      var myEventOption = {
        bubbles: true,
        composed: true,
      }; // 触发事件的选项
      this.triggerEvent("changeCheckAll", myEventDetail, myEventOption);
    },

    // 章节勾选
    checkResourceTitle(e) {
      const flag = e.detail.checked;
      // 这个时候checked的值是fals
      let checkResourceTitleList = []
      const item = e.currentTarget.dataset.item
      //
      let list = this.flattenTree([item])
      let ids = []
      list.forEach(item => {
        ids.push(item.id)
      })
      // console.log(list, 'list789');
      const updatedTreeList = this.findAndUpdateItemsByIds(this.properties.treeList, ids);
      this.setData({
        treeList: updatedTreeList // 更新 treeList 数据
      let checkResourceTitleList = [];
      const item = e.currentTarget.dataset.item;
      const parent = this.findParentById(this.properties.learnList, item.id)
      let childrenList
      let flagNum
      if (parent) childrenList = parent.children.filter(citem => citem.id !== item.id)
      if (childrenList) flagNum = childrenList.findIndex(item => item.checked == false)
      let list = this.flattenTree([item]);
      let ids = [];
      list.forEach((item) => {
        if (item.sysType == 'CmsFolder' || (item.sysType == 'CmsItem' && item.saleMethod.length))
          ids.push(item.id);
      });
      console.log(list, 'list.checked');
      if (!list.checked) {


        this.setData({
          superiorPurchaseSaleMethodId: list
        })

      var myEventDetail = {
        ids,
        flag,
      }; // detail对象，提供给事件监听函数
      var myEventOption = {
        bubbles: true,
        composed: true,
      }; // 触发事件的选项
      this.triggerEvent("changeListChecked", myEventDetail, myEventOption);
      if (flagNum == -1) {
        let checkedState
        var myEventDetail = {
          ids: [parent.id],
          flag,
        }; // detail对象，提供给事件监听函数
        var myEventOption = {
          bubbles: true,
          composed: true,
        }; // 触发事件的选项
        this.triggerEvent("changeListChecked", myEventDetail, myEventOption);
      }

      // console.log(this.data.superiorPurchaseSaleMethodId, 'superiorPurchaseSaleMethodId');
      list.forEach(items => {
        console.log(items.checked, 'itesasd');
      if (!list.checked) {
        this.setData({
          superiorPurchaseSaleMethodId: list,
        });
      }
      list.forEach((items) => {
        console.log(items.checked, "itesasd");
        if (!items.checked) {
          this.setData({
            cloudShoppingCart: items
          })
            cloudShoppingCart: items,
          });
        }
      })
      });
      this.setData({
        openIds: this.data.openIds,
      });
    },
    // 子项勾选
    checkResource(e) {
      const citem = e.currentTarget.dataset.item
      console.log(citem, '5648');
      const updataList = this.checkResoucrceInfo(this.properties.treeList, citem.id)
      console.log(citem.checked, 'citem.checked');
      const citem = e.currentTarget.dataset.item;
      const parent = e.currentTarget.dataset.parent
      let outermost
      if (parent) outermost = this.findParentById(this.properties.learnList, parent.id)
      const childrenList = parent.children.filter(item => item.id !== citem.id && item.saleMethod.length)
      const flag = childrenList.findIndex(item => item.checked == false)
      // 改变该项checked
      var myEventDetail = {
        id: citem.id
      };
      var myEventOption = {
        bubbles: true,
        composed: true,
      };
      this.triggerEvent("changeResourceChecked", myEventDetail, myEventOption);
      // 通过判断,联通父级checked
      if (flag == -1) {
        let checkedState
        citem.checked == false ? checkedState = true : checkedState = false
        var myEventDetail = {
          ids: [parent.id],
          flag: checkedState,
        };
        var myEventOption = {
          bubbles: true,
          composed: true,
        };
        this.triggerEvent("changeListChecked", myEventDetail, myEventOption);
      }
      // 联通最外层级checked ,如果有一个取消勾选,且当前最外层勾选,则取消最外层的勾选
      if (citem.checked && outermost && outermost.checked) {
        var myEventDetail = {
          ids: [outermost.id],
          flag: false,
        };
        var myEventOption = {
          bubbles: true,
          composed: true,
        };
        this.triggerEvent("changeListChecked", myEventDetail, myEventOption);
      }
      // 联通最外层级checked, 如果所有子项勾选, 且当前最外层未勾选, 则加上最外层的勾选
      if (!citem.checked && outermost) {
        let allchildren = this.flattenTree([outermost])
        allchildren = allchildren.filter(item => item.sysType == 'CmsItem' && item.id !== citem.id && item.saleMethod.length)
        const satate = allchildren.findIndex(item => item.checked == false)
        if (satate == -1) {
          var myEventDetail = {
            ids: [outermost.id],
            flag: true,
          };
          var myEventOption = {
            bubbles: true,
            composed: true,
          };
          this.triggerEvent("changeListChecked", myEventDetail, myEventOption);
        }
      }
      if (!citem.checked) {
        //选中的时候添加id
        let sonPurchaseSaleMethodId = this.data.sonPurchaseSaleMethodId || []
        console.log(this.properties.paymentPage, 'this.properties.paymentPage');
        let sonPurchaseSaleMethodId = this.data.sonPurchaseSaleMethodId || [];
        if (this.properties.paymentPage) {
          console.log(789987);
          sonPurchaseSaleMethodId = []
          this.properties.paymentPage = false
          sonPurchaseSaleMethodId = [];
          this.properties.paymentPage = false;
        }
        if (!this.properties.paymentPage) {
          sonPurchaseSaleMethodId.push(citem.saleMethod[0].Id)
          sonPurchaseSaleMethodId.push(citem.saleMethod[0].Id);
        }
        this.setData({
          sonPurchaseSaleMethodId: sonPurchaseSaleMethodId
        })
        console.log(this.data.sonPurchaseSaleMethodId);
          sonPurchaseSaleMethodId: sonPurchaseSaleMethodId,
        });
      } else {
        // 取消选中的时候删除id
      }
      this.setData({
        treeList: updataList,
      })
    },
    // 加入购物车
    async onCloudShoppingCart(e) {
      let shoppingCartGetId = [];

      let shoppingCartGetId = []
      const saleMethodId = e.currentTarget.dataset.item.saleMethod[0].Id
      const item = e.currentTarget.dataset.item
      console.log(item.isShopCar);
      const saleMethodId = e.currentTarget.dataset.item.saleMethod[0].Id;
      console.log(saleMethodId);
      let query = {
        start: 0,
        size: 999,
        filterList: [],
        searchList: []
      }
        searchList: [],
      };

      const res = await app.MG.store.getShoppingCartProductList(query)
      res.datas.forEach(item => {
        shoppingCartGetId.push(item.saleMethod.id)
      })
      const res = await app.MG.store.getShoppingCartProductList(query);
      res.datas.forEach((item) => {
        shoppingCartGetId.push(item.saleMethod.id);
      });
      if (shoppingCartGetId.includes(saleMethodId)) {
        console.log(111);
        // this.data.updateShoppingCartHidden();
        // this.data.updateCloudLearning();

        wx.showToast({
          icon: 'error',
          title: '已添加',
        })
          icon: "error",
          title: "已添加",
        });
        this.setData({
          shoppingCart: false
        })
          shoppingCart: false,
        });
      } else {
        let query = {
          requests: [{
            saleMethodId: saleMethodId,
            storeEventId: null,
            // agentCode: '电子书'
          }]
          }, ],
        };
        const addRes = await app.MG.store.addShoppingCart(query);
        console.log(addRes, "addRes");
        if (addRes) {
          wx.showToast({
            icon: "success",
            title: "添加成功",
          });
          item.isShopCar = false
          this.triggerEvent("updateCloudLearning")
        }
        const addRes = await app.MG.store.addShoppingCart(query)
        console.log(addRes, 'addRes');
        wx.showToast({
          icon: 'success',
          title: '添加成功',
        })
      }

      }
    },
    sadd() {
      this.triggerEvent("updateShoppingCartHidden");
      this.triggerEvent("updateCloudLearning");
    },
    findParentById(arr, id) {
      for (let i = 0; i < arr.length; i++) {
        const item = arr[i];
        // 检查当前项是否匹配（即它是不是我们要找的项）  
        if (item.id === id) {
          // 如果当前项就是我们要找的项，则它没有父级，返回 null  
          return null;
        }
        // 递归查找当前项的子项  
        const child = this.findChildById(item.children, id);
        if (child) {
          // 如果在子项中找到匹配的项，返回当前项作为父级  
          return item;
        }
      }
      // 如果没有找到匹配的父项，返回 null  
      return null;
    },

    // 辅助函数，用于递归查找子项  
    findChildById(children, id) {
      if (!children) {
        return null;
      }
      for (let i = 0; i < children.length; i++) {
        const child = children[i];
        if (child.id === id) {
          // 如果找到匹配的项，返回它  
          return child;
        }
        // 递归检查子项的子项  
        const subChild = this.findChildById(child.children, id);
        if (subChild) {
          return subChild;
        }
      }
      // 如果没有找到匹配的项，返回 null  
      return null;
    }
  },
  onCheckAllChange(e) {
    // debugger
    // console.log('checkbox', e.detail.value);
    // this.setData({
    //   checkAllValues: event.detail,
    // });
  },
})
});