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

完成右侧按钮基本功能

Browse Source
This commit is contained in:
@fawn-nine
2023-06-13 18:02:20 +08:00
parent fa8a3caf9a
commit fdeaeb57d2
2 changed files with 75 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/page/ReferenceEditor.vue
View File

@@ -68,7 +68,7 @@
<!-- 有引用数据--> <!-- 有引用数据-->
<div v-else> <div v-else>
<div class="topInfo"> <div class="topInfo">
<h4>Dear {{user_name}}</h4> <h3>Dear {{user_name}}</h3>
<p class="mt10">您可以在本页面对引用数据进行对应的修改和调整，主要包括如下操作:</p> <p class="mt10">您可以在本页面对引用数据进行对应的修改和调整，主要包括如下操作:</p>
<ul class="mt20"> <ul class="mt20">
<li> <li>
@@ -80,12 +80,12 @@
</li> </li>
<li> <li>
<p>如果您觉得顺序有不妥，您可以点击每一条信息后面的 <p>如果您觉得顺序有不妥，您可以点击每一条信息后面的
<el-button type="primary" size="mini" plain>↑</el-button> <el-button type="warning" size="mini" plain>↑</el-button>
和 和
<el-button type="primary" size="mini" plain>↓</el-button> 调整数据的前后顺序。</p> <el-button type="warning" size="mini" plain>↓</el-button> 调整数据的前后顺序。</p>
</li> </li>
<li> <li>
<p>您可以点击 <el-button type="primary" size="mini" plain>+</el-button> 在这一行的后面再添加一行引用信息。</p> <p>您可以点击 <el-button type="success" size="mini" plain>Add</el-button> 在这一行的后面再添加一行引用信息。</p>
</li> </li>
<li> <li>
<p>您也可以全部放弃这些引用信息，重新导入一批引用信息。<el-link type="primary" @click="removeAll">删除并重新导入</el-link></p> <p>您也可以全部放弃这些引用信息，重新导入一批引用信息。<el-link type="primary" @click="removeAll">删除并重新导入</el-link></p>
@@ -108,24 +108,24 @@
</el-table-column> </el-table-column>
<el-table-column label="Title" align="left"> <el-table-column label="Title" align="left">
<template slot-scope="scope"> <template slot-scope="scope">
<p style="text-align: left;" v-if="scope.row.refer_doi == ''"> <p class="wrongLine" style="text-align: left;" v-if="scope.row.refer_doi == ''">
{{scope.row.refer_content}} {{scope.row.refer_content}}
</p> </p>
<p style="text-align: left;" v-else> <div style="text-align: left;" v-else>
{{scope.row.refer_doi}} <p>{{scope.row.author}}{{scope.row.title}} <em>{{scope.row.joura}}</em> {{scope.row.dateno}}<br/></p>
</p> <a class="doiLink" :href="scope.row.doilink" target="_blank">{{scope.row.doilink}}</a>
</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" width="360"> <el-table-column align="center" width="360">
<div slot-scope="scope"> <div slot-scope="scope">
<el-button v-if="scope.row.refer_doi == ''" style="margin-left:10px;" @click="change(scope.row)" plain type="warning" size="mini" icon="el-icon-edit" >edit</el-button> <el-button style="margin-left:10px;" @click="change(scope.row)" plain type="primary" size="mini" icon="el-icon-edit">edit</el-button>
<el-button v-else style="margin-left:10px;" @click="change(scope.row)" plain type="primary" size="mini" icon="el-icon-edit">change</el-button>
<el-tooltip popper-class="tps" class="item" effect="light" content="Add one under this line" placement="top"> <el-tooltip popper-class="tps" class="item" effect="light" content="Add one under this line" placement="top">
<el-button type="primary" size="mini" plain>+</el-button> <el-button @click="addLine(scope.row)" type="success" size="mini" plain>Add</el-button>
</el-tooltip> </el-tooltip>
<el-button type="primary" size="mini" plain>↑</el-button> <el-button type="warning" size="mini" plain :disabled="scope.$index != 0 ? false : true" @click="changeOrder(scope.row,'up')">↑</el-button>
<el-button type="primary" size="mini" plain>↓</el-button> <el-button type="warning" size="mini" plain :disabled="scope.$index == tableData.length-1 ? true : false" @click="changeOrder(scope.row,'down')">↓</el-button>
<el-button type="danger" icon="el-icon-delete" size="mini" style="float: right;" plain>delete</el-button> <el-button type="danger" icon="el-icon-delete" size="mini" style="float: right;" plain @click="deleteLine(scope.row)">delete</el-button>
</div> </div>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -134,9 +134,16 @@
</div> </div>
<!-- 修改引用 --> <!-- 修改引用 -->
<el-dialog title="Add References" :visible.sync="editboxVisible" width="500px"> <el-dialog title="Add References" :visible.sync="editboxVisible" width="500px">
<el-form :model="refenceForm" :rules="refenceFormrules" ref="refenceForm" label-width="60px" class="demo-ruleForm"> <p class="yinyongPre c888">现在您可以添加或者修改您的引用文献信息，如果您有引用文献的Doi数据，可以直接复制到Doi输入框，并提交，系统会自动识别您的引用文献，如果您没有Doi数据，也可以打开“Show Content”开关，直接填写您的引用文献内容。</p>
<el-form-item label="title" prop="title"> <el-form :model="refenceForm" :rules="refenceFormrules" ref="refenceForm" label-width="80px" class="editForm mt10">
<el-input rows="8" v-model="refenceForm.title" type="textarea"></el-input> <el-form-item label="Show Content" label-width="120px">
<el-switch v-model="contentVisible"></el-switch>
</el-form-item>
<el-form-item label="Doi:" required prop="refer_doi" v-if="!contentVisible">
<el-input v-model="refenceForm.refer_doi" ></el-input>
</el-form-item>
<el-form-item label="Content:" required prop="refer_content" v-else>
<el-input rows="5" v-model="refenceForm.refer_content" type="textarea"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
@@ -191,6 +198,7 @@
user_name: localStorage.getItem('U_relname'), user_name: localStorage.getItem('U_relname'),
importIoading: false, importIoading: false,
baseUrl: this.Common.baseUrl, baseUrl: this.Common.baseUrl,
contentVisible:false,
// 引用数据列表 // 引用数据列表
tableData:[ tableData:[
], ],
@@ -209,7 +217,8 @@
}, },
// 引用表单 // 引用表单
refenceForm:{ refenceForm:{
title:'' refer_content:'',
refer_doi:''
}, },
refenceFormrules:{ refenceFormrules:{
title:[ title:[
@@ -371,6 +380,41 @@
this.$message.error(err); this.$message.error(err);
}); });
}, },
// 添加一行
addLine(row){
this.editboxVisible = true
this.refenceForm = {}
},
// 删除一行
deleteLine(row){
this.$confirm('Are you sure you want to remove this reference?', 'Tips', {
confirmButtonText: 'Sure',
cancelButtonText: 'Cancel',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: 'remove successed!'
});
})
},
// 调整顺序
changeOrder(row, opName){
let optitle = ''
opName == 'up' ? optitle = 'Move up this line?' : optitle = 'Move down this line?'
this.$confirm(optitle, 'Tips', {
confirmButtonText: 'Sure',
cancelButtonText: 'Cancel',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: 'remove successed!'
});
})
}
}, },
computed: { computed: {
upload_manuscirpt: function() { upload_manuscirpt: function() {
@@ -382,11 +426,15 @@
</script> </script>
<style scoped> <style scoped>
.wrongLine{ color: #f15f44;}
.doiLink{color: #409EFF;}
.editForm{background-color:#f9f9f9; padding: 20px 0; padding-right: 20px;}
.yinyongPre{line-height: 28px; margin-bottom: 20px;}
.shuoming{font-size: 14px; line-height: 26px; } .shuoming{font-size: 14px; line-height: 26px; }
.shuoming i{color: #F5BF6D;} .shuoming i{color: #F5BF6D;}
.status{ display: block; width: 40px; height: 40px; border-radius: 40px; font-size: 22px; line-height: 40px; color: #fff; text-align: center;} .status{ display: block; width: 40px; height: 40px; border-radius: 40px; font-size: 22px; line-height: 40px; color: #fff; text-align: center;}
.status.ok{background: #67c23a;} .status.ok{background: #a7e389;}
.status.warn{background: #e6a23c;} .status.warn{background: #ffd192;}
.status.float{display: inline-block;} .status.float{display: inline-block;}
.topInfo{padding: 20px; } .topInfo{padding: 20px; }
.topInfo ul{padding-left: 30px;} .topInfo ul{padding-left: 30px;}

9
src/components/page/articleList.vue
View File

@@ -92,10 +92,12 @@
<span @click="esy_deta(item.article_id)"> <span @click="esy_deta(item.article_id)">
<i class="el-icon-paperclip"></i>My Manuscript <i class="el-icon-paperclip"></i>My Manuscript
</span> </span>
<span v-if="item.state == 3"> <span v-if="item.state == 3" >
<font> | </font> <font> | </font>
<span @click="goPre_ingested(item.article_id)"> <span @click="goPre_ingested(item.article_id)" class="preButton">
<i class="el-icon-paperclip"></i>Complete the profile <el-badge is-dot class="item" >
<i class="el-icon-paperclip"></i>Complete the profile
</el-badge>
</span> </span>
</span> </span>
</div> </div>
@@ -735,6 +737,7 @@
</script> </script>
<style scoped> <style scoped>
.preButton{color: #66b1ff;}
.container { .container {
color: #333; color: #333;
} }