tijiao
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div style="">
|
||||
<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">
|
||||
<el-steps :active="0" align-center>
|
||||
<el-step
|
||||
@@ -32,35 +32,24 @@
|
||||
<br clear="both" />
|
||||
</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">
|
||||
<div class="bag_color" v-if="show_step == 1">
|
||||
<div>
|
||||
<h3>Manuscript Information</h3>
|
||||
<el-form-item label="Journal :" prop="journal" v-if="ms_alias != null">
|
||||
<div style="font-size: 16px">{{ check_item.title }}</div>
|
||||
<p style="color: #666; line-height: 24px; font-size: 13px; margin: 5px 0 0 0">
|
||||
<b>E-Mail Address : </b>{{ check_item.email }}
|
||||
<br />
|
||||
<b>Website : </b
|
||||
><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 label="Journal :" prop="journal">
|
||||
<JournalSelector
|
||||
ref="journalSelector"
|
||||
@selected="handleJournalSelected"
|
||||
:list="items"
|
||||
:check_item="check_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
|
||||
v-for="item in journal_type"
|
||||
:key="item.value"
|
||||
@@ -71,10 +60,10 @@
|
||||
</el-form-item>
|
||||
|
||||
<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 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 :label="1">Yes</el-radio>
|
||||
<el-radio :label="0">No</el-radio>
|
||||
@@ -84,9 +73,10 @@
|
||||
label="Ethical approval file :"
|
||||
prop="approval_file"
|
||||
v-if="form.approval == 1"
|
||||
label-width="300px"
|
||||
label-width="290px"
|
||||
>
|
||||
<el-upload
|
||||
|
||||
<el-upload
|
||||
ref="uploadFile"
|
||||
class="upload-demo up_newstyle"
|
||||
:action="upload_articleApproval"
|
||||
@@ -104,10 +94,13 @@
|
||||
<div class="el-upload__text" @click="clearUploadedFile">
|
||||
<em>Upload</em>
|
||||
</div>
|
||||
<div class="el-upload__tip" slot="tip">
|
||||
Only Word and compressed files can be uploaded (file format: .pdf).
|
||||
<div class="el-upload__tip" slot="tip" style="line-height: 20px;left: 80px;font-size: 13px;top: -9px;">
|
||||
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>
|
||||
</el-upload>
|
||||
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="Explain the reason clearly :"
|
||||
@@ -119,7 +112,7 @@
|
||||
type="textarea"
|
||||
rows="2"
|
||||
v-model="form.approval_content"
|
||||
placeholder="Please enter"
|
||||
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Abstract :" prop="abstrart">
|
||||
@@ -127,7 +120,7 @@
|
||||
type="textarea"
|
||||
rows="5"
|
||||
v-model="form.abstrart"
|
||||
placeholder="Please enter the abstract"
|
||||
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- 话题 -->
|
||||
@@ -144,7 +137,7 @@
|
||||
:key="index"
|
||||
:name="index + 1"
|
||||
v-model="item.ke"
|
||||
:placeholder="'Key words' + (index + 1)"
|
||||
|
||||
style="width: 150px; margin-right: 15px; margin-bottom: 3px"
|
||||
></el-input>
|
||||
<el-button type="text" @click="addfund">
|
||||
@@ -154,50 +147,12 @@
|
||||
<el-form-item label="Fund :">
|
||||
<el-input
|
||||
v-model="form.fund"
|
||||
placeholder="Please provide the specific funding information if your research has received funding support"
|
||||
>
|
||||
>
|
||||
</el-input>
|
||||
</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">
|
||||
<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"
|
||||
@@ -566,12 +521,11 @@
|
||||
type="textarea"
|
||||
rows="3"
|
||||
v-model="reviewerForm.introduction"
|
||||
placeholder="Please input personal qualification and resume"
|
||||
></el-input>
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- 国家 -->
|
||||
<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
|
||||
v-for="it in countrys"
|
||||
:key="it.en_name"
|
||||
@@ -582,7 +536,7 @@
|
||||
</el-form-item>
|
||||
<!-- 专业 -->
|
||||
<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
|
||||
v-for="item in majorList"
|
||||
:key="item.major_id"
|
||||
@@ -597,12 +551,12 @@
|
||||
size="small"
|
||||
v-model="reviewerForm.field"
|
||||
auto-complete="off"
|
||||
placeholder="Field"
|
||||
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- 职称 -->
|
||||
<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="Associate Prof." label="Associate Prof." value="Associate Prof."> </el-option>
|
||||
<el-option key="Assistant Prof." label="Assistant Prof." value="Assistant Prof."> </el-option>
|
||||
@@ -616,7 +570,7 @@
|
||||
size="small"
|
||||
v-model="reviewerForm.company"
|
||||
auto-complete="off"
|
||||
placeholder="Affiliation"
|
||||
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- 简历 -->
|
||||
@@ -650,6 +604,7 @@
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
style="width: 210px"
|
||||
|
||||
>Add Recommended Reviewer</el-button
|
||||
>
|
||||
</p>
|
||||
@@ -683,11 +638,14 @@
|
||||
<el-form-item label="Email :" prop="email">
|
||||
<el-input v-model="item.email" style="width: 160px" :validate-event="false"></el-input>
|
||||
</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
|
||||
v-model="item.country"
|
||||
filterable
|
||||
placeholder="Please select"
|
||||
|
||||
clearable
|
||||
style="width: 180px"
|
||||
>
|
||||
@@ -698,13 +656,15 @@
|
||||
:value="it.en_name"
|
||||
></el-option>
|
||||
</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 label="Major :" prop="major_all">
|
||||
<el-form-item label="Filed :" prop="major_all">
|
||||
<el-cascader
|
||||
:options="step4MajorList"
|
||||
v-model="item.major_all"
|
||||
:props="default4Params"
|
||||
placeholder="Please select major"
|
||||
style="width: 270px"
|
||||
clearable
|
||||
></el-cascader>
|
||||
@@ -718,7 +678,7 @@
|
||||
></el-button>
|
||||
</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.
|
||||
<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
|
||||
@@ -732,8 +692,36 @@
|
||||
investigation in line with our misconduct policy.
|
||||
</p>
|
||||
|
||||
<div style="margin: 50px 0 0 30px">
|
||||
<el-form-item>
|
||||
<!-- <h3 style="margin-bottom:16px;margin-top:30px;">Figure Copyright Declaration</h3>
|
||||
<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">
|
||||
Invitation code
|
||||
<el-popover placement="top-start" width="320" trigger="hover">
|
||||
@@ -753,13 +741,89 @@
|
||||
</span>
|
||||
<el-input
|
||||
v-model="form.code"
|
||||
placeholder="Please enter invitation code"
|
||||
|
||||
style="width: 200px"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</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="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: 20px 0 30px 30px">
|
||||
|
||||
|
||||
<div style="margin: 50px 0 30px 30px">
|
||||
<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">
|
||||
the license agreement</el-link
|
||||
@@ -874,7 +938,7 @@
|
||||
<el-autocomplete
|
||||
class="inline-input"
|
||||
v-model="authMeaIN.email"
|
||||
placeholder="Email"
|
||||
|
||||
:fetch-suggestions="
|
||||
(queryString, callback) => {
|
||||
chaMateFit(queryString, callback, 1);
|
||||
@@ -896,11 +960,11 @@
|
||||
<span style="color: #f56c6c">*</span>
|
||||
Name :
|
||||
</span>
|
||||
<el-input v-model="authMeaIN.firstname" placeholder="First name" 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.firstname" style="width: 280px; margin-right: 20px"></el-input>
|
||||
<el-input v-model="authMeaIN.lastname" style="width: 280px"> </el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="ORCID iD :" label-width="120px">
|
||||
<el-input v-model="authMeaIN.orcid" placeholder="Orcid" style="width: 280px"> </el-input>
|
||||
<el-form-item label="ORCID iD :" label-width="120px" prop="orcid">
|
||||
<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>
|
||||
</el-form-item>
|
||||
<el-form-item label="First author :" label-width="180px">
|
||||
@@ -914,7 +978,7 @@
|
||||
<span style="color: #f56c6c">*</span>
|
||||
Title :
|
||||
</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="Associate Prof." label="Associate Prof." value="Associate 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-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Affiliation :" label-width="120px">
|
||||
<el-form-item label="Affiliation :" label-width="120px" prop="company">
|
||||
<el-autocomplete
|
||||
class="inline-input"
|
||||
v-model="authMeaIN.company"
|
||||
:fetch-suggestions="searchCompany"
|
||||
placeholder="Affiliation"
|
||||
|
||||
:trigger-on-focus="false"
|
||||
@select="selCompany($event, index)"
|
||||
style="width: 100%"
|
||||
@@ -935,21 +999,21 @@
|
||||
</el-autocomplete>
|
||||
</el-form-item>
|
||||
<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 label="Address :" label-width="120px">
|
||||
<span slot="label">
|
||||
<span style="color: #f56c6c" v-show="authMeaIN.isReport">*</span>
|
||||
Address :
|
||||
</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 label-width="120px">
|
||||
<span slot="label">
|
||||
<span style="color: #f56c6c">*</span>
|
||||
Country :
|
||||
</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-select>
|
||||
</el-form-item>
|
||||
@@ -963,7 +1027,11 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JournalSelector from '@/components/page/components/article/journal-selector.vue';
|
||||
export default {
|
||||
components: {
|
||||
JournalSelector
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
hasAIContent: ['1'],
|
||||
@@ -1050,9 +1118,11 @@ export default {
|
||||
manuscirpt: '',
|
||||
supplementary: '',
|
||||
approval_file: '',
|
||||
qualification_file: '',
|
||||
qualification: '',
|
||||
approval_content: '',
|
||||
code: '',
|
||||
is_use_ai: 2,
|
||||
is_use_ai: "",
|
||||
use_ai_explain: ''
|
||||
// topics:null
|
||||
},
|
||||
@@ -1110,6 +1180,20 @@ export default {
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
company: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please enter a affiliation',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
orcid: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please enter a orcid',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
@@ -1168,6 +1252,13 @@ export default {
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
qualification: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please select qualification',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
introduction: [
|
||||
{
|
||||
required: true,
|
||||
@@ -1196,13 +1287,7 @@ export default {
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
company: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please enter company',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
|
||||
email: [
|
||||
{
|
||||
required: true,
|
||||
@@ -1245,6 +1330,13 @@ export default {
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
qualification: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please select figure copyright declaration',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
approval_content: [
|
||||
{
|
||||
required: true,
|
||||
@@ -1258,7 +1350,14 @@ export default {
|
||||
message: 'Please upload ethical approva file',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
],
|
||||
qualification_file: [
|
||||
{
|
||||
required: true,
|
||||
message: 'Please upload ethical approva file',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
},
|
||||
forWard: false,
|
||||
authorVisible: false,
|
||||
@@ -1376,6 +1475,22 @@ export default {
|
||||
}
|
||||
},
|
||||
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() {
|
||||
if (!this.agreechecked) {
|
||||
this.$message.error(
|
||||
@@ -1385,7 +1500,7 @@ export default {
|
||||
}
|
||||
this.$refs.articleform.validate((valid) => {
|
||||
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;
|
||||
}
|
||||
//验证文档
|
||||
@@ -1818,7 +1933,7 @@ export default {
|
||||
|
||||
// 保存修改用户信息
|
||||
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!');
|
||||
return;
|
||||
}
|
||||
@@ -2440,6 +2555,7 @@ export default {
|
||||
this.Reviewerof.journal = e;
|
||||
this.checkReviewer();
|
||||
this.form.journal = e;
|
||||
this.$refs.articleform.clearValidate(['journal']);;
|
||||
this.form.major = '';
|
||||
this.form.major_a = '';
|
||||
this.form.major_b = '';
|
||||
@@ -2879,6 +2995,7 @@ export default {
|
||||
if (res.code == 0) {
|
||||
// 基本信息
|
||||
this.form.journal = res.data.base.journal_id;
|
||||
|
||||
this.form.type = res.data.base.type;
|
||||
this.form.title = res.data.base.title;
|
||||
this.form.approval = res.data.base.approval;
|
||||
@@ -2887,51 +3004,10 @@ export default {
|
||||
this.form.fund = res.data.base.fund;
|
||||
this.form.is_use_ai = res.data.base.is_use_ai;
|
||||
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(',');
|
||||
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 = [];
|
||||
for (let i = 0; i < keyList.length; i++) {
|
||||
this.keywordsList.push({
|
||||
@@ -3047,7 +3123,7 @@ export default {
|
||||
padding-bottom: 10px;
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
|
||||
width: calc(100% - 60px);
|
||||
/* margin-bottom: 10px; */
|
||||
margin-top: 20px;
|
||||
}
|
||||
@@ -3070,9 +3146,9 @@ export default {
|
||||
left: 58% !important;
|
||||
right: -43% !important;
|
||||
}
|
||||
.manu_add h3{
|
||||
.manu_add h3 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 15px;
|
||||
/* margin-bottom: 15px; */
|
||||
margin-top: 0px;
|
||||
}
|
||||
</style>
|
||||
@@ -3199,7 +3275,7 @@ export default {
|
||||
}
|
||||
|
||||
.manu_add .bag_color > div {
|
||||
padding: 1px 25px;
|
||||
padding: 0px 15px;
|
||||
/* background-color: #fff; */
|
||||
/* box-shadow: 2px -30px 15px -20px #ebf5ff inset; */
|
||||
}
|
||||
@@ -3407,7 +3483,7 @@ export default {
|
||||
}
|
||||
|
||||
.tuijian_f {
|
||||
width: 835px;
|
||||
width: calc(100% - 100px);
|
||||
padding: 10px 5px 15px 5px;
|
||||
margin: 20px 0px 0px 55px;
|
||||
box-shadow: 0 0 8px #b7d2ed;
|
||||
|
||||
308
src/components/page/components/article/journal-selector.vue
Normal file
308
src/components/page/components/article/journal-selector.vue
Normal 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>
|
||||
Reference in New Issue
Block a user