<template>
<div class="flexOne">
<div class="query-box">
<ul>
<li>
<span><em>{{$t('adm.adm_title')}}：</em>
<el-input v-model='msg.Title' class="permiss-input"></el-input>
</span>
</li>
<li>
<span><em>{{$t('adm.adm_Publisher')}}：</em>
<el-select filterable clearable v-model='msg.UpdateBy' :placeholder="$t('pub.unlimitedSel')">
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option v-for='item in Employee' :label='item.EmName' :value='item.EmployeeId' :key='item.EmployeeId'>
</el-option>
</el-select>
</span>
</li>
<li>
<span><em>{{$t('adm.adm_ublicationstatus')}}：</em>
<el-select v-model="msg.Status" :placeholder="$t('pub.unlimitedSel')">
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option :label="$t('adm.adm_tobepublish')" value='0'></el-option>
<el-option :label="$t('adm.adm_published')" value='1'></el-option>
<el-option :label="$t('adm.adm_Withdrawn')" value='2'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>{{$t('adm.adm_Ceilingsituation')}}：</em>
<el-select v-model="msg.Is_top" :placeholder="$t('pub.unlimitedSel')">
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option :label="$t('adm.adm_Noroofset')" value='0'></el-option>
<el-option :label="$t('adm.adm_roofset')" value='1'></el-option>
</el-select>
</span>
</li>
<li>
<input type="button" class="hollowFixedBtn" :value="$t('pub.searchBtn')"
@click="resetPageIndex(),getList()" />
<input type="button"
@click="outerVisible = true,dialogTitle=$t('objFill.v101.administrative.tianjiagogao'),layerType=2,clearMessage()"
class="normalBtn" :value="$t('pub.addBtn')" />
</li>
</ul>
</div>
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>{{$t('adm.adm_theme')}}</th>
<!-- <th>{{$t('adm.adm_Ceilingsituation')}}</th> -->
<th>{{$t('adm.adm_ublicationstatus')}}</th>
<th>{{$t('admin.admin_czPerson')}}</th>
<th>{{$t('fnc.caozuoriqi')}}</th>
<th>{{$t('system.table_operation')}}</th>
</tr>
<tr v-for="(item,index) in DataList" v-loading='loading'>
<td>{{item.Title}}</td>
<!-- <td>{{item.Is_top==0?'':$t('adm.adm_roofset')}}</td> -->
<td>{{noticeFormat(item.Status)}}</td>
<td>{{item.UpdateName}}</td>
<td>{{item.UpdateTime|dateFormat(item.UpdateTime)}}</td>
<td>
<el-button-group>
<el-tooltip v-if="item.Status!='0'" class="item" effect="dark" :content="$t('fnc.xiangqing')"
placement="top-start">
<el-button @click='getDetails(item.Id, item.Title)' type="primary" icon="el-icon-tickets"></el-button>
</el-tooltip>
<el-tooltip v-if="item.Status=='0'" class="item" effect="dark" :content="$t('pub.updateMsg')"
placement="top-start">
<el-button @click='updateNotice(item.Id)' type="primary" icon="el-icon-edit"></el-button>
</el-tooltip>
<!-- <el-tooltip v-if="item.Is_top==0&&item.Status=='1'" class="item" effect="dark" :content="$t('adm.adm_roof')" placement="top-start">
<el-button @click="setTop(item.Id)" type="primary" icon="iconfont icon-control-top" ></el-button>
</el-tooltip> -->
<!-- <el-tooltip v-if="item.Is_top==1&&item.Status=='1'" class="item" effect="dark" :content="$t('adm.adm_exitroof')" placement="top-start">
<el-button @click="setTop(item.Id)" type="primary" icon="iconfont icon-control-bottom" ></el-button>
</el-tooltip> -->
<el-tooltip v-if="item.Status=='1'" class="item" effect="dark" :content="$t('adm.adm_chehui')"
placement="top-start">
<el-button @click='reCallNotice(item.Id)' type="warning" icon="el-icon-delete"></el-button>
</el-tooltip>
<el-tooltip v-if="item.Status=='0'" class="item" effect="dark" :content="$t('system.table_delete')"
placement="top-start">
<el-button @click='deleteNotice(item.Id)' type="danger" icon="el-icon-delete"></el-button>
</el-tooltip>
</el-button-group>
</td>
</tr>
</table>
<el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
layout="total,prev, pager, next, jumper" :page-size=msg.pageSize :total=total>
</el-pagination>
<el-dialog custom-class='w800' :title="dialogTitle" :visible.sync="outerVisible" center
:before-close="closeChangeMachie">
<div v-if='layerType==1'>
<p style="text-align: right; padding: 5px 0;">
{{detailMessage.EmName}} {{detailMessage.UpdateTime}}</p>
<div v-html="detailMessage.Content">
</div>
<!-- <pre style="letter-spacing: 1px; font-size: 14px; color: #333;">
{{detailMessage.Content}}
</pre> -->
<p style="padding:0 10px; margin: 10px 0; background: #f1f1f1;">{{$t('adm.adm_fujian')}}：</p>
<p style="height: 28px; padding: 0 10px; line-height: 28px;" v-for="item in downLoadList"
class="AnnFileListPMeta">
<i class="iconfont icon-xiazai"></i>--<span @click="downloadSingle(item)">{{item.Name}}</span>
</p>
</div>
<el-form v-if='layerType==2' :model="addMsg" :rules="rules" ref="addMsg" label-width="100px">
<table class="layerNoIcon">
<tr>
<td>
<el-form-item :label="$t('adm.adm_title')" prop="Title">
<el-input class='w600' type="text" v-model="addMsg.Title" :placeholder="$t('pub.pleaseImport')">
</el-input>
</el-form-item>
</td>
</tr>
<tr>
<td>
<quill-editor :options="editorOption" v-model="addMsg.Content"></quill-editor>
</td>
</tr>
<tr>
<td>
<el-form-item :label="$t('adm.adm_fujian')">
<el-upload :http-request="UploadAttachment" :multiple="true" :show-file-list="false" action="">
<el-button size="small" type="danger" icon="el-icon-upload2">{{$t('adm.adm_content')}}</el-button>
</el-upload>
</el-form-item>
</td>
</tr>
<tr v-if='uploadList.length>0'>
<td>
<el-form-item :label="$t('adm.adm_fjlist')">
<div class="AnnfileList">
<li v-for="item in uploadList">
<span @click="downloadOne(item)">{{item.name}}--{{$t('adm.adm_download')}}</span>
<i class="el-icon-circle-close-outline" @click="deleteFile(item)"></i>
</li>
</div>
</el-form-item>
</td>
</tr>
</table>
</el-form>
<div v-if='layerType!=1' slot="footer" class="dialog-footer">
<button class="hollowFixedBtn"
@click="outerVisible = false,resetForm('addMsg')">{{$t('pub.cancelBtn')}}</button>
<button class="normalBtn" type="primary" @click="submitForm('addMsg',0)">{{$t('fnc.zancun')}}</button>
<button class="normalBtn" type="primary" @click="submitForm('addMsg',1)">{{$t('adm.adm_publish')}}</button>
</div>
<div v-if='layerType==1' slot="footer" class="dialog-footer">
<button class="normalBtn" @click="outerVisible = false">{{$t('pub.closeSel')}}</button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
editorOption: {
modules: {
toolbar: [
['bold', 'italic', 'underline', 'strike', 'image'], // toggled buttons
[{
'header': [1, 2, 3, 4, 5, 6, false]
}],
[{
'color': []
}, {
'background': []
}],
[{
'font': []
}],
[{
'align': []
}],
[{
'size': ['small', false, 'large', 'huge']
}],
[{
'list': 'ordered'
}, {
'list': 'bullet'
}]
]
}
},
uploadList: [],
layerType: '',
loading: true,
//分页
total: 0,
pageSize: '',
currentPage: 1,
//弹窗
outerVisible: false,
isRight: true,
dialogTitle: '',
//请求参数
msg: {
pageIndex: 1,
pageSize: 15,
Status: '-1',
Is_top: '-1',
Title: '',
UpdateBy: '-1'
},
addMsg: {
Id: '-1',
Title: '',
Content: '',
Status: '',
FileList: [],
RB_Group_Id: '-1',
},
rules: {
Title: [{
required: true,
message: this.$t('adm.adm_qsrgbbiaoti'),
trigger: 'blur'
}],
Content: [{
required: true,
message: this.$t('adm.adm_qsrgbneirong'),
trigger: 'blur'
}],
},
employeeMsg: {
GroupId: '',
BranchId: 0,
DepartmentId: 0,
PostId: 0,
IsLeave: 0,
},
//返回结果
DataList: [],
Employee: [],
detailMessage: [],
downLoadList: [],
fabuStatus: {
t1: this.$t('objFill.fabuzts')[0],
t2: this.$t('objFill.fabuzts')[1],
t3: this.$t('objFill.fabuzts')[2],
}
}
},
filters: {
dateFormat(date) {
return date.replace('T', ' ')
}
},
mounted() {
let userInfo = this.getLocalStorage();
this.addMsg.RB_Group_Id = userInfo.RB_Group_id
this.getList();
this.getEmployee();
},
methods: {
noticeFormat(status) {
if (status == "0")
return this.fabuStatus.t1
if (status == "1")
return this.fabuStatus.t2
if (status == "2")
return this.fabuStatus.t3
},
UploadAttachment(file) { //上传
if (file.file.size > 1024 * 1024 * 100) {
this.$message.warning(this.$t('adm.adm_filenotmoreM'))
return
}
let newArr = [];
newArr.push(file.file)
let path = "/Upload/Temporary/"
this.$message.info(this.$t('tips.shangchuanzhong'))
this.UploadSelfFileT(path, newArr, x => {
let fileSize = file.file.size < 1024 ? file.file.size : (file.file.size / 1024).toFixed(0);
this.saveMsg = []
this.saveMsg.push({
Path: x.data.FilePath,
FileName: file.file.name,
MD5Sign: file.file.uid,
FileSize: fileSize,
FolderId: this.msg.ParentId
})
this.uploadList.push({
url: x.data.FilePath,
name: file.file.name
})
});
},
downloadSingle(obj) {
const link = document.createElement('a');
let _loadUrl = this.domainManager().UploadUrl;
link.href = obj.Url;
document.body.appendChild(link);
window.open(obj.Url)
},
downloadOne(obj) {
this.downloadFileRename(obj.url, obj.name);
},
deleteFile(obj) {
if (this.uploadList.findIndex(item => item.url === obj.url) != -1) {
this.uploadList.splice(this.uploadList.findIndex(item => item.url === obj.url), 1)
}
},
reCallNotice(id) {
this.$confirm(this.$t('adm.adm_sfchehui'), this.$t('tips.tips'), {
confirmButtonText: this.$t('pub.sureBtn'),
cancelButtonText: this.$t('pub.cancelBtn'),
type: 'warning'
}).then(() => {
this.apipost("User_post_NoticeSetRevocation", {
noticeId: id
}, res => {
if (res.data.resultCode == 1) {
this.$message.success(this.$t('adm.adm_chsuccess'))
this.getList();
}
}, err => {})
}).catch(() => {
this.$message({
type: 'info',
message: this.$t('adm.adm_chexit')
});
});
},
deleteNotice(id) {
this.$confirm(this.$t('tips.shifoushanchu'), this.$t('tips.tips'), {
confirmButtonText: this.$t('pub.sureBtn'),
cancelButtonText: this.$t('pub.cancelBtn'),
type: 'warning'
}).then(() => {
this.apipost("User_post_NoticeRemove", {
noticeId: id
}, res => {
if (res.data.resultCode == 1) {
this.$message.success(this.$t('tips.shanchuchenggong'))
this.getList();
}
}, err => {})
}).catch(() => {
this.$message({
type: 'info',
message: this.$t('tips.cancleDelete')
});
});
},
getList() { //公告列表
this.loading = true;
this.apipost('User_get_NoticeGetPageList', this.msg, res => {
if (res.data.resultCode == 1) {
this.loading = false;
this.DataList = res.data.data.pageData;
this.total = res.data.data.count;
}
}, err => {})
},
getEmployee() { //员工
this.apipost('admin_get_EmployeeGetList', this.employeeMsg, res => {
if (res.data.resultCode == 1) {
this.Employee = res.data.data;
}
}, err => {})
},
addNotice(_status) {
this.addMsg.FileList = this.uploadList;
this.layerType = 2;
this.addMsg.Status = _status;
this.apipost('User_post_NoticeSet', this.addMsg, res => {
if (res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible = false;
this.getList()
this.resetForm('addMsg');
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
updateNotice(id) {
this.addMsg.Id = id;
this.dialogTitle = this.$t('tips.adm_xgnotice');
this.outerVisible = true;
this.layerType = 2;
this.apipost('User_get_NoticeGet', {
noticeId: id
}, res => {
if (res.data.resultCode == 1) {
this.addMsg.Title = res.data.data.Title
this.addMsg.Content = res.data.data.Content
this.uploadList = []
if (res.data.data.File_url) {
let _arr = JSON.parse(res.data.data.File_url);
if (_arr.length > 0) {
_arr.forEach(item => {
this.uploadList.push({
name: item.Name,
url: item.Url
})
})
}
}
}
}, err => {})
},
getDetails(id, tit) {
this.outerVisible = true;
this.layerType = 1;
this.dialogTitle = tit;
this.apipost('User_get_NoticeGet', {
noticeId: id
}, res => {
if (res.data.resultCode == 1) {
this.detailMessage = res.data.data
if (res.data.data.File_url) {
this.downLoadList = JSON.parse(res.data.data.File_url)
this.downLoadList.forEach(item => {
item.Url = this.domainManager().ViittoFileUrl + item.Url
})
}
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
setTop(id) { //置顶
this.$confirm(this.$t('adm.adm_shifouroof'), this.$t('tips.tips'), {
confirmButtonText: this.$t('pub.sureBtn'),
cancelButtonText: this.$t('pub.cancelBtn'),
type: 'warning'
}).then(() => {
this.apipost('User_post_NoticeSetTop', {
noticeId: id
}, res => {
if (res.data.resultCode == 1) {
this.Employee = res.data.data;
this.getList();
} else {
this.$message.warning(res.data.message)
}
}, err => {})
}).catch(() => {
this.$message({
type: 'info',
message: this.$t('adm.adm_exitroof')
});
});
},
clearMessage() {
this.uploadList.length = 0;
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
submitForm(addMsg, _type) { //提交创建、修改表单
this.$refs[addMsg].validate((valid) => {
if (valid) {
this.addNotice(_type)
} else {
return false;
}
});
},
closeChangeMachie(done) { //弹出框关闭初始化弹框内表单
done();
this.resetForm('addMsg');
},
resetForm(formName) { //弹出框取消 初始化谈框内表单
if (formName) {
this.$refs[formName].resetFields();
}
this.addMsg.Id = '-1'
}
}
}
</script>
<style>
.ann_detail_title {
line-height: 24px;
font-size: 15px;
font-weight: bold;
text-align: center;
}
.ann_textarea textarea {
height: 400px !important;
}
.AnnfileList {
padding: 5px 0;
}
.AnnfileList li {
height: 30px;
line-height: 30px;
padding: 0 10px;
}
.AnnfileList li:hover {
background: #f1f1f1;
}
.AnnfileList li>i {
float: right;
margin-top: 8px;
}
.AnnfileList li:hover,
.AnnFileListPMeta:hover {
text-decoration: underline;
color: #E95252;
cursor: pointer;
}
.AnnFileListPMeta {
color: blue
}
.AnnFileListPMeta .iconfon {
font-size: 12px;
}
</style>