eep_page/src/views/project_manage/project/ProjectPreview.vue

<template>
  <div class="audit">
    <MenuPage cur-key="/project_manage/project" />

    <CommonPreview ref="preview" :project-id="project_id">
      <template #operator="{ courseware, projectId }">
        <span v-if="isTrue(courseware.is_can_request_shangjia_book)" class="link" @click="openRequestBookDialog">
          申请上架
        </span>
        <span v-if="isTrue(courseware.is_can_request_rollback_project)" class="link" @click="requestRollbackProject">
          申请退回
        </span>
        <span class="link" @click="createBookPreviewURL(projectId)">生成预览链接</span>
        <span class="link" @click="goBackBookList">返回项目列表</span>
      </template>
    </CommonPreview>

    <RequestBook :project-id="project_id" :visible.sync="requestBookVisible" @confirm="requestShangjiaBook" />
    <PreviewURL :url="preview_url" :visible.sync="visible" />
  </div>
</template>

<script>
import MenuPage from '@/views/personal_workbench/common/menu.vue';
import CommonPreview from '@/components/CommonPreview.vue';
import RequestBook from './components/RequestBook.vue';
import PreviewURL from '@/views/project_manage/common/PreviewURL.vue';

import { isTrue } from '@/utils/validate';
import { RequestShangjiaBook, RequestRollbackProject } from '@/api/project';
import { CreateBookPreviewURL } from '@/api/app';

export default {
  name: 'AuditTaskPage',
  components: {
    MenuPage,
    CommonPreview,
    RequestBook,
    PreviewURL,
  },
  data() {
    return {
      project_id: this.$route.params.projectId || '',
      isTrue,
      requestBookVisible: false,
      preview_url: '',
      visible: false,
    };
  },
  methods: {
    goBackBookList() {
      this.$router.push({ path: `/project_manage/project` });
    },
    // 打开申请上架对话框
    openRequestBookDialog() {
      this.requestBookVisible = true;
    },
    // 申请上架
    requestShangjiaBook(data) {
      RequestShangjiaBook(data).then(() => {
        this.$message.success('申请上架成功');
        this.$refs.preview.getProjectBaseInfo();
        this.requestBookVisible = false;
      });
    },
    // 申请退回
    requestRollbackProject() {
      RequestRollbackProject({ project_id: this.project_id }).then(() => {
        this.$message.success('申请退回成功');
        this.$refs.preview.getProjectBaseInfo();
      });
    },
    createBookPreviewURL(book_id) {
      CreateBookPreviewURL({ book_id }).then(({ url }) => {
        this.preview_url = url;
        this.visible = true;
      });
    },
  },
};
</script>

<style lang="scss" scoped>
@use '@/styles/mixin.scss' as *;

.audit {
  @include page-content(true);
}
</style>