This commit is contained in:
2025-01-09 11:23:33 +08:00
parent 12e3938e23
commit ee33ce076f
7 changed files with 156 additions and 141 deletions

View File

@@ -1,73 +1,26 @@
<template>
<div class="container" style="padding-top: 0px">
<el-row :gutter="20">
<el-alert
v-if="alertShow"
:title="'Dear ' + user_name + ' Congratulations! , The information will be hidden after ' + hideSec + ' seconds'"
type="success"
show-icon
>
</el-alert>
<el-col class="mt20">
<p v-html="$t('PreAccept.successInfo')"></p>
</el-col>
</el-row>
<div style="" v-if="journalInfo.fee != '0.00'">
<p
v-if="articleInfo.is_buy == 0"
style="
color: #409eff;
margin-top: 10px;
background: #ecf5ff;
border-color: #b3d8ff;
color: #505050;
font-size: 14px;
padding: 10px;
box-sizing: border-box;
position: relative;
overflow: hidden;
"
>
<i class="el-icon-warning" style="color: #517fd5; margin-right: 10px"></i>The article processing fee is
<span style="color: #ff5000;font-weight: bold;">{{ journalInfo.fee }}</span> United States Dollars (USD), applicable to papers submitted after January 1, 2025, and ultimately
accepted for publication. For authors seeking to apply for a fee discount, 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 the detailed policy.
<el-button
size="mini"
type="primary"
style="padding: 4px 6px; float: right; background: #ff5000 !important; border-color: #ff5000 !important"
@click="goOrderConfirmation(articleInfo)"
>Payment</el-button
>
</p>
<p
v-if="articleInfo.is_buy == 1"
style="
color: #409eff;
margin-top: 10px;
background: #ecf5ff;
border-color: #b3d8ff;
color: #505050;
font-size: 14px;
padding: 10px;
box-sizing: border-box;
position: relative;
overflow: hidden;
"
>
<i class="el-icon-warning" style="color: #517fd5; margin-right: 10px"></i>
Dear {{ user_name }}, congratulations! Your manuscript has been successfully paid. Total amount: <span style="color: #ff5000;font-weight: bold;">{{ journalInfo.fee }}</span> USD
</p>
</div>
<div class="container" style="padding-top: 20px; padding-bottom: 20px">
<p
style="
background-color: #f0f9eb;
color: #67c23a;
padding: 8px 16px;
color: #67c23a;
display: flex;
align-items: center;
justify-content: space-between;
"
>
<i class="el-icon-success" style="margin-right: 10px"></i>
<span
>Dear {{ user_name }} , Congratulations! You manuscript has been pre-accepted for publication in
<b>{{ journalInfo.title }}</b
>. Please review and complete the necessary information of your manuscript. Kindly note that an article processing charge is
required for final publication.</span
>
</p>
<!-- <p
style="
margin-top: 10px;
color: #409eff;
@@ -78,11 +31,11 @@
padding: 10px;
box-sizing: border-box;
"
v-else
>
<i class="el-icon-warning" style="color: #517fd5; margin-right: 10px"></i>
This manuscript does not require payment
</p>
</p> -->
<!-- <el-steps :active="active" finish-status="success" simple style="margin-top: 10px">
<el-step :title="`${$t('PreAccept.step')} ${i + 1} ${v.title} `" v-for="(v, i) in stepList"> </el-step>
</el-steps> -->
@@ -103,6 +56,60 @@
</div>
</div> -->
<div class="content_box mt20 stepbox">
<!-- 文章引用 -->
<div class="con">
<h4 class="con-title">{{ this.$t('PreAccept.step1') }}</h4>
<div style="padding: 20px; box-sizing: border-box" v-loading="tableData.length==0">
<p style="color: #505050; font-size: 14px; box-sizing: border-box; margin-bottom: 20px" v-if="tableData.length>0&&tableData[0].state==0">
<i class="el-icon-warning" style="color: #517fd5; margin-right: 8px"></i> How to apply for a discount? Please see
our discount policy here:
<a
style="color: rgb(81, 127, 213); cursor: pointer; text-decoration: underline"
href="https://www.tmrjournals.com/apc/"
target="_blank"
>https://www.tmrjournals.com/apc/</a
>.
</p>
<el-card class="box-card" style="width: 100%"
><el-table :data="tableData" style="width: 100%" align="center">
<el-table-column prop="fee" label="Price">
<template slot-scope="scope"> {{ scope.row.fee }} USD </template>
</el-table-column>
<el-table-column prop="name" label="Discounts">
<template slot-scope="scope"> 0 USD </template>
</el-table-column>
<el-table-column prop="address" label="Tax">
<template slot-scope="scope"> 0 USD </template>
</el-table-column>
<el-table-column prop="fee" label="Total Price">
<template slot-scope="scope"> {{ scope.row.fee }} USD </template>
</el-table-column>
<el-table-column prop="" label="Current Status">
<template slot-scope="scope">
<span v-if="scope.row.state==1" style='color:#67c23a'><b>Completed</b></span>
<span v-if="scope.row.state==0" style='color:#f56c6c'><b>Incomplete</b></span>
</template>
</el-table-column>
</el-table>
<p style="text-align: right; margin: 20px 0 0" v-if="tableData.length>0&&tableData[0].state==0">
<span
@click="goOrderConfirmation(articleInfo)"
style="color: rgb(81, 127, 213); cursor: pointer; text-decoration: underline"
>Click here</span
>
to go to the payment page.
</p></el-card
>
<!-- <p style="text-align: right;">Click here to request an invoice.</p> -->
</div>
<!-- <div v-else style="padding: 20px; box-sizing: border-box"></div> -->
</div>
</div>
<div class="content_box mt20 stepbox">
<!-- 文章引用 -->
<div class="con">
@@ -118,13 +125,15 @@
<div class="con">
<h4 class="con-title" style="overflow: hidden">
{{ this.$t('PreAccept.step3') }}
<span v-if="Ainfo.refer_state.state" style="float: right" class="el-icon-check pass status"> Complete</span>
<span v-else class="el-icon-pie-chart notPass status" style="float: right"> Pending</span>
<b> <span v-if="Ainfo.refer_state.state" style="float: right" class="el-icon-check pass status"> Complete</span>
<span v-else class="el-icon-pie-chart notPass status" style="float: right"> Pending</span></b>
</h4>
<p style="color: #505050; font-size: 14px; padding: 20px; box-sizing: border-box">
<i class="el-icon-warning" style="color: #517fd5; margin-right: 8px"></i> A total of
<i class="tip">{{ Ainfo.refer_state.num }}</i> references in this manuscript is identified.
</p>
<p style="color: #505050; font-size: 14px; padding: 0 20px 20px; box-sizing: border-box">
<el-button @click="goAddReferences(thisArtcleId)" icon="el-icon-edit" type="text">Edit</el-button>
</p>
@@ -138,7 +147,7 @@
<span class="el-icon-info help"></span>
<div>
<h4>Any questions/Help</h4>
<p class="mt20">If you experience any problems, please contact us by publisher@tmrjournals.com</p>
<p class="mt20">If you experience any problems, please contact us by {{ journalInfo.email }}</p>
</div>
</div>
</div>
@@ -150,10 +159,12 @@ import OrderConfirmation from '../page/components/pendingPayment/OrderConfirmati
export default {
data() {
return {
tableData: [],
articleInfo: {},
journalInfo: {},
urlList: {
detail: 'api/Order/preOrderDetail'
detail: 'api/Order/preOrderDetail',
getPreacceptPayment: 'api/Preaccept/getPreacceptPayment'
},
active: 0,
stepList: [
@@ -190,6 +201,13 @@ export default {
this.getInfoStatu();
this.hideAlert();
this.getDetail();
this.getPreacceptPayment();
},
activated() {
this.getInfoStatu();
this.hideAlert();
this.getDetail();
this.getPreacceptPayment();
},
components: {
OrderConfirmation
@@ -203,10 +221,22 @@ export default {
path: '/OrderConfirmation',
query: {
id: this.$route.query.id,
type: 'Pre-accept'
}
});
},
getPreacceptPayment() {
this.$api
.post(this.urlList.getPreacceptPayment, {
article_id: this.$route.query.id
})
.then((res) => {
console.log('res at line 191:', res);
if (res.code == 0) {
this.tableData = [{ ...res.data }];
}
});
},
getDetail() {
this.$api
.post(this.urlList.detail, {
@@ -352,8 +382,8 @@ p {
}
.helpcontent {
color: #888;
margin-top: 150px;
padding-top: 30px;
margin-top: 20px;
padding-top: 20px;
border-top: 2px solid #f1f1f1;
}
.helpcontent p {
@@ -361,11 +391,22 @@ p {
font-size: 12px;
}
.stepbox {
border: 1px solid #ebebeb;
border: 1px solid #006699;
}
.con-title {
background-color: #f8f8f8;
color: #fff;
background-color: #006699;
padding: 10px 20px;
box-sizing: border-box;
}
::v-deep .el-table th {
background-color: #f0f0f0 !important;
/* border-top: 1px solid #b0b0b0 !important; */
color: #333 !important;
}
::v-deep .el-table td.el-table__cell,
.el-table th.el-table__cell.is-leaf {
border-bottom: 1px solid #b0b0b0 !important;
}
</style>