翻译页细节调整

api/translate.ts

@@ -12,6 +12,7 @@ export default new class translate extends Http<ResOptions<any>> {
     private readonly identifyLanguageUrl = '/translate/identifyLanguage'
     private readonly getUserTranslateDocInfoUrl = '/translate/getUserTranslateDocInfo'
     private readonly ocrTranslateUrl = '/translate/ocr'
+    private readonly downLoadUrl = '/translate/download'
     getTranslateList(params:any) {
         return this.get(this.translateList, params)
     }
@@ -36,4 +37,7 @@ export default new class translate extends Http<ResOptions<any>> {
     getUserTranslateDocInfo(params:any) {
         return this.get(this.getUserTranslateDocInfoUrl, params)
     }
+    downLoad(params:any) {
+        return this.get(this.downLoadUrl, params)
+    }
 }

pages/translate.vue

@@ -63,12 +63,12 @@
         <el-input
           v-if="radio1==1||radio1==3"
           v-model="textarea"
-          @keyup.enter="importIdentifyLanguage"
+          @input="importIdentifyLanguage"
           :rows="2"
           type="textarea"
           placeholder="输入翻译"/>
         <el-upload
-          v-if="radio1==2||radio1==4"
+          v-if="radio1==2"
           ref="upload"
           class="upload-demo"
           drag
@@ -77,20 +77,35 @@
           :on-change="uploadChange"
           :on-success="uploadSuccess"
           :on-error="uploadError"
+          accept=".docx,.xls,.xlsx,.ppt,.pptx,.pdf"
           action="/api/common/upload">
-          <img style="width:64px;height:64px;marginLeft:45px" src="../assets/images/fileIcon.png"
-               alt="">
+          <img style="width:64px;height:64px;marginLeft:45px" src="../assets/images/fileIcon.png" alt="">
           <div class="el-upload__text">
             点击文件上传
           </div>
           <div class="el-upload__text2">
-            支持扩展名：XML、TXT、DOC、DOCX、PDF或JPG格式
+            支持扩展名：docx、xls、xlsx、ppt、pptx、pdf格式
+          </div>
+        </el-upload>
+        <el-upload
+          v-if="radio1==4"
+          ref="upload"
+          class="upload-demo"
+          drag
+          limit="1"
+          :before-upload="beforeUpload2"
+          :on-change="uploadChange"
+          :on-success="uploadSuccess"
+          :on-error="uploadError"
+          accept=".pdf,.jpg,.jpeg,.png,.bmp"
+          action="/api/common/upload">
+          <img style="width:64px;height:64px;marginLeft:45px" src="../assets/images/fileIcon.png" alt="">
+          <div class="el-upload__text">
+            点击文件上传
+          </div>
+          <div class="el-upload__text2">
+            支持扩展名：pdf、jpg、jpeg、png、bmp格式
           </div>
-          <!-- <template #tip>
-            <div class="el-upload__tip">
-              jpg/png files with a size less than 500kb
-            </div>
-          </template> -->
         </el-upload>
       </div>
       <!-- <div class="importBox3" v-if="radio1==2||radio1==3">
@@ -135,20 +150,18 @@
 
       </el-form>
       <el-table v-loading="loading" size="large" border :data="content" :empty-text="'暂无数据'"
-                :header-cell-style="{background: '#f5f5f5', color:'#333333'}">
-        <el-table-column show-overflow-tooltip align="center" label="时间"
-                         prop="date"></el-table-column>
-        <el-table-column show-overflow-tooltip align="center" label="名称"
-                         prop="name">
+        :header-cell-style="{background: '#f5f5f5', color:'#333333'}">
+        <el-table-column show-overflow-tooltip align="center" label="时间" prop="date"></el-table-column>
+        <el-table-column show-overflow-tooltip align="center" label="名称" prop="name">
           <template #header>
             <span>名称</span>
           </template>
         </el-table-column>
-        <el-table-column show-overflow-tooltip align="center" label="附件"
-                         prop=""></el-table-column>
-        <el-table-column show-overflow-tooltip align="center" label="操作"
-                         prop="notification_time_text">
-          <span style="color:#E60B0B"><a href="">下载</a></span>
+        <el-table-column show-overflow-tooltip align="center" label="附件" prop=""></el-table-column>
+        <el-table-column show-overflow-tooltip align="center" label="操作" prop="notification_time_text">
+          <template #default="scope">
+            <span style="color:#E60B0B"><a :href="`/api/translate/download?id=${scope.row.id}`">下载</a></span>
+          </template>
         </el-table-column>
       </el-table>
       <div class="mt-32">
@@ -210,10 +223,10 @@ const options2 = reactive([
   {value: 'zh', lable: '中文（简体）'},
   {value: "en", lable: '英文'},
 ])
-const value2 = ref('')
+const value2 = ref('中文')
 const value = ref('')
 const abbreviation1 = ref('')
-const abbreviation2 = ref('en')
+const abbreviation2 = ref('zh')
 const searchData = ref({
   selecttime: '',
   name: ''
@@ -225,6 +238,7 @@ const tanchuang2 = ref()
 const upload = ref()
 const fileUrl = ref('')
 const uid = ref('')
+const timer2 = ref(1)
 const socket = ref(null)
 
 watch(currentLangModalStatus, (val) => {
@@ -286,9 +300,66 @@ function changeTranslate(val: any) {
     }
   })
 }
+//  function downLoad(index:any,record:any){
+//    translateApi.downLoad({id:record.id}).then((res)=>{
+
+//      console.log(res)
+//    })
+//    .catch((error)=>{
+//     console.log(error)
+//    })
   
+// }
 function beforeUpload(file: any) {
-  console.log(file)
+   // 截取上传的文件名后缀
+    let fileExtName = file.name.substring(file.name.lastIndexOf('.') + 1);
+    console.log(typeof fileExtName)
+    if(
+        fileExtName === 'docx' ||
+        fileExtName === 'xls' ||
+        fileExtName === 'xlsx' ||
+        fileExtName === 'ppt' ||
+        fileExtName === 'pptx' ||
+        fileExtName === 'pdf'
+    ){
+       //进行上传成功的一些操作;
+      if(value.value){
+        console.log('file',file);
+      return true
+      }else{
+        ElMessage.success('您还未选择语言')
+        return false
+      }
+    }else{
+         // 提醒只能上传的文件类型
+        ElMessage.warning('只能上传.docx,.xls,.xlsx,.ppt,.pptx,.pdf类型的文件！');
+        return false;
+    }
+}
+function beforeUpload2(file: any) {
+   // 截取上传的文件名后缀
+    let fileExtName = file.name.substring(file.name.lastIndexOf('.') + 1);
+    
+    if(
+        fileExtName === 'pdf' ||
+        fileExtName === 'jpg' ||
+        fileExtName === 'jpeg' ||
+        fileExtName === 'png' ||
+        fileExtName === 'bmp'
+    ){
+       //进行上传成功的一些操作;
+      if(value.value){
+        console.log('file',file);
+        return true
+      }else{
+        ElMessage.success('您还未选择语言')
+        return false
+      }
+    }else{
+         // 提醒只能上传的文件类型
+        ElMessage.warning('只能上传.pdf,.jpg,.jpeg,.png,.bmp类型的文件！');
+        return false;
+    }
 }
 
 function uploadChange() {
@@ -317,18 +388,28 @@ function goYouHua() {
 }
 
 async function importIdentifyLanguage() {
-  const {data: data} = await translateApi.identifyLanguage({
-    content: textarea.value,
-  })
-  value.value = data.name
-  abbreviation1.value = data.abbreviation
+  clearTimeout(timer2.value)
+  timer2.value = setTimeout(async()=>{
+    if(textarea.value){
+      const data = await translateApi.identifyLanguage({
+        content: textarea.value,
+      })
+      if(data.code == 1){
+        value.value = data.data.name
+        abbreviation1.value = data.data.abbreviation
+      }else{
+        value.value = ''
+        abbreviation1.value = ''
+      }
+    }
+  },500)
 }
 
 function reset() {
   value.value = ''
-  value2.value = ''
+  value2.value = '中文'
   abbreviation1.value = ''
-  abbreviation2.value = ''
+  abbreviation2.value = 'zh'
   textarea.value = ''
   textarea2.value = ''
 }
@@ -387,35 +468,38 @@ async function translate() {
 }
 
 async function translate3() {
-  const {data: data} = await translateApi.ocrTranslate({
-    file: fileUrl.value,
-    source: abbreviation1.value,
-    target: abbreviation2.value
-  })
-  textarea2.value = data
-
+  if(value.value&&value2.value&&abbreviation1.value&&abbreviation2.value){
+    const {data: data} = await translateApi.ocrTranslate({
+      file: fileUrl.value,
+      source: abbreviation1.value,
+      target: abbreviation2.value
+    })
+    textarea2.value = data
+  }else{
+    ElMessage.success('您还未选择语言,或语言为选全')
+  }
 }
 
 async function translate2() {
-  translateApi.translateFile({
-    file: fileUrl.value,
-    source: abbreviation1.value,
-    target: abbreviation2.value
-  }).then(res => {
-
-
-// @ts-ignore
-    socket.value.on('translateDoc', async (msg) => {
-      console.log("收到消息：" + msg);
-      // 调接口
-      translateApi.getUserTranslateDocInfo({id: msg}).then((data) => {
-        textarea2.value = data.data.after_content
-
-      })
-    });
-  })
-
-
+  if(value.value&&value2.value&&abbreviation1.value&&abbreviation2.value){
+    translateApi.translateFile({
+      file: fileUrl.value,
+      source: abbreviation1.value,
+      target: abbreviation2.value
+    }).then(res => {
+      // @ts-ignore
+      socket.value.on('translateDoc', async (msg) => {
+        console.log("收到消息：" + msg);
+        // 调接口
+        translateApi.getUserTranslateDocInfo({id: msg}).then((data) => {
+          textarea2.value = data.data.after_content
+  
+        })
+      });
+    })
+  }else{
+    ElMessage.success('您还未选择语言,或语言为选全')
+  }
 }
 
 async function allLanguage() {