@@ -0,0 +1,567 @@
< template >
< div >
< div class = "crumbs" >
< el-breadcrumb separator = "/" >
< el-breadcrumb-item >
< i class = "el-icon-user" > < / i > Editors & Staff List
< / el-breadcrumb-item >
< / el-breadcrumb >
< / div >
< div class = "container" style = "min-width: 1000px;" >
< div >
< span style = "font-size: 14px;color: #606266;margin: 0 10px 0 0;" > Journal : < / span >
< el-select v-model = "query.journal_id" placeholder="Please select a journal" @change="query.pageIndex = 1;getDate()"
style = "width: 220px;margin-right: 35px;" >
< el-option v-for = "item in df_jour" :label="item.title" :key="item.journal_id"
:value = "item.journal_id" > < / el-option >
< / el-select >
< / div >
< div class = "handle-box" style = "margin-bottom: 15px; overflow: hidden; " >
< div >
< el-button type = "primary" icon = "el-icon-plus" @click ="addHandle" style = "float: right;" >
Add new Editors & Staff < / el-button >
< / div >
< / div >
< el-table :data = "tableData" border stripe class = "table" ref = "multipleTable"
header -cell -class -name = " table -header " >
< el-table-column label = "Basic Information" >
< template slot -scope = " scope " >
< p class = "tab_tie_col" >
< span > Realname : < / span > < b style = "font-size: 15px;" > { { scope . row . realname } } < / b >
< / p >
< p class = "tab_tie_col" >
< span > Account : < / span > { { scope . row . account } }
< / p >
< p class = "tab_tie_col" >
< span > Email : < / span > { { scope . row . email } }
< / p >
< / template >
< / el-table-column >
<!-- < el-table-column label = "Personal introduction" align = "center" >
< template slot -scope = " scope " >
< p class = "tab_tie_col" >
< span > Field : < / span >
{ { scope . row . research _areas } }
< / p >
< / template >
< / el-table-column > -- >
< el-table-column label = "H-WOS" align = "center" >
< template slot -scope = " scope " >
< p v-html = "colorIndex(scope.row.wos_index,scope.row.wos_time)" > < / p >
< / template >
< / el -table -column >
< el-table-column label = "H-Google" align = "center" >
< template slot -scope = " scope " >
< p v-html = "colorIndex(scope.row.google_index,scope.row.google_time)" > < / p >
< / template >
< / el -table -column >
< el-table-column align = "center" width = "120" >
< template slot -scope = " scope " >
< div style = "margin: 0 0 10px 0;" >
< el-button type = "primary" plain icon = "el-icon-connection" @click ="handleDtail(scope.row)" >
Detail
< / el -button >
< / div >
<!-- < div style = "margin: 0 0 10px 0;" >
< el-button type = "success" plain icon = "el-icon-edit" @click ="editHandle(scope.row)" >
Edit
< / el -button >
< / div > -- >
< div >
< el-button type = "danger" plain icon = "el-icon-delete" @click ="reneDelete(scope.row)" > Delete
< / el -button >
< / div >
< / template >
< / el-table-column >
< / el-table >
<!-- < div class = "pagination" >
< el-pagination background layout = "total, prev, pager, next" :current-page = "query.pageIndex"
:page-size = "query.pageSize" :total = "Total" @ current -change = " handlePageChange " > < / el-pagination >
< / div > -- >
< / div >
<!-- 添加弹出框 -- >
< el-dialog title = "Add Editors & Staff" :visible.sync = "addVisible" width = "660px" :close-on-click-modal = "false"
@ close = 'addVisCancle' >
< el-form ref = "add_Form" :model = "addForm" :rules = "rules" label -width = " 140px " v-if = "!dis_able" >
< el -form -item label = "Email / Account :" prop = "account" v-if = "!dis_able" >
< el -input v-model = "addForm.account" style="width: 300px;" > < / el -input >
< el-button type = "warning" @click ="saerNa_U()" style = "margin-left: 15px;" icon = "el-icon-paperclip" >
Check < / el-button >
< p style = "color: #888;margin-top: 10px;" >
Note : The new Editors & Staff must be a registered user .
< br > Click < a class = "zhu_ce" @click ="Goto_res()" > register < / a > .
< / p >
< / el -form -item >
< / el-form >
< el-form ref = "add_Form" :model = "addForm" :rules = "rules" label -width = " 150px " v-if = "dis_able" >
< el -form -item label = "Account :" >
{ { addForm . account } }
< / el-form-item >
< el-form-item label = "Email :" >
{ { addForm . email } }
< / el-form-item >
< el-form-item label = "Realname :" >
{ { addForm . realname } }
< / el-form-item >
< el-form-item label = "Journal :" prop = "journal_id" >
< el-select v-model = "addForm.journal_id" placeholder="Please select a journal" style="width: 270px;" >
< el -option v-for = "item in df_jour" :label="item.title" :key="item.journal_id"
:value = "item.journal_id" > < / el-option >
< / el-select >
< / el-form-item >
<!-- < el-form-item label = "Personal introduction :" >
< el-input type = "textarea" v-model = "addForm.areas" placeholder="Please enter" > < / el -input >
< / el-form-item > -- >
< / el-form >
< span slot = "footer" class = "dialog-footer" >
< el-button @click ="addVisCancle" > Cancel < / el -button >
< el-button type = "primary" @click ="saveAdd()" v-if = "dis_able" > OK < / el -button >
< / span >
< / el-dialog >
<!-- 编辑弹出框 -- >
< el-dialog title = "Edit Editors & Staff" :visible.sync = "editvisible" width = "600px" @close ="editClose()" >
< el -form ref = "addForm1" :model = "addForm1" label -width = " 150px " >
< el-form-item label = "Personal introduction :" >
< el-input type = "textarea" v-model = "addForm1.areas" placeholder="Please enter" > < / el -input >
< / el-form-item >
< / el-form >
< span slot = "footer" class = "dialog-footer" >
< el-button @click ="editClose()" > Cancel < / el -button >
< el-button type = "primary" @click ="saveEdit()" > OK < / el -button >
< / span >
< / el-dialog >
< / div >
< / template >
< script >
export default {
name : 'youthList' ,
data ( ) {
return {
YearThis : 0 ,
edit _id : localStorage . getItem ( 'U_id' ) ,
query : {
journal _id : 0 ,
type : 1 ,
year : 0 ,
pageIndex : 1 ,
pageSize : 15 ,
keywords : '' ,
fieldkey : '' ,
order _remark : 0
} ,
Total : 0 ,
df _jour : [ ] ,
df _year : [ ] ,
list _year : [ {
title : '1 Year' ,
id : 1
} , {
title : '2 Years' ,
id : 2
} , {
title : '3 Years' ,
id : 3
} ] ,
tableData : [ ] ,
IMG _Url : '' ,
addVisible : false ,
reneVisible : false ,
cerVisible : false ,
addForm : {
account : '' ,
} ,
addForm1 : {
ctj _id : null ,
areas : ''
} ,
editvisible : false ,
reneForm : {
journal _id : 0
} ,
remarkMes : {
remark : ''
} ,
remarkBox : false ,
dis _able : false ,
rules : {
account : [ {
required : true ,
message : 'Please enter email / account' ,
trigger : 'blur'
} ] ,
journal _id : [ {
required : true ,
message : 'Please select journal' ,
trigger : 'blur'
} ] ,
// year: [{
// required: true,
// message: 'Please select year',
// trigger: 'blur'
// }],
}
} ;
} ,
onShow ( ) {
var pages = getCurrentPages ( ) ; // 获取当前页面栈
var currentPage = pages [ pages . length - 1 ] ; // 当前页面
if ( currentPage . data . refreshIfNeeded ) {
currentPage . data . refreshIfNeeded = false ;
//这里为要调用的函数， ，
this . getDate ( ) ;
}
} ,
created ( ) {
this . getSelect ( ) ;
} ,
methods : {
// 关闭编辑弹窗
editClose ( ) {
this . editvisible = false
this . addForm1 . ctj _id = null ,
this . addForm1 . areas = ''
} ,
// 显示编辑弹出框
editHandle ( val ) {
this . editvisible = true
this . $nextTick ( function ( ) {
this . addForm1 . ctj _id = val . ctj _id
this . addForm1 . areas = val . research _areas
} )
} ,
// 提交编辑弹窗
saveEdit ( ) {
this . $api
. post ( 'api/User/editCommittee' , {
'ctj_id' : this . addForm1 . ctj _id ,
'research_areas' : this . addForm1 . areas
} )
. then ( res => {
if ( res . code == 0 ) {
this . $message . success ( 'Edit successfully!' )
this . editClose ( )
this . getDate ( ) ;
} else {
this . $message . error ( res . msg ) ;
}
} )
. catch ( err => {
this . $message . error ( err ) ;
} ) ;
} ,
// 获取下拉值
getSelect ( ) {
this . $api
. post ( 'api/Chief/getJournalsByEditor' , {
'user_id' : this . edit _id
} )
. then ( res => {
if ( res . code == 0 ) {
this . df _jour = res . data . journals ;
this . query . journal _id = this . df _jour [ 0 ] . journal _id
this . getDate ( ) ;
} else {
this . $message . error ( res . msg ) ;
}
} )
. catch ( err => {
this . $message . error ( err ) ;
} ) ;
} ,
// 获取列表数据
getDate ( ) {
this . $api
. post ( 'api/User/getEditorToJournals' , {
'journal_id' : this . query . journal _id
} )
. then ( res => {
if ( res . code == 0 ) {
this . tableData = res . data . editors ;
for ( var i = 0 ; i < this . tableData . length ; i ++ ) {
this . getScoreData ( i , this . tableData [ i ] . score )
}
// this.Total = res.data.count;
} else {
this . $message . error ( res . msg ) ;
}
} )
. catch ( err => {
console . log ( err ) ;
} ) ;
} ,
// 评分
getScoreData ( i , e ) {
this . tableData [ i ] . starList = [ ]
this . tableData [ i ] . starList _mark = 0
if ( e < 0.5 && e > 0 ) {
this . tableData [ i ] . starList . push ( {
star : 2
} )
this . tableData [ i ] . starList _mark = 1
} else {
let zheng = Math . floor ( e )
let xiao = Number ( e ) - Math . floor ( e )
if ( xiao >= 0.5 ) {
xiao = 0.5
} else {
xiao = 0
}
for ( var j = 0 ; j < zheng ; j ++ ) {
this . tableData [ i ] . starList . push ( {
star : 1
} )
}
if ( xiao == 0.5 ) {
this . tableData [ i ] . starList . push ( {
star : 0
} )
}
this . tableData [ i ] . starList _mark = Number ( zheng ) + Number ( xiao )
}
} ,
// 新增
addHandle ( ) {
this . dis _able = false
this . addForm . account = ''
this . addVisible = true
} ,
// 保存添加
saveAdd ( ) {
this . $refs . add _Form . validate ( ( valid ) => {
if ( valid ) {
const loading = this . $loading ( {
lock : true ,
text : 'Loading...' ,
spinner : 'el-icon-loading' ,
background : 'rgba(0, 0, 0, 0.7)'
} ) ;
this . $api
. post ( 'api/User/addEditorToJournal' ,
{
'user_id' : this . addForm . user _id ,
'journal_id' : this . addForm . journal _id ,
//'research_areas': this.addForm.areas
} )
. then ( res => {
if ( res . code == 0 ) {
this . getDate ( ) ;
this . $message . success ( 'Added successfully!' ) ;
// this.$refs.add_Form.resetFields();
this . dis _able = false
this . addVisible = false ;
loading . close ( ) ;
} else {
this . $message . error ( res . msg ) ;
loading . close ( ) ;
}
} )
. catch ( err => {
this . $message . error ( err ) ;
loading . close ( ) ;
} ) ;
} else {
return false ;
}
} ) ;
} ,
// 添加关闭
addVisCancle ( ) {
this . addVisible = false
this . addForm . journal _id = null
this . addForm . research _areas = ''
} ,
// 查找与他相同的账号
saerNa _U ( ) {
if ( this . addForm . account != undefined && this . addForm . account != '' ) {
this . $api
. post ( 'api/User/searchUserByAccountEmail' , {
'account' : this . addForm . account
} )
. then ( res => {
if ( res . code == 0 ) {
if ( res . data . user == null ) {
this . dis _able = false
this . $message . error ( 'Verify that the account or mailbox does not exist!' ) ;
} else {
this . dis _able = true
this . addForm . user _id = res . data . user . user _id
this . addForm . account = res . data . user . account
this . addForm . realname = res . data . user . realname
this . addForm . email = res . data . user . email
}
} else {
this . $message . error ( res . msg ) ;
}
} )
. catch ( err => {
this . $message . error ( err ) ;
} ) ;
} else {
this . $message . error ( 'Verification account or mailbox cannot be empty!' ) ;
}
} ,
// 点击注册
Goto _res ( ) {
this . $router . push ( '/register' ) ;
} ,
// 详情
handleDtail ( e ) {
let routerJump = this . $router . resolve ( {
path : '/partyRole' ,
query : {
id : e . user _id
}
} ) ;
window . open ( routerJump . href , '_blank' ) ;
} ,
// 删除
reneDelete ( e ) {
// 二次确认删除
this . $confirm ( 'Are you sure you want to delete?' , 'Tip' , {
type : 'warning'
} )
. then ( ( ) => {
this . $api
. post ( 'api/User/delEditorToJournal' , { 'etj_id' : e . etj _id } )
. then ( res => {
if ( res . code == 0 ) {
this . $message . success ( 'Deleted successfully' ) ;
this . getDate ( ) ;
} else {
this . $message . error ( res . msg ) ;
}
} )
. catch ( err => {
this . $message . error ( err ) ;
} ) ;
} )
. catch ( ( ) => { } ) ;
} ,
// 分页导航
handlePageChange ( val ) {
this . $set ( this . query , 'pageIndex' , val ) ;
this . getDate ( ) ;
} ,
colorIndex ( num , time ) {
if ( time != 0 ) {
let date = new Date ( parseInt ( time * 1000 ) ) ;
let Y = date . getFullYear ( ) + '-' ;
let M = date . getMonth ( ) + 1 < 10 ? '0' + ( date . getMonth ( ) + 1 ) + '-' : date . getMonth ( ) + 1 + '-' ;
let D = date . getDate ( ) < 10 ? '0' + date . getDate ( ) : date . getDate ( ) ;
let H = date . getHours ( ) < 10 ? '0' + date . getHours ( ) + ':' : date . getHours ( ) + ':' ;
let U = date . getMinutes ( ) < 10 ? '0' + date . getMinutes ( ) : date . getMinutes ( ) ;
time = Y + M + D ;
}
let str = '' ;
if ( num < 10 ) {
str = '<b style="color:#cb160a">' + num +
'</b><span style="color:#aaa;font-size:14px;margin-left:5px;"><br/>(' + time +
')</span>'
} else if ( num < 15 ) {
str = '<b style="color:#cbb504">' + num +
'</b><span style="color:#aaa;font-size:14px;margin-left:5px;"><br/>(' + time +
')</span>'
} else {
str = '<b style="color:#0cbc15">' + num +
'</b><span style="color:#aaa;font-size:14px;margin-left:5px;"><br/>(' + time +
')</span>'
}
if ( time == 0 ) {
str =
'<b style="color:#aaa;">0</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;">(Empty)</span>'
}
return str ;
} ,
// 时间格式
formatDate ( timestamp ) {
var date = new Date ( timestamp * 1000 ) ; //时间戳为10位需*1000，
var Y = date . getFullYear ( ) + '-' ;
var M = ( date . getMonth ( ) + 1 < 10 ? '0' + ( date . getMonth ( ) + 1 ) : date . getMonth ( ) + 1 ) + '-' ;
var D = date . getDate ( ) < 10 ? '0' + date . getDate ( ) : date . getDate ( ) ;
var h = date . getHours ( ) < 10 ? '0' + date . getHours ( ) : date . getHours ( ) ;
var m = date . getMinutes ( ) < 10 ? '0' + date . getMinutes ( ) : date . getMinutes ( ) ;
var s = date . getSeconds ( ) < 10 ? '0' + date . getSeconds ( ) : date . getSeconds ( ) ;
return Y + M + D ;
} ,
formatYear ( timestamp ) {
var date = new Date ( timestamp * 1000 ) ; //时间戳为10位需*1000，
var Y = date . getFullYear ( ) + ' . ' ;
var M = ( date . getMonth ( ) + 1 < 10 ? '0' + ( date . getMonth ( ) + 1 ) : date . getMonth ( ) + 1 ) ;
return Y + M ;
} ,
}
} ;
< / script >
< style scoped >
. handle - box {
margin - bottom : 20 px ;
}
. table {
width : 100 % ;
font - size : 14 px ;
}
. red {
color : # ff0000 ;
}
. zhu _ce {
text - decoration : underline ;
color : # 006699 ;
font - weight : bold ;
cursor : pointer ;
}
. tab _tie _col {
margin - bottom : 5 px ;
color : # 333 ;
word - wrap : break - word ;
word - break : normal ;
}
. tab _tie _col > span {
color : # 888 ;
margin : 0 5 px 0 0 ;
font - size : 13 px ;
}
. starSty {
width : 18 px ;
margin - right : 4 px ;
vertical - align : text - top ;
}
. starSty : nth - last - child ( 1 ) {
margin - right : 0 ;
}
< / style >
@fawn-nine