This commit is contained in:
2025-01-14 11:12:15 +08:00
parent 9129bd16b1
commit 1a30ab4683
5 changed files with 303 additions and 31 deletions

View File

@@ -58,7 +58,7 @@
<div class="unfetteredBox" style="height: 100%">
<common-word-html-type-setting
@loaded="onFirstComponentLoaded"
:urlList="{
img: 'api/Preaccept/getMainImages',
table: 'api/Preaccept/getMainTables'

View File

@@ -177,8 +177,8 @@
<el-col :span="12">
<h4>Manuscirpt :</h4>
<p class="fi_new">
<template v-for="item in manuscirptFileList">
<a href="#">
<!-- <template v-for="item in manuscirptFileList"> -->
<!-- <a href="#">
<img
src="../../assets/img/icon_0.png"
@click="openDrawer(item, mediaUrl + item.file_url)"
@@ -192,8 +192,16 @@
<a :href="mediaUrl + item.file_url">
<i class="el-icon-download download"></i>
</a>
</a> -->
<a v-for="item in manuscirptFileList" :href="mediaUrl + item.file_url" >
<img src="../../assets/img/icon_0.png" />
<span>
<font>Uploader : </font>{{ form.username }}
<i><i class="el-icon-time"></i>{{ formatDate(item.ctime) }}</i>
</span>
<i class="el-icon-download download"></i>
</a>
</template>
<!-- </template> -->
</p>
<br clear="both" />
</el-col>

View File

@@ -52,12 +52,11 @@
</el-table-column>
<el-table-column label="Cite" width="100px" align="center">
<template slot-scope="scope">
<p style="cursor: pointer;color:#006699 !important;" @click="goCite(scope.row)">
{{ scope.row.cite_num?scope.row.cite_num.length:0 }}
<span style="margin-left: 4px;cursor: pointer;color: #006699 !important;font-weight: bold">
<i class="el-icon-edit"></i>
<p style="cursor: pointer; color: #006699 !important" @click="goCite(scope.row)">
{{ scope.row.cite_num ? scope.row.cite_num.length : 0 }}
<span style="margin-left: 4px; cursor: pointer; color: #006699 !important; font-weight: bold">
<i class="el-icon-edit"></i>
</span>
</p>
</template>
@@ -271,6 +270,9 @@
<template slot="title">
Html Layout :
<span style="margin-left: 15px; color: #666" v-if="mains == ''">No Layout</span>
<el-button type="primary" @click="htmlLayout2('creat')" style="margin-left: 20px" class="import" v-if="mains == ''"
>Create Html Proofread</el-button
>
<span style="margin-left: 15px; color: #0b4b6a" v-if="mains != ''">Typesetting completed</span>
<el-button
v-if="mains != ''"
@@ -278,13 +280,14 @@
plain
icon="el-icon-document-copy"
@click.stop
@click="htmlLayout()"
@click="html_type == 2 ? htmlLayout2() : htmlLayout()"
style="margin-left: 20px"
>
<font>Edit Html Proofread</font>
</el-button>
<el-button
v-if="mains != ''"
v-if="mains != ''&&html_type == 0"
type="danger"
plain
icon="el-icon-document-copy"
@@ -297,16 +300,19 @@
</template>
<div>
<!-- 生成选项 -->
<div v-if="mains == ''">
<el-radio v-model="createType" label="1">Use last manuscirpt version</el-radio>
<el-radio v-model="createType" label="2">Use new file upload</el-radio>
<!-- <div v-if="mains == ''">
<div style="margin: 20px 0 0 0" >
<el-button type="primary" @click="htmlLayout2('creat')" class="import"
>Create Html Proofread</el-button
>
</div> -->
<!-- <el-radio v-model="createType" label="1">Use last manuscirpt version</el-radio>
<el-radio v-model="createType" label="2">Use new file upload</el-radio> -->
<!-- 使用默认最新稿件生成 -->
<div style="margin: 20px 0 0 0" v-if="createType == '1'">
<el-button type="primary" @click="htmlLayout" class="import">Create Html Proofread</el-button>
</div>
<!-- 文件上传 -->
<div class="up" style="margin: 20px 0 0 0" v-if="createType == '2'">
<!-- <div class="up" style="margin: 20px 0 0 0" v-if="createType == '2'">
<el-upload
ref="uploadFile"
class="upload-demo up_newstyle"
@@ -324,16 +330,15 @@
<div class="el-upload__text" @click="clearUploadedFile">
<em>Upload File</em>
</div>
<!-- <div class="el-upload__tip" slot="tip">
Only Word and compressed files can be uploaded (file format: .docx).
</div> -->
</el-upload>
<el-button type="primary" @click="htmlLayout" class="import">Create Html Proofread</el-button>
</div>
</div> -->
<!-- end -->
</div>
<!-- </div> -->
<!-- end -->
<div class="titHtml" v-if="mains != ''">
<div class="titHtml" v-if="mains != '' && html_type != 2" style="height: 50vh;overflow-y: auto;">
<div v-for="(item, index) in mains" :key="index">
<p v-html="item.content" v-if="item.width == 0"></p>
<p v-if="item.width != 0" class="MaxPicture">
@@ -342,6 +347,18 @@
</p>
</div>
</div>
<div class="titHtml titHtml1" v-if="htmlContent && html_type == 2">
<common-word
:readonly="true"
v-if="htmlContent"
ref="commonWord"
:value="htmlContent"
:wordStyle="wordStyle"
style="width: calc(100%); height: 50vh"
:style="`100%`"
></common-word>
<!-- <div v-html="htmlContent"></div> -->
</div>
</div>
</el-collapse-item>
<el-collapse-item name="references">
@@ -410,6 +427,51 @@ import { watch } from 'vue';
export default {
data() {
return {
html_type: null,
htmlContent: '',
wordStyle: `
p {
position: relative;
padding: 8px 15px;
min-height: 22px;
border: 2px dashed #fff;
border-radius: 5px;
color: #606266;
}
p {
font-size: 14px;
line-height: 22px;
}
.imgBox .chNumer {
position: absolute;
top: -2px;
right: -1px;
border-radius: 3px;
font-size: 10px;
background-color: rgb(0 102 153 / 85%);
color: #fff;
padding: 0 6px;
}
.MaxPicture {
text-align: center;
}
.MaxPicture > img {
margin-bottom: 10px;
}
.font {
display: block;
margin: 0 auto;
font-size: 13px;
}
.tableTitle{
text-align:center!important;
font-weight: bold;
}
`,
articleId: null,
createType: '1', // html生成方式
collapseActiveNames: [], // 手风琴绑定值
@@ -471,7 +533,8 @@ export default {
manuscirpt: ''
},
fileData: '', // 上传后返回的文件url
mains: [] // html 数据
mains: [], // html 数据,
newMains: []
};
},
created() {
@@ -488,7 +551,7 @@ export default {
methods: {
//跳转婴用列表
goCite(row) {
console.log('row at line 483:', row.article_id)
console.log('row at line 483:', row.article_id);
this.$router.push({
name: 'citeList',
query: {
@@ -916,6 +979,149 @@ export default {
this.$message.error(err);
});
},
getWord() {
var htmlContent = ``;
htmlContent += this.mains
.map((item) => {
//批注
let contentHtml = '';
var isRemark = ``;
// 判断是否是图片
if (item.type == 1) {
var extension = item.image.url.split('.').pop().toLowerCase();
if (extension == 'tif') {
contentHtml = `
<p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${item.ami_id}" main-id="${
item.am_id
}">
<img src="" data-img-id="${item.ami_id}" style="width: ${item.width ? `${item.width}px` : '100%'}" />
<font class="font" style="width: ${item.width ? `${item.width}px` : '100%'}">${item.image.note ? item.image.note : ''}</font>
</p>
`;
} else if (['jpg', 'jpeg', 'png'].includes(extension)) {
contentHtml = `
<p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${
item.ami_id
}" main-id="${item.am_id}">
${isRemark}
<img src="${this.mediaUrl + item.image.url}" style="width: ${
item.width ? `${item.width}px` : '100%'
}" />
<font class="font" style="width: ${item.width ? `${item.width}px` : '100%'}" >${
item.image.note ? item.image.note : ''
}</font>
</p>
`;
} else {
contentHtml = `
<p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${
item.ami_id
}" main-id="${item.am_id}">
${isRemark}
<span
style="
text-align: center;
font-size: 30px;
display: flex;
align-items: center;
justify-content: center;
"
>
Figures ( .${item.image.url.split('.').pop().toUpperCase()})
</span>
<font class="font" style="width: ${item.width ? `${item.width}px` : '100%'}" >${
item.image.note ? item.image.note : ''
}</font>
</p>
`;
}
} else if (item.type == 2) {
var tableList = JSON.parse(item.table.table_data);
contentHtml = `
<div contenteditable="false" data-id="${item.amt_id}" main-state="${item.state}" main-id="${
item.am_id
}" class="thumbnailTableBox wordTableHtml table_Box pMain" style="width: 100%; padding: 8px 15px; box-sizing: border-box; border-radius: 4px; position: relative;">
${isRemark}
<font class="font tableTitle" style="width:100%" >${item.table.title ? item.table.title : ''}</font>
<table border="1" style="width: auto; border-collapse: collapse; text-align: center; ">
${tableList
.map((row) => {
return `
<tr>
${row
.map((cell) => {
return `
<td colspan="${cell.colspan || 1}" rowspan="${cell.rowspan || 1}">
<span>${cell.text || ''}</span>
</td>
`;
})
.join('')} <!-- join the cells in the row -->
</tr>
`;
})
.join('')} <!-- join the rows -->
</table>
<font class="font" style="width:100%" >${item.table.note ? item.table.note : ''}</font>
</div>
`;
} else {
contentHtml = `<p class="pMain" main-state="${item.state}" contenteditable="false" data-id="${item.am_id}" main-id="${item.am_id}">${isRemark}${item.content}</p>`;
}
// 判断是否是表格类型
return contentHtml;
})
.join('');
this.htmlContent = htmlContent;
},
getMainsInfo2(e) {
this.loadHtml = true;
this.$api
.post('api/Publish/getHtmlForType2', {
article_id: this.articleId
})
.then((res) => {
this.loadHtml = false;
if (res.code == 0) {
// console.log(res,'res')
this.mains = '';
if( res.data.list.length>0){
this.mains = res.data.list;
this.getWord();
}else{
this.mains = '';
}
} else {
this.$message.error(res.msg);
}
})
.catch((err) => {
this.loadHtml = false;
this.$message.error(err);
});
},
creatMains(e) {
this.$api
.post('api/Publish/createHtmlForType2', {
article_id: this.articleId
})
.then((res) => {
})
.catch((err) => {
this.$message.error(err);
});
},
async getRefersList() {
var data;
await this.$api
@@ -935,7 +1141,9 @@ export default {
},
// 文章html弹出层
async htmlContet(e) {
this.articleId = e.article_id;
// this.articleId = '3444';
this.UpHtpFIle.article_id = e.article_id;
this.refersList = await this.getRefersList();
@@ -946,9 +1154,28 @@ export default {
this.UpHtpFIle.title = e.title;
this.UpHtpFIle.mains = e.mains;
this.UpLoadFile.article_id = e.article_id;
await this.getMainsInfo(e);
this.HtmlVisible = true;
this.html_type = e.html_type;
// this.html_type = 2;
if(this.html_type == 2){
if (e.has_html == 0) {
await this.getMainsInfo2();
this.HtmlVisible = true;
} else {
this.mains=''
this.HtmlVisible = true;
}
}else{
await this.getMainsInfo(e);
this.HtmlVisible = true;
}
},
// 生成html
// CreateHtml(){
// const loading = this.$loading({
@@ -970,7 +1197,30 @@ export default {
// })
// },
// 修改文章html
async htmlLayout2(type) {
if (type == 'creat') {
const loading = this.$loading({
lock: true,
text: 'Loading...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
await this.creatMains();
await this.getMainsInfo2();
loading.close();
} else { this.HtmlVisible=false
this.$router.push({
path: '/GenerateCharts',
query: {
id: this.articleId
}
});
}
},
htmlLayout() {
var that = this;
const loading = this.$loading({
lock: true,
text: 'Loading...',
@@ -986,6 +1236,7 @@ export default {
if (res.code == 0) {
loading.close();
this.HtmlVisible = false;
if (this.mains == '') {
this.$router.push({
path: 'comArtHtmlCreat',

View File

@@ -2,7 +2,9 @@
<div style="height: 98%;">
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item> <i class="el-icon-document-copy"></i> Artcile Html </el-breadcrumb-item>
<el-breadcrumb-item> <i class="el-icon-document-copy"></i> Artcile Html
<el-button size="mini" style="position: absolute;right: 40px;" @click="goEdit">Edit</el-button>
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="container" style="height: 97%; min-width: 1000px; background-color: #fafafa; padding: 10px 0 0 0">
@@ -91,6 +93,16 @@ export default {
this.getInfo();
},
methods: {
goEdit(){
this.$router.push({
path: '/GenerateCharts',
query: {
id: this.Art_Id
}
});
},
async getInfo() {
const loading = this.$loading({
lock: true,

View File

@@ -1,8 +1,9 @@
<template>
<!-- v-show="tables.length > 0 || images.length > 0" -->
<div
style="background-color: transparent !important; margin-top: 0px !important; height: 100%; padding: 0 !important; overflow: hidden"
class="ManuscirptList"
v-show="tables.length > 0 || images.length > 0"
>
<!-- 图片缩略图区域 -->