添加 系列详细界面生成二维码分享

tanghaolin

2022-09-01 f904bd0c38237262f2f2fcee4ed8d2291d533c30

添加 系列详细界面生成二维码分享

 package.json

@@ -16,6 +16,7 @@
    "eslint": "^8.16.0",
    "eslint-plugin-vue": "^9.0.1",
    "pdfh5": "^1.4.2",
    "qrcodejs2": "^0.0.2",
    "sass-loader": "^7.3.1",
    "three": "^0.124.0",
    "three-js-csg": "^72.0.0",

 public/static/config/globalConfig.js

@@ -28,7 +28,8 @@
        }
    },
    CorpInfo:{
        CorpMobileUrl:"http://101.132.183.82/"
        CorpMobileUrl:"http://101.132.183.82/",
        WeChatUrl:"http://47.100.245.85:8087/",
    },
    UnitDefault: { UnitQ: { text: "m³/h", value: 1 }, UnitH: { text: "m", value: 0, } },
    FireTypeDefault: { text: "否", value: 0 },

 src/components/model3DContainer.vue

@@ -24,10 +24,10 @@
          <van-icon name="photo-o" class="el-icon-camera big"></van-icon>
        </div>
        <div class="itemcss" title="左转">
          <van-icon class="el-icon-refresh-left big"></van-icon>
          <van-icon name="arrow-left" class="el-icon-refresh-left big"></van-icon>
        </div>
        <div class="itemcss" title="右转">
          <van-icon class="el-icon-refresh-right big"></van-icon>
          <van-icon name="arrow" class="el-icon-refresh-right big"></van-icon>
        </div>
        <div class="itemcss" title="透明显示">
          <van-icon class="el-icon-magic-stick big"></van-icon>
@@ -487,8 +487,8 @@
<style scoped>
.tool {
  position: absolute;
  bottom: 10px;
  right: 130px;
  top: 10px;
  right: 13px;
  z-index: 999;
  background-color: #606266;
  border: 2px solid #1492ff;

 src/views/Compare/CompareList.vue

@@ -121,7 +121,7 @@
        _this.m_isShowLoadingFrm = false;

        let resdata = res.data;
        // console.log(resdata, 50);
         console.log(resdata, 50);
        //
        if (resdata.Code != 0) {
          _this.$toast(resdata.Message);

 src/views/Detail/byParas/Index.vue

@@ -3,13 +3,20 @@
    <!-- 头部导航栏 -->
    <van-nav-bar style="position: fixed; top: 0px; width: 100%">
      <template #left>
        <van-icon @click="pageBack" name="arrow-left" size="18" />
        <van-icon @click="pageBack" v-if="isVisibleBackBtn" name="arrow-left" size="18" />
      </template>
      <template #title>
        <label>{{ pagetitle }}</label>
      </template>
      <template #right>
        <!-- <van-icon name="search" size="18" /> -->
        <van-icon
          size="16"
          style="line-height: 24px;margin-right: 16px;"
          name="share-o"
          @click="showShare = true"
        >
        </van-icon>
        <van-icon
          @click="popupShow = true"
          size="16"
@@ -140,6 +147,7 @@
          :title="$t('detailPage.Model.TR')"
        >
          <model3D
          :isMobile="true"
            style="width: 100%; height: 560px"
            ref="model3dCtrl"
          ></model3D>
@@ -224,6 +232,21 @@
          </van-cell>
        </div>
      </van-popup>
     <!-- 分享面板 -->
      <van-share-sheet
        v-model:show="showShare"
        title="立即分享给好友"
        :options="shareOptions"
        @select="onShareSelect"
    />
        <!-- 二维码弹框 -->
        <van-dialog v-model:show="qrCodeShow" :show-confirm-button="false" cancel-button-text="关闭" title="二维码" show-cancel-button>
              <div
              id="qrCode"
              ref="qrCodeCtrl"
              style="display: flex; justify-content: center;margin: 10px 0;"
            />
      </van-dialog>
    </div>
    <div
      class="compare_icon"
@@ -234,6 +257,9 @@
    </div>
    <div class="compare_icon" v-else @click.stop="deleteCompareLocalStorage">
      <van-icon style="font-size: 28px" name="delete-o" />
    </div>
    <div v-if="compareList.length>1" class="compare_icon" style="bottom: 168px" @click.stop="toCompareList">
      <i class="iconfont iconplus-listview" />
    </div>
    <div class="backTop" v-show="backtopshow" @click="backTop">
      <div class="iconfont iconfanhuidingbu3"></div>
@@ -255,7 +281,7 @@
import waterMarkHelper from "@/utils/waterMarkHelper";
import model3D from "@/components/model3DContainer.vue";
import languageMixin from "@/mixin/language";

import QRCode from "qrcodejs2";//根据链接生成二维码
import spumpCorpHelper from "@/utils/spumpCorp";

export default {
@@ -274,6 +300,12 @@
      propList4Disp: [], //属性列表数据
      propList4DispOld: [], //属性列表数据
      backtopshow: false, //返回顶部按钮是否显示
      showShare:false,//分享面板的显隐
      shareOptions:[
      { name: '二维码', icon: 'qrcode',tag:"qrcord" },
      { name: '复制链接', icon: 'link',tag:"link"},
    ],
      qrCodeShow:false,//二维码弹框
      images: [],
      PumpStyle: 0, //当前泵的类型 0表示离心泵 1 表示轴流泵
      m_pumpBaseInfo: {},
@@ -336,6 +368,8 @@
      popupActiveNames: ["1", "2"], //折叠面板展开列表
      collectList: [], //收藏列表
      compareList: [], //比较列表
      
      isVisibleBackBtn:true,//是否显示返回上一页按钮
    };
  },
  components: {
@@ -378,6 +412,12 @@
    //     return;
    //   }
    // }

    console.log(this.$route)
    let navType =this.$route.query.navType
    if(navType == "share"){
      this.isVisibleBackBtn = false
    }
    //从本地存储读取收藏数据
    let collectList = localStorage.getItem("collectList");
    collectList = collectList != null ? JSON.parse(collectList) : [];
@@ -631,7 +671,15 @@
      //   path: `/${this.$getCurrentLanguageUrl()}/SelectReport`
      // });
    },
    //监听分享选择
    onShareSelect(e){
      if(e.tag== "qrcord"){
        this.showShare = false
        this.clickQRCodeCmd()
      }else if(e.tag == "link"){

      }
    },
    //获取整个页面初始的详情数据
    intialPageDetailData() {
      // console.log(this.$route.query,242)
@@ -1228,6 +1276,32 @@
        }
      }
    },
    //打开分享二维码的界面
    clickQRCodeCmd() {
      this.qrCodeShow = true;
      this.$nextTick(function () {
        if (
          this.$globalConfig.CorpInfo.WeChatUrl == null ||
          this.$globalConfig.CorpInfo.WeChatUrl == ""
        )
          return;
        let url =
          this.$globalConfig.CorpInfo.WeChatUrl +
          "#" +
          this.$route.fullPath +
          "&navType=share";
        document.getElementById("qrCode").innerHTML = "";
        // console.log(url, 858);
        new QRCode(this.$refs.qrCodeCtrl, {
          text: url,
          width: 200,
          height: 200,
          colorDark: "#333333", //二维码颜色
          colorLight: "#ffffff", //二维码背景色
          correctLevel: QRCode.CorrectLevel.L, //容错率，L/M/H
        });
      });
    },
    backTop() {
      let timer = setInterval(function () {
        //获取滚动条的滚动高度

 src/views/Detail/byParas/components/LXBChartPointParas.vue

@@ -317,7 +317,7 @@
    buildPointTable_General(pumpInfoData) {
      if (pumpInfoData.ChartPointPara == null) return;

       console.log(pumpInfoData.ChartPointPara, 285);
      //  console.log(pumpInfoData.ChartPointPara, 285);

      let _this = this;

@@ -857,7 +857,6 @@
    },
    //构建允许区域点
  buildRegionPtByAllowPointItem(group_name, grp_min, grp_max) {
    console.log(grp_min,grp_max,811)
    let unitSetting = this.unitSetting;
    let grp_tag = "AllowPoint"
    let obj = {};
@@ -1009,7 +1008,6 @@
    },
    //设置允许区域曲线点值
    setRegionPtByAllowPointValue(chartPointNode,grp_min,grp_max) {
      console.log(chartPointNode,963)
      let unitSetting = this.unitSetting;
      var nodeList = chartPointNode.nodeList;
      for (var i = 0; i < nodeList.length; i++) {
@@ -1045,7 +1043,6 @@
    },
    //构建查询参数
    buildChartQueryData(query_pt) {
        console.log(query_pt, 799);
      if (query_pt == null) {
        return;
      }