添加AY

src/pages/orderAY/orderAY.vue

@@ -0,0 +1,116 @@
+<!--  -->
+<template>
+  <div class="mine">
+    <el-form :model="ruleForm"
+             ref="ruleForm"
+             label-width="100px"
+             class="demo-ruleForm">
+      <el-form-item label="订单号："
+                    prop="pass">
+        <el-input v-model="ruleForm.pass"
+                  disabled
+                  autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="订单归属："
+                    prop="name">
+        <el-input v-model.number="ruleForm.name"
+                  placeholder="请输入归属人姓名"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary"
+                   class="submit"
+                   @click="submitForm()">认领</el-button>
+
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary"
+                   class="submit copy-btn"
+                   :data-clipboard-text="ruleForm.pass"
+                   @click="copyUrl">复制该订单号</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import Clipboard from 'clipboard';
+
+export default {
+  data () {
+    return {
+      ruleForm: {
+        pass: '',
+        name: ''
+      },
+    }
+  },
+  computed: {},
+  watch: {},
+  created () {
+    this.getOrder()
+  },
+  methods: {
+    getOrder () {
+      let that = this
+      const Http = new XMLHttpRequest();
+      const url = 'https://test-api-ads.tiantianqutao.com/led_create_order?qtype=other';
+      Http.open("GET", url);
+      // let params = { qtype : 'other' }
+      Http.send();
+      Http.onreadystatechange = (e) => {
+        if (Http.readyState == 4 && Http.status == 200) {
+          let data = JSON.parse(Http.responseText)
+          console.log(data.order_id, 'data')
+          that.ruleForm.pass = data.order_id
+        }
+      }
+    },
+    submitForm () {
+      console.log(this.ruleForm,'ruleForm');
+      let that = this
+      const Http = new XMLHttpRequest();
+      const url = 'https://test-api-ads.tiantianqutao.com/led_create_order';
+      Http.open("POST", url, true);
+      Http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+      let params = { order_id: that.ruleForm.pass, name: that.ruleForm.name }
+      Http.send(JSON.stringify(params));
+      Http.onreadystatechange = (e) => {
+        this.$message.success('认领成功')
+      }
+    },
+    // 复制链接
+    copyUrl () {
+      let _this = this;
+      let clipboard = new Clipboard(".copy-btn"); // 这里括号里填写上面点击事件绑定的class名
+      clipboard.on("success", e => {
+        // 复制成功，提示根据自己项目实际使用的UI来写
+        _this.$message.success("复制成功")
+        // 释放内存
+        clipboard.destroy();
+      });
+      clipboard.on("error", e => {
+        // 不支持复制，提示根据自己项目实际使用的UI来写
+        _this.$message.error("该浏览器不支持自动复制")
+        // 释放内存
+        clipboard.destroy();
+      });
+    },
+
+  }
+}
+</script>
+<style lang='less' scoped >
+/* @import url(); 引入css类 */
+.mine {
+  width: 100%;
+  min-height: 100vh;
+  display: flex;
+  justify-content: center;
+  .demo-ruleForm {
+    margin-top: 15%;
+    .submit {
+      width: 100%;
+    }
+  }
+}
+</style>

src/router/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'
 import Home from '@/pages/home/index.vue'
 import Order from '@/pages/order/order.vue'
+import OrderAY from '@/pages/orderAY/orderAY.vue'
 
 Vue.use(Router)
 
@@ -27,6 +28,15 @@ export default new Router({
         },
         component:Order,
       },
+      {
+        path: '/orderAY',
+        name: 'AY订单号生成',
+        meta: {
+          title: 'AY订单号生成',
+          auth: false,
+        },
+        component:OrderAY,
+      },
     ]
 },
 

vue.config.js

@@ -3,7 +3,7 @@
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 module.exports = {
-  publicPath: process.env.env_config === 'prod' ? 'https://video-h5.fyshark.com/upload/dist' :
+  publicPath: process.env.env_config === 'prod' ? 'https://video-h5.fyshark.com/dist' :
     process.env.env_config === 'test' ? '/vapps/calory/' : '/dist/',
   // 设置跨域
   crossorigin: 'anonymous',