Quellcode durchsuchen

复制链接页面开发

tanxue vor 3 Jahren
Ursprung
Commit
6254c8435d

+ 14 - 0
assets/scss/cus-client/cus-client-page.scss

@@ -1307,5 +1307,19 @@
     // 咨询电话
     .course-develop-tel{margin: 46px 0;}
   }
+
+  /********  describe: 复制路径页面--手机  author: TX  date:2021-08-06  ********/
+  .copy-url-page{
+    background: #fff;height: 100vh;
+    // 底部
+    .success-body-box{
+      img{max-width: 100%;padding: 30px;box-sizing: border-box;}
+      p{font-weight: 700;font-size: 20px;color: rgb(31, 104, 176);text-align: center;margin: 4px 0;}
+      span{line-height: 24px;font-weight: 400;font-size: 16px;color: rgb(16, 16, 16);display: block;text-align: center;padding:30px;word-break: break-all;}
+      a{width: 122px;height: 36px;line-height:36px;background-color: rgb(234, 118, 27);color: rgb(255, 255, 255);
+        border-radius: 5px;font-size: 14px;display: block;margin: 0 auto;text-align: center}
+    }
+
+  }
 }
 

+ 46 - 0
pages/copyUrl.vue

@@ -0,0 +1,46 @@
+<template>
+  <div class="copy-url-page">
+    <div class="success-body-box">
+      <img :src= copyUrlImg />
+      <p>请使用电脑端</p>
+      <p>进行麦塔在线学习SaaS系统</p>
+      <p>相关操作</p>
+      <span>{{copyUrlContent}}</span>
+      <a @click="copyUrl">复制链接</a>
+    </div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+    name:    'copyUrl',
+    layout:  'templateB',
+    data() {
+      return {
+        copyUrlContent:'',
+        copyUrlImg:  require(`~/static/images/client/component/register-success-img.png`),
+      };
+    },
+    head() {
+      return {
+        title: '该功能无法在手机端操作,请使用电脑端进行相关操作',
+      };
+    },
+    methods: {
+      copyUrl() {
+        var input = document.createElement("input");   // js创建一个input输入框
+        input.value = this.copyUrlContent;  // 将需要复制的文本赋值到创建的input输入框中
+        document.body.appendChild(input);    // 将输入框暂时创建到实例里面
+        input.select();   // 选中输入框中的内容
+        document.execCommand("Copy");   // 执行复制操作
+        document.body.removeChild(input); // 最后删除实例中临时创建的input输入框,完成复制操作
+        this.$message({customClass:'phone-message-box',type: 'success',message: '复制成功'});
+      }
+    },
+    created() {
+      this.copyUrlContent = this.$route.query.url;
+    },
+  };
+</script>
+

BIN
static/images/client/component/register-success-img.png