index.vue 1007 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <!--
  2. * @Author: Gui
  3. * @Date: 2023-05-12 11:36:28
  4. * @LastEditors: guicheng 1625811865@qq.com
  5. * @LastEditTime: 2024-06-20 15:36:35
  6. * @Description: kxs files
  7. * @filePath:
  8. -->
  9. <template>
  10. <el-button type="primary" @click="clickupload">
  11. {{ btntext }}
  12. <slot />
  13. </el-button>
  14. <input type="file" id="inputfile" style="display: none" />
  15. </template>
  16. <script lang="ts" setup>
  17. import { ref, onMounted } from "vue";
  18. import Ossupload from "@/utils/OSSupload";
  19. type Res = {
  20. uploadurl?: string;
  21. };
  22. const props = defineProps<{
  23. btntext?: string;
  24. FilePath: {
  25. type: Function;
  26. default: () => {};
  27. };
  28. }>();
  29. const uploaddo = ref(null);
  30. onMounted(() => {
  31. uploaddo.value = document.querySelector("#inputfile");
  32. uploaddo.value.addEventListener("change", function (evt) {
  33. const file = evt.target.files[0];
  34. Ossupload(file, "KxsAdmin/UploadFile").then((res: Res) => {
  35. props.FilePath(res.url);
  36. });
  37. });
  38. });
  39. const clickupload = function () {
  40. uploaddo.value.click();
  41. };
  42. </script>