doc和docx更改显示

src/views/work/score/index.vue

@@ -153,7 +153,7 @@
                   </el-card>
                   <el-tag id="chapter3" type="primary" size="large">作品详情</el-tag>
                   <el-card style="width: 100%;margin-top: 10px;margin-bottom: 10px" shadow="always">
-                    <div style="max-width: 800px">
+                    <div style="max-width: 700px">
                       <audio v-if="file.format==='mp3'" :src="file.url" controls>
                       </audio>
                     </div>
@@ -161,9 +161,9 @@
                     <video v-if="file.format==='mp4'"
                            :src="file.url" style="max-width: 700px" controls></video>
                     <img v-if="file.format==='jpg'||file.format==='png'"
-                         :src="file.url" style="max-width: 800px" alt=""/>
+                         :src="file.url" style="max-width: 700px" alt=""/>
                     <div v-if="file.format==='pdf'">
-                      <VueOfficePdf :src="file.url" style="max-width: 800px" class="docx-class"/>
+                      <VueOfficePdf :src="file.url" style="max-width: 700px" class="docx-class"/>
                     </div>
                   </el-card>
                   <div id="chapter2">
@@ -173,18 +173,19 @@
                   <el-card style="width: 100%;margin-top: 10px;text-align: center"
                            shadow="always">
                     {{
-                      file.manuscriptAndMaterial.split("/")[file.manuscriptAndMaterial.split("/").length - 1]
+                      file.manuscriptAndMaterialName
                     }}
                     <el-divider/>
                     <el-scrollbar v-if="file.manuscriptAndMaterial!==''"
                                   style="max-width: 850px;max-height: 1000px;overflow-y: auto;">
                       <div
-                        v-if="file.manuscriptAndMaterial.substring(file.manuscriptAndMaterial.lastIndexOf('.') + 1, file.manuscriptAndMaterial.length)==='pdf'">
+                        v-if="file.formatPDFAndDOC==='pdf'">
                         <VueOfficePdf :src="file.manuscriptAndMaterial" style="height: 670px"/>
                       </div>
                       <div
-                        v-if="file.manuscriptAndMaterial.substring(file.manuscriptAndMaterial.lastIndexOf('.') + 1, file.manuscriptAndMaterial.length)==='doc' ||file.manuscriptAndMaterial.substring(file.manuscriptAndMaterial.lastIndexOf('.') + 1, file.manuscriptAndMaterial.length)==='docx'">
-                        <iframe :src="yulanData.yulandz+file.manuscriptAndMaterial" width="100%"
+                        v-if="file.formatPDFAndDOC==='doc' ||file.formatPDFAndDOC==='docx'">
+                        <iframe :src="yulanData.yulandz+
+                        file.manuscriptAndMaterial" width="100%"
                                 height="670px"></iframe>
                       </div>
                     </el-scrollbar>
@@ -491,7 +492,7 @@ const formData = ref({
 })
 //定义一个word预览地址
 const yulanData = ref({
-  yulandz: 'https://view.officeapps.live.com/op/view.aspx?src='
+  yulandz: 'http://61.156.89.106:8012/onlinePreview?url='
 })
 const formRules = reactive({})
 
@@ -604,9 +605,11 @@ const pageAndPage = ref(0)
 
 const file = ref({
   format: '',
+  formatPDFAndDOC: '',
   url: '',
   workName: '',
   manuscriptAndMaterial: '',
+  manuscriptAndMaterialName: '',
   score: undefined
 });
 /** 作品评分 列表 */
@@ -691,18 +694,39 @@ const handleNodeClick = () => {
 /** 评分查看作品内容 */
 const lookWork = (value,i) => {
   indexScore.value=i
-  file.value = {score: undefined, workName: "", manuscriptAndMaterial: "", format: "", url: ""}
+  file.value = {
+    manuscriptAndMaterialName: "",
+    formatPDFAndDOC: "",
+    score: undefined, workName: "", manuscriptAndMaterial: "", format: "", url: ""}
   console.log(value)
   file.value.format = value.format
   file.value.url = value.workUrl
   file.value.workName = value.workName
   formDataScope.value.workId = value.workId
-  file.value.manuscriptAndMaterial = value.manuscriptAndMaterial
+  file.value.manuscriptAndMaterialName= value.manuscriptAndMaterial.split("/")[value.manuscriptAndMaterial.split("/").length - 1]
+  file.value.formatPDFAndDOC= value.manuscriptAndMaterial.substring(value.manuscriptAndMaterial.lastIndexOf('.') + 1, value.manuscriptAndMaterial.length)
+  console.log(file.value.formatPDFAndDOC)
+  if (file.value.formatPDFAndDOC==="doc"||file.value.formatPDFAndDOC==="docx"){
+    file.value.manuscriptAndMaterial = encodeURIComponent(base64Encode(value.manuscriptAndMaterial.replace('obs-sdjn2.cucloud','obs-sdjn2-internal.cucloud')))
+
+  }else {
+    file.value.manuscriptAndMaterial= value.manuscriptAndMaterial
+
+  }
+  console.log(file.value)
   file.value.score = value.scoreDO.score
   formDataScope.value.score = value.scoreDO.score
   formDataScope.value.id = value.scoreDO.id
   formDataScope.value.workId = value.workId
 }
+const base64Encode=(strings)=> {
+  // 使用btoa对字符串进行Base64编码
+  return btoa(encodeURIComponent(strings).replace(/%([0-9A-F]{2})/g,
+    function(match, p1) {
+      return String.fromCharCode('0x' + p1);
+    }));
+}
+
 const workList = ref<workVO[]>([]) // 作品列表的数据
 
 /** 访问作品类型获取数据 */
@@ -783,8 +807,16 @@ const getWorkLists = async () => {
       file.value.format = workList.value[indexScore.value].format
       file.value.url = workList.value[indexScore.value].workUrl
       file.value.workName = workList.value[indexScore.value].workName
-      file.value.manuscriptAndMaterial = workList.value[indexScore.value].manuscriptAndMaterial
-      file.value.score = workList.value[indexScore.value].scoreDO.score
+      file.value.manuscriptAndMaterialName= workList.value[indexScore.value].manuscriptAndMaterial.split("/")[workList.value[indexScore.value].manuscriptAndMaterial.split("/").length - 1]
+      file.value.formatPDFAndDOC= workList.value[indexScore.value].manuscriptAndMaterial.substring(workList.value[indexScore.value].manuscriptAndMaterial.lastIndexOf('.') + 1, workList.value[indexScore.value].manuscriptAndMaterial.length)
+      console.log(file.value.formatPDFAndDOC)
+      if (file.value.formatPDFAndDOC==="doc"||file.value.formatPDFAndDOC==="docx"){
+        file.value.manuscriptAndMaterial = encodeURIComponent(base64Encode(workList.value[indexScore.value].manuscriptAndMaterial.replace('obs-sdjn2.cucloud','obs-sdjn2-internal.cucloud')))
+
+      }else {
+        file.value.manuscriptAndMaterial= workList.value[indexScore.value].manuscriptAndMaterial
+
+      }      file.value.score = workList.value[indexScore.value].scoreDO.score
       formDataScope.value.score = workList.value[indexScore.value].scoreDO.score
       formDataScope.value.id = workList.value[indexScore.value].scoreDO.id
       formDataScope.value.workId = workList.value[indexScore.value].workId

src/views/work/work/index.vue

@@ -384,16 +384,28 @@ const selectFile = (scope) => {
   video.value.url = scope.row.workUrl;
   video.value.format = scope.row.format
 }
+const base64Encode=(strings)=> {
+  // 使用btoa对字符串进行Base64编码
+  return btoa(encodeURIComponent(strings).replace(/%([0-9A-F]{2})/g,
+    function(match, p1) {
+      return String.fromCharCode('0x' + p1);
+    }));
+}
+
 const selectFile2 = (scope) => {
   video.value.url=''
   video.value.format=''
   dialogVisible.value = true;
-  video.value.url =scope.row.manuscriptAndMaterial;
-  const index = video.value.url.lastIndexOf(".")
-  video.value.format  = video.value.url.substring(index + 1, video.value.url.length)
+  const index = scope.row.manuscriptAndMaterial.lastIndexOf(".")
+  video.value.format  = scope.row.manuscriptAndMaterial.substring(index + 1, scope.row.manuscriptAndMaterial.length)
   if(video.value.format==='doc'||video.value.format==='docx'){
-    video.value.url="https://view.officeapps.live.com/op/view.aspx?src="+video.value.url
+    video.value.url =scope.row.manuscriptAndMaterial.replace("jnjysyzy.obs-sdjn2.cucloud.cn","jnjysyzy.obs-sdjn2-internal.cucloud.cn");
+    video.value.url="http://61.156.89.106:8012/onlinePreview?url="+encodeURIComponent(base64Encode(video.value.url))
+  }else {
+    video.value.url =scope.row.manuscriptAndMaterial
+
   }
+  console.log(video.value)
   // alert(video.value.format)
   // video.value.format = "docx"
 }