You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
258 lines
6.8 KiB
258 lines
6.8 KiB
<template>
|
|
<view>
|
|
<form @submit="formSubmit">
|
|
<view class="mode_com lst_sug_unit">
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu" style="float: left;">待翻译照片</view>
|
|
</view>
|
|
<view class="sug_dly_flex sug_lst_img sug_fm_img">
|
|
<view class="w_33" v-for="(item,index) in pics" :key="index">
|
|
<view class="fm_img_2">
|
|
<image :src="imgUrl + item" class="sug_img" mode="aspectFill"></image>
|
|
<view @tap="delImg(index)" class="btn_del_sug">
|
|
<image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 上传按钮 -->
|
|
<view @tap="uploadImg" class="w_33" :style="isShow">
|
|
<view class="fm_img_2">
|
|
<image src="../../static/images/icn_xji.png" class="kou_top" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu">翻译为</view>
|
|
</view>
|
|
<view class="uni-list">
|
|
<view class="uni-list-cell">
|
|
<view class="uni-list-cell-left">
|
|
当前选择
|
|
</view>
|
|
<view class="uni-list-cell-db">
|
|
<picker @change="bindPickerChange" :value="index" :range="array">
|
|
<view class="uni-input">{{array[index]}}</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu" style="float: left;">结果:</view>
|
|
</view>
|
|
<view style="border: #000000;">
|
|
<textarea placeholder="翻译结果" placeholder-style="#FFFFF" maxlength=-1 style="border: 1px;" :value="message"></textarea>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="blk_2"></view> -->
|
|
<view class="mode_com lst_sug_unit">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu" style="float: left;">待翻译文字</view>
|
|
</view>
|
|
<view style="border: #000000;">
|
|
<textarea placeholder="待翻译文字" @blur="setText" placeholder-style="#FFFFF" maxlength=-1 style="border: 1px;" :value="text"></textarea>
|
|
</view>
|
|
<view>
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu">翻译为</view>
|
|
</view>
|
|
<view class="uni-list">
|
|
<view class="uni-list-cell">
|
|
<view class="uni-list-cell-left">
|
|
当前选择
|
|
</view>
|
|
<view class="uni-list-cell-db">
|
|
<picker @change="bindPickerChange2" :value="index2" :range="array">
|
|
<view class="uni-input">{{array[index2]}}</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="sug_form_line"></view> -->
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu" style="float: left;">结果:</view>
|
|
</view>
|
|
<view style="border: #000000;">
|
|
<textarea placeholder="翻译结果" placeholder-style="#FFFFF" maxlength=-1 style="border: 1px;" :value="textResult"></textarea>
|
|
</view>
|
|
<view class="mode_com sug_edit_btn">
|
|
<button type="default" class="state_sub" @click="fanyi2()">翻译</button>
|
|
</view>
|
|
</view>
|
|
</form>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
pics: [],
|
|
imgUrl: this.$config.ROOTPATH,
|
|
lineuser: "",
|
|
index: 0,
|
|
index2: 0,
|
|
array:[
|
|
"中文",
|
|
"繁体中文",
|
|
"英文",
|
|
"日语",
|
|
"粤语",
|
|
"韩语",
|
|
"法语",
|
|
"西班牙语"
|
|
],
|
|
arrayValue: [
|
|
"zh",
|
|
"cht",
|
|
"en",
|
|
"jp",
|
|
"yue",
|
|
"kor",
|
|
"fra",
|
|
"spa"
|
|
],
|
|
isShow:"display:block;",
|
|
message:"",
|
|
text:"",
|
|
textResult:""
|
|
}
|
|
},
|
|
methods: {
|
|
bindPickerChange: function(e) {
|
|
console.log('picker发送选择改变,携带值为', e.target.value)
|
|
this.index = e.target.value
|
|
this.fanyi();
|
|
},
|
|
bindPickerChange2: function(e) {
|
|
console.log('picker发送选择改变,携带值为', e.target.value)
|
|
this.index2 = e.target.value
|
|
},
|
|
setText: function(e){
|
|
this.text = e.detail.value;
|
|
},
|
|
uploadImg: function() {
|
|
var that = this;
|
|
var pics = that.pics;
|
|
if (pics.length < 1) {
|
|
uni.chooseImage({
|
|
count: 1, // 最多可以选择的图片张数,默认9
|
|
sizeType: ['original', 'compressed'], // original 原图,compressed 压缩图,默认二者都有
|
|
sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有
|
|
success: function(res) {
|
|
uni.showLoading({
|
|
mask: true,
|
|
title: "上传中"
|
|
})
|
|
var imgsrc = res.tempFilePaths;
|
|
uni.uploadFile({
|
|
url: that.$config.fileUpload,
|
|
filePath: imgsrc[0],
|
|
name: 'file',
|
|
success(res) {
|
|
if (res.statusCode != 200) {
|
|
uni.showToast({
|
|
title: "上传失败",
|
|
icon: "none"
|
|
})
|
|
uni.hideLoading();
|
|
}
|
|
var obj = JSON.parse(res.data);
|
|
var flag = that.$util.isSuccess(obj);
|
|
if (!flag) {
|
|
return;
|
|
}
|
|
obj = obj.data;
|
|
pics = pics.concat(obj.path);
|
|
that.pics = pics;
|
|
uni.hideLoading();
|
|
//调用翻译接口
|
|
that.isShow = "display:none;";
|
|
that.fanyi();
|
|
},
|
|
fail(res) {
|
|
uni.showToast({
|
|
title: "上传失败",
|
|
icon: "none"
|
|
})
|
|
uni.hideLoading();
|
|
}
|
|
})
|
|
}
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: "最多上传1张",
|
|
icon: "none"
|
|
})
|
|
}
|
|
},
|
|
fanyi: function(){
|
|
var that = this;
|
|
var data = {
|
|
fileUrl: that.imgUrl +that.pics[0],
|
|
toLanguage: that.arrayValue[that.index]
|
|
}
|
|
that.$Request.post(that.$config.generalTranslation,data).then(res => {
|
|
if(res.status == 200){
|
|
uni.showToast({
|
|
title:"翻译成功",
|
|
icon:"none"
|
|
})
|
|
that.message = res.data;
|
|
}else{
|
|
uni.showToast({
|
|
title:res.msg,
|
|
icon:"none"
|
|
})
|
|
}
|
|
});
|
|
},
|
|
fanyi2: function(){
|
|
var that = this;
|
|
if(that.text == undefined || that.text == "" || that.text.trim().length == 0){
|
|
uni.showToast({
|
|
title:"请输入带翻译内容",
|
|
icon:"none"
|
|
})
|
|
return false;
|
|
}
|
|
var data = {
|
|
query: that.text,
|
|
toLanguage: that.arrayValue[that.index2]
|
|
}
|
|
that.$Request.post(that.$config.photoTranslation,data).then(res => {
|
|
if(res.status == 200){
|
|
uni.showToast({
|
|
title:"翻译成功",
|
|
icon:"none"
|
|
})
|
|
that.textResult = res.data;
|
|
}else{
|
|
uni.showToast({
|
|
title:res.msg,
|
|
icon:"none"
|
|
})
|
|
}
|
|
});
|
|
},
|
|
delImg: function(index) {
|
|
this.isShow = "display:block;";
|
|
this.pics.splice(index, 1);
|
|
},
|
|
delName: function() {
|
|
this.lineuser = "";
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import url("../../static/css/common.css");
|
|
</style>
|
|
|