This commit is contained in:
2025-06-09 15:55:07 +08:00
parent 8c4701c2e6
commit 19c672b3c7
9 changed files with 220 additions and 137 deletions

BIN
dist.zip

Binary file not shown.

View File

@@ -19,8 +19,8 @@ const service = axios.create({
// baseURL: 'https://submission.tmrjournals.com/', //正式 记得切换 // baseURL: 'https://submission.tmrjournals.com/', //正式 记得切换
// baseURL: 'http://www.tougao.com/', //测试本地 记得切换 // baseURL: 'http://www.tougao.com/', //测试本地 记得切换
// baseURL: 'http://192.168.110.110/tougao/public/index.php/', // baseURL: 'http://192.168.110.110/tougao/public/index.php/',
// baseURL: '/api', //本地 baseURL: '/api', //本地
baseURL: '/', //正式 // baseURL: '/', //正式
}); });

View File

@@ -52,9 +52,10 @@ const capitalizeFirstLetter = function (text) {
//px //px
function emuToPixels(emu) { function emuToPixels(emu) {
// 将 EMU 转换为厘米,并进一步转换为像素 // 将 EMU 转换为厘米,并进一步转换为像素
const emuToPixels = emu / 914400 * 2.54 * 96; const emuToPixels = emu * 96 / 914400;
// return parseFloat((emu * 96 / 914400).toFixed(2)); // ✅
// 四舍五入并保留两位小数 // 四舍五入并保留两位小数
return (Math.round(emuToPixels * 100) / 100).toFixed(2); return (Math.round(emuToPixels * 100) / 100).toFixed(0);
} }
function findExtentElement(blipElement) { function findExtentElement(blipElement) {
let current = blipElement.parentElement; let current = blipElement.parentElement;
@@ -116,7 +117,7 @@ export default {
handleFileUpload(event, callback) { handleFileUpload(event, callback) {
const file = event.target.files[0]; const file = event.target.files[0];
if (!file || file.type !== 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') { if (!file || file.type !== 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') {
alert('请上传一个有效的 Word 文件'); alert('Please upload a valid Word file !');
return; return;
} }
@@ -137,7 +138,7 @@ export default {
const rels = {}; const rels = {};
Array.from(relDoc.getElementsByTagName('Relationship')).forEach((rel) => { Array.from(relDoc.getElementsByTagName('Relationship')).forEach((rel) => {
const id = rel.getAttribute('Id'); const id = rel.getAttribute('Id');
const target = rel.getAttribute('Target'); // e.g., 'media/image1.jpeg' const target = rel.getAttribute('Target');
rels[id] = target; rels[id] = target;
}); });
@@ -153,66 +154,41 @@ export default {
if (cx && cy) { if (cx && cy) {
const width = emuToPixels(cx); const width = emuToPixels(cx);
const height = emuToPixels(cy); const height = emuToPixels(cy);
const mediaFile = rels[embedId]; imageInfoMap[embedId] = { width, height };
if (mediaFile) {
imageInfoMap[mediaFile] = { width, height };
console.log('imageInfoMap at line 158:', imageInfoMap)
}
} }
} }
}); });
mammoth.convertToHtml({ arrayBuffer }, mammoth.convertToHtml({ arrayBuffer }, {
{
convertImage: mammoth.images.inline(async function (image) { convertImage: mammoth.images.inline(async function (image) {
console.log('image at line 163:', image)
const contentType = image.contentType.toLowerCase(); const contentType = image.contentType.toLowerCase();
// 只允许这三种格式
const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png']; const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png'];
if (!allowedTypes.includes(contentType)) { if (!allowedTypes.includes(contentType)) {
// 跳过不支持的格式(如 image/tiff、image/x-emf 等) return { src: '' };
return { src: '' }; // 会从 HTML 中删除这张图片
} }
// 读取为 base64 并构造 src const embedId = image.relationshipId || image.refId || '';
const imageBuffer = await image.read("base64"); const imageBuffer = await image.read("base64");
const base64Src = `data:${contentType};base64,${imageBuffer}`; const base64Src = `data:${contentType};base64,${imageBuffer}`;
let width = '', height = '';
if (embedId && imageInfoMap[embedId]) {
width = imageInfoMap[embedId].width;
height = imageInfoMap[embedId].height;
}
return { return {
src: base64Src src: base64Src,
alt: '',
width,
height,
refId: embedId,
'content-type': contentType
}; };
}) })
}) }).then((result) => {
.then((result) => {
let html = result.value; let html = result.value;
// html = html.replace(/<img[^>]+src="data:image\/x-emf[^"]*"[^>]*>/gi, '');
// 替换图片标签中的宽高
const imgTags = html.match(/<img[^>]*src="data:image\/(png|jpg|jpeg);base64,[^"]*"/gi);
console.log('imgTags at line 190:', imgTags);
if (imgTags) {
imgTags.forEach((imgTag) => {
// 提取 "image数字.png" 或 "image数字.jpg" 这样的文件名
const match = imgTag.match(/image(\d+)\.(png|jpg|jpeg)/);
if (match) {
// 构造文件名,例如 "media/image1.png"
const filename = `media/image${match[1]}.${match[2]}`;
const info = imageInfoMap[filename]; // 从 imageInfoMap 中查找宽高信息
console.log('info at line 196:', info); // 查看是否找到了相关图片信息
if (info) {
// 如果找到了图片的信息,就添加宽度和高度到 <img> 标签
const newImgTag = imgTag.replace(
/<img/,
`<img width="${info.width}" height="${info.height}"`
);
html = html.replace(imgTag, newImgTag); // 替换原始的 <img> 标签
}
}
});
}
// 提取合法表格 // 提取合法表格
const tableContent = html.match(/<table[\s\S]*?<\/table>/g); const tableContent = html.match(/<table[\s\S]*?<\/table>/g);
@@ -221,11 +197,9 @@ export default {
: []; : [];
callback(validTables); callback(validTables);
}) }).catch(err => {
.catch(err => {
console.error('mammoth 转换失败:', err); console.error('mammoth 转换失败:', err);
}); });
}).catch(err => { }).catch(err => {
console.error("Zip 读取失败:", err); console.error("Zip 读取失败:", err);
}); });

View File

@@ -349,10 +349,10 @@ const en = {
rulesAuthorInfo: 'Please enter the author', rulesAuthorInfo: 'Please enter the author',
rulesVolInfo: 'Please enter the publication time', rulesVolInfo: 'Please enter the publication time',
rulesArticleInfo: 'Please enter the article title', rulesArticleInfo: 'Please enter the article title',
authorInfo: 'Six or less authors are required to list all authors while more than six authors are required to list three of them with “et al”.', authorInfo: 'Six or less authors are required to list all authors while more than six authors are required to list three of them with “et al.”.',
author: 'Author(s)', author: 'Author(s)',
publicationTime: 'Year', publicationTime: 'Year',
publicationTimeInfo: 'Year;Volume(issue):Inclusive page numbers.', publicationTimeInfo: 'Year;Volume(issue):Inclusive page numbers',
}, },
commonTable: { commonTable: {
add: 'Add', add: 'Add',

View File

@@ -1128,9 +1128,23 @@ export default {
}, },
handleFileChange(event) { handleFileChange(event) {
var that = this; var that = this;
const loading = this.$loading({
lock: true,
text: 'Loading...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
// 处理文件上传并传递回调函数 // 处理文件上传并传递回调函数
this.$commonJS.handleFileUpload(event, function (tables) { this.$commonJS.handleFileUpload(event, function (tables) {
console.log('tables at line 1138:', tables)
if(tables.length == 0){
loading.close()
that.$message({
type: 'warning',
message: 'No table found!'
});
return false
}
// 使用 Promise.all 等待所有表格解析完成 // 使用 Promise.all 等待所有表格解析完成
Promise.all( Promise.all(
@@ -1148,9 +1162,11 @@ export default {
.then((result) => { .then((result) => {
// 所有表格的解析完成后,处理结果 // 所有表格的解析完成后,处理结果
that.uploadWordTables = result; that.uploadWordTables = result;
loading.close()
that.tablesHtmlVisible = true; that.tablesHtmlVisible = true;
}) })
.catch((error) => { .catch((error) => {
loading.close()
console.error('Error processing tables:', error); console.error('Error processing tables:', error);
}); });
}); });

View File

@@ -182,6 +182,8 @@ export default {
}, },
data() { data() {
return { return {
baseUrl: this.Common.baseUrl,
mediaUrl: this.Common.mediaUrl,
typesettingType: 1, typesettingType: 1,
typesettingTypeOptions: [ typesettingTypeOptions: [
{ {
@@ -316,7 +318,6 @@ export default {
console.log('粘贴的内容包含表格'); console.log('粘贴的内容包含表格');
if (_this.type == 'table') { if (_this.type == 'table') {
_this.$commonJS.parseTableToArray(content, (tableList) => { _this.$commonJS.parseTableToArray(content, (tableList) => {
var contentHtml = ` var contentHtml = `
<div class="thumbnailTableBox wordTableHtml table_Box" style=""> <div class="thumbnailTableBox wordTableHtml table_Box" style="">
<table border="1" style="width: auto; border-collapse: collapse; text-align: center;"> <table border="1" style="width: auto; border-collapse: collapse; text-align: center;">
@@ -404,7 +405,8 @@ export default {
custom_colors: false, custom_colors: false,
color_map: ['0082AA', 'TMR Blue'], color_map: ['0082AA', 'TMR Blue'],
plugins: 'texttransform noneditable table', // 启用 forecolor 和 code 插件 // image
plugins: 'texttransform noneditable table image', // 启用 forecolor 和 code 插件
// plugins: 'forecolor code paste table image mathType searchreplace raw', // 启用 forecolor 和 code 插件 // plugins: 'forecolor code paste table image mathType searchreplace raw', // 启用 forecolor 和 code 插件
end_container_on_empty_block: true, end_container_on_empty_block: true,
content_css: 'default', // 加载 TinyMCE 默认样式表 content_css: 'default', // 加载 TinyMCE 默认样式表
@@ -413,6 +415,50 @@ export default {
path: 'https://cdn.mathjax.org/mathjax/latest/MathJax.js', path: 'https://cdn.mathjax.org/mathjax/latest/MathJax.js',
config: 'TeX-AMS-MML_HTMLorMML' config: 'TeX-AMS-MML_HTMLorMML'
}, },
// automatic_uploads: false,
// images_upload_handler: function (blobInfo, success, failure, progress) {
// console.log('blobInfo at line 419:', blobInfo);
// return new Promise(function (resolve, reject) {
// const xhr = new XMLHttpRequest();
// const formData = new FormData();
// const file = blobInfo.blob();
// let filename = file.name;
// if (!filename) {
// // 如果没有名字,则手动生成一个
// const ext = file.type.split('/').pop(); // 从 MIME 类型获取扩展名,例如 'png'
// const timestamp = Date.now();
// filename = `unnamed_${timestamp}.${ext}`;
// }
// console.log('file at line 424:', file);
// xhr.withCredentials = false;
// xhr.open('POST', _this.baseUrl + '/api/Preaccept/up_img_mainImage');
// xhr.onload = function () {
// if (xhr.status !== 200) {
// reject('HTTP Error: ' + xhr.status);
// return;
// }
// try {
// const json = JSON.parse(xhr.responseText);
// console.log('json at line 434:', json);
// if (json.code != 0) {
// reject('Upload Error: ' + json.msg);
// return;
// }
// resolve(_this.mediaUrl + 'articleImage/' + json.data.upurl); // ✅ 返回图片 URL 给 TinyMCE 插入
// } catch (e) {
// reject('Invalid response: ' + xhr.responseText);
// }
// };
// formData.append('mainImage', file, filename);
// formData.append('article_id', _this.$route.query.id);
// xhr.send(formData);
// });
// },
//设置自定义按钮 myCustomToolbarButton //设置自定义按钮 myCustomToolbarButton
setup(ed) { setup(ed) {
_this.$commonJS.initEditorButton(_this, ed); _this.$commonJS.initEditorButton(_this, ed);

View File

@@ -2,7 +2,7 @@
<div> <div>
<!--uploadWord |customButtonExportWord |customButtonExportImg --> <!--uploadWord |customButtonExportWord |customButtonExportImg -->
<!-- image -->
<tinymce <tinymce
type="table" type="table"
ref="tinymceChild1" ref="tinymceChild1"

View File

@@ -52,13 +52,15 @@
</li> </li>
</ul> --> </ul> -->
<div class="go-mt"> <div class="go-mt">
<el-radio-group v-model="isCollapse" style="float:right;" size="mini" @change="changeIsCollapse"> <el-radio-group v-model="isCollapse" style="float: right" size="mini" @change="changeIsCollapse">
<el-radio-button :label="false">{{ $t('commonTable.singleRow') }}</el-radio-button> <el-radio-button :label="false">{{ $t('commonTable.singleRow') }}</el-radio-button>
<el-radio-button :label="true">{{ $t('commonTable.Multicolumn') }}</el-radio-button> <el-radio-button :label="true">{{ $t('commonTable.Multicolumn') }}</el-radio-button>
</el-radio-group> </el-radio-group>
</div> </div>
<div style="width: 200px; float: right; padding: 10px; height: calc(100% - 28px); box-sizing: border-box; overflow-y: auto" class="arrlist"> <div
style="width: 200px; float: right; padding: 10px; height: calc(100% - 28px); box-sizing: border-box; overflow-y: auto"
class="arrlist"
>
<ul style="width: 100%; height: auto"> <ul style="width: 100%; height: auto">
<!-- <li v-show="currentMenu == 1"> <!-- <li v-show="currentMenu == 1">
<div style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: start"> <div style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: start">
@@ -148,7 +150,10 @@
overflow: hidden; overflow: hidden;
position: relative;`" position: relative;`"
> >
<div class="imgbox" style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"> <div
class="imgbox"
style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"
>
<!-- 图片内容 --> <!-- 图片内容 -->
<img src="@/assets/img/upload.png" style="width: 100px; height: 100%; object-fit: cover" /> <img src="@/assets/img/upload.png" style="width: 100px; height: 100%; object-fit: cover" />
</div> </div>
@@ -191,12 +196,12 @@
<div class="title"> <div class="title">
<span <span
>Figure {{ index + 1 }} >Figure {{ index + 1 }}
<span class="previewbox" <span
class="previewbox"
@click="openPreview(index, 'img')" @click="openPreview(index, 'img')"
v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())" v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())"
> >
<i class="el-icon-view" style="font-size: 16px"></i> <i class="el-icon-view" style="font-size: 16px"></i>
</span> </span>
<a :href="mediaUrl + img.image.url" style="color: #000" v-else> <a :href="mediaUrl + img.image.url" style="color: #000" v-else>
<!-- <el-tooltip class="item" effect="dark" :content="$t('commonTable.preview')" placement="top"> --> <!-- <el-tooltip class="item" effect="dark" :content="$t('commonTable.preview')" placement="top"> -->
@@ -244,17 +249,30 @@
:draggable="img.has_selected == 0 ? true : false" :draggable="img.has_selected == 0 ? true : false"
@dragstart="img.has_selected == 0 ? onDragStart($event, img, index, 'img') : ''" @dragstart="img.has_selected == 0 ? onDragStart($event, img, index, 'img') : ''"
> >
<div class="imgbox" style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"> <div
class="imgbox"
style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"
>
<!-- 图片内容 --> <!-- 图片内容 -->
<template v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())"> <template v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())">
<img @click="img.has_selected == 1?goToListComment(img.article_image_id, 'img'):openPreview(index, 'img')" <img
@click="
img.has_selected == 1
? goToListComment(img.article_image_id, 'img')
: openPreview(index, 'img')
"
:data-img-id="img.article_image_id" :data-img-id="img.article_image_id"
:src="mediaUrl + img.image" :src="mediaUrl + img.image"
style="width: 140px; height: 100%; object-fit: cover" style="width: 140px; height: 100%; object-fit: cover"
/> />
</template> </template>
<template v-else-if="img.image.split('.').pop().toLowerCase() === 'tif'"> <template v-else-if="img.image.split('.').pop().toLowerCase() === 'tif'">
<img @click="img.has_selected == 1?goToListComment(img.article_image_id, 'img'):openPreview(index, 'img')" <img
@click="
img.has_selected == 1
? goToListComment(img.article_image_id, 'img')
: openPreview(index, 'img')
"
:data-img-id="img.article_image_id" :data-img-id="img.article_image_id"
:src="img.dataUrl" :src="img.dataUrl"
style="width: 140px; height: 100%; object-fit: cover" style="width: 140px; height: 100%; object-fit: cover"
@@ -311,11 +329,23 @@
</li> </li>
<li v-show="currentMenu == 2"> <li v-show="currentMenu == 2">
<div style="" class="go-content-charts-item-box" :class="isCollapse ? 'double' : 'single'"> <div style="" class="go-content-charts-item-box" :class="isCollapse ? 'double' : 'single'">
<!-- <el-tooltip
class="item"
effect="dark"
content="Upload a Word file and automatically recognize all tables in the document"
placement="top-start"
>
<p @click.stop="handlePaperclip" style="display: flex; align-items: center; justify-content: space-around">
<img src="@/assets/img/word.png" style="width: 20px; height: auto" />
<span style="margin-left: 8px; font-size: 14px; color: #103f91; font-weight: bold">Upload Word</span>
</p>
</el-tooltip> -->
<div class="item_box" @click="addTable" style="width: 100%; height: auto; position: relative"> <div class="item_box" @click="addTable" style="width: 100%; height: auto; position: relative">
<div class="list-center go-flex-center go-transition" style="width: 100%"> <div class="list-center go-flex-center go-transition" style="width: 100%">
<div class="title"> <div class="title">
<span>Add Table </span> <span>Add Table </span>
<span @click.stop="handlePaperclip"><i class="el-icon-paperclip"></i></span> <!-- <span @click.stop="handlePaperclip"><i class="el-icon-paperclip"></i></span> -->
</div> </div>
<div <div
@@ -329,7 +359,10 @@
overflow: hidden; overflow: hidden;
position: relative;`" position: relative;`"
> >
<div class="imgbox" style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"> <div
class="imgbox"
style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"
>
<!-- 图片内容 --> <!-- 图片内容 -->
<img src="@/assets/img/uploadTable.png" style="width: 100px; height: 100%; object-fit: cover" /> <img src="@/assets/img/uploadTable.png" style="width: 100px; height: 100%; object-fit: cover" />
</div> </div>
@@ -416,7 +449,15 @@
:draggable="table.has_selected == 0 ? true : false" :draggable="table.has_selected == 0 ? true : false"
@dragstart="table.has_selected == 0 ? onDragStart($event, table, index, 'table') : ''" @dragstart="table.has_selected == 0 ? onDragStart($event, table, index, 'table') : ''"
> >
<div class="imgbox" @click="table.has_selected == 1?goToListComment(table.article_table_id, 'table'):openPreview(index, 'table')" style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"> <div
class="imgbox"
@click="
table.has_selected == 1
? goToListComment(table.article_table_id, 'table')
: openPreview(index, 'table')
"
style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center"
>
<!-- 图片内容 --> <!-- 图片内容 -->
<table <table
:data-table-id="table.article_table_id" :data-table-id="table.article_table_id"
@@ -546,9 +587,7 @@ export default {
}, },
methods: { methods: {
changeIsCollapse(e) { changeIsCollapse(e) {
localStorage.setItem('isCollapse', e);
localStorage.setItem('isCollapse', e)
}, },
isShowEditComment() { isShowEditComment() {
if (localStorage.getItem('U_role')) { if (localStorage.getItem('U_role')) {
@@ -880,7 +919,7 @@ export default {
}, },
async created() { async created() {
this.isCollapse = localStorage.getItem('isCollapse') == 'true' ? true : false; this.isCollapse = localStorage.getItem('isCollapse') == 'true' ? true : false;
console.log('localStorage.getItem',typeof localStorage.getItem('isCollapse')) console.log('localStorage.getItem', typeof localStorage.getItem('isCollapse'));
this.isShowEditComment(); this.isShowEditComment();
this.isFresh = false; this.isFresh = false;
this.$nextTick(async () => { this.$nextTick(async () => {
@@ -1070,7 +1109,6 @@ li {
height: 28px; */ height: 28px; */
width: 200px; width: 200px;
float: right; float: right;
} }
.double .item_box { .double .item_box {
width: 46% !important; width: 46% !important;
@@ -1092,6 +1130,5 @@ padding:0 2px !important;
line-height: 20px !important; line-height: 20px !important;
} }
.single { .single {
} }
</style> </style>

View File

@@ -243,7 +243,7 @@
></el-input> ></el-input>
<p class="zhushi"> <p class="zhushi">
Six or less authors are required to list all authors while more than six authors are required to list three of Six or less authors are required to list all authors while more than six authors are required to list three of
them with “et al”. them with “et al.
</p> </p>
</el-form-item> </el-form-item>
<el-form-item :label="SourceType == 'journal' ? 'Title:' : 'Book'" required prop="title"> <el-form-item :label="SourceType == 'journal' ? 'Title:' : 'Book'" required prop="title">
@@ -252,37 +252,47 @@
v-model="refenceForm.title" v-model="refenceForm.title"
placeholder="eg: The role of autophagy in the treatment of osteoporosis by Chinese medicines (natural)" placeholder="eg: The role of autophagy in the treatment of osteoporosis by Chinese medicines (natural)"
></el-input> ></el-input>
<p class="zhushi" v-if="SourceType == 'journal'">
<span style="color: #409EFF;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span>
</p>
<el-input <el-input
v-if="SourceType == 'book'" v-if="SourceType == 'book'"
v-model="refenceForm.title" v-model="refenceForm.title"
placeholder="eg: Traditional Medicine Research" placeholder="eg: Traditional Medicine Research"
></el-input> ></el-input>
<p v-if="SourceType == 'book'" class="zhushi">Full Name of Book.</p> <p v-if="SourceType == 'book'" class="zhushi">Full Name of Book <span style="color: #409EFF;margin-left: 6px;display: none;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span></p>
</el-form-item> </el-form-item>
<el-form-item label="Publication Details:" required prop="dateno"> <el-form-item label="Publication Details:" required prop="dateno">
<div v-if="SourceType == 'journal'"> <div v-if="SourceType == 'journal'">
<el-input v-model="refenceForm.dateno" placeholder="eg: 2023;8(9):49-62"></el-input> <el-input v-model="refenceForm.dateno" placeholder="eg: 2023;8(9):49-62"></el-input>
<p class="zhushi">Year;Volume(issue):Inclusive page numbers.</p> <p class="zhushi">Year;Volume(issue):Inclusive page numbers<span style="color: #409EFF;margin-left: 6px;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span></p>
</div> </div>
<div v-if="SourceType == 'book'"> <div v-if="SourceType == 'book'">
<el-input v-model="refenceForm.dateno" placeholder="eg: New York, NY:McGraw-Hill;2011"></el-input> <el-input v-model="refenceForm.dateno" placeholder="eg: New York, NY:McGraw-Hill;2011"></el-input>
<p class="zhushi">City, State (or Country if not in the US) of publisher:Publishers name;copyright year.</p> <p class="zhushi">City, State (or Country if not in the US) of publisher:Publishers name;copyright year<span style="color: #409EFF;display: none;margin-top: -10px;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span></p>
</div> </div>
</el-form-item> </el-form-item>
</div> </div>
<div v-show="SourceType == 'journal'"> <div v-show="SourceType == 'journal'">
<el-form-item label="Journal:" required prop="joura"> <el-form-item label="Journal:" required prop="joura">
<el-input v-model="refenceForm.joura" placeholder="eg: Tradit Med Res"></el-input> <el-input v-model="refenceForm.joura" placeholder="eg: Tradit Med Res"></el-input>
<p class="zhushi">Abbreviated Journal Title.</p> <p class="zhushi">Abbreviated Journal Title
<span style="color: #409EFF;margin-left: 6px;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span> </span>
</p>
</el-form-item> </el-form-item>
<el-form-item label="DOI/URL:" required prop="doilink"> <el-form-item label="DOI/URL:" required prop="doilink">
<el-input v-model="refenceForm.doilink" placeholder="eg: 10.1002/cncr.30667"></el-input> <el-input v-model="refenceForm.doilink" placeholder="eg: 10.1002/cncr.30667"></el-input>
<p class="zhushi">
<span style="color: #409EFF;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span>
</p>
</el-form-item> </el-form-item>
</div> </div>
<!-- Book --> <!-- Book -->
<div v-show="SourceType == 'book'"> <div v-show="SourceType == 'book'">
<el-form-item label="ISBN:" required prop="isbn"> <el-form-item label="ISBN:" required prop="isbn">
<el-input v-model="refenceForm.isbn"></el-input> <el-input v-model="refenceForm.isbn"></el-input> <p class="zhushi">
<span style="color: #409EFF;display: none;">Automatically displayed after publication "."<span style="color: #ff0000ba;margin-left: 4px;">Don't add "."!</span></span>
</p>
</el-form-item> </el-form-item>
</div> </div>
<!-- others --> <!-- others -->