xinsi_book/src/views/Book.vue

<template>
  <div class="xml-read">
    <xml-digital-teaching
      v-if="digitalTeaching"
      ref="xmlDigitalTeaching"
      :textBookData="textBookData"
      :catalogList="catalogList"
      :looseLeafData="looseLeafData"
      :location="location"
      :notesList="data.notes.list"
      :bookmarkList="data.bookmark.list"
      :resourcesList="data.resources.list"
      :highlightList="data.highlight.list"
      :isTrial="isTrial"
      :isTrialIndex="isTrialIndex"
      :userType="userType"
      :setting="setting"
      @updateReadLocation="updateReadLocation"
      @addNote="addNote"
      @editNote="editNote"
      @deleteNote="deleteNote"
      @deleteHighlight = "deleteHighlight"
      @addTeacherNote="addTeacherNote"
      @editTeacherNote="editTeacherNote"
      @deleteTeacherNote="deleteTeacherNote"
      @addHighlight="addHighlight"
      @updateNotes="updateNotes"
      @addBookmark="addBookmark"
      @deleteBookmark="deleteBookmark"
      @downloadFile="downloadFile"
      @addResources="addResources"
      @deleteResource="deleteResource"
      @editResources="editResources"
      @settingChange="settingChange"
      :action = "action"
      :headers  = "headers"
      :isShowTeacherResource="true"
      :continueReading="true"
      :basisPath="basisPath"
      :pageType="pageType"
      officePreviewPath="https://idocview.xxxxxxx.com/view/url?url="
    />
  </div>
</template>

<script>
import {LOCAL_VIEW_DETAIL,LOCAL_VIEW_CATALOG,LOCAL_VIEW_DATA} from "../seed/mock"
import {get_category}  from "../service/getData"
export default {
  data() {
    return {
      action:'http://60.xxxx.137.15:8081/admin-api/teachingMaterial/resource/upload/16550/6940601956829184',
      headers:{Authorization:`eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6IjYyMDFlYjA3LTY4ZWUtNGJhOC1iMjc3LTk4MjU0ZGI0MzUwMSJ9.zvW8Rr8ShOvwH5i7Cvl9bgp4MtznyLusrY86LMLW7MplNOjRp6j8lx6zkAD4_CvNXVF7v7MsYcRhN90DvhTq1g`},
      digitalTeaching: true,
      textBookData: LOCAL_VIEW_DETAIL,
      catalogList: LOCAL_VIEW_CATALOG,
      looseLeafData: LOCAL_VIEW_DATA,
      location: '',
      basisPath: 'https://www.xxxxx.com/file/1685523466073/',
      pageType: 'pc',
      isTrial: false,
      isTrialIndex: 10,
      userType: 'teacher',
      data: {
        notes: {
          list: []
        },
        bookmark: {
          list: []
        },
        highlight: {
          list: []
        },
        resources: {
          list: []
        }
      },
      setting: {}
    }
  },

  created() {
    this.userType = this.$route.query.userType || 'student'
    if (this.$route.query.type) {
      this.pageType = this.$route.query.type
      // this.isTrialIndex = Number(this.$route.query.isTrialIndex)
      if (this.$route.query.isTrialIndex) {
        this.isTrial = true
      }
    }

    this.location = localStorage.getItem(this.textBookData.id)
    setTimeout(() => {
      this.getData()
      // this.getSetting()
    }, 800)
  },

  mounted(){
    this.pageType = /Mobi|Android|iPhone/i.test(navigator.userAgent)?'h5':'pc'
    get_category()
  },
  methods: {
    // 学生笔记操作 start
    addNote(model) {
      this.addData('notes', model)
    },
    editNote(model) {
      this.updateData('notes', model)
    },
    deleteNote(model,feedback) {
      this.deleteData('notes', model)
      feedback()
    },

    // 教师笔记操作 start
    addTeacherNote(model, rollback) {
      this.addData('resources', model)
    },
    editTeacherNote(model) {
      this.updateData('resources', model)
    },
    deleteTeacherNote(model, feedback) {
      this.deleteData('resources', model)
      feedback()
    },

    // 高亮操作
    addHighlight(model, rollback) {
      this.addData('highlight', model)
    },
    // 高亮删除
    deleteHighlight(model, rollback) {
      this.deleteData('highlight', model)
      console.log(model,"model")
    },

    settingChange(key, value) {
      // let newSetting = Object.assign({}, this.setting, { [key]: value })
      // localStorage.setItem('setting_#_' + this.textBookData.id, JSON.stringify(newSetting))
      // this.setting = JSON.parse(localStorage.getItem('setting_#_' + this.textBookData.id)) || {}
    },

    // 更新笔记
    updateNotes(model) {
      this.updateData('notes', model)
    },

    // 添加书签
    addBookmark(e) {
      this.addData('bookmark', e)
    },

    // 删除书签
    deleteBookmark(e) {
      this.deleteData('bookmark', e)
    },

    // 添加数据
    addData(type, item) {
      this.data[type].list.push(item)
      let list = JSON.stringify(this.data)
      localStorage.setItem('simulated-data_' + this.textBookData.id, list)
      this.getData(type, item)
    },

    // 查询数据
    getData(type, item) {
      setTimeout(() => {
        this.data = JSON.parse(localStorage.getItem('simulated-data_' + this.textBookData.id)) || {
          notes: {
            list: []
          },
          bookmark: {
            list: []
          },
          highlight: {
            list: []
          },
          resources: {
            list: []
          }
        }
      }, 300)
    },
    getSetting() {
      this.setting = JSON.parse(localStorage.getItem('setting_#_' + this.textBookData.id)) || {}
    },

    // 更新数据
    updateData(type, item) {
      console.log(item)
      let i = this.data[type].list.findIndex((items) => items.id == item.id)
      this.data[type].list[i] = item
      let list = JSON.stringify(this.data)
      localStorage.setItem('simulated-data_' + this.textBookData.id, list)
      this.getData(type, item)
    },

    // 删除数据
    deleteData(type, item) {
      console.log(item,"deleteData")
      let i = this.data[type].list.findIndex((items) => items.id == item.id)
      this.data[type].list.splice(i, 1)
      let list = JSON.stringify(this.data)
      localStorage.setItem('simulated-data_' + this.textBookData.id, list)
      this.getData(type, item)
    },

    // 下载资源文件
    downloadFile(e) {},

    // 更新阅读进度
    updateReadLocation(newLocation) {
      localStorage.setItem(this.textBookData.id, newLocation.location)
    },

    // 添加教师资源
    addResources(e) {
      this.addData('resources', e)
    },
    // 删除教师资源
    deleteResource(e) {
      this.deleteData('resources', e)
    },
    // 编辑教师资源
    editResources(e) {
      this.updateData('resources', e)
    }
  }
}
</script>