增加转盘抽奖页面和编辑

src/components/ali-oss-upload.vue

@@ -0,0 +1,92 @@
+<template>
+  <el-upload
+    class="avatar-uploader"
+    v-model="url"
+    action=""
+    :auto-upload="false"
+    :http-request="onFileSubmit"
+    :onChange="onFileChange"
+    :show-file-list="false"
+  >
+    <video
+      v-if="url"
+      :src="url"
+      class="avatar"
+      controls="controls"
+      style="width: 200px; height: 148px"
+    >
+      您的浏览器不支持视频播放
+    </video>
+    <i v-else class="el-icon-plus avatar-uploader-icon iconss"></i>
+    <el-progress
+      type="circle"
+      v-if="percentage > 0 && percentage <= 100"
+      :percentage="percentage"
+      color="#efefef"
+    ></el-progress>
+  </el-upload>
+</template>
+<script>
+import OSS from "@/utils/oss-upload.js";
+import { $getCredentials } from "@/api/oss.js";
+export default {
+  data() {
+    return {
+      url: "",
+      ossClient: undefined,
+      percentage: 0,
+    };
+  },
+  mounted() {
+    this.initOssClient();
+  },
+  methods: {
+    async onFileChange(data) {
+      console.log(data);
+      const date = new Date();
+      const start =
+        date.getFullYear() +
+        "" +
+        (date.getMonth() * 1 + 1) +
+        "" +
+        date.getDate();
+      const houzhui = "." + data.name.substr(data.name.lastIndexOf(".") + 1);
+      const name = start + "/" + getUUID() + houzhui;
+      const fileRes = await this.ossClient.partUpload(name, data.raw, (p) => {
+        this.percentage = Math.floor(p * 100);
+        // 这里可以根据进度做相应的处理，例如更新UI等
+      });
+      console.log(fileRes);
+      if (!fileRes) {
+        this.percentage = 0;
+        this.$notify({
+          title: "失败",
+          message: `上传阿里云失败`,
+          type: "error",
+        });
+        return;
+      }
+      if (fileRes.name == "cancel") {
+        return;
+      }
+      this.url = fileRes.replace(
+        "https://djvideo.oss-cn-shanghai.aliyuncs.com/",
+        "https://duanju.hnsiyao.cn/"
+      );
+    },
+    onFileSubmit(data) {
+      console.log("data");
+      console.log(data);
+    },
+    async initOssClient() {
+      console.log("initOssClient");
+      const { data } = await $getCredentials();
+      if (data.code == 0) {
+        const res = data.data;
+        console.log(res);
+        this.ossClient = new OSS({ ...res, stsToken: res.securityToken });
+      }
+    },
+  },
+};
+</script>