submit

src/views/Marketing/goods/goodTopic/index.vue

@@ -25,6 +25,52 @@
       @handleSizeChange="handleSizeChange"
       @handleCurrentChange="handleCurrentChange"
     />
+    <el-dialog
+      :visible.sync="dialogVisible"
+      width="650px"
+      :show-close="false"
+      :close-on-click-modal="false"
+      destroy-on-close
+    >
+      <div slot="title" class="hearders">
+        <div class="leftTitle">分享</div>
+        <div class="rightBoxs">
+          <img
+            src="@/assets/images/Close@2x.png"
+            alt=""
+            @click="dialogVisible = false"
+          />
+        </div>
+      </div>
+      <el-form label-width="180px" :model="formLabelAlign">
+        <el-form-item label="观看链接（PC端）：">
+          <span id="copycode">{{ formLabelAlign.enCodePC }}</span
+          ><el-button
+            v-if="formLabelAlign.enCodePC"
+            type="text"
+            style="margin-left: 10px"
+            @click="copyUrl"
+            >复制</el-button
+          >
+        </el-form-item>
+        <el-form-item label="观看二维码：">
+          <img
+            style="width: 100px; height: 100px"
+            :src="formLabelAlign.enCode"
+            alt=""
+          />
+          <el-button
+            type="text"
+            @click="downloadFileByBase64(formLabelAlign.enCode, '小程序二维码')"
+            >下载</el-button
+          >
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+        <!-- <el-button type="primary" @click="submitTable">保 存</el-button> -->
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -53,6 +99,11 @@ export default {
         },
       },
       topType: true,
+      dialogVisible: false, //分享窗口
+      formLabelAlign: {
+        enCodePC: '',
+        enCode: '',
+      },
       //搜索
       formList: [],
       formData: {
@@ -107,7 +158,9 @@ export default {
   },
   methods: {
     share(v) {
-      console.log(v);
+      this.formLabelAlign.enCodePC = v.enCodePC
+      this.formLabelAlign.enCode = v.enCode
+      this.dialogVisible = true
     },
     search(int) {
       this.loading = true;
@@ -137,6 +190,51 @@ export default {
     },
     init() {
       this.search(2);
+    },
+      /**
+     * 复制地址
+     */
+    copyUrl() {
+      const range = document.createRange();//创建range对象;
+      range.selectNode(document.getElementById("copycode")); //获取复制内容的 id 选择器
+      const selection = window.getSelection(); //创建 selection对象
+      if (selection.rangeCount > 0) selection.removeAllRanges(); //如果页面已经有选取了的话，会自动删除这个选区，没有选区的话，会把这个选取加入选区
+      selection.addRange(range); //将range对象添加到selection选区当中，会高亮文本块
+      document.execCommand("copy"); //复制选中的文字到剪贴板
+      this.$message.success("复制成功");
+      selection.removeRange(range); // 移除选中的元素
+    },
+    //将base64转换为blob
+    dataURLtoBlob(dataurl) {
+      if (!dataurl) {
+        this.$message.error("下载失败");
+        return;
+      }
+      var arr = dataurl.split(","),
+        mime = arr[0].match(/:(.*?);/)[1],
+        bstr = atob(arr[1]),
+        n = bstr.length,
+        u8arr = new Uint8Array(n);
+      while (n--) {
+        u8arr[n] = bstr.charCodeAt(n);
+      }
+      return new Blob([u8arr], { type: mime });
+    },
+    //下载方法
+    downloadFile(url, name = "下载图") {
+      var a = document.createElement("a");
+      a.setAttribute("href", url);
+      a.setAttribute("download", name);
+      a.setAttribute("target", "_blank");
+      let clickEvent = document.createEvent("MouseEvents");
+      clickEvent.initEvent("click", true, true);
+      a.dispatchEvent(clickEvent);
+    },
+
+    downloadFileByBase64(base64, name) {
+      var myBlob = this.dataURLtoBlob(base64);
+      var myUrl = URL.createObjectURL(myBlob);
+      this.downloadFile(myUrl, name);
     },
     del(v) {
       this.$api.gradecheckGoodsChange({ goodsId: v.goodsId }).then((res) => {