提交
This commit is contained in:
@@ -62,7 +62,8 @@
|
||||
@onDragStart="onDragStart"
|
||||
@huifu="huifu"
|
||||
@onAddComment="onAddComment"
|
||||
@add="handleImageAdd"
|
||||
@addImage="handleImageAdd"
|
||||
@addTable="handleTableAdd"
|
||||
@addComment="addCommentSetting"
|
||||
@goToComment="goToComment"
|
||||
@edit="handleImageEdit"
|
||||
@@ -98,6 +99,7 @@
|
||||
@loaded="loadedWord"
|
||||
@onEdit="onEdit"
|
||||
@onDelete="onDelete"
|
||||
@refresh="onRefresh"
|
||||
@onComment="onComment"
|
||||
@onAddComment="onAddComment"
|
||||
@onEditTitle="onEditTitle"
|
||||
@@ -106,17 +108,10 @@
|
||||
:style="`100%`"
|
||||
>
|
||||
<template slot="comment">
|
||||
<div style="" class="commentList annotations">
|
||||
|
||||
</div>
|
||||
<div style="" class="commentList annotations"></div>
|
||||
</template>
|
||||
</common-word>
|
||||
</div>
|
||||
|
||||
<!-- <div style="height: 20px" v-if="Art_Doi == undefined"></div> -->
|
||||
<!-- <div style="margin: 20px 0 0 0; text-align: center; padding-bottom: 30px" v-if="Art_Doi != undefined">
|
||||
<el-button icon="el-icon-finished" type="primary" style="width: 350px" @click="pushOnline()"> Push Online </el-button>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<!--添加/修改图片 -->
|
||||
@@ -144,8 +139,16 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="Figure Describe :">
|
||||
<el-input placeholder="Please enter the table describe..." v-model="picStyle.note" type="textarea" :rows="3">
|
||||
</el-input>
|
||||
<tinymce
|
||||
:isAutomaticUpdate="true"
|
||||
ref="tinymceChildImgNote"
|
||||
@getContent="getContent"
|
||||
@updateChange="(res) => updateChange(res, 'imgNote')"
|
||||
:value="picStyle.note"
|
||||
class="paste-area text-container"
|
||||
toolbar="bold italic subscript superscript clearButton"
|
||||
height="120"
|
||||
></tinymce>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
@@ -452,7 +455,7 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
loadedWord() {
|
||||
this.isWordComponentLoaded = true;
|
||||
},
|
||||
@@ -541,7 +544,7 @@ export default {
|
||||
am_id: comment.am_id
|
||||
})
|
||||
.then((res) => {
|
||||
this.getDate()
|
||||
this.getDate();
|
||||
this.getCommentList();
|
||||
});
|
||||
// this.comments.splice(index, 1); // 删除评论
|
||||
@@ -549,7 +552,7 @@ export default {
|
||||
.catch(() => {});
|
||||
}
|
||||
},
|
||||
async saveContent(content,am_id) {
|
||||
async saveContent(content, am_id) {
|
||||
var that = this;
|
||||
var str = content.replace(/^<p>(.*?)<\/p>$/, '$1') ? content.replace(/^<p>(.*?)<\/p>$/, '$1') : '';
|
||||
if (str == '') {
|
||||
@@ -643,7 +646,14 @@ export default {
|
||||
async onDelete(dataId) {
|
||||
var dataInfo = this.Main_List.find((item) => item.am_id == dataId);
|
||||
|
||||
var type = dataInfo.amt_id ? 'table' : dataInfo.ami_id ? 'img' : 'content';
|
||||
var type = '';
|
||||
if (dataInfo.type == 1) {
|
||||
type = 'img';
|
||||
} else if (dataInfo.type == 2) {
|
||||
type = 'table';
|
||||
} else if (dataInfo.type == 0) {
|
||||
type = 'content';
|
||||
}
|
||||
|
||||
await this.$confirm(this.$t('commonTable.removeContent'), 'Prompt', {
|
||||
confirmButtonText: 'Submit',
|
||||
@@ -672,6 +682,7 @@ export default {
|
||||
if (res.code == 0) {
|
||||
setTimeout(() => {
|
||||
that.getDate();
|
||||
that.getCommentList();
|
||||
if (type == 'img') {
|
||||
that.$refs.commonWordHtmlTypeSetting.refresh('img');
|
||||
} else {
|
||||
@@ -757,6 +768,10 @@ export default {
|
||||
);
|
||||
}
|
||||
},
|
||||
onRefresh() {
|
||||
this.getDate();
|
||||
this.getCommentList();
|
||||
},
|
||||
editComment(comment) {
|
||||
this.commentForm = {
|
||||
...comment
|
||||
@@ -836,7 +851,11 @@ export default {
|
||||
},
|
||||
updateChange(content, type) {
|
||||
var str = this.$commonJS.transformHtmlString(content);
|
||||
this.lineStyle[type] = str;
|
||||
if (type == 'imgNote') {
|
||||
this.picStyle.note = str;
|
||||
} else {
|
||||
this.lineStyle[type] = str;
|
||||
}
|
||||
},
|
||||
onEdit(dataId) {
|
||||
this.currentId = null;
|
||||
@@ -948,121 +967,117 @@ export default {
|
||||
});
|
||||
},
|
||||
getWord() {
|
||||
// var htmlContent = `<h3 class="man_Title" contenteditable="false">${this.detailTitle} </h3>`;
|
||||
// htmlContent += this.Main_List.map((item) => {
|
||||
// //批注
|
||||
// let contentHtml = '';
|
||||
// var isRemark = ``;
|
||||
// if (item.remark && item.remark != '') {
|
||||
// // isRemark = `<img class="isRemark" main-id="${item.am_id}" src="${this.remarkImageUrl}" alt="" style="width:20px;height:20px;"/>`;
|
||||
// isRemark = `<span class="isRemark" main-id="${item.am_id}"><img class="isRemarkIcon" main-id="${item.am_id}" src="${
|
||||
// this.remarkImageUrl
|
||||
// }" alt="" style="width: 20px; height: 20px" />
|
||||
|
||||
// <span class="isRemarkIcon" main-id="${item.am_id}" > (${item.am_id})</span>
|
||||
// ${item.state == 0 ? `<span class="Resolved" main-id="${item.am_id}">Resolved</span>` : ''}
|
||||
// </span>
|
||||
|
||||
// `;
|
||||
// }
|
||||
// // 判断是否是图片
|
||||
// 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>
|
||||
// var htmlContent = `<h3 class="man_Title" contenteditable="false">${this.detailTitle} </h3>`;
|
||||
// htmlContent += this.Main_List.map((item) => {
|
||||
// //批注
|
||||
// let contentHtml = '';
|
||||
// var isRemark = ``;
|
||||
// if (item.remark && item.remark != '') {
|
||||
// // isRemark = `<img class="isRemark" main-id="${item.am_id}" src="${this.remarkImageUrl}" alt="" style="width:20px;height:20px;"/>`;
|
||||
// isRemark = `<span class="isRemark" main-id="${item.am_id}"><img class="isRemarkIcon" main-id="${item.am_id}" src="${
|
||||
// this.remarkImageUrl
|
||||
// }" alt="" style="width: 20px; height: 20px" />
|
||||
|
||||
// <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);
|
||||
// <span class="isRemarkIcon" main-id="${item.am_id}" > (${item.am_id})</span>
|
||||
// ${item.state == 0 ? `<span class="Resolved" main-id="${item.am_id}">Resolved</span>` : ''}
|
||||
// </span>
|
||||
|
||||
// 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>`;
|
||||
// }
|
||||
// `;
|
||||
// }
|
||||
// // 判断是否是图片
|
||||
// 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);
|
||||
|
||||
// return contentHtml;
|
||||
// }).join('');
|
||||
// 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;
|
||||
this.htmlContent = 'true';
|
||||
|
||||
},
|
||||
// 获取数据
|
||||
async getDate() {
|
||||
|
||||
// this.isFirstComponentLoaded = false;
|
||||
// this.isWordComponentLoaded = false;
|
||||
this.imagesList = [];
|
||||
let urlLInk = '';
|
||||
let urlTask = {};
|
||||
@@ -1083,8 +1098,6 @@ export default {
|
||||
.post(urlLInk, urlTask)
|
||||
.then(async (res) => {
|
||||
if (res.code == 0) {
|
||||
// this.detailTitle = res.data.production.title;
|
||||
// this.Art_P_Id = res.data.production.p_article_id;
|
||||
this.Main_List = res.data.list;
|
||||
this.getManuscirptContent();
|
||||
for (let i = 0; i < this.Main_List.length; i++) {
|
||||
@@ -1410,7 +1423,6 @@ export default {
|
||||
positionAnnotations() {
|
||||
this.$nextTick(() => {
|
||||
this.comments.forEach((item) => {
|
||||
|
||||
const contentElement = document.querySelector('[remark-main-id="' + item.am_id + '"]');
|
||||
const annotationElement = document.querySelector('[data-target="main-' + item.am_id + '"]');
|
||||
if (contentElement && annotationElement) {
|
||||
@@ -1739,7 +1751,7 @@ export default {
|
||||
}
|
||||
.commentList {
|
||||
width: 350px !important;
|
||||
|
||||
|
||||
padding: 15px;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
@@ -1770,6 +1782,4 @@ export default {
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555; /* 滑块悬停时的颜色 */
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user