生成预览链接

src/api/app.js

@@ -93,5 +93,14 @@ export function H5StartupFile(data) {
 }
 
 export function LearnWebSI(MethodName, data) {
-    return http.post(`/GCLSLearnWebSI/ServiceInterface?MethodName=${MethodName}`, data);
-}
+  return http.post(`/GCLSLearnWebSI/ServiceInterface?MethodName=${MethodName}`, data);
+}
+
+/**
+ * 生成教材预览链接
+ * @param {object} data 请求数据
+ * @param {string} data.book_id 教材 ID
+ */
+export function CreateBookPreviewURL(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=book_preview_manager-CreateBookPreviewURL`, data);
+}

src/views/book/courseware/data/bookType.js

@@ -114,7 +114,6 @@ import DialogueArticlePreview from '../preview/components/dialogue_article/index
 import NewWordTemplatePreview from '../preview/components/newWord_template/NewWordTemplatePreview.vue';
 import CharacterStructurePreview from '../preview/components/character_structure/CharacterStructurePreview.vue';
 
-
 export const bookTypeOption = [
   {
     value: 'base',
@@ -423,7 +422,6 @@ export const bookTypeOption = [
         set: DrawingSetting,
         preview: DrawingPreview,
       },
-      
     ],
   },
 ];

src/views/project_manage/book/BookPreview.vue

@@ -5,35 +5,49 @@
     <CommonPreview ref="preview" :project-id="project_id" :is-show-audit="false" :is-book="true">
       <template #operator="{ courseware }">
         <span class="link">查看教材信息</span>
+        <span class="link" @click="createBookPreviewURL(courseware.id)">生成预览链接</span>
         <span v-if="isTrue(courseware.is_can_request_xiajia)" class="link">申请下架</span>
         <span class="link" @click="goBackToProjectList">返回教材列表</span>
       </template>
     </CommonPreview>
+
+    <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 PreviewURL from '@/views/project_manage/common/PreviewURL.vue';
 
 import { isTrue } from '@/utils/validate';
+import { CreateBookPreviewURL } from '@/api/app';
 
 export default {
   name: 'BookPreview',
   components: {
     MenuPage,
     CommonPreview,
+    PreviewURL,
   },
   data() {
     return {
       project_id: this.$route.params.projectId || '',
       isTrue,
+      preview_url: '',
+      visible: false,
     };
   },
   methods: {
     goBackToProjectList() {
       this.$router.push({ path: '/project_manage/book' });
     },
+    createBookPreviewURL(book_id) {
+      CreateBookPreviewURL({ book_id }).then(({ url }) => {
+        this.preview_url = url;
+        this.visible = true;
+      });
+    },
   },
 };
 </script>

src/views/project_manage/common/PreviewURL.vue

@@ -0,0 +1,50 @@
+<template>
+  <el-dialog title="预览链接" :visible="visible" width="680px" :close-on-click-modal="false" @close="dialogClose">
+    <p class="preview-url">{{ url }}</p>
+
+    <div slot="footer">
+      <el-button @click="dialogClose">关闭</el-button>
+      <el-button type="primary" @click="copyUrl">复制链接</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'PreviewURL',
+  props: {
+    url: {
+      type: String,
+      required: true,
+    },
+    visible: {
+      type: Boolean,
+      required: true,
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    dialogClose() {
+      this.$emit('update:visible', false);
+    },
+    copyUrl() {
+      navigator.clipboard.writeText(this.url).then(() => {
+        this.$message.success('链接已复制到剪贴板');
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.preview-url {
+  padding: 12px 24px;
+  font-size: 16px;
+  text-align: center;
+  word-break: break-all;
+  user-select: all;
+  border: $border;
+}
+</style>

src/views/project_manage/project/ProjectPreview.vue

@@ -10,11 +10,13 @@
         <span v-if="isTrue(courseware.is_can_request_rollback_project)" class="link" @click="requestRollbackProject">
           申请退回
         </span>
+        <span class="link" @click="createBookPreviewURL(courseware.id)">生成预览链接</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>
 
@@ -22,9 +24,11 @@
 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',
@@ -32,12 +36,15 @@ export default {
     MenuPage,
     CommonPreview,
     RequestBook,
+    PreviewURL,
   },
   data() {
     return {
       project_id: this.$route.params.projectId || '',
       isTrue,
       requestBookVisible: false,
+      preview_url: '',
+      visible: false,
     };
   },
   methods: {
@@ -63,6 +70,12 @@ export default {
         this.$refs.preview.getProjectBaseInfo();
       });
     },
+    createBookPreviewURL(book_id) {
+      CreateBookPreviewURL({ book_id }).then(({ url }) => {
+        this.preview_url = url;
+        this.visible = true;
+      });
+    },
   },
 };
 </script>