|
@@ -34,8 +34,8 @@
|
|
|
<el-input style="height: 100%; font-size: 20px;" maxlength="100000" :show-word-limit="true" type="textarea" placeholder="请输入需要注音的文字内容" v-model="txt1" @input="inputChange"></el-input>
|
|
|
</el-col>
|
|
|
<el-col :span="12" style="height: 100%;position: relative;">
|
|
|
- <div class="outarea" :class="tipsShow ? 'red-border' : ''" v-html="txtHtml" v-if="pinBuild == 1"></div>
|
|
|
- <el-input class="outtext" :class="tipsShow ? 'red-border' : ''" v-if="pinBuild == 2" type="textarea" readonly v-model="txtHtml"></el-input>
|
|
|
+ <el-input class="outtext" :class="tipsShow ? 'red-border' : ''" v-if="pinBuild == 3" type="textarea" readonly v-model="txtHtml"></el-input>
|
|
|
+ <div class="outarea" :class="tipsShow ? 'red-border' : ''" v-html="txtHtml" v-else></div>
|
|
|
<p class="pin-tips" v-if="tipsShow">非会员注音限制在20个以内</p>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -52,7 +52,7 @@
|
|
|
<i class="el-icon-notebook-2"></i>
|
|
|
文件列表
|
|
|
<span style="color: #F22C40; float: right;cursor: pointer;"
|
|
|
- @click="$message({message:'超长文本上下注音时,分割成每30万字导出一份文档', type:'warning'})">{{ loadingTips }}</span>
|
|
|
+ @click="$message({message:'超长文本结构注音时,分割成每30万字导出一份文档', type:'warning'})">{{ loadingTips }}</span>
|
|
|
</p>
|
|
|
<div class="table-scroll" id="drag-table">
|
|
|
<vxe-table
|
|
@@ -87,7 +87,8 @@
|
|
|
<span class="set-title">注音结构:</span>
|
|
|
<el-select v-model="pinBuild" size="small" style="width:100px;" @change="dataChange">
|
|
|
<el-option label="上下结构" :value="1"></el-option>
|
|
|
- <el-option label="只要拼音" :value="2"></el-option>
|
|
|
+ <el-option label="左右结构" :value="2"></el-option>
|
|
|
+ <el-option label="只要拼音" :value="3"></el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="set-item">
|
|
@@ -98,7 +99,7 @@
|
|
|
<el-option label="数字后缀" value="num"></el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
- <div class="set-item" v-if="pinBuild == 2">
|
|
|
+ <div class="set-item" v-if="pinBuild == 3">
|
|
|
<span class="set-title">输出内容:</span>
|
|
|
<el-select v-model="pinSetting.pattern" size="small" style="width:100px;" @change="dataChange">
|
|
|
<el-option label="完整拼音" value="-"></el-option>
|
|
@@ -115,20 +116,20 @@
|
|
|
<span class="set-title">导出格式:</span>
|
|
|
<el-select v-model="exportFormat" size="small" style="width:100px;" >
|
|
|
<el-option label="docx" value="docx"></el-option>
|
|
|
- <el-option label="txt" value="txt" v-if="pinBuild == 2"></el-option>
|
|
|
+ <el-option label="txt" value="txt" v-if="pinBuild == 3"></el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</el-row>
|
|
|
|
|
|
<el-row type="flex" style="padding: 10px 0;">
|
|
|
- <div class="set-item" v-if="pinBuild == 2">
|
|
|
+ <div class="set-item" v-if="pinBuild == 3">
|
|
|
<span class="set-title">模式:</span>
|
|
|
<el-select v-model="pinSetting.mode" size="small" style="width:100px;" @change="dataChange">
|
|
|
<el-option label="普通模式" value="-"></el-option>
|
|
|
<el-option label="姓氏模式" value="surname"></el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
- <div class="set-item" v-if="pinBuild == 2">
|
|
|
+ <div class="set-item" v-if="pinBuild == 3">
|
|
|
<span class="set-title">非汉字:</span>
|
|
|
<el-select v-model="pinSetting.nonZh" size="small" style="width:140px;" @change="dataChange">
|
|
|
<el-option label="以空格间隔输出" value="-"></el-option>
|
|
@@ -430,32 +431,33 @@
|
|
|
this.tipsShow = false;
|
|
|
}
|
|
|
|
|
|
- if(this.pinBuild == 1){ // 上下结构
|
|
|
- let htmls = html(val, {toneType : this.pinSetting.toneType, wrapNonChinese: true});
|
|
|
- let regex1 = new RegExp('py-non-chinese-item"> </span>', "g");
|
|
|
- let regex2 = new RegExp('py-non-chinese-item">\n</span>', "g");
|
|
|
- let regex3 = new RegExp('</span><span class="py-result-item">', "g");
|
|
|
- htmls = htmls.replace(regex1, 'py-non-chinese-item"> </span>')
|
|
|
- .replace(regex2, 'py-non-chinese-item">\n</span><br>')
|
|
|
- .replace(regex3, '</span>'+this.pinSetting.separator+'<span class="py-result-item">');
|
|
|
-
|
|
|
- let regex4 = /<ruby><span class="py-chinese-item">|<\/span><rp>|<\/rp><rt class="py-pinyin-item">|<\/rt><rp>|<\/rp><\/ruby>/g;
|
|
|
-
|
|
|
- htmls = htmls.replace(regex4, '')
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.txtHtml = htmls;
|
|
|
- }else{
|
|
|
+ if(this.pinBuild == 3){ // 只要拼音
|
|
|
this.txtHtml = pinyin(val, this.pinSetting);
|
|
|
+ }else{
|
|
|
+ let htmls = this.dealHtml(html(val, {toneType : this.pinSetting.toneType, wrapNonChinese: true}));
|
|
|
+ if(this.pinBuild == 2){ // 左右结构
|
|
|
+ let regex4 = /<ruby><span class="py-chinese-item">|<\/span><rp>|<\/rp><rt class="py-pinyin-item">|<\/rt><rp>|<\/rp><\/ruby>/g;
|
|
|
+ htmls = htmls.replace(regex4, '');
|
|
|
+ }
|
|
|
+ this.txtHtml = htmls;
|
|
|
}
|
|
|
},
|
|
|
dataChange(){
|
|
|
- if(this.pinBuild == 1 && this.exportFormat == 'txt'){
|
|
|
+ if(this.pinBuild != 3 && this.exportFormat == 'txt'){
|
|
|
this.exportFormat = 'docx';
|
|
|
}
|
|
|
this.inputChange(this.txt1);
|
|
|
},
|
|
|
+ // 格式化html
|
|
|
+ dealHtml(htmls){
|
|
|
+ let regex1 = new RegExp('py-non-chinese-item"> </span>', "g");
|
|
|
+ let regex2 = new RegExp('py-non-chinese-item">\n</span>', "g");
|
|
|
+ let regex3 = new RegExp('</span><span class="py-result-item">', "g");
|
|
|
+ htmls = htmls.replace(regex1, 'py-non-chinese-item"> </span>')
|
|
|
+ .replace(regex2, 'py-non-chinese-item">\n</span><br>')
|
|
|
+ .replace(regex3, '</span>'+this.pinSetting.separator+'<span class="py-result-item">');
|
|
|
+ return htmls;
|
|
|
+ },
|
|
|
// 导出
|
|
|
async exportFile(flag) {
|
|
|
this.loading = true;
|
|
@@ -475,11 +477,11 @@
|
|
|
|
|
|
let htmlContent = this.txtHtml;
|
|
|
let buffer;
|
|
|
- if(this.pinBuild == 1){ // 上下结构
|
|
|
+ if(this.pinBuild == 3){ // 只要拼音
|
|
|
+ buffer = htmlContent;
|
|
|
+ }else{
|
|
|
let blob = htmlDocx.asBlob(htmlContent);
|
|
|
buffer = Buffer.from(await blob.arrayBuffer());
|
|
|
- }else{
|
|
|
- buffer = htmlContent;
|
|
|
}
|
|
|
let filePath = this.handleData.newPath + "\\" + "注音文档" + this.$utils.formatFileTime() + '.' + this.exportFormat;
|
|
|
|
|
@@ -574,15 +576,11 @@
|
|
|
},
|
|
|
async blockFile(index, item, textArr){
|
|
|
for(let i = 0; i < textArr.length; i++){
|
|
|
- let htmls = html(textArr[i], {toneType : this.pinSetting.toneType, wrapNonChinese: true});
|
|
|
- let regex1 = new RegExp('py-non-chinese-item"> </span>', "g");
|
|
|
- let regex2 = new RegExp('py-non-chinese-item">\n</span>', "g");
|
|
|
- let regex3 = new RegExp('</span><span class="py-result-item">', "g");
|
|
|
- htmls = htmls.replace(regex1, 'py-non-chinese-item"> </span>')
|
|
|
- .replace(regex2, 'py-non-chinese-item">\n</span><br>')
|
|
|
- .replace(regex3, '</span>'+this.pinSetting.separator+'<span class="py-result-item">');
|
|
|
-
|
|
|
-
|
|
|
+ let htmls = this.dealHtml(html(textArr[i], {toneType : this.pinSetting.toneType, wrapNonChinese: true}));
|
|
|
+ if(this.pinBuild == 2){ // 左右结构
|
|
|
+ let regex4 = /<ruby><span class="py-chinese-item">|<\/span><rp>|<\/rp><rt class="py-pinyin-item">|<\/rt><rp>|<\/rp><\/ruby>/g;
|
|
|
+ htmls = htmls.replace(regex4, '');
|
|
|
+ }
|
|
|
let blob = htmlDocx.asBlob(htmls);
|
|
|
let buffer = Buffer.from(await blob.arrayBuffer());
|
|
|
|
|
@@ -629,7 +627,7 @@
|
|
|
let textLength = data.length;
|
|
|
let blockLength = Math.ceil(textLength / 300000);
|
|
|
let textArr = [];
|
|
|
- if(textLength > 300000 && this.pinBuild == 1){ // 文字长度大于30万字且是上下结构输出,分块处理
|
|
|
+ if(textLength > 300000 && this.pinBuild != 3){ // 文字长度大于30万字且是结构输出,分块处理
|
|
|
for(let i=0; i<blockLength; i++){
|
|
|
let startIndex = i * 300000;
|
|
|
let endIndex = (i+1) * 300000;
|
|
@@ -650,26 +648,25 @@
|
|
|
}else{
|
|
|
let outContent = '';
|
|
|
this.pinSetting.separator = this.separator == '' ? ' ' : this.separator;
|
|
|
- if(this.pinBuild == 1){ // 上下结构
|
|
|
- let htmls = html(data, {toneType : this.pinSetting.toneType, wrapNonChinese: true});
|
|
|
- let regex1 = new RegExp('py-non-chinese-item"> </span>', "g");
|
|
|
- let regex2 = new RegExp('py-non-chinese-item">\n</span>', "g");
|
|
|
- let regex3 = new RegExp('</span><span class="py-result-item">', "g");
|
|
|
- htmls = htmls.replace(regex1, 'py-non-chinese-item"> </span>')
|
|
|
- .replace(regex2, 'py-non-chinese-item">\n</span><br>')
|
|
|
- .replace(regex3, '</span>'+this.pinSetting.separator+'<span class="py-result-item">');
|
|
|
- outContent = htmls;
|
|
|
- }else{
|
|
|
+ if(this.pinBuild == 3){ // 只要拼音
|
|
|
outContent = pinyin(data, this.pinSetting);
|
|
|
+ }else{
|
|
|
+ let htmls = this.dealHtml(html(data, {toneType : this.pinSetting.toneType, wrapNonChinese: true}));
|
|
|
+ if(this.pinBuild == 2){ // 左右结构
|
|
|
+ let regex4 = /<ruby><span class="py-chinese-item">|<\/span><rp>|<\/rp><rt class="py-pinyin-item">|<\/rt><rp>|<\/rp><\/ruby>/g;
|
|
|
+ htmls = htmls.replace(regex4, '');
|
|
|
+ }
|
|
|
+ outContent = htmls;
|
|
|
}
|
|
|
|
|
|
this.showPercent(50, index, item);
|
|
|
+
|
|
|
let buffer;
|
|
|
- if(this.pinBuild == 1){ // 上下结构
|
|
|
+ if(this.pinBuild == 3){ // 只要拼音
|
|
|
+ buffer = outContent;
|
|
|
+ }else{
|
|
|
let blob = htmlDocx.asBlob(outContent);
|
|
|
buffer = Buffer.from(await blob.arrayBuffer());
|
|
|
- }else{
|
|
|
- buffer = Buffer.from(outContent);
|
|
|
}
|
|
|
|
|
|
this.showPercent(70, index, item);
|