1
This commit is contained in:
徐哼唧L
2613
src/components/page/Dashboard_.vue
Normal file
2613
src/components/page/Dashboard_.vue
Normal file
File diff suppressed because it is too large
Load Diff
352
src/components/page/articleDrafts.vue
Normal file
352
src/components/page/articleDrafts.vue
Normal file
@@ -0,0 +1,352 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-lx-cascades"></i> Manuscripts in Draft
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container_state">
|
||||
<div class="handle-box" style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="primary" icon="el-icon-edit-outline" @click="addArticle" style="width: 190px;">New
|
||||
Submission</el-button>
|
||||
</div>
|
||||
|
||||
<p v-if="tableData.length==0" style="text-align: center;font-size: 20px;">No Drafts</p>
|
||||
|
||||
<div shadow="never" v-for="item in tableData" class="mangu_list">
|
||||
<div style="padding: 20px 20px 20px 20px;position: relative;">
|
||||
<p class="man_title" @click="jumpArticle(item.article_id)">
|
||||
{{item.title}}
|
||||
</p>
|
||||
<p style="margin-bottom: 8px;">
|
||||
<font style="color: #666b7a;">ID : </font>
|
||||
{{item.accept_sn}}
|
||||
<font style="color: #666b7a;margin-left: 50px;">Type : </font>
|
||||
{{item.type | ellipsis}}
|
||||
<font style="color: #666b7a;margin-left: 50px;">Journal : </font>
|
||||
<b style="font-weight: normal;">{{item.journal_title}}</b>
|
||||
</p>
|
||||
<p>
|
||||
<font style="color: #666b7a;">
|
||||
<i class="el-icon-time" style="margin: 0 5px 0 0;"></i>
|
||||
Update Time :
|
||||
</font>
|
||||
<b style="font-weight: normal;margin: 0 0 0 5px;">{{item.ctime}}</b>
|
||||
</p>
|
||||
<el-button type="primary" @click="jumpArticle(item.article_id)"
|
||||
style="position: absolute;right: 15px;top: 28px;width: 80px;">Continue</el-button>
|
||||
<el-button type="danger" @click="deleteArticle(item.article_id)" size="mini" plain
|
||||
style="position: absolute;right: 15px;top: 70px;width: 80px;">Delete</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
query: {
|
||||
user_id: localStorage.getItem('U_id')
|
||||
},
|
||||
tableData: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getdate();
|
||||
},
|
||||
methods: {
|
||||
// 获取文章列表数据
|
||||
getdate() {
|
||||
this.$api
|
||||
.post('api/Article/getSaveArticles', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.articles;
|
||||
for (let i = 0; i < this.tableData.length; i++) {
|
||||
let date = new Date(parseInt(this.tableData[i].ctime) * 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();
|
||||
this.tableData[i].ctime = Y + M + D;
|
||||
}
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 增加稿件
|
||||
addArticle() {
|
||||
this.$router.push('/articleAdd');
|
||||
},
|
||||
|
||||
// 跳转暂存文章
|
||||
jumpArticle(e) {
|
||||
this.$router.push({
|
||||
path: 'articleAdd',
|
||||
query: {
|
||||
id: e
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 删除暂存文章
|
||||
deleteArticle(e) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure you want to delete?', 'Tip', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/Article/delSaveArticle', {
|
||||
article_id:e
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Deletion succeeded!');
|
||||
this.getdate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
// 时间
|
||||
formatDate(timestamp) {
|
||||
var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘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 + ' ' + h + ':' + m + ':' + s;
|
||||
},
|
||||
|
||||
},
|
||||
filters: {
|
||||
// 文章类型
|
||||
ellipsis(value) {
|
||||
let frag = '';
|
||||
switch (value) {
|
||||
case "A":
|
||||
frag = 'Article';
|
||||
break;
|
||||
case 'B':
|
||||
frag = 'Review';
|
||||
break;
|
||||
case 'C':
|
||||
frag = 'Case report';
|
||||
break;
|
||||
case 'P':
|
||||
frag = 'Research proposal';
|
||||
break;
|
||||
case 'N':
|
||||
frag = 'News';
|
||||
break;
|
||||
case 'T':
|
||||
frag = 'Comment';
|
||||
break;
|
||||
case 'CT':
|
||||
frag = 'Correction';
|
||||
break;
|
||||
case 'HT':
|
||||
frag = 'Hypothesis';
|
||||
break;
|
||||
case 'PF':
|
||||
frag = 'Preface';
|
||||
break;
|
||||
case 'ET':
|
||||
frag = 'Editorial';
|
||||
break;
|
||||
case 'RP':
|
||||
frag = 'Report';
|
||||
break;
|
||||
case 'LR':
|
||||
frag = 'Letter';
|
||||
break;
|
||||
case 'EF':
|
||||
frag = 'Empirical formula';
|
||||
break;
|
||||
case 'EM':
|
||||
frag = 'Evidence-based medicine';
|
||||
break;
|
||||
case 'EC':
|
||||
frag = 'Expert consensus';
|
||||
break;
|
||||
case 'LTE':
|
||||
frag = 'Letter to editor';
|
||||
break;
|
||||
case 'QI':
|
||||
frag = 'Questionnaire investigation';
|
||||
break;
|
||||
case 'PT':
|
||||
frag = 'Protocol';
|
||||
break;
|
||||
case 'CS':
|
||||
frag = 'Case Series';
|
||||
break;
|
||||
case 'RT':
|
||||
frag = 'Retraction';
|
||||
break;
|
||||
case 'MR':
|
||||
frag = 'Mini Review';
|
||||
break;
|
||||
default:
|
||||
frag = 'Others';
|
||||
}
|
||||
return frag;
|
||||
},
|
||||
|
||||
},
|
||||
computed: {
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
.mr10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.table-td-thumb {
|
||||
display: block;
|
||||
margin: auto;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.el-table .hasChange-row {
|
||||
background-color: #ffebe8;
|
||||
}
|
||||
|
||||
.mangu_list {
|
||||
color: #333;
|
||||
margin: 0 0 20px 0;
|
||||
font-size: 14px;
|
||||
/* position: relative; */
|
||||
border-radius: 5px;
|
||||
border: 2px solid #EBEEF5;
|
||||
background-color: #fff;
|
||||
|
||||
}
|
||||
|
||||
/* .mangu_list:hover {
|
||||
border: 2px solid rgba(0,102,153,.3);
|
||||
} */
|
||||
|
||||
.mangu_list .man_title {
|
||||
margin: 2px 100px 10px 0;
|
||||
font-weight: bolder;
|
||||
letter-spacing: -0.5px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.mangu_list .man_title:hover {
|
||||
text-decoration: underline;
|
||||
color: #006699
|
||||
}
|
||||
|
||||
.mangu_list .man_state {
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
top: -1px;
|
||||
border: 1px solid #fff;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 6px 18px;
|
||||
letter-spacing: -0.5px;
|
||||
border-top-right-radius: 3px;
|
||||
/* border-top-left-radius: 3px; */
|
||||
}
|
||||
|
||||
.mangu_list .man_progess {
|
||||
padding: 15px 20px;
|
||||
border-top: 1px solid #5a90e126;
|
||||
|
||||
}
|
||||
|
||||
.mangu_list .man_progess i {
|
||||
margin: 0 5px 0 0;
|
||||
}
|
||||
|
||||
|
||||
.mangu_list .man_progess>a>b {
|
||||
margin-left: 5px;
|
||||
color: #5a90e1;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.mangu_list .man_progess>a>b:hover {
|
||||
color: #006699;
|
||||
}
|
||||
|
||||
.mangu_list .man_btn {
|
||||
/* color: #006699; */
|
||||
position: absolute;
|
||||
bottom: 25px;
|
||||
right: 25px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.mangu_list .man_btn>span {
|
||||
/* text-decoration: underline; */
|
||||
}
|
||||
|
||||
.mangu_list .man_btn>span:hover {
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
color: #06374e;
|
||||
}
|
||||
|
||||
|
||||
.mangu_list .man_btn i {
|
||||
margin: 0 8px 0 0;
|
||||
}
|
||||
|
||||
.mangu_list .man_btn font {
|
||||
margin: 0 18px;
|
||||
}
|
||||
</style>
|
||||
1397
src/components/page/articleListEditor_E1.vue
Normal file
1397
src/components/page/articleListEditor_E1.vue
Normal file
File diff suppressed because it is too large
Load Diff
423
src/components/page/articleListEditor_E1_old.vue
Normal file
423
src/components/page/articleListEditor_E1_old.vue
Normal file
@@ -0,0 +1,423 @@
|
||||
<template>
|
||||
<div>
|
||||
|
||||
<div class="bor_style_onli">
|
||||
<h4 style="margin: 0 0 20px 0;">Supplementary Essential Information</h4>
|
||||
<el-form ref="detail_form" :model="detailMes" label-width="100px" :rules="rules">
|
||||
<el-form-item label="Title :" prop='title'>
|
||||
{{detailMes.on_title}}
|
||||
<el-button size="mini" type="primary" plain icon="el-icon-tickets" @click="showdetaileditor"
|
||||
style="margin: 0 0 0 15px;">Manuscript Detail
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="Stage :" prop="journal_stage_id">
|
||||
<el-select v-model="detailMes.journal_stage_id" placeholder="Please select"
|
||||
@change="select_tem($event)" style="width: 300px;">
|
||||
<el-option v-for="item in opStage" :key="item.journal_stage_id" :label="neYStage(item)"
|
||||
:value="item.journal_stage_id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Page :" prop="npp">
|
||||
<el-input v-model="detailMes.npp" style="width: 300px;"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-button type="primary" v-if="detailMes.has_push==0" @click="editSaveMes" style="width: 300px;margin-left: 100px;">
|
||||
<i class="el-icon-check"></i>
|
||||
Save
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="bor_style_onli">
|
||||
<h4 style="margin: 0 0 20px 0;">Essential Information</h4>
|
||||
<el-form ref="detail" :model="detailMes" label-width="100px">
|
||||
<el-form-item label="Jouranl :">
|
||||
{{detailMesJour.title}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Type :">
|
||||
{{detailMes.article_type}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Data :">
|
||||
{{modifDate(detailMes.on_ctime*1000)}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Doi :">
|
||||
{{detailMes.on_doi}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Keywords :">
|
||||
{{detailMes.keywords}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Abstract :">
|
||||
{{detailMes.abstract}}
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div style="text-align: center;margin: 30px 0;" v-if="detailMes.has_push==0">
|
||||
<el-button type="primary" @click="pushAllMes" style="width: 400px;">
|
||||
<i class="el-icon-finished"></i>
|
||||
Push Online
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'quill/dist/quill.core.css';
|
||||
import 'quill/dist/quill.snow.css';
|
||||
import 'quill/dist/quill.bubble.css';
|
||||
import {
|
||||
quillEditor
|
||||
} from 'vue-quill-editor';
|
||||
import {
|
||||
Loading
|
||||
} from 'element-ui';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
IMGdo_Url: this.IMGdoURL,
|
||||
IMGup_Url: this.IMGupURL,
|
||||
username: localStorage.getItem('U_name'),
|
||||
editor_id: localStorage.getItem('U_id'),
|
||||
acticleId: this.$route.query.id,
|
||||
detailMes: {},
|
||||
detailMesJour: {},
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...'
|
||||
},
|
||||
opStage: [],
|
||||
defaultParams: {
|
||||
label: 'title',
|
||||
value: 'journal_stage_id',
|
||||
children: 'children'
|
||||
},
|
||||
StageForm: {
|
||||
journal_id: ''
|
||||
},
|
||||
StageVisible: false,
|
||||
StageimageUrl: '',
|
||||
rules: {
|
||||
stage_year: [{
|
||||
required: true,
|
||||
message: 'Please enter year',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
stage_vol: [{
|
||||
required: true,
|
||||
message: 'Please enter volume',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
stage_no: [{
|
||||
required: true,
|
||||
message: 'Please enter issue',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
stage_page: [{
|
||||
required: true,
|
||||
message: 'Please enter number',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
issueDate: [{
|
||||
required: true,
|
||||
message: 'Please select date',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
journal_stage_id: [{
|
||||
required: true,
|
||||
message: 'Please select',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
npp: [{
|
||||
required: true,
|
||||
message: 'Please enter npp',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
components: {
|
||||
quillEditor
|
||||
},
|
||||
|
||||
methods: {
|
||||
//初始化
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/Typeset/getOnlineDetail', {
|
||||
'on_id': this.acticleId
|
||||
})
|
||||
.then(res => {
|
||||
this.detailMesJour = res.data.journal;
|
||||
this.detailMes = res.data.online;
|
||||
if (this.detailMes.journal_stage_id == 0) {
|
||||
this.detailMes.journal_stage_id = ''
|
||||
}
|
||||
this.getStageDate()
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 分期组合格式
|
||||
neYStage(e) {
|
||||
return e.stage_year + ' Vol.' + e.stage_vol + ' issue.' + e.stage_no + e.stage_pagename + e.stage_page
|
||||
},
|
||||
|
||||
// 获取分期
|
||||
getStageDate() {
|
||||
this.$api
|
||||
.post('api/Typeset/getStagesOnline', {
|
||||
'journal_id': this.detailMesJour.journal_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.opStage = res.data.stages;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 文章信息
|
||||
showdetaileditor() {
|
||||
this.$router.push({
|
||||
path: 'articleDetailEditor',
|
||||
query: {
|
||||
id: this.detailMes.article_id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 保存修改文章信息
|
||||
editSaveMes() {
|
||||
this.$refs.detail_form.validate((valid) => {
|
||||
console.log(valid)
|
||||
if (valid) {
|
||||
this.$message.error('456');
|
||||
this.$api
|
||||
.post('api/Typeset/editOnline', this.detailMes)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Successfully!');
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// Online推送
|
||||
pushAllMes() {
|
||||
if (this.detailMes.journal_stage_id == '' || this.detailMes.npp == '') {
|
||||
this.$message.error('Please complete the information!');
|
||||
return
|
||||
}
|
||||
// 二次确认
|
||||
this.$confirm('Are you sure you want to push this manuscript to the official website?', 'Tips', {
|
||||
confirmButtonText: 'OK',
|
||||
cancelButtonText: 'Cancel',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Loading...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
this.$api
|
||||
.post('api/Typeset/pushArticleToSystem', this.detailMes)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
loading.close();
|
||||
this.$message.success('Online Successfully!');
|
||||
this.$router.push('/articleListEditor?ADeStage=3');
|
||||
} else {
|
||||
loading.close();
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
// 添加分期弹出框
|
||||
AddSatge() {
|
||||
this.StageimageUrl = "";
|
||||
this.StageVisible = true
|
||||
},
|
||||
|
||||
// 保存分期
|
||||
saveStage(StageForm) {
|
||||
this.StageForm.journal_id = this.detailMes.journal_id
|
||||
this.$refs.stage_Form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$api
|
||||
.post('api/Typeset/addStage', this.StageForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.StageVisible = false;
|
||||
this.$refs.stage_Form.resetFields();
|
||||
this.$message.success('Added successfully!');
|
||||
this.StageimageUrl = "";
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 修改时间为年月日
|
||||
modifDate(e) {
|
||||
let date = new Date(parseInt(e));
|
||||
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();
|
||||
return Y + M + D;
|
||||
},
|
||||
|
||||
|
||||
// 转化日期格式
|
||||
dateBlur(e) {
|
||||
//1
|
||||
this.$forceUpdate()
|
||||
//2、或者自己修改数据监听的最新数据
|
||||
this.itemKey = Math.random()
|
||||
let date = new Date(e);
|
||||
let Y = date.getFullYear();
|
||||
let M = date.getMonth() + 1;
|
||||
let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
|
||||
if (M == 1) {
|
||||
M = 'January'
|
||||
} else if (M == 2) {
|
||||
M = 'February'
|
||||
} else if (M == 3) {
|
||||
M = 'March'
|
||||
} else if (M == 4) {
|
||||
M = 'April'
|
||||
} else if (M == 5) {
|
||||
M = 'May'
|
||||
} else if (M == 6) {
|
||||
M = 'June'
|
||||
} else if (M == 7) {
|
||||
M = 'July'
|
||||
} else if (M == 8) {
|
||||
M = 'August'
|
||||
} else if (M == 9) {
|
||||
M = 'September'
|
||||
} else if (M == 10) {
|
||||
M = 'October'
|
||||
} else if (M == 11) {
|
||||
M = 'November'
|
||||
} else if (M == 12) {
|
||||
M = 'December'
|
||||
}
|
||||
this.StageForm.issue_date = D + ' ' + M + ' ' + Y
|
||||
},
|
||||
|
||||
//上传分期图片
|
||||
handleAvatarSuccess(res, file) {
|
||||
if (res.code == 0) {
|
||||
this.StageForm.stage_icon = res.url;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.StageimageUrl = URL.createObjectURL(file.raw);
|
||||
},
|
||||
handleAvatarError(res, file) {
|
||||
// this.$message.error(res);
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isLt2M = file.size / 1024 / 1024 < 1;
|
||||
if (!isLt2M) {
|
||||
this.$message.error('封面图片大小不能超过 1M!');
|
||||
}
|
||||
return isLt2M;
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.scroll-item {
|
||||
margin: 0 30px 50px 210px;
|
||||
}
|
||||
|
||||
.bor_style_onli {
|
||||
border: 2px solid rgba(0, 102, 153, .1);
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
padding: 20px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.ql-toolbar {
|
||||
border: 1px solid #DCDFE6 !important;
|
||||
}
|
||||
|
||||
.ql-container {
|
||||
min-height: 200px !important;
|
||||
border: 1px solid #DCDFE6 !important;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
line-height: 140px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
33
src/components/page/articleListEditor_F.vue
Normal file
33
src/components/page/articleListEditor_F.vue
Normal file
@@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="container">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
methods: {
|
||||
//初始化
|
||||
getDate() {
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
701
src/components/page/comArtHtml.vue
Normal file
701
src/components/page/comArtHtml.vue
Normal file
@@ -0,0 +1,701 @@
|
||||
<template>
|
||||
<div style="height: 98%;">
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-document-copy"></i> Artcile Html
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="height: 97%;min-width: 1000px;background-color: #fafafa;padding: 10px 0 0 0;">
|
||||
<h3 class="man_Title">{{detailTitle}}</h3>
|
||||
<div class="type_MTxt">
|
||||
<div v-for="(item,index) in Main_List">
|
||||
<p v-html="item.text"></p>
|
||||
<font v-if="item.getnum!=0" class="chNumer">{{item.getnum}}</font>
|
||||
<b class="MaxBtn" @click="MTxtEdit(item,index)" style="background-color: #006699;right: 40px;">
|
||||
<i class="el-icon-edit"></i>
|
||||
</b>
|
||||
<!-- <b class="MaxBtn" @click="MTxtPic(item,index)" style="background-color: #13bc20;right: 80px;">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</b>
|
||||
<b class="MaxBtn" @click="MTxtTable(item,index)" style="background-color: #e07404;right:40px;">
|
||||
<i class="el-icon-document-add"></i>
|
||||
</b> -->
|
||||
<b class="MaxBtn" @click="MTxtDelet(item,index)" style="background-color: #bc1a13;right: 0px;">
|
||||
<i class="el-icon-delete"></i>
|
||||
</b>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height: 20px;"></div>
|
||||
</div>
|
||||
|
||||
<!--修改文本 -->
|
||||
<el-dialog title="Modify Text" :visible.sync="txtVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="txtStyle" label-width="1px">
|
||||
<p style="margin: 0 5px 15px 5px;line-height: 18px;font-size: 13px;color: #aaa;">{{exegesis}}</p>
|
||||
<el-form-item label="">
|
||||
<el-input type="textarea" placeholder="Please enter the table content..." v-model="txtStyle.text"
|
||||
autosize>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p class="type_Gbtn" @click="trsanGtp">
|
||||
<i class="el-icon-document-copy" style="margin-right: 5px;" v-if="btnDisble"></i>
|
||||
<i class="el-icon-loading" style="margin-right: 5px;" v-if="!btnDisble"></i>
|
||||
TMRGTP Proofreading
|
||||
</p>
|
||||
<div class="type_CHar" v-if="txtStyle.ChGtpTxt!=''">
|
||||
<p v-html="txtStyle.ChGtpTxt"></p>
|
||||
<font class="chReple" @click="replceChGpr(item)">Replace</font>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="txtVisible=false">
|
||||
Cancel
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveTxt">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!--添加图片 -->
|
||||
<el-dialog title="Insert Picture" :visible.sync="pictVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="picStyle" label-width="150px">
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Picture :
|
||||
</span>
|
||||
<el-upload class="avatar-uploader" :action="baseUrl+'api/Production/up_articlepic_file'"
|
||||
:show-file-list="false" name="articleicon" :on-success="handleAvatarSuccess"
|
||||
:on-error="handleAvatarError" :before-upload="beforeAvatarUpload">
|
||||
<img v-if="picStyle.imageUrl" :src="picStyle.imageUrl" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="picStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Describe :">
|
||||
<el-input placeholder="Please enter the table describe..." v-model="picStyle.titleDes">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="picStyle.picUrl='';picStyle.titleBot='';picStyle.titleDes='';picStyle.imageUrl='';">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="picStyle.picUrl!=''">
|
||||
<div>
|
||||
<span class="title">Picture Width :</span>
|
||||
<el-input v-model="picStyle.picwith" style="width: 120px;">
|
||||
<template slot="append">px</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="picStyle.picUrl!=''">
|
||||
<div style="text-align: center;">
|
||||
<img :src="baseUrl+'public/'+picStyle.picUrl" :style="'width:'+picStyle.picwith+'px'">
|
||||
</div>
|
||||
<p style="text-align: center;margin: 10px 0 15px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{picStyle.titleBot}}</b>
|
||||
</p>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{picStyle.titleDes}}</p>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer" v-if="picStyle.picUrl!=''">
|
||||
<el-button type="primary" @click="savePic">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Picture
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加表格 -->
|
||||
<el-dialog title="Insert Table" :visible.sync="threeVisible" width="1000px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="lineStyle" label-width="115px">
|
||||
<el-form-item label="Top Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleTop">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Content :
|
||||
</span>
|
||||
<el-input type="textarea" :rows="5" placeholder="Please enter the table content..."
|
||||
v-model="lineStyle.textarea">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="lineStyle.textarea='';lineStyle.titleTop='';lineStyle.titleBot='';lineTable=[]">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="CopyExcelToTable">
|
||||
<i class="el-icon-sort" style="margin-right: 5px;"></i>Generate Table
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="lineTable.length!=0">
|
||||
<div>
|
||||
<span class="title">Table All Width :</span>
|
||||
<el-input v-model="lineStyle.tabwith" style="width: 120px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="(item,index) in lineStyle.arrwith" class="styArry">
|
||||
<span class="title">Column <b style="color: #006699;">{{index+1}}</b> :</span>
|
||||
<el-input v-model="lineStyle.arrwith[index]" style="width: 100px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="lineTable.length!=0">
|
||||
<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{lineStyle.titleTop}}</b>
|
||||
</p>
|
||||
<div class="lineAll" :style="'width:'+lineStyle.tabwith+'%'">
|
||||
<div v-for="item in lineTable" class="lineTit">
|
||||
<div v-for="(eqrt,iner) in item" :style="'width:'+lineStyle.arrwith[iner]+'%'">
|
||||
{{eqrt}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{lineStyle.titleBot}}</p>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="saveLine" v-if="lineTable.length!=0">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Table
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
Art_Id: this.$route.query.id,
|
||||
btnDisble: true,
|
||||
detailTitle: '',
|
||||
detailMes: {},
|
||||
Main_List: [],
|
||||
txtStyle: {
|
||||
text: '',
|
||||
ChGtpTxt: '',
|
||||
},
|
||||
txtVisible: false,
|
||||
lineStyle: {
|
||||
titleTop: '',
|
||||
titleBot: '',
|
||||
textarea: '',
|
||||
tabwith: '100',
|
||||
arrwith: []
|
||||
},
|
||||
lineTable: [],
|
||||
threeVisible: false,
|
||||
picStyle: {
|
||||
titleBot: '',
|
||||
titleDes: '',
|
||||
// picUrl: 'https://www.tmrjournals.cn/public/articleHTML/TMR/TMR20230213002/images/alternativeImage/TMR20230213002-F004.jpg',
|
||||
picUrl: '',
|
||||
imageUrl: '',
|
||||
picwith: '500'
|
||||
},
|
||||
pictVisible: false,
|
||||
exegesis: "The following contents'<b></b>,<i></i>'are necessary for the generation phase, please do not delete them!!!",
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getDate()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Loading...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
// 获取文章信息
|
||||
this.$api
|
||||
.post('api/Production/getProductionMains', {
|
||||
p_article_id: this.Art_Id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.detailTitle = res.data.production.title
|
||||
this.detailMes = res.data.mains
|
||||
this.Main_List = []
|
||||
for (let i = 0; i < this.detailMes.length; i++) {
|
||||
this.Main_List.push({
|
||||
p_main_id: this.detailMes[i].p_main_id,
|
||||
text: this.detailMes[i].content,
|
||||
value: i + 1,
|
||||
getnum: 0,
|
||||
check: false,
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
loading.close()
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
loading.close()
|
||||
});
|
||||
},
|
||||
|
||||
// 修改段落
|
||||
MTxtEdit(val, num) {
|
||||
this.txtVisible = true
|
||||
this.txtStyle = JSON.parse(JSON.stringify(val))
|
||||
this.txtStyle.index = num
|
||||
this.txtStyle.ChGtpTxt = ''
|
||||
this.btnDisble = true
|
||||
},
|
||||
|
||||
// 转化为gpt标准格式
|
||||
trsanGtp() {
|
||||
if (this.btnDisble) {
|
||||
this.btnDisble = false
|
||||
this.$api
|
||||
.post('api/Production/mainGptcheck', {
|
||||
p_main_id: this.txtStyle.p_main_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtStyle.ChGtpTxt = res.data.content
|
||||
this.btnDisble = true
|
||||
// this.$forceUpdate()
|
||||
this.$message.success('Converting success!');
|
||||
} else {
|
||||
this.btnDisble = true
|
||||
this.$message.error('Converting fail!');
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.btnDisble = true
|
||||
this.$message.error('Converting fail!');
|
||||
});
|
||||
}else{
|
||||
this.$message.warning('Converting, please wait!');
|
||||
}
|
||||
},
|
||||
|
||||
// 替换Gtp生成的内容
|
||||
replceChGpr(val) {
|
||||
this.txtStyle.text = JSON.parse(JSON.stringify(this.txtStyle.ChGtpTxt))
|
||||
},
|
||||
|
||||
// 确定保存段落修改
|
||||
saveTxt() {
|
||||
this.$api
|
||||
.post('api/Production/editProductionMain', {
|
||||
p_main_id: this.txtStyle.p_main_id,
|
||||
content: this.txtStyle.text
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtVisible = false
|
||||
this.Main_List[this.txtStyle.index].text = JSON.parse(JSON.stringify(this.txtStyle.text))
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 图片段落
|
||||
MTxtPic(val, num) {
|
||||
this.picStyle.p_main_id = val.p_main_id;
|
||||
this.picStyle.titleBot = '';
|
||||
this.picStyle.titleDes = '';
|
||||
this.picStyle.picUrl = '';
|
||||
this.picStyle.imageUrl = ''
|
||||
this.pictVisible = true
|
||||
},
|
||||
|
||||
// 确定保存图片
|
||||
savePic() {
|
||||
let dataImage = ''
|
||||
dataImage = '<div style="text-align: center;"><img src="' + this.baseUrl + 'public/' + this.picStyle
|
||||
.picUrl + '" style="width:' + this.picStyle.picwith + 'px"></div>'
|
||||
if (this.picStyle.titleBot != '') {
|
||||
dataImage = dataImage +
|
||||
'<p style="text-align: center;margin: 10px 0 15px 0;font-size: 12px;color: #006699;">' +
|
||||
this.lineStyle.titleBot + '</p>'
|
||||
}
|
||||
if (this.picStyle.titleDes != '') {
|
||||
dataImage = dataImage + '<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">' +
|
||||
this.lineStyle.titleDes + '</p>'
|
||||
}
|
||||
console.log(dataImage)
|
||||
},
|
||||
|
||||
// 表格段落
|
||||
MTxtTable(val, num) {
|
||||
this.lineStyle.p_main_id = val.p_main_id;
|
||||
this.lineStyle.textarea = '';
|
||||
this.lineStyle.titleCon = '';
|
||||
this.lineTable = [];
|
||||
this.threeVisible = true
|
||||
},
|
||||
|
||||
// 表格转化
|
||||
CopyExcelToTable() {
|
||||
if (this.lineStyle.textarea == '') {
|
||||
this.$message.error('Please fill in the table content!');
|
||||
return
|
||||
}
|
||||
let txtRows = this.lineStyle.textarea.split("\n");
|
||||
let txtColum = []
|
||||
for (let i = 0; i < txtRows.length; i++) {
|
||||
if (txtRows[i] != "") {
|
||||
let columns = txtRows[i].split("\t");
|
||||
let dataone = [];
|
||||
for (let j = 0; j < columns.length; j++) {
|
||||
dataone.push(columns[j]);
|
||||
}
|
||||
txtColum.push(dataone);
|
||||
};
|
||||
}
|
||||
let arrwithNumer = Math.floor(100 / txtColum[0].length) - 2
|
||||
this.lineStyle.arrwith = []
|
||||
for (let i = 0; i < txtColum[0].length; i++) {
|
||||
this.lineStyle.arrwith.push(arrwithNumer)
|
||||
}
|
||||
this.lineTable = txtColum
|
||||
},
|
||||
|
||||
|
||||
// 确定保存表格
|
||||
saveLine() {
|
||||
let dataTable = ''
|
||||
for (let i = 0; i < this.lineTable.length; i++) {
|
||||
let ArryDr = ''
|
||||
let listHNem = ''
|
||||
for (let j = 0; j < this.lineTable[i].length; j++) {
|
||||
let ArrHtml = '<div style="width:' + this.lineStyle.arrwith[j] +
|
||||
'%;line-height: 22px;vertical-align: middle;display: inline-block;padding: 0 1%;font-size: 14px;color: #606266;word-wrap: break-word;word-break: normal;">' +
|
||||
this.lineTable[i][j] + '</div>'
|
||||
ArryDr = ArryDr + ArrHtml
|
||||
}
|
||||
if (i == 0) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-top: 2px solid #333333;border-bottom: 1px solid #333333;padding: 10px 0;font-weight: bold;margin-bottom: 20px;">' +
|
||||
ArryDr + '</div>'
|
||||
} else if (i == this.lineTable.length - 1) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-bottom: 2px solid #333333;padding:0 0 20px 0;">' +
|
||||
ArryDr + '</div>'
|
||||
ArryDr = ArryDr + listHNem
|
||||
} else {
|
||||
listHNem = '<div style="display: flex;padding:20px 0;">' + ArryDr + '</div>'
|
||||
}
|
||||
dataTable = dataTable + listHNem
|
||||
}
|
||||
dataTable = '<div style="width:' + this.lineStyle.tabwith + '%">' + dataTable + '</div>'
|
||||
if (this.lineStyle.titleTop != '') {
|
||||
dataTable = '<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;"><b>' +
|
||||
this.lineStyle.titleTop + '</b></p>' + dataTable
|
||||
}
|
||||
if (this.lineStyle.titleBot != '') {
|
||||
dataTable = dataTable + '<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">' +
|
||||
this.lineStyle.titleBot + '</p>'
|
||||
}
|
||||
console.log(dataTable)
|
||||
},
|
||||
|
||||
// 删除段落
|
||||
MTxtDelet(val, num) {
|
||||
this.$api
|
||||
.post('api/Production/delProductionMain', {
|
||||
p_main_id: val.p_main_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.Main_List.splice(num, 1);
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 上传图片
|
||||
handleAvatarSuccess(res, file) {
|
||||
if (res.code == 0) {
|
||||
this.picStyle.picUrl = res.upurl;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.picStyle.imageUrl = URL.createObjectURL(file.raw);
|
||||
},
|
||||
handleAvatarError(res, file) {
|
||||
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isLt2M = file.size / 1024 / 1024 < 1;
|
||||
if (!isLt2M) {
|
||||
this.$message.error('Picture size cannot exceed 1M!');
|
||||
}
|
||||
return isLt2M;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.lineStyle {
|
||||
border-top: 1px solid #0066994d;
|
||||
padding: 20px 20px 40px 20px;
|
||||
}
|
||||
|
||||
.lineStyle>div {}
|
||||
|
||||
.lineStyle>div span.title {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.lineStyle>div font.mark {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 0px 0px 10px;
|
||||
}
|
||||
|
||||
.lineStyle .styArry {
|
||||
display: inline-block;
|
||||
margin: 15px 40px 0 0;
|
||||
}
|
||||
|
||||
.lineStyle .styArry:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.lineAll {
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
|
||||
.lineAll .lineTit {
|
||||
padding: 0 0 20px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(1) {
|
||||
border-top: 2px solid #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
padding: 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(2) {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-last-child(1) {
|
||||
border-bottom: 2px solid #333333;
|
||||
}
|
||||
|
||||
.lineAll .lineTit>div {
|
||||
line-height: 22px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
padding: 0 1%;
|
||||
}
|
||||
|
||||
|
||||
.man_Title {
|
||||
background-color: #fff;
|
||||
margin: 0 0 10px 0;
|
||||
border-bottom: 1px solid #dde1eb;
|
||||
box-shadow: 0 5px 5px -2px rgb(134 134 134);
|
||||
padding: 12px 25px 8px 25px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt {
|
||||
background-color: #fff;
|
||||
padding: 0 10px 10px 10px;
|
||||
box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt>div {
|
||||
position: relative;
|
||||
padding: 8px 15px;
|
||||
min-height: 22px;
|
||||
border: 2px dashed #fff;
|
||||
border-radius: 5px;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt>div:hover {
|
||||
background-color: rgb(0 102 153 / 10%);
|
||||
border: 2px dashed rgb(0 102 153 / 50%);
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt>div>p {
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
|
||||
}
|
||||
|
||||
.type_MTxt>div .chNumer {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -1px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(0 102 153 / 85%);
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.type_MTxt>div .MaxBtn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -1px;
|
||||
color: #fff;
|
||||
border-radius: 50px;
|
||||
font-size: 15.5px;
|
||||
padding: 6px 7px;
|
||||
display: none;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.type_MTxt>div:hover .MaxBtn {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.type_MTxt>div .MaxBtn:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_Gbtn {
|
||||
color: #fff;
|
||||
border-color: #006699;
|
||||
background: #006699;
|
||||
width: 30%;
|
||||
text-align: center;
|
||||
padding: 8px 0;
|
||||
font-size: 14px;
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.type_Gbtn:hover {
|
||||
box-shadow: 0 4px 14px rgb(0 102 153 / 30%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_CHar {
|
||||
position: relative;
|
||||
border-left: 4px solid rgba(0 102 153 / 20%);
|
||||
border-radius: 5px;
|
||||
padding: 20px 25px 15px 20px;
|
||||
background-color: #fff;
|
||||
margin: 20px 0 0 0;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
box-shadow: 0 1px 10px rgb(0 102 153 / 20%);
|
||||
}
|
||||
|
||||
.type_CHar .chReple {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
right: 1px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(223 109 11);
|
||||
opacity: 0.85;
|
||||
color: #fff;
|
||||
padding: 1px 10px;
|
||||
}
|
||||
|
||||
.type_CHar .chReple:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small {
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .el-upload {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .avatar-uploader-icon {
|
||||
line-height: 80px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
766
src/components/page/comArtHtml_.vue
Normal file
766
src/components/page/comArtHtml_.vue
Normal file
@@ -0,0 +1,766 @@
|
||||
<template>
|
||||
<div style="height: 98%;">
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-document-copy"></i> Artcile Html
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="height: 95%;min-width: 1000px;background-color: #fafafa;padding: 10px;">
|
||||
<el-row :gutter="20" style="height: 102%;">
|
||||
<el-col :span="24" style="height: 100%;">
|
||||
<div class="type_MTxt">
|
||||
<h3 class="man_Title">{{detailMes.title}}ea quisquam modi ratione in, ducimus quia. Neque
|
||||
reiciendis nihil illum!</h3>
|
||||
<div>
|
||||
<div v-for="(item,index) in Main_List" :class="item.check?'C_style':''">
|
||||
<el-checkbox v-model="item.check" class="checkMain" @change="chooseMain($event,item)">
|
||||
</el-checkbox>
|
||||
<p v-html="item.text"></p>
|
||||
<font v-if="item.getnum!=0" class="chNumer">{{item.getnum}}</font>
|
||||
<b class="MaxBtn" @click="MTxtEdit(item,index)"
|
||||
style="background-color: #006699;right: 120px;">
|
||||
<i class="el-icon-edit"></i>
|
||||
</b>
|
||||
<b class="MaxBtn" @click="MTxtPic(item,index)"
|
||||
style="background-color: #13bc20;right: 80px;">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</b>
|
||||
<b class="MaxBtn" @click="MTxtTable(item,index)"
|
||||
style="background-color: #b6a109;right:40px;">
|
||||
<i class="el-icon-document-add"></i>
|
||||
</b>
|
||||
|
||||
<b class="MaxBtn" @click="MTxtDelet(item,index)"
|
||||
style="background-color: #bc1a13;right: 0px;">
|
||||
<i class="el-icon-delete"></i>
|
||||
</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" style="height: 100%;">
|
||||
<p class="type_Gbtn" @click="trsanGtp">
|
||||
<i class="el-icon-document-copy" style="margin-right: 5px;"></i>
|
||||
TMRGTP Proofreading
|
||||
</p>
|
||||
<div style="height: 91.5%;overflow-y: scroll;" v-if="ChGtp_List.length!=0">
|
||||
<div class="type_CHar" v-for="(item,index) in ChGtp_List">
|
||||
<p v-html="item.text"></p>
|
||||
<font class="chNumer">{{index+1}}</font>
|
||||
<font class="chReple" @click="replceChGpr(item)">replace</font>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!--修改文本 -->
|
||||
<el-dialog title="Modify Text" :visible.sync="txtVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="txtStyle" label-width="10px">
|
||||
<!-- <el-form-item label="">
|
||||
<p style="color: #006699;font-weight: bold;">Preview :</p>
|
||||
<p v-html="txtStyle.text" style="line-height: 24px;word-wrap: break-word;word-break: normal;"></p>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="">
|
||||
<el-input type="textarea" placeholder="Please enter the table content..." v-model="txtStyle.text"
|
||||
autosize>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="txtVisible=false">
|
||||
Cancel
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveTxt">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!--添加图片 -->
|
||||
<el-dialog title="Insert Picture" :visible.sync="pictVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="picStyle" label-width="150px">
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Picture :
|
||||
</span>
|
||||
<el-upload class="avatar-uploader" :action="baseUrl+'api/Production/up_articlepic_file'"
|
||||
:show-file-list="false" name="articleicon" :on-success="handleAvatarSuccess"
|
||||
:on-error="handleAvatarError" :before-upload="beforeAvatarUpload">
|
||||
<img v-if="picStyle.imageUrl" :src="picStyle.imageUrl" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="picStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Describe :">
|
||||
<el-input placeholder="Please enter the table describe..." v-model="picStyle.titleDes">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="picStyle.picUrl='';picStyle.titleBot='';picStyle.titleDes='';picStyle.imageUrl='';">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="">
|
||||
<i class="el-icon-sort" style="margin-right: 5px;"></i>Generate Picture
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="picStyle.picUrl!=''">
|
||||
<div>
|
||||
<span class="title">Picture Width :</span>
|
||||
<el-input v-model="picStyle.picwith" style="width: 120px;">
|
||||
<template slot="append">px</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="picStyle.picUrl!=''">
|
||||
<div style="text-align: center;">
|
||||
<img :src="baseUrl+'public/'+picStyle.picUrl" :style="'width:'+picStyle.picwith+'px'">
|
||||
</div>
|
||||
<p style="text-align: center;margin: 0 0 15px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{picStyle.titleBot}}</b>
|
||||
</p>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{picStyle.titleDes}}</p>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer" v-if="picStyle.picUrl!=''">
|
||||
<el-button type="primary" @click="savePic">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Picture
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!-- 添加表格 -->
|
||||
<el-dialog title="Insert Table" :visible.sync="threeVisible" width="1000px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="lineStyle" label-width="115px">
|
||||
<el-form-item label="Top Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleTop">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Content :
|
||||
</span>
|
||||
<el-input type="textarea" :rows="5" placeholder="Please enter the table content..."
|
||||
v-model="lineStyle.textarea">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="lineStyle.textarea='';lineStyle.titleTop='';lineStyle.titleBot='';lineTable=[]">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="CopyExcelToTable">
|
||||
<i class="el-icon-sort" style="margin-right: 5px;"></i>Generate Table
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="lineTable.length!=0">
|
||||
<div>
|
||||
<span class="title">Table All Width :</span>
|
||||
<el-input v-model="lineStyle.tabwith" style="width: 120px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="(item,index) in lineStyle.arrwith" class="styArry">
|
||||
<span class="title">Column <b style="color: #006699;">{{index+1}}</b> :</span>
|
||||
<el-input v-model="lineStyle.arrwith[index]" style="width: 100px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="lineTable.length!=0">
|
||||
<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{lineStyle.titleTop}}</b>
|
||||
</p>
|
||||
<div class="lineAll" :style="'width:'+lineStyle.tabwith+'%'">
|
||||
<div v-for="item in lineTable" class="lineTit">
|
||||
<div v-for="(eqrt,iner) in item" :style="'width:'+lineStyle.arrwith[iner]+'%'">
|
||||
{{eqrt}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{lineStyle.titleBot}}</p>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="saveLine" v-if="lineTable.length!=0">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Table
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
Art_Id: this.$route.query.id,
|
||||
detailMes: {},
|
||||
Main_List: [],
|
||||
check_List: [],
|
||||
ChGtp_List: [],
|
||||
lineStyle: {
|
||||
titleTop: '',
|
||||
titleBot: '',
|
||||
textarea: '',
|
||||
tabwith: '100',
|
||||
arrwith: []
|
||||
},
|
||||
lineTable: [],
|
||||
threeVisible: false,
|
||||
picStyle: {
|
||||
titleTop: '',
|
||||
titleDes: '',
|
||||
// picUrl: 'https://www.tmrjournals.cn/public/articleHTML/TMR/TMR20230213002/images/alternativeImage/TMR20230213002-F004.jpg',
|
||||
picUrl: '',
|
||||
imageUrl: '',
|
||||
picwith: '500'
|
||||
},
|
||||
pictVisible: false,
|
||||
txtStyle: {
|
||||
text: ''
|
||||
},
|
||||
txtVisible: false,
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getDate()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Loading...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
// 获取文章信息
|
||||
this.$api
|
||||
.post('api/Production/getProductionMains', {
|
||||
p_article_id: this.Art_Id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.detailMes = res.data.mains
|
||||
this.Main_List = []
|
||||
for (let i = 0; i < this.detailMes.length; i++) {
|
||||
this.Main_List.push({
|
||||
p_main_id: this.detailMes[i].p_main_id,
|
||||
text: this.detailMes[i].content,
|
||||
value: i + 1,
|
||||
getnum: 0,
|
||||
check: false,
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
loading.close()
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
loading.close()
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 选择段落
|
||||
chooseMain(e, item) {
|
||||
this.check_List = []
|
||||
let allNUm = 1
|
||||
for (var i = 0; i < this.Main_List.length; i++) {
|
||||
if (this.Main_List[i].check) {
|
||||
this.Main_List[i].getnum = allNUm
|
||||
allNUm = allNUm + 1
|
||||
this.check_List.push({
|
||||
text: this.Main_List[i].text,
|
||||
value: this.Main_List[i].value,
|
||||
index: i,
|
||||
p_main_id: this.Main_List[i].p_main_id,
|
||||
})
|
||||
}
|
||||
}
|
||||
console.log(this.check_List)
|
||||
},
|
||||
|
||||
// 转化为gpt标准格式
|
||||
trsanGtp() {
|
||||
if (this.check_List.length == 0) {
|
||||
this.$message.error('Please select a paragraph!');
|
||||
} else {
|
||||
this.ChGtp_List = JSON.parse(JSON.stringify(this.check_List))
|
||||
console.log(this.ChGtp_List)
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 替换Gtp生成的内容
|
||||
replceChGpr(val) {
|
||||
this.Main_List[val.index].text = JSON.parse(JSON.stringify(val.text))
|
||||
},
|
||||
|
||||
|
||||
// 修改段落
|
||||
MTxtEdit(val, num) {
|
||||
this.txtVisible = true
|
||||
this.txtStyle = JSON.parse(JSON.stringify(val))
|
||||
this.txtStyle.index = num
|
||||
},
|
||||
|
||||
// 图片段落
|
||||
MTxtPic(val, num) {
|
||||
this.picStyle.p_main_id = val.p_main_id;
|
||||
this.picStyle.titleBot = '';
|
||||
this.picStyle.titleDes = '';
|
||||
this.picStyle.picUrl = '';
|
||||
this.picStyle.imageUrl = ''
|
||||
this.pictVisible = true
|
||||
},
|
||||
|
||||
// 表格段落
|
||||
MTxtTable(val, num) {
|
||||
this.lineStyle.p_main_id = val.p_main_id;
|
||||
this.lineStyle.textarea = '';
|
||||
this.lineStyle.titleCon = '';
|
||||
this.lineTable = [];
|
||||
this.threeVisible = true
|
||||
},
|
||||
|
||||
// 删除段落
|
||||
MTxtDelet(val, num) {
|
||||
this.$api
|
||||
.post('api/Production/delProductionMain', {
|
||||
p_main_id: val.p_main_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtVisible = false
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// 确定保存段落修改
|
||||
saveTxt() {
|
||||
this.$api
|
||||
.post('api/Production/editProductionMain', {
|
||||
p_main_id: this.txtStyle.p_main_id,
|
||||
content: this.txtStyle.text
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtVisible = false
|
||||
this.Main_List[this.txtStyle.index].text = JSON.parse(JSON.stringify(this.txtStyle.text))
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 确定保存图片
|
||||
savePic() {
|
||||
|
||||
},
|
||||
|
||||
// 表格转化
|
||||
CopyExcelToTable() {
|
||||
if (this.lineStyle.textarea == '') {
|
||||
this.$message.error('Please fill in the table content!');
|
||||
return
|
||||
}
|
||||
let txtRows = this.lineStyle.textarea.split("\n");
|
||||
let txtColum = []
|
||||
for (let i = 0; i < txtRows.length; i++) {
|
||||
if (txtRows[i] != "") {
|
||||
let columns = txtRows[i].split("\t");
|
||||
let dataone = [];
|
||||
for (let j = 0; j < columns.length; j++) {
|
||||
dataone.push(columns[j]);
|
||||
}
|
||||
txtColum.push(dataone);
|
||||
};
|
||||
}
|
||||
|
||||
let arrwithNumer = Math.floor(100 / txtColum[0].length) - 2
|
||||
this.lineStyle.arrwith = []
|
||||
for (let i = 0; i < txtColum[0].length; i++) {
|
||||
this.lineStyle.arrwith.push(arrwithNumer)
|
||||
}
|
||||
this.lineTable = txtColum
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 确定保存表格
|
||||
saveLine() {
|
||||
let dataTable = ''
|
||||
for (let i = 0; i < this.lineTable.length; i++) {
|
||||
let ArryDr = ''
|
||||
let listHNem = ''
|
||||
for (let j = 0; j < this.lineTable[i].length; j++) {
|
||||
let ArrHtml = '<div style="width:' + this.lineStyle.arrwith[j] +
|
||||
'%;line-height: 22px;vertical-align: middle;display: inline-block;padding: 0 1%;font-size: 14px;color: #606266;word-wrap: break-word;word-break: normal;">'
|
||||
+ this.lineTable[i][j] +'</div>'
|
||||
ArryDr = ArryDr + ArrHtml
|
||||
}
|
||||
|
||||
if (i == 0) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-top: 2px solid #333333;border-bottom: 1px solid #333333;padding: 10px 0;font-weight: bold;margin-bottom: 20px;">' +
|
||||
ArryDr + '</div>'
|
||||
} else if (i == this.lineTable.length - 1) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-bottom: 2px solid #333333;padding:0 0 20px 0;">' +
|
||||
ArryDr + '</div>'
|
||||
ArryDr = ArryDr + listHNem
|
||||
} else {
|
||||
listHNem = '<div style="display: flex;padding:20px 0;">' + ArryDr + '</div>'
|
||||
}
|
||||
|
||||
dataTable = dataTable + listHNem
|
||||
}
|
||||
dataTable = '<div style="width:' + this.lineStyle.tabwith + '%">' + dataTable + '</div>'
|
||||
|
||||
if (this.lineStyle.titleTop != '') {
|
||||
dataTable = '<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;"><b>' +
|
||||
this.lineStyle.titleTop + '</b></p>' + dataTable
|
||||
}
|
||||
|
||||
if (this.lineStyle.titleBot != '') {
|
||||
dataTable = dataTable+'<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">' +
|
||||
this.lineStyle.titleBot + '</p>'
|
||||
}
|
||||
|
||||
|
||||
console.log(dataTable)
|
||||
},
|
||||
|
||||
|
||||
// 上传图片
|
||||
handleAvatarSuccess(res, file) {
|
||||
if (res.code == 0) {
|
||||
this.picStyle.picUrl = res.upurl;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.picStyle.imageUrl = URL.createObjectURL(file.raw);
|
||||
},
|
||||
handleAvatarError(res, file) {
|
||||
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isLt2M = file.size / 1024 / 1024 < 1;
|
||||
if (!isLt2M) {
|
||||
this.$message.error('Picture size cannot exceed 1M!');
|
||||
}
|
||||
return isLt2M;
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.lineStyle {
|
||||
border-top: 1px solid #0066994d;
|
||||
padding: 20px 20px 40px 20px;
|
||||
}
|
||||
|
||||
.lineStyle>div {}
|
||||
|
||||
.lineStyle>div span.title {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.lineStyle>div font.mark {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 0px 0px 10px;
|
||||
}
|
||||
|
||||
.lineStyle .styArry {
|
||||
display: inline-block;
|
||||
margin: 15px 40px 0 0;
|
||||
}
|
||||
|
||||
.lineStyle .styArry:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.lineAll {
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
|
||||
.lineAll .lineTit {
|
||||
padding: 0 0 20px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(1) {
|
||||
border-top: 2px solid #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
padding: 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(2) {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-last-child(1) {
|
||||
border-bottom: 2px solid #333333;
|
||||
}
|
||||
|
||||
.lineAll .lineTit>div {
|
||||
line-height: 22px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
padding: 0 1%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.type_MTxt {
|
||||
background-color: #fff;
|
||||
padding: 0 10px;
|
||||
box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
|
||||
border-radius: 12px;
|
||||
height: 99%;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt .man_Title {
|
||||
margin: 0 -10px 20px -25px;
|
||||
border-bottom: 1px solid #dde1eb;
|
||||
box-shadow: 0 5px 5px -2px rgb(134 134 134);
|
||||
padding: 12px 25px 8px 35px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div {
|
||||
position: relative;
|
||||
padding: 10px 10px 10px 40px;
|
||||
min-height: 22px;
|
||||
border: 2px dashed #fff;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 5px;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt>div>div:hover {
|
||||
background-color: #eaf3fe;
|
||||
border: 2px dashed rgb(0 102 153 / 80%);
|
||||
}
|
||||
|
||||
.type_MTxt>div>div.C_style {
|
||||
background-color: rgb(0 102 153 / 10%);
|
||||
border: 2px dashed rgb(0 102 153 / 10%);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div>.checkMain {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 12px;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div>p {
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .chNumer {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -1px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(0 102 153 / 85%);
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .MaxBtn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -1px;
|
||||
color: #fff;
|
||||
border-radius: 50px;
|
||||
font-size: 15.5px;
|
||||
padding: 5px 6px;
|
||||
display: none;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div:hover .MaxBtn {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .MaxBtn:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_Gbtn {
|
||||
color: #fff;
|
||||
border-color: #006699;
|
||||
background: #006699;
|
||||
width: 100%;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
font-size: 17px;
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.type_Gbtn:hover {
|
||||
box-shadow: 0 4px 14px rgb(0 102 153 / 30%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_CHar {
|
||||
border-left: 4px solid rgba(0 102 153 / 20%);
|
||||
border-radius: 5px;
|
||||
padding: 10px 25px 10px 20px;
|
||||
background-color: #fff;
|
||||
margin: 15px 0 0 0;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.type_CHar .chNumer {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
right: 5px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(0 102 153 / 85%);
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.type_CHar .chReple {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
right: 40px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(223 109 11);
|
||||
opacity: 0.85;
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.type_CHar:hover .chReple {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.type_CHar .chReple:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small {
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .el-upload {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .avatar-uploader-icon {
|
||||
line-height: 80px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
632
src/components/page/disseMRecord.vue
Normal file
632
src/components/page/disseMRecord.vue
Normal file
@@ -0,0 +1,632 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-message"></i> Promotion Record
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container_state">
|
||||
<div class="handle-box">
|
||||
<el-button type="primary" icon="el-icon-plus" class="handle-del" @click="addTtask()">
|
||||
Add email promotion task
|
||||
</el-button>
|
||||
<!-- <el-button type="warning" icon="el-icon-document-copy" @click="addTemple()">
|
||||
Mail Template
|
||||
</el-button> -->
|
||||
</div>
|
||||
<p v-if="tableData.length==0" style="color: #6f6f6f;font-size: 18px;margin-top: 30px;text-align: center;">No task</p>
|
||||
<div v-for="item in tableData" class="taskList" :style="stateChange(item.range,item.is_end)">
|
||||
<div style="text-align: right;padding-right: 60px;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-view" @click="handleSend(item)">
|
||||
Preview mail
|
||||
</el-button>
|
||||
<el-button type="success" size="mini" icon="el-icon-postcard" @click="handleTest(item)">
|
||||
Send test mail
|
||||
</el-button>
|
||||
<el-button type="warning" size="mini" icon="el-icon-finished" @click="handleTaske(item,1)"
|
||||
v-if="item.is_end==1">
|
||||
Open Task
|
||||
</el-button>
|
||||
<el-button type="info" size="mini" icon="el-icon-circle-close" @click="handleTaske(item,2)"
|
||||
v-if="item.is_end==0">
|
||||
Close Task
|
||||
</el-button>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" @click="handleDelete(item)">
|
||||
Delete
|
||||
</el-button>
|
||||
</div>
|
||||
<!-- <div class="taskRow" style="font-size: 16px;margin:-23px 0 15px 0;letter-spacing: -0.5px;">
|
||||
<b>{{decjuRange(item.range)}}</b>
|
||||
</div> -->
|
||||
<div class="taskRow">
|
||||
<font>
|
||||
<i class="el-icon-paperclip"></i>
|
||||
Promoting journal :
|
||||
</font>
|
||||
{{item.journal_title}}
|
||||
</div>
|
||||
<div class="taskRow">
|
||||
<font>
|
||||
<i class="el-icon-user"></i>
|
||||
Target library :
|
||||
</font>
|
||||
{{decjuSendata(item.library)}}
|
||||
<p v-if="item.category=='major'" style="display: inline-block;">
|
||||
({{item.major_str}})
|
||||
</p>
|
||||
<p v-if="item.category=='keyword'" style="display: inline-block;">
|
||||
({{item.keyword}})
|
||||
</p>
|
||||
</div>
|
||||
<div class="taskRow">
|
||||
<font>
|
||||
<i class="el-icon-message"></i>
|
||||
Mail title :
|
||||
</font>
|
||||
{{item.email_title}}
|
||||
</div>
|
||||
<div class="taskRow">
|
||||
<font>
|
||||
<i class="el-icon-time"></i>
|
||||
Scheduled Tasks :
|
||||
</font>
|
||||
{{timefreSDel(item.frequency)}}
|
||||
</div>
|
||||
<div class="taskRow">
|
||||
<font>
|
||||
<i class="el-icon-position"></i>
|
||||
Sent personnel :
|
||||
</font>
|
||||
<b style="color: #006699">{{item.user_count}}</b> in total,
|
||||
<b style="color: #006699">{{item.user_send}}</b> people have been sent,
|
||||
send <b style="color: #006699">{{item.pagesize}}</b> people each time.
|
||||
<!-- <div style="margin: 10px 0 0 120px;">
|
||||
<p v-for="item in numbeoList" class="sentPeale">
|
||||
<font :style="item.disfor?'background-color:#F56C6C':'background-color:#006699'"></font>
|
||||
<b class="el-icon-success" v-if="item.disfor" style="color: #159900;"></b>
|
||||
<b class="el-icon-error" v-if="!item.disfor" style="color: #F56C6C;"></b>
|
||||
{{item.title}}
|
||||
</p>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="ribbon-lanren" v-if="item.is_end==0">
|
||||
<div class="blue">In Progress</div>
|
||||
</div>
|
||||
|
||||
<div class="ribbon-lanren" v-if="item.is_end==1">
|
||||
<div class="gray">Unexecuted</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 预览弹出框 -->
|
||||
<el-dialog title="Preview mail messages" :visible.sync="sendVisible" :close-on-click-modal="false"
|
||||
width="850px">
|
||||
<el-form ref="send_Form" :model="sendForm" :rules="rules" label-width="160px">
|
||||
<!-- <el-form-item label="Target personnel :" prop="senProce">
|
||||
<el-checkbox-group v-model="sendForm.senProce" @change="chanProce">
|
||||
<el-checkbox v-for="item in numbeoList" :label="item.id" :key="item.id" :disabled="item.disfor">
|
||||
{{item.title}}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item label="Mail Range :">
|
||||
<div>{{decjuRange(sendForm.range)}}</div>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="Promoting journal :">
|
||||
<div>{{sendForm.journal_title}}</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="Target library :">
|
||||
<div>
|
||||
{{decjuSendata(sendForm.library)}}
|
||||
<p v-if="sendForm.category=='major'" style="display: inline-block;">
|
||||
({{sendForm.major_str}})
|
||||
</p>
|
||||
<p v-if="sendForm.category=='keyword'" style="display: inline-block;">
|
||||
({{sendForm.keyword}})
|
||||
</p>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="Subject :">
|
||||
<div>{{sendForm.email_title}}</div>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="Mail Template :">
|
||||
<div>Customize</div>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="Content :">
|
||||
<div class="senderKuan">
|
||||
<img src="../../assets/img/mailPT.png" style="margin-bottom: -10px;" v-if="sendForm.has_hb==1">
|
||||
<div v-html="sendForm.template" style="padding: 20px;word-wrap: break-word;word-break: normal;">
|
||||
</div>
|
||||
<img src="../../assets/img/mailPB.png" v-if="sendForm.has_hb==1">
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="Scheduled Tasks :">
|
||||
{{timefreSDel(sendForm.frequency)}}
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="sendVisible = false;">Cancel</el-button>
|
||||
<!-- <el-button type="primary" @click="saveSend(sendForm)">Send mail</el-button> -->
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!-- 测试邮件弹出框 -->
|
||||
<el-dialog title="Send test mail" :visible.sync="testEBox" width="500px" :close-on-click-modal="false">
|
||||
<el-form ref="testRef" :rules="rules" :model="testEForm" label-width="120px">
|
||||
<el-form-item label="Mail title :">
|
||||
{{testEForm.email_title}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Test Email :" prop="email">
|
||||
<el-input v-model="testEForm.email" style="width: 280px;" placeholder="Please enter the test email">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="testEBox = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="sendTest">Send test mail</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 开关任务弹出框 -->
|
||||
<el-dialog title="" :visible.sync="taskBox" width="500px" :close-on-click-modal="false">
|
||||
<div style="position: relative;">
|
||||
<i class="el-icon-warning"
|
||||
style="color: #E6A23C;font-size:30px;margin-right: 5px;position: absolute;top: 5px;left: 10px;"></i>
|
||||
<p style="font-size: 15px;line-height: 26px;padding: 5px 35px 0px 50px;word-break: normal;">
|
||||
<font v-if="taskForm.index==2">
|
||||
Are you sure want to stop executing the email '
|
||||
<b style="letter-spacing: -0.5px;">{{taskForm.email_title}}</b>' task?
|
||||
</font>
|
||||
<font v-if="taskForm.index==1">
|
||||
Are you sure want to start executing the email '
|
||||
<b style="letter-spacing: -0.5px;">{{taskForm.email_title}}</b>' task?
|
||||
<br>
|
||||
The task cycle is <b>{{timefreSDel(taskForm.frequency)}}</b>
|
||||
</font>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="taskBox = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="gengTask">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
edit_id: localStorage.getItem('U_id'),
|
||||
tableData: [],
|
||||
sendForm: {},
|
||||
sendVisible: false,
|
||||
testEForm: {
|
||||
email: '376837995@qq.com'
|
||||
},
|
||||
testEBox: false,
|
||||
rangeList: [{
|
||||
title: 'Appointment',
|
||||
id: 1
|
||||
}, {
|
||||
title: 'Article Recommendation',
|
||||
id: 2
|
||||
}, {
|
||||
title: 'Promotion',
|
||||
id: 3
|
||||
}],
|
||||
numbeoList: [{
|
||||
title: '1-100',
|
||||
id: 1,
|
||||
disfor: true
|
||||
}, {
|
||||
title: '101-200',
|
||||
id: 2,
|
||||
disfor: false
|
||||
}, {
|
||||
title: '201-300',
|
||||
id: 3,
|
||||
disfor: false
|
||||
}],
|
||||
taskBox: false,
|
||||
taskForm: {},
|
||||
rules: {
|
||||
senProce: [{
|
||||
required: true,
|
||||
message: 'Please select target personnel',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
email: [{
|
||||
required: true,
|
||||
message: 'Please enter a email',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
};
|
||||
},
|
||||
created: function() {
|
||||
this.getData();
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
//获取数据
|
||||
getData() {
|
||||
this.$api
|
||||
.post('api/Promotion/getPromotions', {
|
||||
user_id: this.edit_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.list
|
||||
for (let i = 0; i < this.tableData.length; i++) {
|
||||
this.tableData[i].journal_title = this.tableData[i].journal.title
|
||||
if (this.tableData[i].pushed == '') {
|
||||
this.tableData[i].user_send = 0
|
||||
} else {
|
||||
this.tableData[i].user_send = this.tableData[i].pagesize * this.tableData[i].pushed
|
||||
.length
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.$message.error('res.msg');
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 编辑操作
|
||||
handleSend(row) {
|
||||
this.sendForm = row
|
||||
this.sendForm.senProce = []
|
||||
this.sendVisible = true
|
||||
},
|
||||
|
||||
// 保存编辑
|
||||
saveSend(sendForm) {
|
||||
this.$refs.send_Form.validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
} else {
|
||||
this.$message.error('Please complete the information!');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 测试邮件弹出
|
||||
handleTest(e) {
|
||||
this.testEForm.pro_id = e.pro_id;
|
||||
this.testEForm.email_title = e.email_title;
|
||||
// this.testEForm.email = '';
|
||||
this.testEBox = true
|
||||
},
|
||||
|
||||
// 发送测试邮件
|
||||
sendTest() {
|
||||
this.$refs.testRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$api
|
||||
.post('api/Promotion/pushTestEmail', this.testEForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Successfully send test email!');
|
||||
this.testEBox = false
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
|
||||
this.$message.error('Please complete the information!');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// 开启关闭任务
|
||||
handleTaske(row, index) {
|
||||
this.taskForm.email_title = row.email_title
|
||||
this.taskForm.frequency = row.frequency
|
||||
this.taskForm.pro_id = row.pro_id
|
||||
this.taskForm.index = index
|
||||
this.taskBox = true
|
||||
},
|
||||
// 开启关闭任务确认
|
||||
gengTask() {
|
||||
let bianUrl
|
||||
if (this.taskForm.index == 1) {
|
||||
bianUrl = 'api/Promotion/startPromotion'
|
||||
}
|
||||
if (this.taskForm.index == 2) {
|
||||
bianUrl = 'api/Promotion/stopPromotion'
|
||||
}
|
||||
this.$api
|
||||
.post(bianUrl, this.taskForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Succeeded!');
|
||||
this.taskBox = false
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 删除操作
|
||||
handleDelete(row) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure to delete this email "' + row.email_title + '"?', 'Tips', {
|
||||
distinguishCancelAndClose: true,
|
||||
confirmButtonText: 'OK',
|
||||
cancelButtonText: 'Cancel'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/Promotion/delPromotion', row)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Delete succeeded!');
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
// 添加邮件任务
|
||||
addTtask() {
|
||||
this.$router.push({
|
||||
path: 'disseMinate',
|
||||
});
|
||||
},
|
||||
|
||||
// 添加模板
|
||||
addTemple() {
|
||||
this.$router.push({
|
||||
path: 'disseMTemple',
|
||||
});
|
||||
},
|
||||
|
||||
// 任务范围
|
||||
decjuRange(e) {
|
||||
let phrase = '';
|
||||
switch (e) {
|
||||
case 1:
|
||||
phrase = 'Appointment';
|
||||
break;
|
||||
case 2:
|
||||
phrase = 'Article Recommendation';
|
||||
break;
|
||||
case 3:
|
||||
phrase = 'Promotion';
|
||||
break;
|
||||
}
|
||||
return phrase;
|
||||
},
|
||||
|
||||
// 人员范围
|
||||
decjuSendata(e) {
|
||||
let phrase = '';
|
||||
switch (e) {
|
||||
case 'user':
|
||||
phrase = 'All Users';
|
||||
break;
|
||||
case 'author':
|
||||
phrase = 'Author Database';
|
||||
break;
|
||||
case 'ash':
|
||||
phrase = 'Untapped Users';
|
||||
break;
|
||||
}
|
||||
return phrase;
|
||||
},
|
||||
|
||||
// 发送时间
|
||||
timefreSDel(e) {
|
||||
let phrase = '';
|
||||
switch (e) {
|
||||
case 'day':
|
||||
phrase = 'Day (explanatory note: 10:00 - 12:00)';
|
||||
break;
|
||||
case 'week':
|
||||
phrase = 'Week (explanatory note: Monday - Tuesday)';
|
||||
break;
|
||||
case 'month':
|
||||
phrase = 'Month (explanatory note: 1st - 5th)';
|
||||
break;
|
||||
}
|
||||
return phrase;
|
||||
},
|
||||
|
||||
// 改变人员多选框
|
||||
chanProce(e) {
|
||||
this.$forceUpdate()
|
||||
},
|
||||
|
||||
// 列表颜色
|
||||
stateChange(value, contol) {
|
||||
let str = '';
|
||||
let sgr = '';
|
||||
let skr = '';
|
||||
switch (contol) {
|
||||
case 0:
|
||||
str = '#5a90e10d;';
|
||||
sgr = '#5a90e14d;';
|
||||
skr = '0px 0px 4px #5a90e133;';
|
||||
break;
|
||||
case 1:
|
||||
str = '#8888880d;';
|
||||
sgr = '#8888884d;';
|
||||
skr = '0px 0px 4px #88888833;';
|
||||
break;
|
||||
}
|
||||
return 'background-color:' + str + ';border-color:' + sgr + ';box-shadow:' + skr;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
.taskList {
|
||||
color: #333;
|
||||
margin: 0 0 20px 0;
|
||||
font-size: 14px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #EBEEF5;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.taskRow {
|
||||
margin: 0 0 5px 0;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.taskRow>font {
|
||||
font-size: 13px;
|
||||
color: #666b7a;
|
||||
display: inline-block;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.taskRow>font>i {
|
||||
margin: 0 3px 0 0;
|
||||
}
|
||||
|
||||
.sentPeale {
|
||||
display: inline-block;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.sentPeale font {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background-color: #000;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.sentPeale b {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
display: inline-block;
|
||||
vertical-align: text-bottom;
|
||||
margin: 0 3px 0 0;
|
||||
}
|
||||
|
||||
|
||||
.senderKuan {
|
||||
margin: 5px 0 0 0;
|
||||
padding: 5px;
|
||||
border: 1px solid #00669933;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.senderKuan img {
|
||||
width: 100%;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
}
|
||||
|
||||
.lanren {
|
||||
margin: 50px auto;
|
||||
width: 280px;
|
||||
height: 180px;
|
||||
background: white;
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
|
||||
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
}
|
||||
|
||||
.ribbon-lanren {
|
||||
width: 85px;
|
||||
height: 88px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
right: -3px;
|
||||
}
|
||||
|
||||
.ribbon-lanren div {
|
||||
position: relative;
|
||||
padding: 7px 0;
|
||||
left: -5px;
|
||||
top: 15px;
|
||||
width: 120px;
|
||||
font: bold 12px Sans-Serif;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
-webkit-transform: rotate(45deg);
|
||||
-moz-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
-o-transform: rotate(45deg);
|
||||
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
|
||||
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.ribbon-lanren .blue {
|
||||
|
||||
text-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px;
|
||||
|
||||
background-color: #006699cc;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45));
|
||||
background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -moz-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -ms-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -o-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
|
||||
.ribbon-lanren .gray {
|
||||
text-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px;
|
||||
|
||||
background-color: #e3e0e0;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45));
|
||||
background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -moz-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -ms-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
background-image: -o-linear-gradient(top, #BFDC7A, #8EBF45);
|
||||
color: #6a6340;
|
||||
}
|
||||
</style>
|
||||
313
src/components/page/disseMTemple.vue
Normal file
313
src/components/page/disseMTemple.vue
Normal file
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-message"></i> Promotion email management
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container_state">
|
||||
<div class="handle-box">
|
||||
<el-button type="primary" icon="el-icon-plus" class="handle-del" @click="add_Selection">Add template
|
||||
</el-button>
|
||||
</div>
|
||||
<el-table :data="tableData" row-key="eid" border class="table" ref="multipleTable" default-expand-all
|
||||
header-cell-class-name="table-header" :tree-props="{children: 'children', hasChildren: true}"
|
||||
empty-text="New template (0)">
|
||||
<el-table-column label="Template Range" width="220">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.epid==0">
|
||||
{{scope.row.etitle}}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Template Name" prop="econtent">
|
||||
<template slot-scope="scope">
|
||||
<p v-if="scope.row.epid!=0">
|
||||
{{scope.row.econtent}}
|
||||
<br>
|
||||
{{scope.row.etitle}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Number of clicks" width="90" align="center">
|
||||
<template slot-scope="scope" v-if="scope.row.epid!=0">
|
||||
{{scope.row.num}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="" width="200" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.epid!=0">
|
||||
<el-button type="primary" plain size="mini" icon="el-icon-edit"
|
||||
@click="handleEdit(scope.row)">
|
||||
Edit
|
||||
</el-button>
|
||||
<el-button type="danger" plain size="mini" icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)">
|
||||
Delete
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<!-- 添加弹出框 -->
|
||||
<el-dialog title="Add template" :visible.sync="addVisible" width="850px">
|
||||
<el-form ref="add_Form" :model="addForm" :rules="rules" label-width="150px">
|
||||
<el-form-item label="Template name :" prop="etitle">
|
||||
<el-input v-model="addForm.etitle"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Mail Range :" prop="range">
|
||||
<el-select v-model="addForm.range" placeholder="Please select a range" @change="changeRange()"
|
||||
style="width: 240px;">
|
||||
<el-option v-for="item in rangeList" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="econtent">
|
||||
<quill-editor ref="myTextEditor" v-model="addForm.econtent" :options="editorOption"
|
||||
class="quilStyle">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="addVisible = false;">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveAdd(addForm)">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- 编辑弹出框 -->
|
||||
<el-dialog title="Edit template" :visible.sync="editVisible" width="850px">
|
||||
<el-form ref="edit_Form" :model="editForm" :rules="rules" label-width="150px">
|
||||
<el-form-item label="Template name :" prop="etitle">
|
||||
<el-input v-model="editForm.etitle"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Mail Range :" prop="range">
|
||||
<el-select v-model="editForm.range" placeholder="Please select a range" @change="changeRange()"
|
||||
style="width: 240px;">
|
||||
<el-option v-for="item in rangeList" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="econtent">
|
||||
<quill-editor ref="myTextEditor" v-model="editForm.econtent" :options="editorOption"
|
||||
class="quilStyle">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="editVisible = false;">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEdit(editForm)">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
addForm: {
|
||||
etitle: '',
|
||||
econtent: ''
|
||||
},
|
||||
editForm: {
|
||||
etitle: '',
|
||||
econtent: ''
|
||||
},
|
||||
tableData: [],
|
||||
addVisible: false,
|
||||
editVisible: false,
|
||||
rangeList: [{
|
||||
title: 'Appointment',
|
||||
id: 1
|
||||
}, {
|
||||
title: 'Article Recommendation',
|
||||
id: 2
|
||||
}, {
|
||||
title: 'Promotion',
|
||||
id: 3
|
||||
}],
|
||||
rules: {
|
||||
etitle: [{
|
||||
required: true,
|
||||
message: 'Please enter a template title',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
range: [{
|
||||
required: true,
|
||||
message: 'Please select a range',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
econtent: [{
|
||||
required: true,
|
||||
message: 'Please enter template content',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...',
|
||||
modules: {
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
['blockquote', 'code-block'],
|
||||
[{
|
||||
'header': 1
|
||||
}, {
|
||||
'header': 2
|
||||
}],
|
||||
[{
|
||||
'list': 'ordered'
|
||||
}, {
|
||||
'list': 'bullet'
|
||||
}],
|
||||
[{
|
||||
'script': 'sub'
|
||||
}, {
|
||||
'script': 'super'
|
||||
}],
|
||||
[{
|
||||
'indent': '-1'
|
||||
}, {
|
||||
'indent': '+1'
|
||||
}],
|
||||
[{
|
||||
'direction': 'rtl'
|
||||
}],
|
||||
[{
|
||||
'size': ['small', false, 'large', 'huge']
|
||||
}],
|
||||
[{
|
||||
'header': [1, 2, 3, 4, 5, 6, false]
|
||||
}],
|
||||
[{
|
||||
'color': []
|
||||
}, {
|
||||
'background': []
|
||||
}],
|
||||
[{
|
||||
'font': []
|
||||
}],
|
||||
[{
|
||||
'align': []
|
||||
}],
|
||||
['link']
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
},
|
||||
created: function() {
|
||||
this.getData();
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
//获取数据
|
||||
getData() {
|
||||
this.$api
|
||||
.post('api/Email/getAllEmailTemplate')
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.templates;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
// 添加操作
|
||||
add_Selection(index, row) {
|
||||
this.addVisible = true;
|
||||
},
|
||||
// 保存添加
|
||||
saveAdd(addForm) {
|
||||
this.$refs.add_Form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$api
|
||||
.post('api/Email/addEmailTemplate', this.addForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.addVisible = false;
|
||||
this.$refs.add_Form.resetFields();
|
||||
this.$message.success('Template added successfully!');
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 编辑操作
|
||||
handleEdit(row) {
|
||||
this.editForm = row
|
||||
this.editVisible = true
|
||||
},
|
||||
// 保存编辑
|
||||
saveEdit(editForm) {
|
||||
|
||||
},
|
||||
// 删除操作
|
||||
handleDelete(row) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure to delete this template "' + row.etitle + '"?', 'Tips', {
|
||||
distinguishCancelAndClose: true,
|
||||
confirmButtonText: 'OK',
|
||||
cancelButtonText: 'Cancel'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/Email/delEmailTemplate', row)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Delete succeeded!');
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
|
||||
// 富文本编辑器
|
||||
onEditorChange({
|
||||
editor,
|
||||
html,
|
||||
text
|
||||
}) {
|
||||
this.addForm.econtent = html;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.handle-box {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
</style>
|
||||
1090
src/components/page/disseMinate.vue
Normal file
1090
src/components/page/disseMinate.vue
Normal file
File diff suppressed because it is too large
Load Diff
1466
src/components/page/documentView.vue
Normal file
1466
src/components/page/documentView.vue
Normal file
File diff suppressed because it is too large
Load Diff
136
src/components/page/editApplyList.vue
Normal file
136
src/components/page/editApplyList.vue
Normal file
@@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Editorial board Apply list
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container">
|
||||
<el-table :data="tableData" border stripe class="table" ref="multipleTable"
|
||||
header-cell-class-name="table-header">
|
||||
<el-table-column label="No." align="center" width="50">
|
||||
<template slot-scope="scope">
|
||||
{{scope.$index+1}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title" label="Targeted Journal" width="300"></el-table-column>
|
||||
<el-table-column prop="account" label="Name"></el-table-column>
|
||||
<el-table-column prop="technical" label="Title"></el-table-column>
|
||||
<el-table-column prop="realname" label="Realname"></el-table-column>
|
||||
<el-table-column prop="email" label="Email"></el-table-column>
|
||||
<el-table-column label="Application Date" align="center" width="110">
|
||||
<template slot-scope="scope">
|
||||
{{formatDate(scope.row.ctime)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" width="120">
|
||||
<template slot-scope="scope">
|
||||
<p style="margin-bottom: 10px;">
|
||||
<el-button type="primary" plain icon="el-icon-user" @click="handleDtail(scope.row)">
|
||||
Detail
|
||||
</el-button>
|
||||
</p>
|
||||
<el-button type="danger" plain icon="el-icon-delete" @click="deleteApply(scope.row)">
|
||||
Delete
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
methods: {
|
||||
// 获取编委申请列表数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getBoardApplys', {
|
||||
editor_id: localStorage.getItem('U_id')
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.applys;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 删除
|
||||
deleteApply(e) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure you want to delete the apply?', 'Tip', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/User/delBoardApply', e)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Delete succeeded!');
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
|
||||
// 详情
|
||||
handleDtail(e) {
|
||||
let routerJump = this.$router.resolve({
|
||||
path: '/partyRole',
|
||||
query: {
|
||||
id: e.user_id
|
||||
}
|
||||
});
|
||||
window.open(routerJump.href, '_blank');
|
||||
|
||||
},
|
||||
|
||||
// 时间格式
|
||||
formatDate(timestamp) {
|
||||
var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘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;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
</style>
|
||||
194
src/components/page/man_article.vue
Normal file
194
src/components/page/man_article.vue
Normal file
@@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-document-copy"></i> <span class="top_dao"> Editor-in-Chief manuscripts list</span>
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container_l">
|
||||
<!-- 期刊下拉菜单 -->
|
||||
<el-select v-model="query.journal_id" filterable placeholder="Please select a journal" @change="getData"
|
||||
style="width: 300px;">
|
||||
<el-option v-for="item in cate_jour" :key="item.journal_id" :label="item.title"
|
||||
:value="item.journal_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.type" @change="getData()" placeholder="Please select status"
|
||||
style="width: 120px;margin-left: 10px;">
|
||||
<el-option :key="1" label="Dealing" :value="1"></el-option>
|
||||
<el-option :key="2" label="Finished" :value="2"></el-option>
|
||||
</el-select>
|
||||
<p style="float: right;color: #fb8c19;font-size: 14px;margin: 8px 20px 0 0;">From Aug. 2021-New manuscript
|
||||
system updated</p>
|
||||
<br><br>
|
||||
|
||||
<el-card class="box-card">
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable"
|
||||
header-cell-class-name="table-header" empty-text="New messages (0)">
|
||||
<el-table-column label="Manuscript ID" width="170" align="center">
|
||||
<template slot-scope="scope">
|
||||
<p style="margin-bottom: 5px;">{{scope.row.accept_sn}}</p>
|
||||
<router-link :to="{path:'/man_text_ls',query:{Art_id:scope.row.article_id}}">
|
||||
<el-button type="primary" icon="el-icon-tickets" plain>Detail</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title" label="Title"></el-table-column>
|
||||
<el-table-column prop="type" label="Type" width="120"></el-table-column>
|
||||
<el-table-column prop="major_str" label="Major" width="200"></el-table-column>
|
||||
<el-table-column prop="ctime" label="Submitted time" width="140" align="center"></el-table-column>
|
||||
<el-table-column prop="abstrart" label="Abstract">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.abstrart | ellipsis}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<div class="pagination">
|
||||
<el-pagination layout="total, prev, pager, next" :current-page="query.pageIndex"
|
||||
:page-size="query.pageSize" :total="link_Tota" @current-change="handlePageChange2">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
Direct_log: this.$route.query.act,
|
||||
head_line: "",
|
||||
tableData: [],
|
||||
query: {
|
||||
user_id: localStorage.getItem('U_id'),
|
||||
type: 2,
|
||||
pageIndex: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
link_Tota: 0,
|
||||
cate_jour: [],
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
if (this.Direct_log == null) {
|
||||
this.getTable();
|
||||
} else {
|
||||
this.$api
|
||||
.post('api/Chief/autoLoginForChief ', {
|
||||
'code': this.Direct_log
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
localStorage.setItem('U_role', res.data.roles);
|
||||
localStorage.setItem('U_name', res.data.user.account);
|
||||
localStorage.setItem('U_id', res.data.user.user_id);
|
||||
localStorage.setItem('U_relname', res.data.user.realname);
|
||||
this.getTable();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取期刊数据
|
||||
getTable() {
|
||||
this.$api
|
||||
.post('api/Chief/getJournalsFromChief', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.cate_jour = res.data.journals
|
||||
this.query.journal_id = this.cate_jour[0].journal_id;
|
||||
this.getData();
|
||||
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
// 获取列表数据
|
||||
getData() {
|
||||
let link_ty = ''
|
||||
if (this.query.type == 1) {
|
||||
link_ty = 'api/Chief/getPArticlesForChief'
|
||||
} else {
|
||||
link_ty = 'api/Chief/getHArticlesForChief'
|
||||
}
|
||||
this.$api
|
||||
.post(link_ty, this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.articles != '') {
|
||||
for (let i = 0; i < res.data.articles.length; i++) {
|
||||
let date = new Date(parseInt(res.data.articles[i].ctime) * 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();
|
||||
res.data.articles[i].ctime = Y + M + D;
|
||||
}
|
||||
}
|
||||
this.tableData = res.data.articles;
|
||||
this.link_Tota = res.data.count || 0;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 下拉
|
||||
getSelData(e) {
|
||||
if (e == 1) {
|
||||
|
||||
} else {
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
handlePageChange2(val) {
|
||||
this.$set(this.query, 'pageIndex', val);
|
||||
this.getData();
|
||||
},
|
||||
|
||||
},
|
||||
filters: {
|
||||
ellipsis(value) {
|
||||
if (!value) return "";
|
||||
if (value.length > 200) {
|
||||
value = value.slice(0, 200);
|
||||
return value.slice(0, value.lastIndexOf(" ")) + "...";
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
292
src/components/page/partyExte.vue
Normal file
292
src/components/page/partyExte.vue
Normal file
@@ -0,0 +1,292 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-message"></i> Mailbox template
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="handle-box">
|
||||
<el-input v-model="query.username" placeholder="Please enter" style="width: 200px;">
|
||||
</el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="getDate" style="margin-left: 10px;">Search
|
||||
</el-button>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd()" style="float: right;">
|
||||
Add mail template
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
|
||||
empty-text="New messages (0)">
|
||||
<el-table-column prop="realname" label="Title"></el-table-column>
|
||||
<el-table-column label=" " width="198" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button plain type="success" icon="el-icon-view" @click="handleView(scope.row)">Preview
|
||||
</el-button>
|
||||
<el-button plain type="primary" icon="el-icon-edit" @click="handleEdit(scope.row)">Edit
|
||||
</el-button>
|
||||
</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="link_Total" @current-change="handlePageChange">
|
||||
</el-pagination>
|
||||
</div>
|
||||
|
||||
<!-- 新建邮件弹出框 -->
|
||||
<el-dialog title="Add mail template" :visible.sync="addVisible" width="800px">
|
||||
<el-form ref="add_Tab" :model="addForm" :rules="rules" label-width="100px">
|
||||
<el-form-item label="Title :" prop="title">
|
||||
<el-input v-model="addForm.title"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="content">
|
||||
<quill-editor ref="myTextEditor" v-model="addForm.content" :options="editorOption">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="addVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEmail">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 编辑邮件弹出框 -->
|
||||
<el-dialog title="Edit mail template" :visible.sync="editVisible" width="800px">
|
||||
<el-form ref="edit_Tab" :model="editForm" :rules="rules" label-width="100px">
|
||||
<el-form-item label="Title :" prop="title">
|
||||
<el-input v-model="editForm.title"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="content">
|
||||
<quill-editor ref="myTextEditor" v-model="editForm.content" :options="editorOption">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="editVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="editEmail">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 预览邮件弹出框 -->
|
||||
<el-dialog title="Preview mail template" :visible.sync="viewVisible" width="800px">
|
||||
{{viewForm}}
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="viewVisible = false">Cancel</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'quill/dist/quill.core.css';
|
||||
import 'quill/dist/quill.snow.css';
|
||||
import 'quill/dist/quill.bubble.css';
|
||||
import {
|
||||
quillEditor
|
||||
} from 'vue-quill-editor';
|
||||
export default {
|
||||
name: 'partyList',
|
||||
data() {
|
||||
return {
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
userrole: localStorage.getItem('U_status'),
|
||||
guest_id: localStorage.getItem('U_id'),
|
||||
query: {
|
||||
role:0,
|
||||
username:'',
|
||||
pageIndex: 1,
|
||||
pageSize: 15,
|
||||
},
|
||||
tableData: [],
|
||||
link_Total: 0,
|
||||
addVisible: false,
|
||||
editVisible: false,
|
||||
viewVisible: false,
|
||||
addForm: {},
|
||||
editForm:{},
|
||||
viewForm:{},
|
||||
rules: {
|
||||
title: [{
|
||||
required: true,
|
||||
message: 'Please enter the title',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
content: [{
|
||||
required: true,
|
||||
message: 'Please enter the message content',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...',
|
||||
modules: {
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
['blockquote', 'code-block'],
|
||||
[{
|
||||
'header': 1
|
||||
}, {
|
||||
'header': 2
|
||||
}],
|
||||
[{
|
||||
'list': 'ordered'
|
||||
}, {
|
||||
'list': 'bullet'
|
||||
}],
|
||||
[{
|
||||
'script': 'sub'
|
||||
}, {
|
||||
'script': 'super'
|
||||
}],
|
||||
[{
|
||||
'indent': '-1'
|
||||
}, {
|
||||
'indent': '+1'
|
||||
}],
|
||||
[{
|
||||
'direction': 'rtl'
|
||||
}],
|
||||
[{
|
||||
'size': ['small', false, 'large', 'huge']
|
||||
}],
|
||||
[{
|
||||
'header': [1, 2, 3, 4, 5, 6, false]
|
||||
}],
|
||||
[{
|
||||
'color': []
|
||||
}, {
|
||||
'background': []
|
||||
}],
|
||||
[{
|
||||
'font': []
|
||||
}],
|
||||
[{
|
||||
'align': []
|
||||
}],
|
||||
['link']
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.getDate()
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getAllUser', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.users;
|
||||
this.link_Total = res.data.count || 0;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 添加邮件弹出
|
||||
handleAdd(){
|
||||
this.addVisible=true
|
||||
},
|
||||
|
||||
// 确定增加
|
||||
saveEmail() {
|
||||
this.$refs.add_Tab.validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 编辑邮件弹出
|
||||
handleEdit(e){
|
||||
this.editVisible=true
|
||||
this.editForm=e
|
||||
},
|
||||
|
||||
// 预览邮件弹出层
|
||||
handleView(e){
|
||||
this.viewVisible=true
|
||||
this.viewForm=e
|
||||
},
|
||||
|
||||
// 确定修改
|
||||
editEmail() {
|
||||
this.$refs.edit_Tab.validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
handlePageChange(val) {
|
||||
this.$set(this.query, 'pageIndex', val);
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
// 富文本编辑器
|
||||
onEditorChange({
|
||||
editor,
|
||||
html,
|
||||
text
|
||||
}) {
|
||||
this.content = html;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.el-button--primary.is-plain:hover {
|
||||
background-color: #409EFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.zhsoiuStyle {
|
||||
color: #006699;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.zhsoiuStyle:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.zhsoiuStyle i {
|
||||
margin-right: 3px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
889
src/components/page/partyListAct.vue
Normal file
889
src/components/page/partyListAct.vue
Normal file
@@ -0,0 +1,889 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Active Users
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="min-width: 1200px;">
|
||||
<div class="handle-box">
|
||||
<p class="titline" style="margin-top: 0;">
|
||||
Essential information
|
||||
<b class="el-icon-arrow-right" v-if="shoLosA==false" @click="shoLosA=true"></b>
|
||||
<b class="el-icon-arrow-down" v-if="shoLosA==true" @click="shoLosA=false"></b>
|
||||
</p>
|
||||
<div v-if="shoLosA">
|
||||
<div class="titSear titSelectAct">
|
||||
<span>Activity :</span>
|
||||
<el-radio-group v-model="query.role">
|
||||
<el-radio v-for="item in actList" :label="item.value">
|
||||
<img v-if="item.value!=0" src="../../assets/img/star-all.png" class="starSty">
|
||||
<span v-if="item.value!=0"> × </span>{{item.title}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Name/Email :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Hindex :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Country :</span>
|
||||
<el-select v-model="query.country">
|
||||
<el-option label="All country" :key="0" :value="0"></el-option>
|
||||
<el-option label="China" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="titSear titMoreInp">
|
||||
<span>Research direction :</span>
|
||||
<!-- <el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter" style="margin: 0 15px;">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input> -->
|
||||
<el-select v-model="query.major_a" placeholder="Please select major" @change="majorChange(1)">
|
||||
<el-option v-for="item in majors_a" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_b" placeholder="Please select major" v-if="majors_b!=''"
|
||||
@change="majorChange(2)" style="margin:0 15px;">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_b" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_c" placeholder="Please select major" v-if="majors_c!=''"
|
||||
@change="majorChange(3)">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_c" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btnSear">
|
||||
<el-button type="primary" icon="el-icon-search" @click="getDate"
|
||||
style="margin-left: 70px;padding: 10px 80px;">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button plain icon="el-icon-refresh" @click="getDate">
|
||||
Reset
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="float: right;margin-top: -65px;">
|
||||
<el-button type="warning" icon="el-icon-document" @click="handleSendAll">PROMOTION
|
||||
</el-button>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">Add User
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
|
||||
@selection-change="handleSelectionChange" :row-key="getRowKeys" empty-text="New messages (0)">
|
||||
<el-table-column type="selection" :reserve-selection="true" prop="user_id" width="45" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="Base Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_base">
|
||||
<span>Realname:</span><b>{{scope.row.realname}}</b>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Account:</span>{{scope.row.account}}
|
||||
</p>
|
||||
|
||||
<p class="tab_base">
|
||||
<span>Email:</span>{{scope.row.email}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Other Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_base">
|
||||
<span>Country:</span>{{scope.row.country}}
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Research direction:</span>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Institute:</span>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Activity:</span>
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="WOS Index" width="100px" 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 prop="" label="Google Index" width="110px" 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 label="Role" width="175px">
|
||||
<template slot-scope="scope">
|
||||
<p v-for="item in scope.row.roles" class="ro_li_ku">
|
||||
<font v-if="item=='author'">Author</font>
|
||||
<font v-if="item=='editor'">Editor</font>
|
||||
<font v-if="item=='chief'">Editor-in-Chief</font>
|
||||
<font v-if="item=='reviewer'">Reviewer</font>
|
||||
<font v-if="item=='board'">Editorial Board Member</font>
|
||||
<font v-if="item=='yboard'">Young Scientist Member</font>
|
||||
<font v-if="item=='special'">Guest Editor</font>
|
||||
</p>
|
||||
<br clear="both">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label=" " width="105" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button plain type="primary" icon="el-icon-discount" @click="handleRole(scope.row)">Detail
|
||||
</el-button>
|
||||
</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="link_Total" @current-change="handlePageChange">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 推广发送邮件弹出框 -->
|
||||
<el-dialog title="Send mail" :visible.sync="mailVisible" width="800px">
|
||||
<el-form ref="mail_Tab" :model="mailForm" :rules="rules" label-width="140px">
|
||||
<el-form-item label="User information :">
|
||||
<div v-for="(item,index) in mailForm.pooplist" v-if="index<mailForm.maxlist" class="poplSty">
|
||||
{{item.realname}} (<span style="color: #073a54;">{{item.email}}</span>)
|
||||
<i class="el-icon-delete" @click="delePopMail(index)"></i>
|
||||
</div>
|
||||
<p v-if="mailForm.pooplist.length>3&&mailForm.maxlist==3" @click="moreBtn('max')"
|
||||
class="zhsoiuStyle">
|
||||
<i class="el-icon-bottom"></i>more
|
||||
</p>
|
||||
<p v-if="mailForm.pooplist.length>3&&mailForm.maxlist>3" @click="moreBtn('min')"
|
||||
class="zhsoiuStyle">
|
||||
<i class="el-icon-top"></i>more
|
||||
</p>
|
||||
<p style="display: inline-block;margin: 0 0 0 20px;color: #999;" v-if="mailForm.pooplist.length>3">
|
||||
{{mailForm.pooplist.length}} in total
|
||||
</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Template :" prop="pem_id">
|
||||
<el-select v-model="mailForm.pem_id" filterable placeholder="请选择模板" @change="tem_plt">
|
||||
<el-option label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in formwork" :key="item.pem_id" :label="item.title" :value="item.pem_id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button type="warning" icon="el-icon-notebook-2" @click="add_Shutter" style="margin-left: 20px;">
|
||||
Template management</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="content">
|
||||
<quill-editor ref="myTextEditor" v-model="mailForm.content" :options="editorOption">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="mailVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="savSendmail">Send mail</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加用户邮箱验证弹出框 -->
|
||||
<el-dialog title="Check Account And Email" :visible.sync="emailVisible" width="450px">
|
||||
<el-form ref="emailTab" :model="emailForm" :rules="rules" label-width="90px">
|
||||
<el-form-item label="Account :" prop="account">
|
||||
<el-input v-model="emailForm.account"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :" prop="email">
|
||||
<el-input v-model="emailForm.email"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p v-if="email_num==1" style="margin: 0 0 0 100px;color: orangered;">
|
||||
<!-- 验证失败 -->
|
||||
{{emailForm.mark_new}}
|
||||
</p>
|
||||
<p v-if="email_num==2" style="margin: 0 0 0 100px;color: #006699;">
|
||||
<!-- 验证成功 -->
|
||||
Verification successful
|
||||
</p>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="emailVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEmail">Check</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加用户弹出框 -->
|
||||
<el-dialog title="Add User" :visible.sync="addVisible" width="550px">
|
||||
<el-form ref="addTab" :model="addForm" :rules="rules" label-width="150px">
|
||||
<el-form-item label="Account :" prop="account">
|
||||
{{addForm.account}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :" prop="email">
|
||||
{{addForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Password :" prop="password">
|
||||
<el-input v-model="addForm.password" type="password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Confirm password :" prop="repassword">
|
||||
<el-input v-model="addForm.repassword" type="password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Realname :" prop="realname">
|
||||
<el-input v-model="addForm.realname"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Phone :" prop="phone">
|
||||
<el-input v-model="addForm.phone"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="addVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveAdd">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'partyList',
|
||||
data() {
|
||||
return {
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
userrole: localStorage.getItem('U_status'),
|
||||
guest_id: localStorage.getItem('U_id'),
|
||||
tableData: [],
|
||||
multipleSelection: [],
|
||||
emailForm: {
|
||||
mark_new: ''
|
||||
},
|
||||
mailForm: {
|
||||
pooplist: [],
|
||||
maxlist: 3,
|
||||
pem_id: 0
|
||||
},
|
||||
formwork: {},
|
||||
actList: [{
|
||||
value: 0,
|
||||
title: 'All Grade'
|
||||
}, {
|
||||
value: 0.5,
|
||||
title: 0.5
|
||||
}, {
|
||||
value: 1,
|
||||
title: 1
|
||||
}, {
|
||||
value: 1.5,
|
||||
title: 1.5
|
||||
}, {
|
||||
value: 2,
|
||||
title: 2
|
||||
}, {
|
||||
value: 2.5,
|
||||
title: 2.5
|
||||
}, {
|
||||
value: 3,
|
||||
title: 3
|
||||
}, {
|
||||
value: 4,
|
||||
title: '3 more'
|
||||
}],
|
||||
addForm: {},
|
||||
query: {
|
||||
role: 0,
|
||||
activ: 0,
|
||||
journal: 1,
|
||||
country: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 15,
|
||||
username: '',
|
||||
major: '',
|
||||
major_a: '',
|
||||
major_b: '',
|
||||
major_c: '',
|
||||
},
|
||||
link_Total: 0,
|
||||
email_num: 0,
|
||||
emailVisible: false,
|
||||
addVisible: false,
|
||||
editVisible: false,
|
||||
shoLosA: true,
|
||||
mailVisible: false,
|
||||
majors_a: [],
|
||||
majors_b: [],
|
||||
majors_c: [],
|
||||
rules: {
|
||||
account: [{
|
||||
required: true,
|
||||
message: 'Please input account',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
email: [{
|
||||
required: true,
|
||||
message: 'Please input email',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^[-.-_A-Za-z0-9]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct email format"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
realname: [{
|
||||
required: true,
|
||||
message: 'Please input realname',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
phone: [{
|
||||
required: true,
|
||||
message: 'Please input phone',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^1[3456789]\d{9}$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct phone format!"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
password: [{
|
||||
required: true,
|
||||
validator: 'Please input password',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
repassword: [{
|
||||
required: true,
|
||||
validator: 'Please input password again',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
getRowKeys(row) {
|
||||
return row.user_id;
|
||||
},
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...',
|
||||
modules: {
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
['blockquote', 'code-block'],
|
||||
[{
|
||||
'header': 1
|
||||
}, {
|
||||
'header': 2
|
||||
}],
|
||||
[{
|
||||
'list': 'ordered'
|
||||
}, {
|
||||
'list': 'bullet'
|
||||
}],
|
||||
[{
|
||||
'script': 'sub'
|
||||
}, {
|
||||
'script': 'super'
|
||||
}],
|
||||
[{
|
||||
'indent': '-1'
|
||||
}, {
|
||||
'indent': '+1'
|
||||
}],
|
||||
[{
|
||||
'direction': 'rtl'
|
||||
}],
|
||||
[{
|
||||
'size': ['small', false, 'large', 'huge']
|
||||
}],
|
||||
[{
|
||||
'header': [1, 2, 3, 4, 5, 6, false]
|
||||
}],
|
||||
[{
|
||||
'color': []
|
||||
}, {
|
||||
'background': []
|
||||
}],
|
||||
[{
|
||||
'font': []
|
||||
}],
|
||||
[{
|
||||
'align': []
|
||||
}],
|
||||
['link']
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.getDate()
|
||||
this.initMajor()
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getAllUser', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.users;
|
||||
this.link_Total = res.data.count || 0;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 指数颜色
|
||||
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><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else if (num < 15) {
|
||||
str = '<b style="color:#cbb504">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else {
|
||||
str = '<b style="color:#0cbc15">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
}
|
||||
if (time == 0) {
|
||||
str =
|
||||
'<b style="color:#aaa;">0 </b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;">(No time)</span>'
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
// 多选表格
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
console.log(this.multipleSelection)
|
||||
},
|
||||
|
||||
// 发送群邮件弹出
|
||||
handleSendAll() {
|
||||
if (this.multipleSelection.length > 0) {
|
||||
this.mailForm.pooplist = JSON.parse(JSON.stringify(this.multipleSelection))
|
||||
this.mailForm.maxlist = 3
|
||||
this.mailForm.content = ''
|
||||
this.mailForm.pem_id = 0
|
||||
this.mailVisible = true
|
||||
} else {
|
||||
this.$message.error('Please select a person first!');
|
||||
}
|
||||
},
|
||||
|
||||
// 切换模板
|
||||
tem_plt(event) {
|
||||
|
||||
},
|
||||
|
||||
// 模板管理
|
||||
add_Shutter() {
|
||||
this.mailVisible = false
|
||||
this.$router.push({
|
||||
path: 'partyExte'
|
||||
});
|
||||
},
|
||||
|
||||
// 展开收缩
|
||||
moreBtn(e) {
|
||||
if (e == 'max') {
|
||||
this.mailForm.maxlist = this.mailForm.pooplist.length
|
||||
} else if (e == 'min') {
|
||||
this.mailForm.maxlist = 3
|
||||
}
|
||||
},
|
||||
|
||||
// 删除邮箱
|
||||
delePopMail(e) {
|
||||
this.mailForm.pooplist.splice(e, 1)
|
||||
},
|
||||
|
||||
// 确定发送
|
||||
savSendmail() {
|
||||
this.$refs.mail_Tab.validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 检测邮箱弹出框
|
||||
handleAdd() {
|
||||
this.email_num = 0
|
||||
this.emailVisible = true
|
||||
},
|
||||
|
||||
// 添加用户弹出框
|
||||
saveEmail() {
|
||||
this.$refs.emailTab.validate((valid) => {
|
||||
if (valid) {
|
||||
let Email_mark = 0
|
||||
let Accnt_mark = 0
|
||||
this.$api
|
||||
.post('api/User/checkUserByEmail', this.emailForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.has == 0) {
|
||||
Email_mark = 0
|
||||
} else {
|
||||
Email_mark = 1
|
||||
}
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.$api
|
||||
.post('api/User/checkUserByAccount', this.emailForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.has == 0) {
|
||||
Accnt_mark = 0
|
||||
} else {
|
||||
Accnt_mark = 1
|
||||
}
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
if (Email_mark == 1 && Accnt_mark == 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Email and account already exist!'
|
||||
} else if (Email_mark == 1 && Accnt_mark != 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Email already exist!'
|
||||
} else if (Email_mark != 1 && Accnt_mark == 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Account already exist!'
|
||||
} else {
|
||||
this.addForm.email = this.emailForm.email
|
||||
this.addForm.account = this.emailForm.account
|
||||
this.email_num = 2
|
||||
setTimeout(() => {
|
||||
this.emailVisible = false
|
||||
this.addVisible = true
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 保存添加用户
|
||||
saveAdd() {
|
||||
this.$refs.addTab.validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.addForm.password == this.addForm.repassword) {
|
||||
this.$api
|
||||
.post('api/User/addUser', this.addForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.addVisible = false
|
||||
this.$refs.addTab.resetFields()
|
||||
this.getDate()
|
||||
this.$message.success('User added successfully!');
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('The two passwords are inconsistent!');
|
||||
}
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 编辑身份跳页面
|
||||
handleRole(row) {
|
||||
this.$router.push({
|
||||
path: 'partyRole',
|
||||
query: {
|
||||
id: row.user_id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 领域
|
||||
initMajor() {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: 1
|
||||
}).then((res) => {
|
||||
this.majors_a = res.data.major.children;
|
||||
});
|
||||
},
|
||||
|
||||
majorChange(e) {
|
||||
if (e == 1) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_a
|
||||
}).then((res) => {
|
||||
this.majors_b = res.data.major.children;
|
||||
this.majors_c = []
|
||||
this.query.major_b = ''
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else if (e == 2 && this.query.major_b != 0) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_b
|
||||
}).then((res) => {
|
||||
this.majors_c = res.data.major.children;
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else {
|
||||
this.majorChange_panduan()
|
||||
}
|
||||
},
|
||||
|
||||
majorChange_panduan() {
|
||||
if (this.query.major_c != '' || this.query.major_c != 0) {
|
||||
this.query.major = this.query.major_c
|
||||
} else if (this.query.major_b != '' || this.query.major_b != 0) {
|
||||
this.query.major = this.query.major_b
|
||||
} else {
|
||||
this.query.major = this.query.major_a
|
||||
}
|
||||
// this.getDate()
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
handlePageChange(val) {
|
||||
this.$set(this.query, 'pageIndex', val);
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
// 富文本编辑器
|
||||
onEditorChange({
|
||||
editor,
|
||||
html,
|
||||
text
|
||||
}) {
|
||||
this.content = html;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
.el-button--primary.is-plain:hover {
|
||||
background-color: #409EFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.ro_li_ku {
|
||||
border: 1px solid #419fcf;
|
||||
border-radius: 5px;
|
||||
color: #419fcf;
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
padding: 0 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.titline {
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #c7dbf1;
|
||||
padding: 0 0 15px 0;
|
||||
margin: 10px 0 15px 0;
|
||||
}
|
||||
|
||||
.titline b {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
color: #006699;
|
||||
margin: 5px 10px 0 0;
|
||||
cursor: pointer;
|
||||
width: 1000px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
.titSear {
|
||||
width: 350px;
|
||||
margin-bottom: 18px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.titSear>span {
|
||||
color: #666;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 20px;
|
||||
width: 140px;
|
||||
text-align: right;
|
||||
font-size: 14px;
|
||||
margin: 0 15px 0 0;
|
||||
}
|
||||
|
||||
.titSear .el-select,
|
||||
.titSear .el-input {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
|
||||
.titSelectRole {
|
||||
display: block;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.titSelectAct {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.titMoreInp {
|
||||
width: 800px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.titMoreInp .el-select,
|
||||
.titMoreInp .el-input {
|
||||
width: 258px;
|
||||
}
|
||||
|
||||
|
||||
.titSearLong {
|
||||
width: 390px;
|
||||
}
|
||||
|
||||
.titSearLong>span {
|
||||
width: 165px;
|
||||
}
|
||||
|
||||
.titSearLong .el-select,
|
||||
.titSearLong .el-input {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.btnSear {
|
||||
text-align: center;
|
||||
margin: 0 0 30px 0;
|
||||
/* border-top: 1px solid #c7dbf1; */
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
.btnreset {
|
||||
float: right;
|
||||
color: #006699;
|
||||
font-size: 13px;
|
||||
margin: 12px 15px 0 0;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.btnreset:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btnreset i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
|
||||
.starSty {
|
||||
width: 18px;
|
||||
vertical-align: sub;
|
||||
}
|
||||
|
||||
.zhsoiuStyle {
|
||||
color: #006699;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.zhsoiuStyle:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.zhsoiuStyle i {
|
||||
margin-right: 3px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.poplSty i {
|
||||
margin: 0 0 0 15px;
|
||||
color: #e51818;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.tab_base {
|
||||
font-size: 15px;
|
||||
margin: 0 0 5px 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.tab_base>span {
|
||||
color: #888;
|
||||
margin: 0 5px 0 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
555
src/components/page/partyListCorr.vue
Normal file
555
src/components/page/partyListCorr.vue
Normal file
@@ -0,0 +1,555 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Author Database
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="handle-box">
|
||||
<el-select v-model="query.journal_id" placeholder="Please select a journal"
|
||||
@change="query.pageIndex = 1;getData()">
|
||||
<el-option v-for="item in jourList" :label="item.title" :key="item.journal_id"
|
||||
:value="item.journal_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.year" placeholder="Please select a year"
|
||||
@change="query.pageIndex = 1;getData()" style="margin: 0 0 0 15px;width: 100px;">
|
||||
<el-option v-for="item in yearList" :label="item.title" :key="item.year" :value="item.year">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-input v-model="query.keywords" placeholder="Account / Realname / Email"
|
||||
style="width: 240px;margin: 0 15px;">
|
||||
</el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="query.pageIndex = 1;getData()">Search
|
||||
</el-button>
|
||||
<p style="height: 20px;"></p>
|
||||
<span style="font-size: 14px;color: #606266;margin: 0 10px 0 0;">Research direction :</span>
|
||||
<el-select v-model="query.major_a" placeholder="Please select major" @change="majorChange(1)"
|
||||
style="width: 240px;margin: 0 10px 0 0;">
|
||||
<el-option :key="0" label="All major" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_a" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_b" placeholder="Please select major" v-if="majors_b!=''"
|
||||
@change="majorChange(2)" style="width: 240px;margin:0 10px 0 0;">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_b" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_c" placeholder="Please select major" v-if="majors_c!=''"
|
||||
@change="majorChange(3)" style="width: 240px;margin:0 10px 0 0;">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_c" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
|
||||
empty-text="Messages (0)">
|
||||
<el-table-column label="Base Information" width="250px">
|
||||
<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>Email: </span>{{scope.row.email}}
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Title: </span>{{scope.row.technical}}
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>H-WOS: </span>
|
||||
<font v-html="colorIndex(scope.row.wos_index,scope.row.wos_time)"></font>
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>H-Google: </span>
|
||||
<font v-html="colorIndex(scope.row.google_index,scope.row.google_time)"></font>
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.starList_mark!=0">
|
||||
<span>Grade: </span>
|
||||
<font style="display: inline-block;">
|
||||
<img src="../../assets/img/star-all.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==1" class="starSty">
|
||||
<img src="../../assets/img/star-traf.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==0" class="starSty">
|
||||
<img src="../../assets/img/star-none.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==2" class="starSty">
|
||||
<img src="../../assets/img/star-all.png" v-if="scope.row.starList_mark>8"
|
||||
class="starSty">
|
||||
<b style="font-size: 15px;color: #b77614;" v-if="scope.row.starList_mark>8">×
|
||||
{{scope.row.starList_mark}}</b>
|
||||
</font>
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Other Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_tie_col" v-if="scope.row.field!=''&&scope.row.field!=null">
|
||||
<span>Field: </span>{{scope.row.field}}
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.major_str!=''&&scope.row.major_str!=null">
|
||||
<span>Major: </span>{{scope.row.major_str}}
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.company!=''&&scope.row.company!=null">
|
||||
<span>Affiliation: </span>{{scope.row.company}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Article List" width="280" :key="Math.random()">
|
||||
<template slot-scope="scope">
|
||||
<!-- <div class="iss_vol">
|
||||
<el-popover placement="top-start" width="300" trigger="hover">
|
||||
<p class="tipck">
|
||||
<b>{{scope.row.realname}}</b>
|
||||
</p>
|
||||
<p class="tipck" style="margin: 5px 0pt;">
|
||||
<b style="letter-spacing: -0.5px;color: #006699;">25 March 2023, Volume 5 Issue
|
||||
1</b>
|
||||
</p>
|
||||
<p class="tipck" style="margin: 10px 0;word-wrap: break-word;word-break: normal;">
|
||||
{{scope.row.field}}
|
||||
</p>
|
||||
<span slot="reference">
|
||||
25 March 2023, Volume 5 Issue 1
|
||||
</span>
|
||||
</el-popover>
|
||||
</div> -->
|
||||
<div class="iss_vol" v-for="(item,index) in scope.row.art_detail"
|
||||
v-if="index<scope.row.art_detail_num" @click="openActicle(item)">
|
||||
<b style="margin-right: 2px;">{{item.journal_abbr}}</b>: {{item.doi}}
|
||||
<font v-if="item.doi==''">Link</font>
|
||||
</div>
|
||||
<p class="moreShrink" v-if="scope.row.art_detail.length>5&&scope.row.art_detail_num==5"
|
||||
@click="moreShrink(scope,1)">
|
||||
<i class="el-icon-bottom"></i>
|
||||
More
|
||||
</p>
|
||||
<p class="moreShrink" v-if="scope.row.art_detail.length>5&&scope.row.art_detail_num!=5"
|
||||
@click="moreShrink(scope,0)">
|
||||
<i class="el-icon-top"></i>
|
||||
More
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Remarks" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.remark}}
|
||||
<b @click="BoxRemark(scope.row)" style="margin-left:10px;cursor: pointer;color:#006699;"
|
||||
class="el-icon-edit"></b>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="" width="105" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary" plain icon="el-icon-edit" @click="handleDtail(scope.row)">
|
||||
Detail
|
||||
</el-button>
|
||||
</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="link_Total" @current-change="handlePageChange"></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 标记弹出框 -->
|
||||
<el-dialog title="Remarks" :visible.sync="remarkBox" width="550px">
|
||||
<el-form ref="remark" :model="remarkMes" label-width="95px">
|
||||
<el-form-item label="Reviewer :">
|
||||
<p style="line-height: 20px;margin-top: 6px;">{{remarkMes.realname}}</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
<p style="line-height: 20px;margin-top: 6px;">{{remarkMes.email}}</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :">
|
||||
<el-input type="textarea" rows="5" v-model="remarkMes.remark"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="remarkBox = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveRemark">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
query: {
|
||||
journal_id: '',
|
||||
year: 0,
|
||||
keywords: '',
|
||||
pageIndex: 1,
|
||||
pageSize: 15,
|
||||
major: 0,
|
||||
major_a: 0,
|
||||
major_b: '',
|
||||
major_c: '',
|
||||
},
|
||||
edit_id: localStorage.getItem('U_id'),
|
||||
tableData: [],
|
||||
link_Total: 0,
|
||||
jourList: [],
|
||||
yearList: [{
|
||||
title: 'All years',
|
||||
year: 0
|
||||
}],
|
||||
majors_a: [],
|
||||
majors_b: [],
|
||||
majors_c: [],
|
||||
remarkMes: {
|
||||
remark: ''
|
||||
},
|
||||
remarkBox: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getJournal();
|
||||
this.initMajor()
|
||||
},
|
||||
methods: {
|
||||
// 获取期刊列表数据
|
||||
getJournal() {
|
||||
this.$api
|
||||
.post('api/Chief/getJournalsByEditor', {
|
||||
'user_id': this.edit_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.jourList = res.data.journals;
|
||||
this.query.journal_id = this.jourList[0].journal_id
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
|
||||
for (var i = 2015; i <= new Date().getFullYear(); i++) {
|
||||
this.yearList.push({
|
||||
title: i,
|
||||
year: i
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
getData() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Loading...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
this.$api
|
||||
.post('api/User/getAuthorUserList', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.list;
|
||||
for (var i = 0; i < this.tableData.length; i++) {
|
||||
this.getScoreData(i, this.tableData[i].score)
|
||||
if (this.tableData[i].art_detail.length > 5) {
|
||||
this.tableData[i].art_detail_num = 5
|
||||
} else {
|
||||
this.tableData[i].art_detail_num = this.tableData[i].art_detail.length
|
||||
}
|
||||
}
|
||||
this.link_Total = res.data.count || 0;
|
||||
loading.close()
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
loading.close()
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
loading.close()
|
||||
});
|
||||
},
|
||||
|
||||
// 文章跳转
|
||||
openActicle(e) {
|
||||
window.open(e.link, '_blank');
|
||||
},
|
||||
|
||||
// 文章展开收缩
|
||||
moreShrink(e, m) {
|
||||
if (m == 1) {
|
||||
this.tableData[e.$index].art_detail_num = this.tableData[e.$index].art_detail.length
|
||||
} else if (m == 0) {
|
||||
this.tableData[e.$index].art_detail_num = 5
|
||||
}
|
||||
console.log(this.tableData[e.$index])
|
||||
console.log(this.tableData[e.$index].art_detail_num)
|
||||
|
||||
this.$forceUpdate()
|
||||
|
||||
},
|
||||
|
||||
// 评分
|
||||
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)
|
||||
}
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
handlePageChange(val) {
|
||||
this.$set(this.query, 'pageIndex', val);
|
||||
this.getData();
|
||||
},
|
||||
|
||||
// 详情
|
||||
handleDtail(e) {
|
||||
let routerJump = this.$router.resolve({
|
||||
path: '/partyRole',
|
||||
query: {
|
||||
id: e.user_id
|
||||
}
|
||||
});
|
||||
window.open(routerJump.href, '_blank');
|
||||
},
|
||||
|
||||
// 标记弹出框
|
||||
BoxRemark(e) {
|
||||
this.remarkBox = true;
|
||||
this.remarkMes.realname = e.realname;
|
||||
this.remarkMes.user_id = e.user_id;
|
||||
this.remarkMes.email = e.email;
|
||||
this.remarkMes.remark = e.remark;
|
||||
},
|
||||
|
||||
// 修改标记
|
||||
saveRemark() {
|
||||
this.$api
|
||||
.post('api/User/editRemarkForUser', this.remarkMes)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Success');
|
||||
this.remarkBox = false;
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 领域
|
||||
initMajor() {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: 1
|
||||
}).then((res) => {
|
||||
this.majors_a = res.data.major.children;
|
||||
});
|
||||
},
|
||||
|
||||
// 搜索选择领域
|
||||
majorChange(e) {
|
||||
if (e == 1) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_a
|
||||
}).then((res) => {
|
||||
this.majors_b = res.data.major.children;
|
||||
this.majors_c = []
|
||||
this.query.major_b = ''
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else if (e == 2 && this.query.major_b != 0) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_b
|
||||
}).then((res) => {
|
||||
this.majors_c = res.data.major.children;
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else {
|
||||
this.majorChange_panduan()
|
||||
}
|
||||
},
|
||||
|
||||
majorChange_panduan() {
|
||||
if (this.query.major_c != '' || this.query.major_c != 0) {
|
||||
this.query.major = this.query.major_c
|
||||
} else if (this.query.major_b != '' || this.query.major_b != 0) {
|
||||
this.query.major = this.query.major_b
|
||||
} else {
|
||||
this.query.major = this.query.major_a
|
||||
}
|
||||
this.query.pageIndex = 1
|
||||
this.getData();
|
||||
},
|
||||
|
||||
// 指数颜色
|
||||
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:10px;">(' + time +
|
||||
')</span>'
|
||||
} else if (num < 15) {
|
||||
str = '<b style="color:#cbb504">' + num +
|
||||
'</b><span style="color:#aaa;font-size:14px;margin-left:10px;">(' + time +
|
||||
')</span>'
|
||||
} else {
|
||||
str = '<b style="color:#0cbc15">' + num +
|
||||
'</b><span style="color:#aaa;font-size:14px;margin-left:10px;">(' + time +
|
||||
')</span>'
|
||||
}
|
||||
if (time == 0) {
|
||||
str =
|
||||
'<b style="color:#aaa;">0</b><span style="color:#aaa;font-size:14px;margin-left:10px;">(No time)</span>'
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
// 时间格式
|
||||
formatDate(timestamp) {
|
||||
var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘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;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.table-td-thumb {
|
||||
display: block;
|
||||
margin: auto;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.el-table .warning-row {
|
||||
background: #f3ca7f;
|
||||
}
|
||||
|
||||
.el-table .success-row {
|
||||
background: #bcfc9a;
|
||||
}
|
||||
|
||||
.el-table .normol-row {
|
||||
background: #d8f1c7;
|
||||
}
|
||||
|
||||
.el-table .red-row {
|
||||
background: #f05555;
|
||||
}
|
||||
|
||||
.tab_tie_col {
|
||||
margin-bottom: 5px;
|
||||
color: #333;
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.tab_tie_col>span {
|
||||
color: #888;
|
||||
margin: 0 5px 0 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.starSty {
|
||||
width: 18px;
|
||||
margin-right: 4px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
.starSty:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
|
||||
.txt_pdf {
|
||||
margin: 0 0 20px 10px;
|
||||
display: inline-block;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.txt_pdf>i {
|
||||
color: #66a9f0;
|
||||
font-weight: bold;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.iss_vol {
|
||||
/* color: #006699; */
|
||||
margin: 5px 0;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.iss_vol:hover {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.moreShrink {
|
||||
text-align: right;
|
||||
color: #006699;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.moreShrink:hover {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
684
src/components/page/partyListIna.vue
Normal file
684
src/components/page/partyListIna.vue
Normal file
@@ -0,0 +1,684 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Inactive Users
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="min-width: 1200px;">
|
||||
<div class="handle-box">
|
||||
<p class="titline" style="margin-top: 0;">
|
||||
Essential information
|
||||
<b class="el-icon-arrow-right" v-if="shoLosA==false" @click="shoLosA=true"></b>
|
||||
<b class="el-icon-arrow-down" v-if="shoLosA==true" @click="shoLosA=false"></b>
|
||||
</p>
|
||||
<div v-if="shoLosA">
|
||||
<div class="titSear">
|
||||
<span>Name/Email :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Hindex :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Country :</span>
|
||||
<el-select v-model="query.country">
|
||||
<el-option label="All country" :key="0" :value="0"></el-option>
|
||||
<el-option label="China" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="titSear titMoreInp">
|
||||
<span>Research direction :</span>
|
||||
<!-- <el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter" style="margin: 0 15px;">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input> -->
|
||||
<el-select v-model="query.major_a" placeholder="Please select major" @change="majorChange(1)">
|
||||
<el-option v-for="item in majors_a" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_b" placeholder="Please select major" v-if="majors_b!=''"
|
||||
@change="majorChange(2)" style="margin:0 15px;">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_b" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.major_c" placeholder="Please select major" v-if="majors_c!=''"
|
||||
@change="majorChange(3)">
|
||||
<el-option :key="0" label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in majors_c" :key="item.major_id" :label="item.major_title"
|
||||
:value="item.major_id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btnSear">
|
||||
<el-button type="primary" icon="el-icon-search" @click="getDate"
|
||||
style="margin-left: 70px;padding: 10px 80px;">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button plain icon="el-icon-refresh" @click="getDate">
|
||||
Reset
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="float: right;margin-top: -65px;">
|
||||
<el-button type="warning" icon="el-icon-document" @click="handleSendAll">PROMOTION
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
|
||||
@selection-change="handleSelectionChange" :row-key="getRowKeys" empty-text="New messages (0)">
|
||||
<el-table-column type="selection" :reserve-selection="true" prop="user_id" width="45" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="Base Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_base">
|
||||
<span>Realname:</span><b>{{scope.row.realname}}</b>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Account:</span>{{scope.row.account}}
|
||||
</p>
|
||||
|
||||
<p class="tab_base">
|
||||
<span>Email:</span>{{scope.row.email}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Other Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_base">
|
||||
<span>Country:</span>{{scope.row.country}}
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Research direction:</span>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Institute:</span>
|
||||
</p>
|
||||
<p class="tab_base">
|
||||
<span>Activity:</span>
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="WOS Index" width="100px" 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 prop="" label="Google Index" width="110px" 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 label="Role" width="175px">
|
||||
<template slot-scope="scope">
|
||||
<p v-for="item in scope.row.roles" class="ro_li_ku">
|
||||
<font v-if="item=='author'">Author</font>
|
||||
<font v-if="item=='editor'">Editor</font>
|
||||
<font v-if="item=='chief'">Editor-in-Chief</font>
|
||||
<font v-if="item=='reviewer'">Reviewer</font>
|
||||
<font v-if="item=='board'">Editorial Board Member</font>
|
||||
<font v-if="item=='yboard'">Young Scientist Member</font>
|
||||
<font v-if="item=='special'">Guest Editor</font>
|
||||
</p>
|
||||
<br clear="both">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label=" " width="105" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button plain type="primary" icon="el-icon-discount" @click="handleRole(scope.row)">Detail
|
||||
</el-button>
|
||||
</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="link_Total" @current-change="handlePageChange">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 推广发送邮件弹出框 -->
|
||||
<el-dialog title="Send mail" :visible.sync="mailVisible" width="800px">
|
||||
<el-form ref="mail_Tab" :model="mailForm" :rules="rules" label-width="140px">
|
||||
<el-form-item label="User information :">
|
||||
<div class="poplSty">
|
||||
<div v-for="(item,index) in mailForm.pooplist">
|
||||
{{item.realname}} (<span style="color: #073a54;">{{item.email}}</span>)
|
||||
<i class="el-icon-delete" @click="delePopMail(index)"></i>
|
||||
</div>
|
||||
</div>
|
||||
<p style="color: #006699;text-align: right;" v-if="mailForm.pooplist.length>3">
|
||||
{{mailForm.pooplist.length}} in total
|
||||
</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Template :" prop="pem_id">
|
||||
<el-select v-model="mailForm.pem_id" filterable placeholder="请选择模板" @change="tem_plt">
|
||||
<el-option label="None" :value="0"></el-option>
|
||||
<el-option v-for="item in formwork" :key="item.pem_id" :label="item.title" :value="item.pem_id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button type="warning" icon="el-icon-notebook-2" @click="add_Shutter" style="margin-left: 20px;">
|
||||
Template management</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :" prop="content">
|
||||
<quill-editor ref="myTextEditor" v-model="mailForm.content" :options="editorOption">
|
||||
</quill-editor>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="mailVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="savSendmail">Send mail</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'partyList',
|
||||
data() {
|
||||
return {
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
userrole: localStorage.getItem('U_status'),
|
||||
guest_id: localStorage.getItem('U_id'),
|
||||
tableData: [],
|
||||
multipleSelection: [],
|
||||
mailForm: {
|
||||
pooplist: [],
|
||||
pem_id: 0
|
||||
},
|
||||
formwork: {},
|
||||
query: {
|
||||
role: 0,
|
||||
activ: 0,
|
||||
journal: 1,
|
||||
country: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 15,
|
||||
username: '',
|
||||
major: '',
|
||||
major_a: '',
|
||||
major_b: '',
|
||||
major_c: '',
|
||||
},
|
||||
link_Total: 0,
|
||||
shoLosA: true,
|
||||
mailVisible: false,
|
||||
majors_a: [],
|
||||
majors_b: [],
|
||||
majors_c: [],
|
||||
rules: {
|
||||
account: [{
|
||||
required: true,
|
||||
message: 'Please input account',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
email: [{
|
||||
required: true,
|
||||
message: 'Please input email',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^[-.-_A-Za-z0-9]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct email format"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
realname: [{
|
||||
required: true,
|
||||
message: 'Please input realname',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
phone: [{
|
||||
required: true,
|
||||
message: 'Please input phone',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^1[3456789]\d{9}$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct phone format!"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
password: [{
|
||||
required: true,
|
||||
validator: 'Please input password',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
repassword: [{
|
||||
required: true,
|
||||
validator: 'Please input password again',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
getRowKeys(row) {
|
||||
return row.user_id;
|
||||
},
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...',
|
||||
modules: {
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
['blockquote', 'code-block'],
|
||||
[{
|
||||
'header': 1
|
||||
}, {
|
||||
'header': 2
|
||||
}],
|
||||
[{
|
||||
'list': 'ordered'
|
||||
}, {
|
||||
'list': 'bullet'
|
||||
}],
|
||||
[{
|
||||
'script': 'sub'
|
||||
}, {
|
||||
'script': 'super'
|
||||
}],
|
||||
[{
|
||||
'indent': '-1'
|
||||
}, {
|
||||
'indent': '+1'
|
||||
}],
|
||||
[{
|
||||
'direction': 'rtl'
|
||||
}],
|
||||
[{
|
||||
'size': ['small', false, 'large', 'huge']
|
||||
}],
|
||||
[{
|
||||
'header': [1, 2, 3, 4, 5, 6, false]
|
||||
}],
|
||||
[{
|
||||
'color': []
|
||||
}, {
|
||||
'background': []
|
||||
}],
|
||||
[{
|
||||
'font': []
|
||||
}],
|
||||
[{
|
||||
'align': []
|
||||
}],
|
||||
['link']
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.getDate()
|
||||
this.initMajor()
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getAllUser', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.users;
|
||||
this.link_Total = res.data.count || 0;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 指数颜色
|
||||
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><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else if (num < 15) {
|
||||
str = '<b style="color:#cbb504">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else {
|
||||
str = '<b style="color:#0cbc15">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
}
|
||||
if (time == 0) {
|
||||
str =
|
||||
'<b style="color:#aaa;">0 </b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;">(No time)</span>'
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
// 多选表格
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
console.log(this.multipleSelection)
|
||||
},
|
||||
|
||||
// 发送群邮件弹出
|
||||
handleSendAll() {
|
||||
if (this.multipleSelection.length > 0) {
|
||||
this.mailForm.pooplist = JSON.parse(JSON.stringify(this.multipleSelection))
|
||||
this.mailForm.content = ''
|
||||
this.mailForm.pem_id = 0
|
||||
this.mailVisible = true
|
||||
} else {
|
||||
this.$message.error('Please select a person first!');
|
||||
}
|
||||
},
|
||||
|
||||
// 切换模板
|
||||
tem_plt(event) {
|
||||
|
||||
},
|
||||
|
||||
// 模板管理
|
||||
add_Shutter() {
|
||||
this.mailVisible = false
|
||||
this.$router.push({
|
||||
path: 'partyExte'
|
||||
});
|
||||
},
|
||||
|
||||
// 删除邮箱
|
||||
delePopMail(e) {
|
||||
this.mailForm.pooplist.splice(e, 1)
|
||||
},
|
||||
|
||||
// 确定发送
|
||||
savSendmail() {
|
||||
this.$refs.mail_Tab.validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 编辑身份跳页面
|
||||
handleRole(row) {
|
||||
this.$router.push({
|
||||
path: 'partyRole',
|
||||
query: {
|
||||
id: row.user_id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 领域
|
||||
initMajor() {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: 1
|
||||
}).then((res) => {
|
||||
this.majors_a = res.data.major.children;
|
||||
});
|
||||
},
|
||||
|
||||
majorChange(e) {
|
||||
if (e == 1) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_a
|
||||
}).then((res) => {
|
||||
this.majors_b = res.data.major.children;
|
||||
this.majors_c = []
|
||||
this.query.major_b = ''
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else if (e == 2 && this.query.major_b != 0) {
|
||||
this.$api
|
||||
.post('api/Ucenter/getMajor', {
|
||||
major_id: this.query.major_b
|
||||
}).then((res) => {
|
||||
this.majors_c = res.data.major.children;
|
||||
this.query.major_c = ''
|
||||
this.majorChange_panduan()
|
||||
});
|
||||
} else {
|
||||
this.majorChange_panduan()
|
||||
}
|
||||
},
|
||||
|
||||
majorChange_panduan() {
|
||||
if (this.query.major_c != '' || this.query.major_c != 0) {
|
||||
this.query.major = this.query.major_c
|
||||
} else if (this.query.major_b != '' || this.query.major_b != 0) {
|
||||
this.query.major = this.query.major_b
|
||||
} else {
|
||||
this.query.major = this.query.major_a
|
||||
}
|
||||
// this.getDate()
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
handlePageChange(val) {
|
||||
this.$set(this.query, 'pageIndex', val);
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
// 富文本编辑器
|
||||
onEditorChange({
|
||||
editor,
|
||||
html,
|
||||
text
|
||||
}) {
|
||||
this.content = html;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
.el-button--primary.is-plain:hover {
|
||||
background-color: #409EFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.ro_li_ku {
|
||||
border: 1px solid #419fcf;
|
||||
border-radius: 5px;
|
||||
color: #419fcf;
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
padding: 0 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.titline {
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #c7dbf1;
|
||||
padding: 0 0 15px 0;
|
||||
margin: 10px 0 15px 0;
|
||||
}
|
||||
|
||||
.titline b {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
color: #006699;
|
||||
margin: 5px 10px 0 0;
|
||||
cursor: pointer;
|
||||
width: 1000px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
.titSear {
|
||||
width: 350px;
|
||||
margin-bottom: 18px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.titSear>span {
|
||||
color: #666;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 20px;
|
||||
width: 140px;
|
||||
text-align: right;
|
||||
font-size: 14px;
|
||||
margin: 0 15px 0 0;
|
||||
}
|
||||
|
||||
.titSear .el-select,
|
||||
.titSear .el-input {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
|
||||
.titSelectRole {
|
||||
display: block;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.titSelectAct {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.titMoreInp {
|
||||
width: 800px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.titMoreInp .el-select,
|
||||
.titMoreInp .el-input {
|
||||
width: 258px;
|
||||
}
|
||||
|
||||
|
||||
.titSearLong {
|
||||
width: 390px;
|
||||
}
|
||||
|
||||
.titSearLong>span {
|
||||
width: 165px;
|
||||
}
|
||||
|
||||
.titSearLong .el-select,
|
||||
.titSearLong .el-input {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.btnSear {
|
||||
text-align: center;
|
||||
margin: 0 0 30px 0;
|
||||
/* border-top: 1px solid #c7dbf1; */
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
.btnreset {
|
||||
float: right;
|
||||
color: #006699;
|
||||
font-size: 13px;
|
||||
margin: 12px 15px 0 0;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.btnreset:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btnreset i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
|
||||
.starSty {
|
||||
width: 18px;
|
||||
vertical-align: sub;
|
||||
}
|
||||
|
||||
.zhsoiuStyle {
|
||||
color: #006699;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.zhsoiuStyle:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.zhsoiuStyle i {
|
||||
margin-right: 3px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.poplSty {
|
||||
max-height: 160px;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid #ccc;
|
||||
padding: 5px 15px;
|
||||
}
|
||||
|
||||
.poplSty div i {
|
||||
margin: 0 0 0 15px;
|
||||
color: #e51818;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.tab_base {
|
||||
font-size: 15px;
|
||||
margin: 0 0 5px 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.tab_base>span {
|
||||
color: #888;
|
||||
margin: 0 5px 0 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
726
src/components/page/partyListIna_.vue
Normal file
726
src/components/page/partyListIna_.vue
Normal file
@@ -0,0 +1,726 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Active Users
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="min-width: 1200px;">
|
||||
<div class="handle-box">
|
||||
<p class="titline" style="margin-top: 0;">
|
||||
Essential information
|
||||
<b class="el-icon-arrow-right" v-if="shoLosA==false" @click="shoLosA=true"></b>
|
||||
<b class="el-icon-arrow-down" v-if="shoLosA==true" @click="shoLosA=false"></b>
|
||||
</p>
|
||||
<div v-if="shoLosA">
|
||||
<div class="titSear titSelectRole">
|
||||
<span>Role :</span>
|
||||
<el-radio-group v-model="query.role">
|
||||
<el-radio v-for="item in roleList" :label="item.value">{{item.title}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Name/Email :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Hindex :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear">
|
||||
<span>Country :</span>
|
||||
<el-select v-model="query.country">
|
||||
<el-option label="All country" :key="0" :value="0"></el-option>
|
||||
<el-option label="China" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<p class="titline">
|
||||
Grade estimation
|
||||
<b class="el-icon-arrow-right" v-if="shoLosB==false" @click="shoLosB=true"></b>
|
||||
<b class="el-icon-arrow-down" v-if="shoLosB==true" @click="shoLosB=false"></b>
|
||||
</p>
|
||||
<div v-if="shoLosB">
|
||||
<div class="titSear titSelectAct">
|
||||
<span>Activity :</span>
|
||||
<el-radio-group v-model="query.role">
|
||||
<el-radio v-for="item in actList" :label="item.value">{{item.title}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
|
||||
<div class="titSear titMoreInp">
|
||||
<span>Direction :</span>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter" style="margin: 0 15px;">
|
||||
</el-input>
|
||||
<el-input v-model="query.username" placeholder="Please enter">
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<p class="titline">
|
||||
Release quantity
|
||||
<b class="el-icon-arrow-right" v-if="shoLosC==false" @click="shoLosC=true"></b>
|
||||
<b class="el-icon-arrow-down" v-if="shoLosC==true" @click="shoLosC=false"></b>
|
||||
</p>
|
||||
<div v-if="shoLosC">
|
||||
<div class="titSear titSearLong">
|
||||
<span>Publications Number :</span>
|
||||
<el-input-number :min="0" v-model="query.Hindex"></el-input-number>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear titSearLong">
|
||||
<span>Publication Journals :</span>
|
||||
<el-select v-model="query.journal">
|
||||
<el-option label="All journals" :key="0" :value="0"></el-option>
|
||||
<el-option label="TMR Non-Drug Therapy" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<br>
|
||||
<div class="titSear titSearLong">
|
||||
<span>Reviewed Number :</span>
|
||||
<el-input-number :min="0" v-model="query.Hindex"></el-input-number>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="titSear titSearLong">
|
||||
<span>Reviewed Journals :</span>
|
||||
<el-select v-model="query.journal">
|
||||
<el-option label="All journals" :key="0" :value="0"></el-option>
|
||||
<el-option label="TMR Non-Drug Therapy" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<br>
|
||||
<div class="titSear titSearLong">
|
||||
<span>Indexed Number :</span>
|
||||
<el-input-number :min="0" v-model="query.Hindex"></el-input-number>
|
||||
</div>
|
||||
<div class="titSear titSearLong">
|
||||
<span>Indexed Journals :</span>
|
||||
<el-select v-model="query.journal">
|
||||
<el-option label="All journals" :key="0" :value="0"></el-option>
|
||||
<el-option label="TMR Non-Drug Therapy" :key="1" :value="1"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="btnSear">
|
||||
<el-button type="primary" icon="el-icon-search" @click="getDate"
|
||||
style="margin-left: 70px;padding: 10px 80px;">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button plain icon="el-icon-refresh" @click="getDate">
|
||||
Reset
|
||||
</el-button>
|
||||
|
||||
</div>
|
||||
<div style="float: right;margin-top: -65px;">
|
||||
<el-button type="warning" icon="el-icon-document" @click="handlePopu">Popularize
|
||||
</el-button>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">Add User
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
|
||||
empty-text="New messages (0)">
|
||||
<el-table-column prop="account" label="Account" v-if="this.userrole == 0"></el-table-column>
|
||||
<el-table-column prop="realname" label="Realname"></el-table-column>
|
||||
<el-table-column prop="email" label="Email" v-if="this.userrole == 0"></el-table-column>
|
||||
<el-table-column prop="" label="WOS Index" width="120px" 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 prop="" label="Google Index" width="120px" 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 label="Role" width="305px">
|
||||
<template slot-scope="scope">
|
||||
<p v-for="item in scope.row.roles" class="ro_li_ku">
|
||||
<font v-if="item=='author'">Author</font>
|
||||
<font v-if="item=='editor'">Editor</font>
|
||||
<font v-if="item=='chief'">Editor-in-Chief</font>
|
||||
<font v-if="item=='reviewer'">Reviewer</font>
|
||||
<font v-if="item=='board'">Editorial Board Member</font>
|
||||
<font v-if="item=='yboard'">Young Scientist Member</font>
|
||||
<font v-if="item=='special'">Guest Editor</font>
|
||||
</p>
|
||||
<br clear="both">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label=" " width="290" align="center">
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button plain type="primary" icon="el-icon-edit" @click="handleEdit(scope.row)">Edit Message</el-button> -->
|
||||
<el-button plain type="primary" icon="el-icon-discount" @click="handleRole(scope.row)">User
|
||||
Detail
|
||||
</el-button>
|
||||
<el-button plain type="danger" icon="el-icon-lock" @click="handleDark(scope.row)">Join the
|
||||
blacklist</el-button>
|
||||
</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="link_Total" @current-change="handlePageChange">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 拉黑详情弹出框 -->
|
||||
<el-dialog title="Pull black user" :visible.sync="blackVisible" width="500px">
|
||||
<el-form ref="edit_Form" :model="blackForm" label-width="110px">
|
||||
<el-form-item label="Account :">
|
||||
{{blackForm.account}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Realname :">
|
||||
{{blackForm.realname}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
{{blackForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Black reasons :">
|
||||
<el-input v-model="blackForm.reason" type="textarea" :rows="6"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="handleBlack(blackForm)">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- 添加用户邮箱验证弹出框 -->
|
||||
<el-dialog title="Check Account And Email" :visible.sync="emailVisible" width="450px">
|
||||
<el-form ref="emailTab" :model="emailForm" :rules="rules" label-width="90px">
|
||||
<el-form-item label="Account :" prop="account">
|
||||
<el-input v-model="emailForm.account"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :" prop="email">
|
||||
<el-input v-model="emailForm.email"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p v-if="email_num==1" style="margin: 0 0 0 100px;color: orangered;">
|
||||
<!-- 验证失败 -->
|
||||
{{emailForm.mark_new}}
|
||||
</p>
|
||||
<p v-if="email_num==2" style="margin: 0 0 0 100px;color: #006699;">
|
||||
<!-- 验证成功 -->
|
||||
Verification successful
|
||||
</p>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="emailVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEmail">Check</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- 添加用户弹出框 -->
|
||||
<el-dialog title="Add User" :visible.sync="addVisible" width="550px">
|
||||
<el-form ref="addTab" :model="addForm" :rules="rules" label-width="150px">
|
||||
<el-form-item label="Account :" prop="account">
|
||||
{{addForm.account}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :" prop="email">
|
||||
{{addForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Password :" prop="password">
|
||||
<el-input v-model="addForm.password" type="password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Confirm password :" prop="repassword">
|
||||
<el-input v-model="addForm.repassword" type="password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Realname :" prop="realname">
|
||||
<el-input v-model="addForm.realname"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Phone :" prop="phone">
|
||||
<el-input v-model="addForm.phone"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="addVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveAdd">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- 编辑用户弹出框 -->
|
||||
<el-dialog title="Edit User" :visible.sync="editVisible" width="550px">
|
||||
<el-form ref="editTab" :model="editForm" :rules="rules" label-width="100px">
|
||||
<el-form-item label="Account :" prop="account">
|
||||
{{editForm.account}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :" prop="email">
|
||||
{{editForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Realname :" prop="realname">
|
||||
<el-input v-model="editForm.realname"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Phone :" prop="phone">
|
||||
<el-input v-model="editForm.phone"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="editVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEdit">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'partyList',
|
||||
data() {
|
||||
return {
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
userrole: localStorage.getItem('U_status'),
|
||||
guest_id: localStorage.getItem('U_id'),
|
||||
tableData: [],
|
||||
blackForm: {},
|
||||
emailForm: {
|
||||
mark_new: ''
|
||||
},
|
||||
roleList: [{
|
||||
value: 0,
|
||||
title: 'All Role'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
title: 'Editor'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
title: 'Reviewer'
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
title: 'Editorial Board Member'
|
||||
}
|
||||
],
|
||||
actList: [{
|
||||
value: 0,
|
||||
title: 'All Grade'
|
||||
}, {
|
||||
value: 1,
|
||||
title: 'A'
|
||||
}, {
|
||||
value: 2,
|
||||
title: 'B'
|
||||
}, {
|
||||
value: 3,
|
||||
title: 'C'
|
||||
}, {
|
||||
value: 4,
|
||||
title: 'D'
|
||||
}],
|
||||
addForm: {},
|
||||
editForm: {},
|
||||
query: {
|
||||
role: 0,
|
||||
activ: 0,
|
||||
journal: 0,
|
||||
country: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 15,
|
||||
username: ''
|
||||
},
|
||||
link_Total: 0,
|
||||
email_num: 0,
|
||||
blackVisible: false,
|
||||
emailVisible: false,
|
||||
addVisible: false,
|
||||
editVisible: false,
|
||||
shoLosA: true,
|
||||
shoLosB: false,
|
||||
shoLosC: false,
|
||||
rules: {
|
||||
account: [{
|
||||
required: true,
|
||||
message: 'Please input account',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
email: [{
|
||||
required: true,
|
||||
message: 'Please input email',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^[-.-_A-Za-z0-9]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct email format"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
realname: [{
|
||||
required: true,
|
||||
message: 'Please input realname',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
phone: [{
|
||||
required: true,
|
||||
message: 'Please input phone',
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
validator: function(rule, value, callback) {
|
||||
if (/^1[3456789]\d{9}$/.test(value) == false) {
|
||||
callback(new Error("Please enter the correct phone format!"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "blur"
|
||||
}],
|
||||
password: [{
|
||||
required: true,
|
||||
validator: 'Please input password',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
repassword: [{
|
||||
required: true,
|
||||
validator: 'Please input password again',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.getDate()
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getAllUser', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.users;
|
||||
this.link_Total = res.data.count || 0;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 指数颜色
|
||||
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><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else if (num < 15) {
|
||||
str = '<b style="color:#cbb504">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
} else {
|
||||
str = '<b style="color:#0cbc15">' + num +
|
||||
'</b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;"> (' + time +
|
||||
')</span>'
|
||||
}
|
||||
if (time == 0) {
|
||||
str =
|
||||
'<b style="color:#aaa;">0 </b><br/><span style="color:#aaa;font-size:14px;margin-left:5px;">(No time)</span>'
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
// 检测邮箱弹出框
|
||||
handleAdd() {
|
||||
this.email_num = 0
|
||||
this.emailVisible = true
|
||||
},
|
||||
|
||||
// 添加用户弹出框
|
||||
saveEmail() {
|
||||
this.$refs.emailTab.validate((valid) => {
|
||||
if (valid) {
|
||||
let Email_mark = 0
|
||||
let Accnt_mark = 0
|
||||
this.$api
|
||||
.post('api/User/checkUserByEmail', this.emailForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.has == 0) {
|
||||
Email_mark = 0
|
||||
} else {
|
||||
Email_mark = 1
|
||||
}
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.$api
|
||||
.post('api/User/checkUserByAccount', this.emailForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.has == 0) {
|
||||
Accnt_mark = 0
|
||||
} else {
|
||||
Accnt_mark = 1
|
||||
}
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
if (Email_mark == 1 && Accnt_mark == 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Email and account already exist!'
|
||||
} else if (Email_mark == 1 && Accnt_mark != 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Email already exist!'
|
||||
} else if (Email_mark != 1 && Accnt_mark == 1) {
|
||||
this.email_num = 1
|
||||
this.emailForm.mark_new = 'Account already exist!'
|
||||
} else {
|
||||
this.addForm.email = this.emailForm.email
|
||||
this.addForm.account = this.emailForm.account
|
||||
this.email_num = 2
|
||||
setTimeout(() => {
|
||||
this.emailVisible = false
|
||||
this.addVisible = true
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 保存添加用户
|
||||
saveAdd() {
|
||||
this.$refs.addTab.validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.addForm.password == this.addForm.repassword) {
|
||||
this.$api
|
||||
.post('api/User/addUser', this.addForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.addVisible = false
|
||||
this.$refs.addTab.resetFields()
|
||||
this.getDate()
|
||||
this.$message.success('User added successfully!');
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('The two passwords are inconsistent!');
|
||||
}
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 编辑用户弹出框
|
||||
handleEdit(row) {
|
||||
this.editForm = Object.assign({}, row);
|
||||
this.editVisible = true;
|
||||
},
|
||||
// 保存编辑用户
|
||||
saveEdit() {
|
||||
|
||||
},
|
||||
// 推广页面跳转
|
||||
handlePopu() {
|
||||
this.$router.push({
|
||||
path: 'partyExte'
|
||||
});
|
||||
},
|
||||
// 编辑身份跳页面
|
||||
handleRole(row) {
|
||||
this.$router.push({
|
||||
path: 'partyRole',
|
||||
query: {
|
||||
id: row.user_id
|
||||
}
|
||||
});
|
||||
},
|
||||
// 拉黑弹窗
|
||||
handleDark(row) {
|
||||
this.blackForm = Object.assign({}, row);
|
||||
this.blackVisible = true;
|
||||
},
|
||||
// 移除拉黑操作
|
||||
handleBlack(blackForm) {
|
||||
// 二次确认更改状态
|
||||
this.$confirm('Are you sure you want ' + blackForm.realname + ' to join the blacklist？', 'Tip', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/User/pushUserToBlack', this.blackForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Join the blacklist successful!');
|
||||
this.blackForm.reason = '';
|
||||
this.blackVisible = false;
|
||||
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();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
.el-button--primary.is-plain:hover {
|
||||
background-color: #409EFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.ro_li_ku {
|
||||
border: 1px solid #419fcf;
|
||||
border-radius: 5px;
|
||||
color: #419fcf;
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
padding: 0 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.titline {
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #c7dbf1;
|
||||
padding: 0 0 15px 0;
|
||||
margin: 10px 0 15px 0;
|
||||
}
|
||||
|
||||
.titline b {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
color: #006699;
|
||||
margin: 5px 10px 0 0;
|
||||
cursor: pointer;
|
||||
width: 1000px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
.titSear {
|
||||
width: 325px;
|
||||
margin-bottom: 18px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.titSear>span {
|
||||
color: #666;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 20px;
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
font-size: 14px;
|
||||
margin: 0 15px 0 0;
|
||||
}
|
||||
|
||||
.titSear .el-select,
|
||||
.titSear .el-input {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
|
||||
.titSelectRole {
|
||||
display: block;
|
||||
width: 800px;
|
||||
}
|
||||
.titSelectAct{
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.titMoreInp {
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
|
||||
.titSearLong {
|
||||
width: 390px;
|
||||
}
|
||||
|
||||
.titSearLong>span {
|
||||
width: 165px;
|
||||
}
|
||||
|
||||
.titSearLong .el-select,
|
||||
.titSearLong .el-input {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.btnSear {
|
||||
text-align: center;
|
||||
margin: 5px 0 30px 0;
|
||||
/* border-top: 1px solid #c7dbf1; */
|
||||
padding: 10px 0 0 0;
|
||||
}
|
||||
|
||||
.btnreset {
|
||||
float: right;
|
||||
color: #006699;
|
||||
font-size: 13px;
|
||||
margin: 12px 15px 0 0;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.btnreset:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btnreset i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
</style>
|
||||
1126
src/components/page/partyListPot.vue
Normal file
1126
src/components/page/partyListPot.vue
Normal file
File diff suppressed because it is too large
Load Diff
307
src/components/page/tmrGPT.vue
Normal file
307
src/components/page/tmrGPT.vue
Normal file
@@ -0,0 +1,307 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-chat-line-square"></i> <span class="top_dao"> TMRGPT</span>
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="padding: 30px 20px;min-width: 800px;background: none;" v-loading="loading"
|
||||
element-loading-text="Loading..." element-loading-spinner="el-icon-loading"
|
||||
element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||
<div class="anSwer" id="anSwer">
|
||||
<div v-for="(item,index) in talkTable">
|
||||
<div class="anPoint" v-if="item.role=='user'">
|
||||
<!-- <b class="el-icon-question pushBtn" style="color: #006699;"></b> -->
|
||||
<!-- <svg t="1681971463063" class="icon pushBtn" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="7376" width="26" height="26">
|
||||
<path
|
||||
d="M525.146839 30.984258c273.474065 0 495.153548 221.316129 495.153548 494.327742 0 132.82271-52.587355 252.994065-137.909677 341.751742 26.590968 36.401548 79.706839 116.339613 98.304 144.284903a6.276129 6.276129 0 0 1-5.351226 9.777549 17354.157419 17354.157419 0 0 0-103.324903-1.45342h-355.096775l0.330323-0.330322C247.477677 1015.048258 29.927226 795.714065 29.927226 525.312 29.927226 252.20129 251.639742 30.951226 525.146839 30.951226z m-6.110968 692.95071c-20.48 0-37.16129 6.507355-51.100903 19.489032-13.939613 13.01471-20.48 29.729032-20.48 50.176 0 20.446968 6.540387 37.16129 20.48 50.176a72.340645 72.340645 0 0 0 51.067871 20.446968c20.48 0 37.16129-6.507355 51.100903-19.522065 13.939613-13.01471 21.371871-30.653935 21.371871-51.100903 0-20.446968-7.432258-37.16129-20.413936-50.176-13.939613-12.981677-31.611871-19.489032-52.025806-19.489032z m16.714323-536.080516c-68.773161 0-122.648774 19.522065-162.584775 58.533161-40.893935 39.044129-60.382968 92.919742-60.382967 161.659871h105.901419c0-39.011097 7.432258-69.698065 23.221677-91.036903 17.639226-26.029419 46.443355-38.086194 87.337291-38.086194 31.578839 0 56.683355 8.357161 74.32258 25.996387 16.714323 17.672258 25.996387 41.818839 25.996387 72.472774 0 23.221677-8.357161 45.518452-25.071483 65.96542l-11.164904 13.014709c-60.382968 53.842581-96.619355 92.88671-108.676129 117.958194-13.01471 25.104516-18.597161 55.758452-18.597161 91.069935v13.01471h106.859355v-13.01471c0-22.296774 4.624516-41.818839 13.939613-60.382967a143.987613 143.987613 0 0 1 37.16129-46.476387c44.593548-38.978065 71.514839-64.082581 79.872-73.364646 22.296774-29.729032 34.386581-67.848258 34.386581-114.291612 0-56.683355-18.597161-101.276903-55.758452-133.780646-37.128258-33.428645-86.379355-49.218065-146.762322-49.218064z"
|
||||
fill="#006699" p-id="7377"></path>
|
||||
</svg> -->
|
||||
<svg t="1681972043358" class="icon pushBtn" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="9732" width="26" height="26">
|
||||
<path
|
||||
d="M905.728 151.552c34.304 0 62.464 28.16 61.952 63.488v497.152c0.512 34.816-27.648 63.488-61.952 63.488h-99.84l-32.256 97.28-129.536-97.28h-291.84c-35.328 0-65.024-31.232-65.024-63.488V215.04c0-34.816 28.16-63.488 62.464-63.488h556.032z"
|
||||
fill="#2196F3" p-id="9733"></path>
|
||||
<path
|
||||
d="M330.24 831.488c-51.712 0-97.28-44.544-97.28-95.744V313.856H103.936c-24.576 0-44.544 20.48-44.544 45.056v493.056c-0.512 25.088 19.968 45.056 44.544 45.056h71.168l13.824 65.024 97.28-65.024h212.992c25.6 0 46.592-22.016 46.592-45.056v-19.456l-194.048-0.512h-21.504z"
|
||||
fill="#9FDAFF" p-id="9734"></path>
|
||||
<path
|
||||
d="M555.008 431.616c0 25.088 6.144 44.544 17.92 59.392s27.648 22.016 47.616 22.016c20.48 0 36.352-7.168 48.128-21.504 11.776-14.336 17.408-34.304 17.408-59.392 0-26.112-5.632-46.592-16.896-61.44s-27.136-22.016-47.104-22.016c-20.48 0-36.864 7.68-48.64 22.528-12.288 15.872-18.432 35.84-18.432 60.416z m203.776 192c-10.24 3.072-23.04 4.608-37.888 4.608-16.896 0-33.28-4.608-48.64-13.824-15.36-9.216-35.328-27.648-59.904-55.808-34.304-1.024-61.44-13.312-81.92-36.864s-30.72-52.736-30.72-87.04c0-39.424 11.264-70.656 33.792-94.72s52.736-35.84 90.624-35.84c34.816 0 62.976 11.264 84.992 34.816 22.016 23.04 32.768 53.248 32.768 91.136 0 29.696-6.656 55.296-19.968 76.288-13.312 21.504-32.256 36.352-57.344 44.544 10.752 11.264 20.992 19.456 30.72 25.088 10.24 5.12 23.04 8.192 38.4 8.192 9.216 0 17.92-1.536 25.088-4.096v43.52z"
|
||||
fill="#FFFFFF" p-id="9735"></path>
|
||||
</svg>
|
||||
<p>{{item.content}}</p>
|
||||
</div>
|
||||
<div class="anKey" v-if="item.role=='assistant'">
|
||||
<!-- <b class="el-icon-info pushBtn" style="color: #e2a714;"></b> -->
|
||||
<svg t="1681971921971" class="icon pushBtn" viewBox="0 0 1151 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="39578" width="26" height="26">
|
||||
<path
|
||||
d="M546.027756 0.001279c30.253149 0.12792 56.476808 21.362688 63.448464 51.423957a67.158152 67.158152 0 0 1-37.928366 77.647615c-6.523935 3.837609-15.478355 11.832627-15.478355 18.036761-1.535043 39.399449 0 44.516261 0 86.985797h300.35684c37.480645 0 46.882786 8.95442 46.882787 47.202587v432.178699c0 40.934493-8.95442 49.441192-50.528515 49.633072h-164.377572a46.754866 46.754866 0 0 0-9.849862 2.686326v60.762138h58.843333a31.212551 31.212551 0 0 1 26.54346 8.95442c7.035616 6.971656 10.425504 16.885478 9.210261 26.863261v123.059319a34.282638 34.282638 0 0 1-9.594022 28.142463 32.683634 32.683634 0 0 1-27.694743 9.466102H353.571681a32.044033 32.044033 0 0 1-27.630783-9.530062 33.579076 33.579076 0 0 1-8.95442-28.334344v-120.564873c0-28.078504 9.785902-37.160844 38.376087-38.056286h52.063558l4.349289-3.389888 0.447721-1.279203v-57.883931c-10.489464 0-20.275366-1.279203-29.869387-1.535043H229.74484c-30.95671 0-41.382214-10.681344-41.382213-41.446174V275.989304c0-32.299873 9.785902-41.638054 43.556858-41.638054h301.700003V141.73696c0-4.669091-9.146301-9.977783-14.838753-13.30371A67.158152 67.158152 0 0 1 482.195532 50.529794c7.291457-29.869388 33.706996-50.720395 63.832224-50.528515zM124.722282 370.778239v254.561376C55.837206 625.339615 0 568.415086 0 498.058927s55.837206-127.280688 124.722282-127.280688z m949.48835 62.553021a128.431971 128.431971 0 0 1 0 129.199493 122.995359 122.995359 0 0 1-111.290652 61.465699V371.865561c45.283783-1.918804 88.073119 21.682489 111.290652 61.465699z m-739.379274 20.467247c-12.024507 12.792029-18.484482 30.061268-17.84488 47.842188l-0.191881-1.790884c0 17.972801 7.035616 35.17808 19.699725 47.778228 12.600149 12.536188 29.613547 19.379924 47.202587 18.996163A67.477953 67.477953 0 0 0 449.064177 498.250807a68.437355 68.437355 0 0 0-43.109138-59.866695 66.13479 66.13479 0 0 0-71.123681 15.350435z m372.567844-22.06625l0.447721 1.343163a64.599746 64.599746 0 0 0-46.946746 18.420522c-12.600149 12.344308-19.827645 29.229786-20.211406 47.010706a68.309435 68.309435 0 0 0 65.431228 66.774391 67.158152 67.158152 0 0 0 66.646471-66.774391c0.383761-17.84488-6.396014-34.986199-18.740323-47.586348a63.384504 63.384504 0 0 0-46.626945-19.188043z"
|
||||
fill="#e2a714" p-id="39579"></path>
|
||||
</svg>
|
||||
<p>
|
||||
<font v-html="item.content" style="white-space: pre-wrap"></font>
|
||||
<span class="typer-cursor" v-if="falseMark&&index==talkTable.length-1"></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="queTion">
|
||||
<el-input type="textarea" v-model="gptForm.question" placeholder="Please enter the question..."
|
||||
autosize>
|
||||
</el-input>
|
||||
<!-- <el-input type="textarea" v-model="gptForm.question" placeholder="Please enter the question..." autosize
|
||||
@keyup.enter.native="submitGpt()">
|
||||
</el-input> -->
|
||||
</div>
|
||||
<div class="queSub">
|
||||
<el-button type="primary" @click="submitGpt()" :disabled="falseMark">
|
||||
Submit Question
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
user_id: localStorage.getItem('U_id'),
|
||||
username: localStorage.getItem('U_name'),
|
||||
loading: false,
|
||||
talkTable: [],
|
||||
gptForm: {
|
||||
question: '',
|
||||
},
|
||||
falseMark: false,
|
||||
replyIndex: 0,
|
||||
replyEnd: 0,
|
||||
replyContent: '',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getData() {
|
||||
|
||||
},
|
||||
|
||||
// 提交问题
|
||||
submitGpt() {
|
||||
// if (this.falseMark) {
|
||||
// return false
|
||||
// }
|
||||
|
||||
if (this.gptForm.question == '') {
|
||||
this.$message.error('Please fill in the question first!');
|
||||
return false
|
||||
}
|
||||
|
||||
this.replyContent = ''
|
||||
this.falseMark = true
|
||||
this.replyEnd = 0
|
||||
let newMark = 0
|
||||
|
||||
this.talkTable.push({
|
||||
role: 'user',
|
||||
content: this.gptForm.question
|
||||
}, {
|
||||
role: 'assistant',
|
||||
content: ''
|
||||
})
|
||||
|
||||
var ele = document.getElementById("anSwer");
|
||||
if (ele.scrollHeight > ele.clientHeight) {
|
||||
setTimeout(function() {
|
||||
ele.scrollTop = ele.scrollHeight;
|
||||
}, 100);
|
||||
}
|
||||
|
||||
let sendTable = JSON.parse(JSON.stringify(this.talkTable)).splice(0, this.talkTable.length - 1)
|
||||
|
||||
// 传递问题
|
||||
this.$api
|
||||
.post('api/Auto/GptCreateChat', {
|
||||
message: sendTable
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
let ckeyData = res.data.ckey
|
||||
|
||||
// 循环答案
|
||||
let timeLef = setInterval(() => {
|
||||
this.$api
|
||||
.post('api/Auto/AjaxForGpt', {
|
||||
'ckey': ckeyData
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0 && res.data.msg) {
|
||||
this.replyContent = res.data.msg
|
||||
if (newMark == 0) {
|
||||
this.effactReply()
|
||||
}
|
||||
newMark++
|
||||
if (res.data.msg.indexOf("[{enddata}]") != -1) {
|
||||
this.replyContent = this.replyContent.replace(
|
||||
"[{enddata}]", "")
|
||||
this.replyEnd = 1
|
||||
clearInterval(timeLef);
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
}, 1000);
|
||||
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 打字机效果
|
||||
effactReply() {
|
||||
this.gptForm.question = ''
|
||||
let typingInterval = setInterval(() => {
|
||||
var ele = document.getElementById("anSwer");
|
||||
if (ele.scrollHeight > ele.clientHeight) {
|
||||
setTimeout(function() {
|
||||
ele.scrollTop = ele.scrollHeight;
|
||||
}, 500);
|
||||
}
|
||||
let replyText = this.replyContent;
|
||||
if (this.replyIndex > replyText.length) {
|
||||
if (this.replyEnd == 1) {
|
||||
clearInterval(typingInterval);
|
||||
this.replyIndex = 0;
|
||||
this.falseMark = false
|
||||
}
|
||||
} else {
|
||||
this.talkTable[this.talkTable.length - 1].content = this.talkTable[this.talkTable.length -
|
||||
1]
|
||||
.content + replyText.slice(this.replyIndex - 1, this.replyIndex);
|
||||
this.replyIndex++;
|
||||
}
|
||||
}, 50);
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.anSwer {
|
||||
/* height: 600px; */
|
||||
position: absolute;
|
||||
top: 85px;
|
||||
bottom: 135px;
|
||||
left: 20px;
|
||||
right: 45px;
|
||||
overflow-y: scroll;
|
||||
padding: 0 20px 0 15px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.anSwer>div>div {
|
||||
padding: 20px 0 20px 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.anPoint {
|
||||
margin: 0 0 5px 0;
|
||||
}
|
||||
|
||||
.anKey {
|
||||
margin: 0 0 20px 0;
|
||||
background-color: rgba(226, 167, 20, 0.2);
|
||||
}
|
||||
|
||||
.pushBtn {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
.anSwer>div>div>p {
|
||||
display: inline-block;
|
||||
padding: 0 0 0 20px;
|
||||
width: 92%;
|
||||
line-height: 24px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.queTion {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
left: 20px;
|
||||
right: 45px;
|
||||
border: 2px solid rgba(0, 102, 153, 0.4);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
/deep/.queTion .el-textarea__inner {
|
||||
border-radius: 8px;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.queSub {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
right: 45px;
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.anSwer::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
|
||||
.anSwer::-webkit-scrollbar-thumb {
|
||||
border-radius: 100px;
|
||||
-webkit-box-shadow: inset 0 0 5px rgba(0, 102, 153, 0.2);
|
||||
background: #006699;
|
||||
}
|
||||
|
||||
|
||||
.anSwer::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 5px rgba(0, 102, 153, 0.2);
|
||||
border-radius: 0;
|
||||
background: rgba(0, 102, 153, 0.1);
|
||||
|
||||
}
|
||||
|
||||
@keyframes mydeamon {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.typer-cursor {
|
||||
background-color: #e2a714;
|
||||
animation: mydeamon 0.6s infinite;
|
||||
-webkit-animation: mydeamon 0.6s infinite;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0 0 0 3px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
</style>
|
||||
386
src/components/page/youthApplyList.vue
Normal file
386
src/components/page/youthApplyList.vue
Normal file
@@ -0,0 +1,386 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Young Scientist Apply list
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
|
||||
<div class="container" style="min-width: 1000px;">
|
||||
<el-table :data="tableData" border stripe class="table" ref="multipleTable"
|
||||
header-cell-class-name="table-header">
|
||||
<el-table-column label="No." align="center" width="50">
|
||||
<template slot-scope="scope">
|
||||
{{scope.$index+1}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Base Information" width="320px">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_tie_col">
|
||||
<span>Apply Journal: </span>{{scope.row.title}}
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Realname: </span><b style="font-size: 15px;letter-spacing: -0.5px;">{{scope.row.realname}}</b>
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Title: </span>{{scope.row.technical}}
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Email: </span>{{scope.row.email}}
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.phone!=''">
|
||||
<span>Phone: </span>{{scope.row.phone}}
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.starList_mark!=0">
|
||||
<span>Grade: </span>
|
||||
<font style="display: inline-block;">
|
||||
<img src="../../assets/img/star-all.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==1" class="starSty">
|
||||
<img src="../../assets/img/star-traf.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==0" class="starSty">
|
||||
<img src="../../assets/img/star-none.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==2" class="starSty">
|
||||
<img src="../../assets/img/star-all.png" v-if="scope.row.starList_mark>8"
|
||||
class="starSty">
|
||||
<b style="font-size: 15px;color: #b77614;" v-if="scope.row.starList_mark>8">×
|
||||
{{scope.row.starList_mark}}</b>
|
||||
</font>
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Apply Time: </span>{{formatDate(scope.row.ap_time)}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Other Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_tie_col" v-if="scope.row.cvs.length>0">
|
||||
<span>CV.: </span>
|
||||
<img src="../../assets/img/icon_0.png" alt=""
|
||||
style="vertical-align: middle;margin-left: 10px;">
|
||||
<span style="margin-left: 20px;color: #888;font-size: 13px;">
|
||||
<i class="el-icon-paperclip"></i>
|
||||
{{formatDate(scope.row.cvs[scope.row.cvs.length-1].ctime)}}
|
||||
</span>
|
||||
<a :href="mediaUrl+'reviewer/'+scope.row.cvs[scope.row.cvs.length-1].cv" target="_blank" class="txt_pdf">
|
||||
<b class="el-icon-download" style="color: #006699;font-weight: bold;"></b>
|
||||
</a>
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Field: </span>{{scope.row.field}}
|
||||
</p>
|
||||
<p class="tab_tie_col" v-if="scope.row.company!=''">
|
||||
<span>Affiliation: </span>{{scope.row.company}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Remarks" width="300">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.remark}}
|
||||
<b @click="BoxRemark(scope.row)" style="margin-left:10px;cursor: pointer;color:#006699;"
|
||||
class="el-icon-edit"></b>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" width="120">
|
||||
<template slot-scope="scope">
|
||||
<p style="margin-bottom: 10px;">
|
||||
<el-button type="primary" plain icon="el-icon-user" @click="handleDtail(scope.row)">
|
||||
Detail
|
||||
</el-button>
|
||||
</p>
|
||||
<p style="margin-bottom: 10px;">
|
||||
<el-button type="success" plain icon="el-icon-check" @click="agreeApply(scope.row)">
|
||||
Agree
|
||||
</el-button>
|
||||
</p>
|
||||
<el-button type="danger" plain icon="el-icon-close" @click="deleteApply(scope.row)">
|
||||
Refuse
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<!-- 同意弹出框 -->
|
||||
<el-dialog title="Agree User" :visible.sync="agreeVisible" width="500px">
|
||||
<el-form ref="agree_Form" :model="agreeForm" :rules="rules" label-width="140px">
|
||||
<el-form-item label="Realname :">
|
||||
{{agreeForm.realname}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
{{agreeForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Apply Journal :">
|
||||
{{agreeForm.title}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Term of office :" prop="year">
|
||||
<el-select v-model="agreeForm.year" placeholder="Please select a year">
|
||||
<el-option v-for="item in list_year" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="agreeVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveAgreee()">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
|
||||
<!-- 标记弹出框 -->
|
||||
<el-dialog title="Remarks" :visible.sync="remarkBox" width="550px">
|
||||
<el-form ref="remark" :model="remarkMes" label-width="130px">
|
||||
<el-form-item label="Realname :">
|
||||
{{remarkMes.realname}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
{{remarkMes.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Apply Journal :">
|
||||
{{remarkMes.title}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :">
|
||||
<el-input type="textarea" rows="5" v-model="remarkMes.remark"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="remarkBox = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveRemark">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
tableData: [],
|
||||
agreeVisible: false,
|
||||
agreeForm: {},
|
||||
remarkMes: {
|
||||
remark: ''
|
||||
},
|
||||
remarkBox: false,
|
||||
list_year: [{
|
||||
title: '1 Year',
|
||||
id: 1
|
||||
}, {
|
||||
title: '2 Years',
|
||||
id: 2
|
||||
}, {
|
||||
title: '3 Years',
|
||||
id: 3
|
||||
}],
|
||||
rules: {
|
||||
year: [{
|
||||
required: true,
|
||||
message: 'Please select year',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
methods: {
|
||||
// 获取青年科学家申请列表数据
|
||||
getDate() {
|
||||
this.$api
|
||||
.post('api/User/getYboardApplys', {
|
||||
editor_id: localStorage.getItem('U_id')
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.applys;
|
||||
for (var i = 0; i < this.tableData.length; i++) {
|
||||
this.getScoreData(i, this.tableData[i].score)
|
||||
}
|
||||
} 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)
|
||||
}
|
||||
},
|
||||
|
||||
// 同意
|
||||
agreeApply(e) {
|
||||
this.agreeForm = e
|
||||
this.agreeVisible = true
|
||||
},
|
||||
|
||||
// 提交同意
|
||||
saveAgreee() {
|
||||
this.$refs.agree_Form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$api
|
||||
.post('api/User/agreeYboardApply', this.agreeForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Add succeeded!');
|
||||
this.agreeVisible = false
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('Please complete the information!!');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 拒绝
|
||||
deleteApply(e) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure you want to refuse the apply?', 'Tip', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/User/refuseYboardApply', e)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Delete succeeded!');
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
|
||||
|
||||
// 标记弹出框
|
||||
BoxRemark(e) {
|
||||
this.remarkBox = true;
|
||||
this.remarkMes.realname = e.realname;
|
||||
this.remarkMes.user_id = e.user_id;
|
||||
this.remarkMes.email = e.email;
|
||||
this.remarkMes.title = e.title;
|
||||
this.remarkMes.remark = e.remark;
|
||||
},
|
||||
|
||||
// 修改标记
|
||||
saveRemark() {
|
||||
this.$api.post('api/User/editRemarkForUser', this.remarkMes)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Success');
|
||||
this.remarkBox = false;
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// 详情
|
||||
handleDtail(e) {
|
||||
let routerJump = this.$router.resolve({
|
||||
path: '/partyRole',
|
||||
query: {
|
||||
id: e.user_id
|
||||
}
|
||||
});
|
||||
window.open(routerJump.href, '_blank');
|
||||
|
||||
},
|
||||
|
||||
// 时间格式
|
||||
formatDate(timestamp) {
|
||||
var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘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;
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
.tab_tie_col {
|
||||
margin-bottom: 5px;
|
||||
color: #333;
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.tab_tie_col>span {
|
||||
color: #888;
|
||||
margin: 0 5px 0 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.starSty {
|
||||
width: 18px;
|
||||
margin-right: 4px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
.starSty:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
</style>
|
||||
725
src/components/page/youthList.vue
Normal file
725
src/components/page/youthList.vue
Normal file
@@ -0,0 +1,725 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user"></i> Young Scientist list
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="min-width: 1000px;">
|
||||
<div class="handle-box">
|
||||
<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>
|
||||
<span style="font-size: 14px;color: #606266;margin: 0 10px 0 40px;">Keywords :</span>
|
||||
<el-input v-model="query.keywords" placeholder="Account / Realname / Email"
|
||||
style="width: 230px;margin: 0 10px 0 0;">
|
||||
</el-input>
|
||||
<el-input v-model="query.fieldkey" placeholder="Field1 ; Field2 ; Field3"
|
||||
style="width: 220px;margin: 0 10px 0 0;">
|
||||
</el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="query.pageIndex = 1;getDate()">Search
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 15px;">
|
||||
<span style="font-size: 14px;color: #606266;margin: 0 10px 0 0;">Term of service : </span>
|
||||
<el-radio-group v-model="query.type" @change="selectShai">
|
||||
<el-radio :label="1">Be on duty</el-radio>
|
||||
<el-radio :label="2">Exceed the time limit</el-radio>
|
||||
<el-radio :label="3">
|
||||
<el-select v-model="query.year" @change="selectYearShai" style="width: 80px;">
|
||||
<el-option v-for="item in df_year" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="addHandle" style="float: right;">
|
||||
Add new Young Scientist</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-table :data="tableData" border stripe class="table" ref="multipleTable" @sort-change="changeSort"
|
||||
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="Additional Information">
|
||||
<template slot-scope="scope">
|
||||
<p class="tab_tie_col">
|
||||
<span>Affiliation: </span>{{scope.row.company}}
|
||||
</p>
|
||||
<p class="tab_tie_col">
|
||||
<span>Field: </span>{{scope.row.field}}
|
||||
</p>
|
||||
<!-- <p class="tab_tie_col">
|
||||
<span>Major: </span>{{scope.row.major_title}}
|
||||
</p> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="H-WOS" width="110px" 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" width="110px" 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 prop="grade" label="Grade" width="110px" align="center">
|
||||
<template slot-scope="scope">
|
||||
<p style="display: inline-block;" v-if="scope.row.starList_mark!=0">
|
||||
<img src="../../assets/img/star-all.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==1" class="starSty">
|
||||
<img src="../../assets/img/star-traf.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==0" class="starSty">
|
||||
<img src="../../assets/img/star-none.png" v-for="item in scope.row.starList"
|
||||
v-if="scope.row.starList_mark<=8&&item.star==2" class="starSty">
|
||||
<img src="../../assets/img/star-all.png" v-if="scope.row.starList_mark>8" class="starSty">
|
||||
<b style="font-size: 15px;color: #b77614;" v-if="scope.row.starList_mark>8">×
|
||||
{{scope.row.starList_mark}}</b>
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Term of service" align="center" width="160">
|
||||
<template slot-scope="scope">
|
||||
<p v-for="item in scope.row.sd">
|
||||
{{formatYear(item.start_date)}}
|
||||
<span style="margin: 0 3px;">-</span>
|
||||
{{formatYear(item.end_date)}}
|
||||
</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" label="Remarks" width="180" sortable="custom">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.remark}}
|
||||
<b @click="BoxRemark(scope.row)" style="margin-left:10px;cursor: pointer;color:#006699;"
|
||||
class="el-icon-edit"></b>
|
||||
</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-edit" @click="handleDtail(scope.row)">
|
||||
Detail
|
||||
</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="success" plain icon="el-icon-connection" @click="reneHandle(scope.row)">
|
||||
Renewal
|
||||
</el-button>
|
||||
</div>
|
||||
<div style="margin: 10px 0;">
|
||||
<el-button type="warning" plain icon="el-icon-trophy" @click="cerFicte(scope.row)">
|
||||
Certificate
|
||||
</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 Young Scientist" :visible.sync="addVisible" width="620px" :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 Young Scientist 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="Term of office :" prop="year">
|
||||
<el-select v-model="addForm.year" placeholder="Please select a year">
|
||||
<el-option v-for="item in list_year" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</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="Renewal Young Scientist" :visible.sync="reneVisible" width="600px">
|
||||
<el-form ref="rene_Form" :model="reneForm" :rules="rules" label-width="140px">
|
||||
<el-form-item label="Account :">
|
||||
{{reneForm.account}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
{{reneForm.email}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Realname :">
|
||||
{{reneForm.realname}}
|
||||
</el-form-item>
|
||||
<el-form-item label="Term of office :" prop="year">
|
||||
<el-select v-model="reneForm.year" placeholder="Please select a year">
|
||||
<el-option v-for="item in list_year" :label="item.title" :key="item.id" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="reneVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveRene()">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 标记弹出框 -->
|
||||
<el-dialog title="Remarks" :visible.sync="remarkBox" width="550px">
|
||||
<el-form ref="remark" :model="remarkMes" label-width="130px">
|
||||
<el-form-item label="Young Scientist :">
|
||||
<p style="line-height: 20px;margin-top: 6px;">{{remarkMes.realname}}</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Email :">
|
||||
<p style="line-height: 20px;margin-top: 6px;">{{remarkMes.email}}</p>
|
||||
</el-form-item>
|
||||
<el-form-item label="Content :">
|
||||
<el-input type="textarea" rows="5" v-model="remarkMes.remark"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="remarkBox = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveRemark">Save</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 证书弹出框 -->
|
||||
<el-dialog :visible.sync="cerVisible" width="850px">
|
||||
<el-image class="table-td-thumb rev_digol" :src="this.IMG_Url"></el-image>
|
||||
</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: '',
|
||||
},
|
||||
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
|
||||
this.getDate();
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSelect();
|
||||
this.yearData()
|
||||
},
|
||||
methods: {
|
||||
// 获取当年时间
|
||||
yearData() {
|
||||
this.YearThis = new Date().getFullYear()
|
||||
this.query.year = this.YearThis
|
||||
for (let i = 0; i < 15; i++) {
|
||||
this.df_year.push({
|
||||
title: 2016 + i,
|
||||
id: 2016 + i
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// 获取下拉值
|
||||
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/getYboardlist', this.query)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.yboards;
|
||||
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);
|
||||
});
|
||||
},
|
||||
|
||||
// 排序
|
||||
changeSort(val) {
|
||||
if (val.prop == 'remark') {
|
||||
if (val.order == 'ascending') {
|
||||
this.query.order_remark = 1
|
||||
} else {
|
||||
this.query.order_remark = 0
|
||||
}
|
||||
}
|
||||
this.getDate()
|
||||
},
|
||||
|
||||
// 评分
|
||||
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)
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
// 日期条件筛选
|
||||
selectShai() {
|
||||
this.query.pageIndex = 1;
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
selectYearShai() {
|
||||
this.query.type = 3
|
||||
this.query.pageIndex = 1;
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
// 新增
|
||||
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/addYboard', this.addForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.addVisible = false;
|
||||
this.getDate();
|
||||
this.$message.success(`Added successfully！`);
|
||||
this.$refs.add_Form.resetFields();
|
||||
this.dis_able = 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.$refs.add_Form.resetFields();
|
||||
},
|
||||
|
||||
// 查找与他相同的账号
|
||||
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');
|
||||
},
|
||||
|
||||
// 续约
|
||||
reneHandle(e) {
|
||||
this.reneForm.journal_id = e.journal_id
|
||||
this.reneForm.user_id = e.user_id
|
||||
this.reneForm.account = e.account
|
||||
this.reneForm.realname = e.realname
|
||||
this.reneForm.email = e.email
|
||||
this.reneVisible = true
|
||||
},
|
||||
|
||||
// 保存续约
|
||||
saveRene(e) {
|
||||
this.$refs.rene_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/addYboardContinue', this.reneForm)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.reneVisible = false;
|
||||
this.getDate();
|
||||
this.$message.success(`Renewal successfully！`);
|
||||
loading.close();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
loading.close();
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
loading.close();
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 删除
|
||||
reneDelete(e) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure you want to delete?', 'Tip', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('api/User/delYboard', e)
|
||||
.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(() => {});
|
||||
},
|
||||
|
||||
// 证书弹出层
|
||||
cerFicte(e) {
|
||||
this.IMG_Url = this.Common.mediaUrl + 'cert/' + e.icon
|
||||
this.cerVisible = true;
|
||||
},
|
||||
|
||||
// 标记弹出框
|
||||
BoxRemark(e) {
|
||||
this.remarkBox = true;
|
||||
this.remarkMes.realname = e.realname;
|
||||
this.remarkMes.user_id = e.user_id;
|
||||
this.remarkMes.email = e.email;
|
||||
this.remarkMes.remark = e.remark;
|
||||
},
|
||||
|
||||
// 修改标记
|
||||
saveRemark() {
|
||||
this.$api.post('api/User/editRemarkForUser', this.remarkMes)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('Success');
|
||||
this.remarkBox = false;
|
||||
this.getDate();
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 分页导航
|
||||
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，时间戳为13位的话不需乘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，时间戳为13位的话不需乘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: 20px;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
|
||||
.red {
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
|
||||
.zhu_ce {
|
||||
text-decoration: underline;
|
||||
color: #006699;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab_tie_col {
|
||||
margin-bottom: 5px;
|
||||
color: #333;
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.tab_tie_col>span {
|
||||
color: #888;
|
||||
margin: 0 5px 0 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.starSty {
|
||||
width: 18px;
|
||||
margin-right: 4px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
.starSty:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user