U 产品详情页面 原始包预览时 图片可以放大

he wei

2025-02-26 75d229e997cba687ecbda2d7e41d42ed01bf8bfd

U 产品详情页面 原始包预览时 图片可以放大

 package.json

@@ -31,6 +31,8 @@
    "mockjs": "^1.1.0",
    "nprogress": "^0.2.0",
    "script-loader": "^0.7.2",
    "v-viewer": "^1.7.4",
    "viewerjs": "^1.11.7",
    "viser-vue": "^2.4.8",
    "vue": "2.6.11",
    "vue-i18n": "^8.18.2",

 src/main.js

@@ -16,6 +16,9 @@
import './assets/css/custom.css'
import beforeRouteChange from './assets/js/beforeRouteChange'

import 'viewerjs/dist/viewer.css'
import VueViewer from 'v-viewer'

Vue.prototype.$layer = layer(Vue);

const router = initRouter(store.state.setting.asyncRoutes)
@@ -25,6 +28,7 @@
Vue.config.productionTip = false
Vue.use(Viser)
Vue.use(Plugins)
Vue.use(VueViewer)

// 全局混入页面路由守卫
Vue.mixin(beforeRouteChange);

 src/pages/resourceManage/product/details/details.vue

@@ -493,14 +493,17 @@
        <sop-list :parentCode="parentCode"></sop-list>
      </div>
    </a-modal>
    <a-modal
    <!-- <a-modal
      :width="600"
      :visible="previewVisible"
      :footer="null"
      @cancel="handleCancel"
    >
      <img alt="" style="width: 100%" :src="imgUrl" />
    </a-modal>
    </a-modal> -->
    <!-- <viewer :images="imgUrl">
      <img alt="" style="width: 100%" :src="imgUrl" />
    </viewer> -->
  </div>
</template>

@@ -1588,7 +1591,8 @@
        case "jpeg":
        case "png":
          this.imgUrl = this.webUrl + obj.url;
          this.previewVisible = true;
          this.viewerImg();
          // this.previewVisible = true;
          break;
        case "pdf":
          window.open(this.webUrl + obj.url);
@@ -1606,6 +1610,14 @@
    handleCancel() {
      this.previewVisible = false;
    },
    viewerImg() {
      this.$viewerApi({
        images: [this.imgUrl],
        options: {
          initialViewIndex: 0,
        },
      });
    },
    searchChanged() {
      this.treeReset = false;
      this.$nextTick(() => {

 yarn.lock

Diff too large