xiaoshi_system/src/views/layout/components/contextMenu.vue

<template>
  <div>
    <myContextMenu @operateDirectory="getMethod"></myContextMenu>
    <contrast ref="contrast"></contrast>
    <!-- 批注 -->
    <annotation ref="annotation"></annotation>
    <my-ImageViewer v-if="showImg" :on-close="closeViewer" :url-list="[imgSrc]"></my-ImageViewer>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import contrast from '@/views/components/dialog/menuDialog/contrast.vue'
import annotation from '@/views/components/dialog/menuDialog/annotation.vue'
export default {
  name: 'myCommonUse',
  components: {
    contrast,
    annotation,
  },
  props: {},
  data() {
    return {
      showImg: false,
      imgSrc: '',
    };
  },
  watch: {},
  computed: {
    ...mapGetters(["highlight"])
  },
  created() { },
  mounted() {
    // window.selectMark = this.selectMark
  },
  methods: {
    //查看图片
    checkImg(e) {
      this.imgSrc = e.target.src
      this.showImg = true
    },
    //关闭图片弹窗
    closeViewer() {
      this.showImg = false
    },
    //点击图标回显数据
    selectMark(id, selectType) {
      var Id = id.substring(1, id.length)
      if (selectType == 'p') {//批注
        var index = this.highlight.piZhuContrastList.findIndex(item => {
          if (item.id == Id) {
            // 清空currentSelectObj，否则Id与id同时存在
            this.$store.commit("SET_PATENT_INDEX", item)
          }
          return item.id == Id
        })
        if (index != -1) {
          // document.addEventListener("click", function (e) {
          //   console.log(e.clientX)
          //   console.log(e.clientY)
          //   var menuContent = []
          //   this.$store.commit("SET_CONTEXT_MENU", {
          //     clientX: e.clientX,
          //     clientY: e.clientY,
          //     displayContextMenu: true,
          //     menuContent: this.highlight.piZhuContrastList[index]
          //   })
          // })
          // 打开批注框
          this.$refs.annotation.open()
        }
      } else if (selectType == 'c') {//对比
        let a = this.highlight.contrastList.find(item => {
          return item.id == Id
        })
        a.column = a.fieldName
        a.text = a.evidenceText
        this.$store.commit("SET_PATENT_INDEX", a)
        this.contrast()
      } else if (selectType == 'o') {
      }

    },
    getMethod(type) {
      if (this[type]) {
        this[type]()
      }
    },
    //波浪线
    wave() {
      this.$refs.annotation.submit2()
    },
    //下划线
    underscore() {
      this.$refs.annotation.submit2()
    },
    //高亮
    addHighlight() {
      this.$refs.annotation.submit2()
    },
    //批注
    mark() {
      this.$refs.annotation.open()
    },
    //修改颜色
    changeColor() {
      this.$refs.annotation.submit2()
      console.log('修改颜色')
    },
    //对比
    contrast() {
      console.log('对比')
      this.$refs.contrast.open()
    },
    //删除批注
    deleteMark() {
      console.log('删除')
    },
  },
};
</script>
<style lang="scss" scoped></style>