2025.9.18 数据产品（待完成）

riku

2025-09-18 c1d2051abc8ca88cd07f0d7c56c0dbf8165d5c33

 src/views/fysp/check/components/ArbitraryPhoto.vue

@@ -14,7 +14,12 @@
    @contextmenu="closeContextMenu"
    class="container"
  > -->
  <div v-if="showMenu" ref="menu" :style="menuStyle" class="context-menu">
  <div
    v-if="showMenu && !menuLoading"
    ref="menu"
    :style="menuStyle"
    class="context-menu"
  >
    <template v-for="(item, index) in menuItems" :key="index">
      <el-popover v-if="item.children" placement="right-start" trigger="hover">
        <template #reference>
@@ -58,20 +63,9 @@
      loading: true,
      // 右键图片弹出菜单控制
      showMenu: false,
      menuLoading: true,
      menuStyle: undefined,
      // menuItems: [
      //   { label: '复制图片', action: 'copy' },
      //   {
      //     label: '移动到',
      //     children: [
      //       {
      //         action: 'move',
      //         label: v.typeName,
      //         value: v.typeId
      //       }
      //     ]
      //   }
      // ],
      allMoveActions: [],
      closeContextMenuListenr: undefined,
      // 右键选中的图片
      selectedFileElement: undefined,
@@ -82,21 +76,14 @@
  },
  computed: {
    menuItems() {
      const sceneTypeId = this.subtask.sceneTypeId;
      const items = enumMediaFile(sceneTypeId, false)
        .filter((v) => {
          return v.value != this.selectedTypeId;
        })
        .map((v) => {
          return {
            action: 'move',
            label: v.label,
            value: v.value
          };
        });
      return [
        // { label: '复制到剪贴板', action: 'copy' },
        { label: '移动到', children: items }
        {
          label: '移动到',
          children: this.allMoveActions.filter((v) => {
            return v.value != this.selectedTypeId;
          })
        }
      ];
    }
  },
@@ -113,6 +100,8 @@
      }
    };
    document.addEventListener('click', this.closeContextMenuListenr);

    this.initMenuItems();
  },
  unmounted() {
    document.removeEventListener('click', this.closeContextMenuListenr);
@@ -229,7 +218,7 @@
      canvas.width = img.naturalWidth;
      canvas.height = img.naturalHeight;
      ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
      // this.copyCanvasToClipboard(canvas);
      this.copyCanvasToClipboard(canvas);
      const dataUrl = canvas.toDataURL('image/png'); // 可以选择其他格式如'image/jpeg'
      // 创建一个临时的textarea元素来复制文本
      const tempTextArea = document.createElement('textarea');
@@ -251,6 +240,22 @@
          }
        );
      }, 'image/png'); // 同样，这里也可以指定其他格式，如 'image/jpeg'
    },
    // 初始化场景图片的类型菜单
    initMenuItems() {
      this.menuLoading = true;
      const sceneTypeId = this.subtask.sceneTypeId;
      enumMediaFile(sceneTypeId, false)
        .then((res) => {
          this.allMoveActions = res.map((v) => {
            return {
              action: 'move',
              label: v.label,
              value: v.value
            };
          });
        })
        .finally(() => (this.menuLoading = false));
    }
  }
};