152 lines
4.3 KiB
Vue
152 lines
4.3 KiB
Vue
<template>
|
|
<div class="card-box">
|
|
<el-steps class="steps" :active="display">
|
|
<el-step :title="this.$t('system.newsBulletin')" icon="el-icon-edit-outline" />
|
|
<el-step title="" icon="el-icon-upload" />
|
|
</el-steps>
|
|
<div class="joylink-card forms">
|
|
<div style="height: 100%; padding-top: 40px; overflow-y: auto; position: relative;">
|
|
<div class="online_box">在线人数 {{ onlineNum }}</div>
|
|
<el-form ref="form" :model="messageModel" :rules="rules" label-width="200px">
|
|
<el-form-item :label="this.$t('system.newsHeadlines')" prop="title">
|
|
<el-input v-model="messageModel.title" style="width: 450px" /></el-form-item>
|
|
<el-form-item :label="this.$t('system.newsContent')" prop="message">
|
|
<el-input v-model="messageModel.message" style="width: 450px" type="textarea" :autosize="{ minRows: 2, maxRows: 6}" />
|
|
</el-form-item>
|
|
<el-form-item :label="this.$t('system.whetherTheNewsCanBeClosed')" prop="showClose">
|
|
<el-radio-group v-model="messageModel.showClose">
|
|
<el-radio :label="radioValue.yes">{{ $t('global.yes') }}</el-radio>
|
|
<el-radio :label="radioValue.no">{{ $t('global.no') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<div class="draft">
|
|
<el-button type="primary" @click="pushNotification">{{ $t('system.push') }}</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {pushMessage} from '@/api/pushMessage';
|
|
import { getOnlineNmuber } from '@/api/management/user.js';
|
|
export default {
|
|
name: 'News',
|
|
data() {
|
|
return {
|
|
display: 1,
|
|
onlineNum: 0,
|
|
messageModel: {
|
|
title: '',
|
|
message: '',
|
|
showClose: false
|
|
},
|
|
radioValue: {
|
|
yes: true,
|
|
no: false
|
|
},
|
|
rules: {
|
|
title: [
|
|
{ required: true, message: this.$t('rules.enterTheNewsTitle'), trigger: 'blur'}
|
|
],
|
|
message:[
|
|
{ required: true, message: this.$t('rules.enterTheNewsContent'), trigger: 'blur' }
|
|
],
|
|
showClose: [
|
|
{ required: true, message: this.$t('rules.chooseNewsCanBeClosed'), trigger: 'change' }
|
|
]
|
|
}
|
|
};
|
|
},
|
|
mounted() {
|
|
this.getOnlineNmuber();
|
|
},
|
|
methods: {
|
|
async getOnlineNmuber() {
|
|
try {
|
|
const res = await getOnlineNmuber();
|
|
this.onlineNum = res.data.total;
|
|
} catch (error) {
|
|
this.$msgbox(error.message);
|
|
}
|
|
},
|
|
pushNotification() {
|
|
this.$refs['form'].validate((valid) => {
|
|
if (valid) {
|
|
pushMessage(this.messageModel).then(resp => {
|
|
this.$message.success(this.$t('tip.pushNewsSuccess'));
|
|
}).catch(() => {
|
|
this.$messageBox(this.$t('tip.pushNewsFailed'));
|
|
});
|
|
} else {
|
|
return false;
|
|
}
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
@import "src/styles/mixin.scss";
|
|
|
|
.card-box {
|
|
padding-top: 20px;
|
|
height: 100%;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.steps {
|
|
width: 980px;
|
|
margin: 0 auto;
|
|
|
|
/deep/ {
|
|
.el-step__icon.is-icon {
|
|
width: 95px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.online_box {
|
|
position: absolute;
|
|
left: 20px;
|
|
top: 18px;
|
|
}
|
|
|
|
.forms {
|
|
width: 800px;
|
|
margin: 0 auto;
|
|
margin-top: 10px;
|
|
height: calc(100% - 150px);
|
|
|
|
/deep/ {
|
|
.el-select {
|
|
float: left;
|
|
width: calc(600px);
|
|
}
|
|
|
|
.el-textarea {
|
|
float: left;
|
|
width: calc(600px);
|
|
}
|
|
|
|
.el-form-item__content>.el-input {
|
|
float: left;
|
|
width: calc(600px);
|
|
}
|
|
|
|
.el-input-number {
|
|
float: left;
|
|
width: calc(250px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.draft {
|
|
width: 300px;
|
|
text-align: center;
|
|
margin: 20px auto;
|
|
}
|
|
</style>
|
|
|