precise_delivery_distribution_front/src/views/material/video.vue

<template>
  <div class="video">
    <div class="title-box-common">
      <h3>视频库</h3>
      <a-button
        type="primary"
        @click="
          uploadVisible = true;
          confirmLoading = false;
          $refs.upload.clearList();
        "
        >上传</a-button
      >
    </div>
    <div class="padding-box-common">
      <search :materialType="'video'" @search="onSearch"></search>
      <common-table
        ref="commonTable"
        :materialType="'video'"
        :searchForm="searchForm"
      ></common-table>
    </div>
    <a-modal
      width="40%"
      :title="`上传视频至${
        searchForm.is_public === 1 ? '公共素材' : '我的上传'
      }`"
      v-model:visible="uploadVisible"
      :confirm-loading="confirmLoading"
      @ok="onConfirmUpload"
      okText="上传"
      @cancel="confirmLoading = false"
    >
      <upload-video
        ref="upload"
        :searchForm="searchForm"
        @close="uploadVisible = false"
        @getList="$refs.commonTable.getList()"
      ></upload-video>
    </a-modal>
  </div>
</template>

<script lang="ts">
import Search from "./component/search.vue";
import CommonTable from "./component/common-table.vue";
import UploadVideo from "./component/upload-video.vue";
import usePagination from "@/hooks/usePagination";
import { defineComponent, reactive, toRefs, ref } from "vue";
import { onBeforeRouteUpdate } from "vue-router";
// import { TableColumnOfYuewen } from "../_pageOptions/table_yuewen";
//getPromotionList
import {} from "@/api";
import { message } from "ant-design-vue";
const VideoLibrary = defineComponent({
  components: { Search, CommonTable, UploadVideo },
  setup() {
    let { tablePageOptions } = usePagination();
    const formRef = ref();
    const state = reactive({
      searchForm: {},
      uploadVisible: false,
      confirmLoading: false, // 上传视频按钮loading
    });
    return { ...toRefs(state), formRef, tablePageOptions };
  },
  mounted() {},
  methods: {
    // 搜索条件回传
    onSearch(param: any) {
      this.searchForm = JSON.parse(JSON.stringify(param));
    },
    // 确定上传 触发组件上传视频
    onConfirmUpload() {
      let upload: any = this.$refs.upload;
      upload.onUploadVideo();
      // this.confirmLoading = true;
    },
  },
});

export default VideoLibrary;
</script>
<style lang="scss" scoped>
@import "@/assets/common-style/frame.scss";
// .performance {
// }
</style>