zm/tougao_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tijiao

Browse Source
This commit is contained in:
始于初见
2025-10-23 13:07:07 +08:00
parent ccaff5b459
commit e86b537bd1
5 changed files with 593 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/api/index.js
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: '/', //正式
}); });

82
src/common/js/debounce.js
View File

@@ -9,51 +9,51 @@ let timeout = null
* @return null * @return null
*/ */
function debounce(func, wait = 500, immediate = false) { function debounce(func, wait = 500, immediate = false) {
// 清除定时器 // 清除定时器
if (timeout !== null) clearTimeout(timeout) if (timeout !== null) clearTimeout(timeout)
// 立即执行，此类情况一般用不到 // 立即执行，此类情况一般用不到
if (immediate) { if (immediate) {
const callNow = !timeout const callNow = !timeout
timeout = setTimeout(() => { timeout = setTimeout(() => {
timeout = null timeout = null
}, wait) }, wait)
if (callNow) typeof func === 'function' && func() if (callNow) typeof func === 'function' && func()
} else { } else {
// 设置定时器，当最后一次操作后，timeout不会再被清除，所以在延时wait毫秒后执行func回调方法 // 设置定时器，当最后一次操作后，timeout不会再被清除，所以在延时wait毫秒后执行func回调方法
timeout = setTimeout(() => { timeout = setTimeout(() => {
typeof func === 'function' && func() typeof func === 'function' && func()
}, wait) }, wait)
} }
} }
function throttle(fn, delay = 1000, immediate = false) { function throttle(fn, delay = 1000, immediate = false) {
console.log("进入节流对象") console.log("进入节流对象")
let timer let timer
let status = false // 是否为重复点击状态 let status = false // 是否为重复点击状态
return function () { return function () {
let _this = this let _this = this
let args = arguments let args = arguments
if (immediate) { if (immediate) {
console.log("立即执行参数 执行一次方法") console.log("立即执行参数 执行一次方法")
fn.apply(_this, args)
immediate = false
return
}
if (status) {
console.log("当前点击状态为正在重复点击，请稍等片刻后在点击执行")
return
}
console.log("执行节流：当前执行了一次点击方法")
fn.apply(_this, args) fn.apply(_this, args)
status = true // 修改状态 immediate = false
timer = setTimeout(() => { return
console.log("规定时间到,重置状态，可以重新调用")
status = false
}, delay)
} }
if (status) {
console.log("当前点击状态为正在重复点击，请稍等片刻后在点击执行")
return
}
console.log("执行节流：当前执行了一次点击方法")
fn.apply(_this, args)
status = true // 修改状态
timer = setTimeout(() => {
console.log("规定时间到,重置状态，可以重新调用")
status = false
}, delay)
} }
}
export { export {
debounce, debounce,
throttle throttle
} }

9
src/components/common/common.vue
View File

@@ -5,12 +5,9 @@
const mediaUrl = '/public/'; const mediaUrl = '/public/';
const baseUrl = '/'; const baseUrl = '/';
// const mediaUrl = 'https://submission.tmrjournals.com/public/'; // const mediaUrl = 'https://submission.tmrjournals.com/public/';
// // const mediaUrl = 'http://zmzm.tougao.dev.com/public/'; // // const mediaUrl = 'http://zmzm.tougao.dev.com/public/';
// const baseUrl = '/api'; // const baseUrl = '/api'
//本地(正式环境 ) //本地(正式环境 )
@@ -33,8 +30,6 @@ const baseUrl = '/';
export default { export default {
baseUrl, baseUrl,
mediaUrl, mediaUrl
}; };
</script> </script>

398
src/components/page/articleAdd2.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<div style=""> <div style="">
<div style="display: flex; justify-content: space-between"> <div style="display: flex; justify-content: space-between">
<div style="width: 960px; position: relative"> <div style="width: 100%;min-width: 1020px; position: relative">
<div class="step_list_new"> <div class="step_list_new">
<el-steps :active="0" align-center> <el-steps :active="0" align-center>
<el-step <el-step
@@ -32,35 +32,24 @@
<br clear="both" /> <br clear="both" />
</div> --> </div> -->
<div class="manu_add" style="width: 960px" v-loading="loading"> <div class="manu_add" style="width: calc(100% - 20px);" v-loading="loading">
<el-form ref="articleform" :model="form" :rules="rules" label-width="120px"> <el-form ref="articleform" :model="form" :rules="rules" label-width="120px">
<div class="bag_color" v-if="show_step == 1"> <div class="bag_color" v-if="show_step == 1">
<div> <div>
<h3>Manuscript Information</h3> <h3>Manuscript Information</h3>
<el-form-item label="Journal :" prop="journal" v-if="ms_alias != null"> <el-form-item label="Journal :" prop="journal">
<div style="font-size: 16px">{{ check_item.title }}</div> <JournalSelector
<p style="color: #666; line-height: 24px; font-size: 13px; margin: 5px 0 0 0"> ref="journalSelector"
<b>E-Mail Address : </b>{{ check_item.email }} @selected="handleJournalSelected"
<br /> :list="items"
<b>Website : </b :check_item="check_item"
><a :href="check_item.website" target="_blank" style="color: #666" class="web_stite">{{ />
check_item.website
}}</a>
</p>
<!-- <el-button type="warning" size="mini" icon="el-icon-refresh" plain @click="change_Journal" style="margin-top: 15px;">Change Journal</el-button> -->
</el-form-item>
<el-form-item label="Journal :" prop="journal" v-if="ms_alias == null">
<div
v-for="item in items"
@click="ch_Jour_all(item.journal_id)"
:class="form.journal == item.journal_id ? 'jour_ku_all B_style' : 'jour_ku_all'"
>
{{ item.title }}
</div>
</el-form-item> </el-form-item>
<el-form-item label="Type :" prop="type">
<el-select v-model="form.type" placeholder="Please select type" style="width: 240px">
<el-form-item label="Type :" prop="type" >
<el-select v-model="form.type" style="width: 240px" placeholder="">
<el-option <el-option
v-for="item in journal_type" v-for="item in journal_type"
:key="item.value" :key="item.value"
@@ -71,10 +60,10 @@
</el-form-item> </el-form-item>
<el-form-item label="Manuscript Title :" prop="title" label-width="160px"> <el-form-item label="Manuscript Title :" prop="title" label-width="160px">
<el-input v-model="form.title" placeholder="Please enter title"></el-input> <el-input v-model="form.title" ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Whether ethical approval was obtained ?" prop="approval" label-width="300px"> <el-form-item label="Whether ethical approval was obtained ?" prop="approval" label-width="290px">
<el-radio-group v-model="form.approval"> <el-radio-group v-model="form.approval">
<el-radio :label="1">Yes</el-radio> <el-radio :label="1">Yes</el-radio>
<el-radio :label="0">No</el-radio> <el-radio :label="0">No</el-radio>
@@ -84,9 +73,10 @@
label="Ethical approval file :" label="Ethical approval file :"
prop="approval_file" prop="approval_file"
v-if="form.approval == 1" v-if="form.approval == 1"
label-width="300px" label-width="290px"
> >
<el-upload
<el-upload
ref="uploadFile" ref="uploadFile"
class="upload-demo up_newstyle" class="upload-demo up_newstyle"
:action="upload_articleApproval" :action="upload_articleApproval"
@@ -104,10 +94,13 @@
<div class="el-upload__text" @click="clearUploadedFile"> <div class="el-upload__text" @click="clearUploadedFile">
<em>Upload</em> <em>Upload</em>
</div> </div>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip" style="line-height: 20px;left: 80px;font-size: 13px;top: -9px;">
Only Word and compressed files can be uploaded (file format: .pdf). Only PDF and compressed files can be uploaded.<br/>
<span style="color: #8c8d8f;">Please ensure that the file includes the ethics approval number and the institutional approval document.</span>
</div> </div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
label="Explain the reason clearly :" label="Explain the reason clearly :"
@@ -119,7 +112,7 @@
type="textarea" type="textarea"
rows="2" rows="2"
v-model="form.approval_content" v-model="form.approval_content"
placeholder="Please enter"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Abstract :" prop="abstrart"> <el-form-item label="Abstract :" prop="abstrart">
@@ -127,7 +120,7 @@
type="textarea" type="textarea"
rows="5" rows="5"
v-model="form.abstrart" v-model="form.abstrart"
placeholder="Please enter the abstract"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<!-- 话题 --> <!-- 话题 -->
@@ -144,7 +137,7 @@
:key="index" :key="index"
:name="index + 1" :name="index + 1"
v-model="item.ke" v-model="item.ke"
:placeholder="'Key words' + (index + 1)"
style="width: 150px; margin-right: 15px; margin-bottom: 3px" style="width: 150px; margin-right: 15px; margin-bottom: 3px"
></el-input> ></el-input>
<el-button type="text" @click="addfund"> <el-button type="text" @click="addfund">
@@ -154,50 +147,12 @@
<el-form-item label="Fund :"> <el-form-item label="Fund :">
<el-input <el-input
v-model="form.fund" v-model="form.fund"
placeholder="Please provide the specific funding information if your research has received funding support" >
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="Article Processing Charge :" v-if="form.journal != 0" label-width="180px">
$ {{ getFee(form.journal) }}
<div style="color: #8c8d8f" v-if="getFee(form.journal) && getFee(form.journal) != '0.00'">
<i class="el-icon-warning" style="color: #517fd5; margin-right: 4px"></i>The article processing fee
applies to papers submitted and ultimately accepted for publication after January 1, 2025. For
authors seeking to apply for fee discounts, please
<a
style="color: rgb(81, 127, 213); cursor: pointer; text-decoration: underline"
href="https://www.tmrjournals.com/apc/"
target="_blank"
>click here</a
>
to view detailed policies.
</div>
</el-form-item>
<el-form-item
label="Has artificial intelligence been used in the article ?"
prop="approval"
label-width="340px"
>
<el-radio-group v-model="form.is_use_ai" @input="changeUseAi">
<el-radio :label="1">Yes</el-radio>
<el-radio :label="2">No</el-radio>
</el-radio-group>
<div v-if="form.is_use_ai == 1">
<!-- <p class="zyfont" style="font-weight: normal; margin: 20px 0 10px 0; color: #777">
If yes, please provide a brief explanation in the text box below.<i
class="el-icon-edit"
style="margin-left: 10px"
></i>
</p> -->
<el-input
type="textarea"
placeholder="please input content"
v-model="form.use_ai_explain"
:rows="4"
></el-input>
</div>
</el-form-item>
<div style="text-align: center; margin: 40px 0 0 0"> <div style="text-align: center; margin: 40px 0 0 0">
<el-button type="warning" @click="onStagingSave(1)" class="pro_stage">Save as draft </el-button> <el-button type="warning" @click="onStagingSave(1)" class="pro_stage">Save as draft </el-button>
<el-button type="primary" @click="onStep(1)" class="pro_ceed" <el-button type="primary" @click="onStep(1)" class="pro_ceed"
@@ -566,12 +521,11 @@
type="textarea" type="textarea"
rows="3" rows="3"
v-model="reviewerForm.introduction" v-model="reviewerForm.introduction"
placeholder="Please input personal qualification and resume" ></el-input>
></el-input>
</el-form-item> </el-form-item>
<!-- 国家 --> <!-- 国家 -->
<el-form-item prop="country" label="Country :"> <el-form-item prop="country" label="Country :">
<el-select v-model="reviewerForm.country" filterable placeholder="Please select"> <el-select v-model="reviewerForm.country" filterable placeholder="">
<el-option <el-option
v-for="it in countrys" v-for="it in countrys"
:key="it.en_name" :key="it.en_name"
@@ -582,7 +536,7 @@
</el-form-item> </el-form-item>
<!-- 专业 --> <!-- 专业 -->
<el-form-item prop="major" label="Major :"> <el-form-item prop="major" label="Major :">
<el-select v-model="reviewerForm.major" filterable placeholder="Please select"> <el-select v-model="reviewerForm.major" filterable placeholder="">
<el-option <el-option
v-for="item in majorList" v-for="item in majorList"
:key="item.major_id" :key="item.major_id"
@@ -597,12 +551,12 @@
size="small" size="small"
v-model="reviewerForm.field" v-model="reviewerForm.field"
auto-complete="off" auto-complete="off"
placeholder="Field"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<!-- 职称 --> <!-- 职称 -->
<el-form-item prop="technical" label="Technical :"> <el-form-item prop="technical" label="Technical :">
<el-select v-model="reviewerForm.technical" placeholder="Please select"> <el-select v-model="reviewerForm.technical" placeholder="">
<el-option key="Prof." label="Prof." value="Prof."></el-option> <el-option key="Prof." label="Prof." value="Prof."></el-option>
<el-option key="Associate Prof." label="Associate Prof." value="Associate Prof."> </el-option> <el-option key="Associate Prof." label="Associate Prof." value="Associate Prof."> </el-option>
<el-option key="Assistant Prof." label="Assistant Prof." value="Assistant Prof."> </el-option> <el-option key="Assistant Prof." label="Assistant Prof." value="Assistant Prof."> </el-option>
@@ -616,7 +570,7 @@
size="small" size="small"
v-model="reviewerForm.company" v-model="reviewerForm.company"
auto-complete="off" auto-complete="off"
placeholder="Affiliation"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<!-- 简历 --> <!-- 简历 -->
@@ -650,6 +604,7 @@
plain plain
icon="el-icon-plus" icon="el-icon-plus"
style="width: 210px" style="width: 210px"
>Add Recommended Reviewer</el-button >Add Recommended Reviewer</el-button
> >
</p> </p>
@@ -683,11 +638,14 @@
<el-form-item label="Email :" prop="email"> <el-form-item label="Email :" prop="email">
<el-input v-model="item.email" style="width: 160px" :validate-event="false"></el-input> <el-input v-model="item.email" style="width: 160px" :validate-event="false"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Country :" prop="country"> <el-form-item label="Department :" >
<el-input v-model="item.department"></el-input>
</el-form-item>
<!-- <el-form-item label="Country :" prop="country">
<el-select <el-select
v-model="item.country" v-model="item.country"
filterable filterable
placeholder="Please select"
clearable clearable
style="width: 180px" style="width: 180px"
> >
@@ -698,13 +656,15 @@
:value="it.en_name" :value="it.en_name"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> -->
<el-form-item label="Affiliation :" prop="Affiliation">
<el-input v-model="item.Affiliation" style="width: 160px" :validate-event="false"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Major :" prop="major_all"> <el-form-item label="Filed :" prop="major_all">
<el-cascader <el-cascader
:options="step4MajorList" :options="step4MajorList"
v-model="item.major_all" v-model="item.major_all"
:props="default4Params" :props="default4Params"
placeholder="Please select major"
style="width: 270px" style="width: 270px"
clearable clearable
></el-cascader> ></el-cascader>
@@ -718,7 +678,7 @@
></el-button> ></el-button>
</el-form> </el-form>
<p style="font-size: 12px; color: #888; margin: 15px 10px 0 55px; line-height: 18px"> <p style="font-size: 12px; color: #888; margin: 15px 10px 0px 55px; line-height: 18px">
You can suggest 3 potential reviewers, which can help speed up the review process. You can suggest 3 potential reviewers, which can help speed up the review process.
<br /><b style="letter-spacing: -0.5px">Please pay attention:</b> <br />Authors may suggest potential <br /><b style="letter-spacing: -0.5px">Please pay attention:</b> <br />Authors may suggest potential
reviewers if they wish. However, whether or not to consider these reviewers is at the editor's reviewers if they wish. However, whether or not to consider these reviewers is at the editor's
@@ -732,8 +692,36 @@
investigation in line with our misconduct policy. investigation in line with our misconduct policy.
</p> </p>
<div style="margin: 50px 0 0 30px"> <!-- <h3 style="margin-bottom:16px;margin-top:30px;">Figure Copyright Declaration</h3>
<el-form-item> <p style="line-height: 25px; margin: 0 10px 0 55px; font-size: 14px">
· I confirm that all figures in this manuscript are original<br/>
· I confirm that all figures in this manuscript used with proper permission. (upload the copyright permission letters or license documents figures.)
</p> -->
<!-- <div v-if="form.journal != 0">
<h3 style="margin-bottom:16px;margin-top:30px;">Article Processing Charge</h3>
<div style="line-height: 25px; margin: 0 10px 0 55px; font-size: 14px">
<div style="font-size: 16px;margin-bottom: 10px;font-weight: 700;">
$ {{ getFee(form.journal) }}
</div>
<div style="color: #8c8d8f;line-height: 20px;" v-if="getFee(form.journal) && getFee(form.journal) != '0.00'">
<i class="el-icon-warning" style="color: #517fd5; margin-right: 4px"></i>The article processing fee
applies to papers submitted and ultimately accepted for publication after January 1, 2025. For
authors seeking to apply for fee discounts, please
<a
style="color: rgb(81, 127, 213); cursor: pointer; text-decoration: underline"
href="https://www.tmrjournals.com/apc/"
target="_blank"
>click here</a
>
to view detailed policies.
</div>
</div>
</div> -->
<div style="margin:30px 0 30px 0px">
<el-form-item label-width="180px">
<span slot="label"> <span slot="label">
Invitation code Invitation code
<el-popover placement="top-start" width="320" trigger="hover"> <el-popover placement="top-start" width="320" trigger="hover">
@@ -753,13 +741,89 @@
</span> </span>
<el-input <el-input
v-model="form.code" v-model="form.code"
placeholder="Please enter invitation code"
style="width: 200px" style="width: 200px"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</div> </div>
<el-form-item label="Article Processing Charge :" v-if="form.journal&&form.journal != 0" label-width="220px">
$ {{ getFee(form.journal) }}
<div style="color: #8c8d8f" v-if="getFee(form.journal) && getFee(form.journal) != '0.00'">
<i class="el-icon-warning" style="color: #517fd5; margin-right: 4px"></i>The article processing fee
applies to papers submitted and ultimately accepted for publication after January 1, 2025. For
authors seeking to apply for fee discounts, please
<a
style="color: rgb(81, 127, 213); cursor: pointer; text-decoration: underline"
href="https://www.tmrjournals.com/apc/"
target="_blank"
>click here</a
>
to view detailed policies.
</div>
</el-form-item>
<el-form-item label="Figure Copyright Declaration :" label-width="220px" prop="qualification">
<div style="margin: 20px 0 30px 30px"> <div style="color: #333" >
<el-radio v-model="form.qualification" label="1">I confirm that all figures in this manuscript are original.</el-radio>
<el-radio v-model="form.qualification" label="2">I confirm that all figures in this manuscript used with proper permission.</el-radio>
<el-form-item
label=""
prop="qualification_file"
v-if="form.qualification == 2"
label-width="0px"
>
<div style="position: relative;top: 4px;margin-left: 14px">
<el-upload
ref="uploadFile"
class="upload-demo up_newstyle"
:action="upload_articleApproval"
accept=".pdf"
name="articleApproval"
:before-upload="beforeupload_articleApproval"
:on-error="uperr_coverLetter"
:on-success="upSuccess_articleApproval"
:limit="1"
:on-exceed="alertlimit"
:on-remove="removefilearticleApproval"
:file-list="fileL_articleApproval"
:on-preview="dowloadFile"
>
<div class="el-upload__text" @click="clearUploadedFile">
<em>Upload</em>
</div>
<div class="el-upload__tip" slot="tip" style="color: #888;left:80px;font-size: 13px;">
Upload the copyright permission letters or license documents figures.<br/>
</div>
</el-upload>
</div>
</el-form-item>
</div>
</el-form-item>
<el-form-item
label="Has artificial intelligence been used in the article ?"
prop="approval"
label-width="340px"
>
<el-radio-group v-model="form.is_use_ai" @input="changeUseAi">
<el-radio :label="1">Yes</el-radio>
<el-radio :label="2">No</el-radio>
</el-radio-group>
<div v-if="form.is_use_ai == 1">
<el-input
type="textarea"
v-model="form.use_ai_explain"
:rows="4"
></el-input>
</div>
</el-form-item>
<div style="margin: 50px 0 30px 30px">
<el-checkbox v-model="agreechecked" style="font-weight: bold">I accept </el-checkbox> <el-checkbox v-model="agreechecked" style="font-weight: bold">I accept </el-checkbox>
<el-link @click="licensebox = true" type="primary" style="padding-left: 5px; font-weight: bold"> <el-link @click="licensebox = true" type="primary" style="padding-left: 5px; font-weight: bold">
the license agreement</el-link the license agreement</el-link
@@ -874,7 +938,7 @@
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
v-model="authMeaIN.email" v-model="authMeaIN.email"
placeholder="Email"
:fetch-suggestions=" :fetch-suggestions="
(queryString, callback) => { (queryString, callback) => {
chaMateFit(queryString, callback, 1); chaMateFit(queryString, callback, 1);
@@ -896,11 +960,11 @@
<span style="color: #f56c6c">*</span> <span style="color: #f56c6c">*</span>
Name : Name :
</span> </span>
<el-input v-model="authMeaIN.firstname" placeholder="First name" style="width: 280px; margin-right: 20px"></el-input> <el-input v-model="authMeaIN.firstname" style="width: 280px; margin-right: 20px"></el-input>
<el-input v-model="authMeaIN.lastname" placeholder="Last name" style="width: 280px"> </el-input> <el-input v-model="authMeaIN.lastname" style="width: 280px"> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="ORCID iD :" label-width="120px"> <el-form-item label="ORCID iD :" label-width="120px" prop="orcid">
<el-input v-model="authMeaIN.orcid" placeholder="Orcid" style="width: 280px"> </el-input> <el-input v-model="authMeaIN.orcid" style="width: 280px"> </el-input>
<a href="https://orcid.org/register" target="_blank" class="orcid_link">Register for an ORCID iD</a> <a href="https://orcid.org/register" target="_blank" class="orcid_link">Register for an ORCID iD</a>
</el-form-item> </el-form-item>
<el-form-item label="First author :" label-width="180px"> <el-form-item label="First author :" label-width="180px">
@@ -914,7 +978,7 @@
<span style="color: #f56c6c">*</span> <span style="color: #f56c6c">*</span>
Title : Title :
</span> </span>
<el-select v-model="authMeaIN.title" placeholder="Please select" style="width: 280px" @change="chanSelt"> <el-select v-model="authMeaIN.title" style="width: 280px" @change="chanSelt" placeholder="">
<el-option key="Prof." label="Prof." value="Prof."></el-option> <el-option key="Prof." label="Prof." value="Prof."></el-option>
<el-option key="Associate Prof." label="Associate Prof." value="Associate Prof."></el-option> <el-option key="Associate Prof." label="Associate Prof." value="Associate Prof."></el-option>
<el-option key="Assistant Prof." label="Assistant Prof." value="Assistant Prof."></el-option> <el-option key="Assistant Prof." label="Assistant Prof." value="Assistant Prof."></el-option>
@@ -922,12 +986,12 @@
<el-option key="Others" label="Others" value="Others"></el-option> <el-option key="Others" label="Others" value="Others"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="Affiliation :" label-width="120px"> <el-form-item label="Affiliation :" label-width="120px" prop="company">
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
v-model="authMeaIN.company" v-model="authMeaIN.company"
:fetch-suggestions="searchCompany" :fetch-suggestions="searchCompany"
placeholder="Affiliation"
:trigger-on-focus="false" :trigger-on-focus="false"
@select="selCompany($event, index)" @select="selCompany($event, index)"
style="width: 100%" style="width: 100%"
@@ -935,21 +999,21 @@
</el-autocomplete> </el-autocomplete>
</el-form-item> </el-form-item>
<el-form-item label="Department :" label-width="120px"> <el-form-item label="Department :" label-width="120px">
<el-input v-model="authMeaIN.department" placeholder="Department"></el-input> <el-input v-model="authMeaIN.department" ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Address :" label-width="120px"> <el-form-item label="Address :" label-width="120px">
<span slot="label"> <span slot="label">
<span style="color: #f56c6c" v-show="authMeaIN.isReport">*</span> <span style="color: #f56c6c" v-show="authMeaIN.isReport">*</span>
Address : Address :
</span> </span>
<el-input v-model="authMeaIN.address" placeholder="Address"></el-input> <el-input v-model="authMeaIN.address" ></el-input>
</el-form-item> </el-form-item>
<el-form-item label-width="120px"> <el-form-item label-width="120px">
<span slot="label"> <span slot="label">
<span style="color: #f56c6c">*</span> <span style="color: #f56c6c">*</span>
Country : Country :
</span> </span>
<el-select v-model="authMeaIN.country" filterable placeholder="Please select" style="width: 280px"> <el-select v-model="authMeaIN.country" filterable style="width: 280px" placeholder="">
<el-option v-for="it in countrys" :key="it.en_name" :label="it.en_name" :value="it.en_name"></el-option> <el-option v-for="it in countrys" :key="it.en_name" :label="it.en_name" :value="it.en_name"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@@ -963,7 +1027,11 @@
</template> </template>
<script> <script>
import JournalSelector from '@/components/page/components/article/journal-selector.vue';
export default { export default {
components: {
JournalSelector
},
data() { data() {
return { return {
hasAIContent: ['1'], hasAIContent: ['1'],
@@ -1050,9 +1118,11 @@ export default {
manuscirpt: '', manuscirpt: '',
supplementary: '', supplementary: '',
approval_file: '', approval_file: '',
qualification_file: '',
qualification: '',
approval_content: '', approval_content: '',
code: '', code: '',
is_use_ai: 2, is_use_ai: "",
use_ai_explain: '' use_ai_explain: ''
// topics:null // topics:null
}, },
@@ -1110,6 +1180,20 @@ export default {
trigger: 'blur' trigger: 'blur'
} }
], ],
company: [
{
required: true,
message: 'Please enter a affiliation',
trigger: 'blur'
}
],
orcid: [
{
required: true,
message: 'Please enter a orcid',
trigger: 'blur'
}
],
type: [ type: [
{ {
required: true, required: true,
@@ -1168,6 +1252,13 @@ export default {
trigger: 'blur' trigger: 'blur'
} }
], ],
qualification: [
{
required: true,
message: 'Please select qualification',
trigger: 'blur'
}
],
introduction: [ introduction: [
{ {
required: true, required: true,
@@ -1196,13 +1287,7 @@ export default {
trigger: 'blur' trigger: 'blur'
} }
], ],
company: [
{
required: true,
message: 'Please enter company',
trigger: 'blur'
}
],
email: [ email: [
{ {
required: true, required: true,
@@ -1245,6 +1330,13 @@ export default {
trigger: 'blur' trigger: 'blur'
} }
], ],
qualification: [
{
required: true,
message: 'Please select figure copyright declaration',
trigger: 'blur'
}
],
approval_content: [ approval_content: [
{ {
required: true, required: true,
@@ -1258,7 +1350,14 @@ export default {
message: 'Please upload ethical approva file', message: 'Please upload ethical approva file',
trigger: 'blur' trigger: 'blur'
} }
] ],
qualification_file: [
{
required: true,
message: 'Please upload ethical approva file',
trigger: 'blur'
}
],
}, },
forWard: false, forWard: false,
authorVisible: false, authorVisible: false,
@@ -1376,6 +1475,22 @@ export default {
} }
}, },
methods: { methods: {
handleJournalSelected(journal) {
if (journal == '') {
this.check_item = {};
this.ms_alias = '';
this.form.journal = '';
this.reviewerof.journal = 1;
console.log('this.form at line 1386:', this.form)
if (localStorage.getItem('ms_journal_alias')) {
localStorage.removeItem('ms_journal_alias');
}
} else {
this.check_item = journal;
this.ch_Jour_all(journal.journal_id);
}
},
onSubmit() { onSubmit() {
if (!this.agreechecked) { if (!this.agreechecked) {
this.$message.error( this.$message.error(
@@ -1385,7 +1500,7 @@ export default {
} }
this.$refs.articleform.validate((valid) => { this.$refs.articleform.validate((valid) => {
if (this.isAbstractTooShort(this.form.abstrart)) { if (this.isAbstractTooShort(this.form.abstrart)) {
this.$message.error('The abstract should not be less than 200 Chinese characters or English words!'); this.$message.error('The abstract should not be less than 200 words!');
return false; return false;
} }
//验证文档 //验证文档
@@ -1818,7 +1933,7 @@ export default {
// 保存修改用户信息 // 保存修改用户信息
saveAuthor(value) { saveAuthor(value) {
if (value.firstname == '' || value.lastname == '' || value.title == '' || value.Country == '' || value.email == '') { if (value.firstname == '' || value.lastname == '' || value.title == '' || value.Country == '' || value.email == ''||value.company == ''||value.orcid == '') {
this.$message.error('Please provide complete author information!'); this.$message.error('Please provide complete author information!');
return; return;
} }
@@ -2440,6 +2555,7 @@ export default {
this.Reviewerof.journal = e; this.Reviewerof.journal = e;
this.checkReviewer(); this.checkReviewer();
this.form.journal = e; this.form.journal = e;
this.$refs.articleform.clearValidate(['journal']);;
this.form.major = ''; this.form.major = '';
this.form.major_a = ''; this.form.major_a = '';
this.form.major_b = ''; this.form.major_b = '';
@@ -2879,6 +2995,7 @@ export default {
if (res.code == 0) { if (res.code == 0) {
// 基本信息 // 基本信息
this.form.journal = res.data.base.journal_id; this.form.journal = res.data.base.journal_id;
this.form.type = res.data.base.type; this.form.type = res.data.base.type;
this.form.title = res.data.base.title; this.form.title = res.data.base.title;
this.form.approval = res.data.base.approval; this.form.approval = res.data.base.approval;
@@ -2887,51 +3004,10 @@ export default {
this.form.fund = res.data.base.fund; this.form.fund = res.data.base.fund;
this.form.is_use_ai = res.data.base.is_use_ai; this.form.is_use_ai = res.data.base.is_use_ai;
this.form.use_ai_explain = res.data.base.use_ai_explain; this.form.use_ai_explain = res.data.base.use_ai_explain;
console.log(res.data.base);
// this.form.topics = res.data.base.topics
// 领域
console.log('this.majorValueList at line 2853:', this.majorValueList);
// this.$api
// .post('api/Major/getMajorForAddArticle', {
// journal_id: this.form.journal,
// major_id: 1
// })
// .then((res) => {
// this.majors_a = res.data.majors;
// });
// this.form.major_a = res.data.major.major_id;
// this.$api
// .post('api/Major/getMajorForAddArticle', {
// journal_id: this.form.journal,
// major_id: this.form.major_a
// })
// .then((ref) => {
// this.majors_b = ref.data.majors;
// this.majors_c = [];
// this.form.major_b = '';
// this.form.major_c = '';
// this.majorChange_panduan();
// if (res.data.major.child != undefined) {
// this.form.major_b = res.data.major.child.major_id;
// this.$api
// .post('api/Major/getMajorForAddArticle', {
// journal_id: this.form.journal,
// major_id: this.form.major_b
// })
// .then((ref) => {
// this.majors_c = ref.data.majors;
// this.form.major_c = '';
// this.majorChange_panduan();
// if (res.data.major.child.child != undefined) {
// this.form.major_c = res.data.major.child.child.major_id;
// this.majorChange_panduan();
// }
// });
// }
// });
// 关键词
let keyList = res.data.base.keywords.split(','); let keyList = res.data.base.keywords.split(',');
if (this.items.find((e) => e.journal_id == this.form.journal)) {
this.check_item = this.items.find((e) => e.journal_id == this.form.journal);
}
this.keywordsList = []; this.keywordsList = [];
for (let i = 0; i < keyList.length; i++) { for (let i = 0; i < keyList.length; i++) {
this.keywordsList.push({ this.keywordsList.push({
@@ -3047,7 +3123,7 @@ export default {
padding-bottom: 10px; padding-bottom: 10px;
border-top-left-radius: 10px; border-top-left-radius: 10px;
border-top-right-radius: 10px; border-top-right-radius: 10px;
width: calc(100% - 60px);
/* margin-bottom: 10px; */ /* margin-bottom: 10px; */
margin-top: 20px; margin-top: 20px;
} }
@@ -3070,9 +3146,9 @@ export default {
left: 58% !important; left: 58% !important;
right: -43% !important; right: -43% !important;
} }
.manu_add h3{ .manu_add h3 {
font-size: 16px; font-size: 16px;
margin-bottom: 15px; /* margin-bottom: 15px; */
margin-top: 0px; margin-top: 0px;
} }
</style> </style>
@@ -3199,7 +3275,7 @@ export default {
} }
.manu_add .bag_color > div { .manu_add .bag_color > div {
padding: 1px 25px; padding: 0px 15px;
/* background-color: #fff; */ /* background-color: #fff; */
/* box-shadow: 2px -30px 15px -20px #ebf5ff inset; */ /* box-shadow: 2px -30px 15px -20px #ebf5ff inset; */
} }
@@ -3407,7 +3483,7 @@ export default {
} }
.tuijian_f { .tuijian_f {
width: 835px; width: calc(100% - 100px);
padding: 10px 5px 15px 5px; padding: 10px 5px 15px 5px;
margin: 20px 0px 0px 55px; margin: 20px 0px 0px 55px;
box-shadow: 0 0 8px #b7d2ed; box-shadow: 0 0 8px #b7d2ed;

308
src/components/page/components/article/journal-selector.vue Normal file
View File

@@ -0,0 +1,308 @@
<template>
<div class="journal-selector relative w-full max-w-md" ref="journalSelector">
<!-- 使用el-input作为输入框 -->
<div v-if="!selectedJournal">
<el-input clearable
v-model="searchTerm"
@focus="showDropdown = true"
size="medium"
class="journal-input" suffix-icon="el-icon-search"
>
<!-- 搜索图标插槽 -->
<!-- 已选择时显示清除图标 -->
<i
slot="suffix"
v-if="selectedJournal"
class="fas fa-times text-gray-400 hover:text-red-500 cursor-pointer el-input__icon"
@click.stop="clearSelection"
></i>
</el-input>
<!-- 下拉列表 -->
<div
class="journal-dropdown "
v-if="showDropdown && filteredJournals.length"
>
<div
class="journal-item "
v-for="journal in filteredJournals"
:key="journal.id"
@click="selectJournal(journal)"
>
<div class="flexBox alignCenter justBetween">
<img src="https://picsum.photos/40/40?random=1" :alt="journal.title" class="">
<div class="journal-title">{{ journal.title }}</div>
</div>
</div>
</div>
<!-- 无结果提示 -->
<div
class="journal-dropdown " style="padding: 0;"
v-if="showDropdown && !filteredJournals.length && searchTerm"
>
<div class="">
<p class="nofound">No matching journals found
Please try other keywords or spellings</p>
</div>
</div>
</div>
<!-- 选中的期刊 -->
<div
class="journal-selected"
v-if="selectedJournal&&!showDropdown"
>
<div class="flexBox alignCenter">
<img src="https://picsum.photos/40/40?random=1" :alt="selectedJournal.name" class="object-cover">
<span class="journal-selected-title">{{ selectedJournal.title }}</span>
</div>
<div class="journal-info">
{{ selectedJournal.scope }}
</div>
<span class="journal-close" @click="closeSelection">
<i class="el-icon-close"></i>
</span>
</div>
</div>
</template>
<script>
export default {
name: 'JournalSelector',
props: {
list: {
type: Array,
default: () => []
},
check_item: {
type: Object,
default: () => ({})
},
},
data() {
return {
searchTerm: '',
showDropdown: false,
selectedJournal: null,
journals: []
};
},
watch: {
list: {
handler(newVal) {
// this.journals = this.list;
// console.log('this.journals at line 96:', this.journals)
},
deep: true
},
check_item: {
handler(newVal) {
// if (newVal.id) {
if(JSON.stringify(this.check_item)!=='{}'){
this.selectedJournal = this.check_item;
}else{
this.selectedJournal = null;
}
console.log('this.selectedJournal at line 113:', this.selectedJournal)
// }
},
deep: true
}
},
computed: {
// 过滤期刊列表
filteredJournals() {
if (!this.searchTerm) {
return this.journals;
}
const term = this.searchTerm.toLowerCase();
console.log('term at line 109:', term)
return this.journals.filter(journal => journal.abbr.toLowerCase().includes(term)||
journal.title.toLowerCase().includes(term)||
journal.title.toLowerCase().includes(this.searchTerm)||
journal.title.includes(this.searchTerm)
);
}
},
methods: {
getJournalList(){
this.$api
.post('api/Article/getJournal')
.then((res) => {
this.journals = res;
})
.catch((err) => {
console.log(err);
});
},
closeSelection(){
this.selectedJournal=null
this.searchTerm = '';
this.showDropdown = false;
this.$emit('selected', '')
},
// 选择期刊
selectJournal(journal) {
this.selectedJournal = journal;
this.searchTerm = '';
this.showDropdown = false;
// 触发选中事件，方便父组件获取数据
this.$emit('selected', journal);
this.$emit('selected', journal)
},
// 清除选择
clearSelection() {
this.selectedJournal = null;
this.searchTerm = '';
this.$emit('cleared');
},
// 点击外部关闭下拉框
handleClickOutside(event) {
if (this.showDropdown && !this.$refs.journalSelector.contains(event.target)) {
this.showDropdown = false;
}
}
},
mounted() {
this.getJournalList();
document.addEventListener('click', this.handleClickOutside);
},
beforeDestroy() {
document.removeEventListener('click', this.handleClickOutside);
}
};
</script>
<style scoped>
/* 适配el-input的样式 */
.journal-input {
--el-input-height: 40px; cursor: pointer;
}
.journal-selector .title {
font-size: 14px;
font-weight: 700;
color: #333;
}
.journal-input .el-input__inner {
padding-left: 38px !important;
border-radius: 8px;
border-color: #e4e4e4;
transition: all 0.2s ease;
}
.journal-input .el-input__inner:focus {
border-color: #3b82f6;
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}
.journal-input .el-input__prefix {
left: 12px;
top: 50%;
transform: translateY(-50%);
}
.journal-input .el-input__suffix {
right: 12px;
}
/* 下拉列表样式 */
.journal-dropdown {
border: 1px solid #f0f0f0;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
border-radius: 8px;
margin-top: 6px;
padding: 12px 0;
box-sizing: border-box; cursor: pointer;
}
/* 列表项样式 */
.journal-item {
padding: 0 15px;
box-sizing: border-box;
border-bottom: 1px solid #f8f8f8;
margin: 0;
color: #666;
margin-bottom: 10px;
cursor: pointer;
}
.journal-item:last-child {
border-bottom: none;
}
/* 选中项样式 */
.journal-selected {
border-radius: 6px;
/* margin-top: 8px; */
border: 1px solid #DCDFE6;
font-size: 14px;color: #8c8d8f;
padding: 10px;
cursor: pointer;
position: relative;
}
.journal-selected-title{
font-size: 14px;
font-weight: 700;
color: #333;
margin-left: 14px;
line-height: 40px;
}
/* 清除按钮样式 */
.journal-clear {
transition: all 0.2s;
}
.flexBox{
display: flex;
}
.alignCenter{
align-items: center;
}
.justBetween{
justify-content: space-between;
}
.journal-title{
width: calc(100% - 60px);
}
.journal-info {
margin-top: 8px;
line-height: 20px;
text-align: justify;
}
.journal-close{
position: absolute;
top: 0px;
right: 6px;
font-size: 16px;
color: #8c8d8f;
cursor: pointer;
}
.nofound{
color: #8c8d8f;
padding-left: 10px;
}
</style>