<template>
<div class="wrapper wrapper-content" id="notes" v-cloak>
<div class="row">
<div class="col-sm-12 animated fadeInRight">
<div class="mail-box-header">
<h2 langCode="Notification" params="通知发布">通知发布</h2>
</div>
<div class="mail-box">
<div class="mail-body">
<form class="form-horizontal" method="get">
<div class="form-group" style=" margin-bottom: 15px">
<label class="col-sm-1 control-label" :langCode="'Subject'" params="主题">主题：</label>
<div class="col-sm-5" style="position: relative">
<input type="text" class="form-control" value="" v-model="theme" maxlength="32">
</div>
<label class="col-sm-1 control-label" :langCode="'Recipient'" params="接收者">接收者：</label>
</div>
<div class="form-group" style=" margin-bottom: 15px">
<label class="col-sm-1 control-label" :langCode="'Publisher'" params="发布者">发布者：</label>
<div class="col-sm-5" style="position: relative">
<input type="text" class="form-control" value="" v-model="departmentName" maxlength="32" @focus="treeShowHide()">
<div id="treeDepartment" v-show="treeShow" style="height: 320px;width:400px;overflow-y: scroll;position: absolute;z-index: 9999;border: 1px solid #ccc">
<el-tree :data="data2" default-expand-all="" node-key="id" ref="tree" check-strictly :props="defaultProps" @node-click="getNodeData">
</el-tree>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label" :langCode="'Content'" params="内容">内容：</label>
<div class="col-sm-6">
<vue-editor v-model="content"></vue-editor>
</div>
<div class="col-sm-5">
<div id="treeDepartment1" style="height: 376px;width:400px;overflow-y: scroll;position: absolute;top:-90px;z-index: 9999;border: 1px solid #ccc">
<el-tree :data="data1" show-checkbox="" default-expand-all="" node-key="id" ref="tree" highlight-current :props="defaultProps">
</el-tree>
</div>
</div>
</div>
</form>
<form class="uploadForm" style="padding-left: 150px">
<input type ="file" name="file" class="fileContent hiddenClass" οnchange="doUpload(this)"/>
<input type ="text" name="sessionId" class="hiddenClass"/>
<input type ="text" name="areaCode" class="hiddenClass"/>
</form>
<span langCode="Add_attachments">添加附件</span>
<span class="triggerUpLoad fa fa-paperclip" style="cursor: pointer;color:#78BC27" οnclick="triggerUpLoad(this)"></span>
<div class="picC">
<ul class="picContent"></ul>
<ul class="fileContent"></ul>
</div>
</div>
<div class="mail-body text-right tooltip-demo">
<a class="btn btn-sm zbtn-bg" data-toggle="tooltip" data-placement="top" title="Send" @click='getCheckedKeys'><i class="fa fa-reply"></i> <span :langCode="'Send'" params="发送">发送</span></a>
<a class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="Discard email" @click='cancle'><i class="fa fa-times" ></i> <span :langCode="'Give_up'" params="放弃">放弃</span></a>
<!--<a class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="Move to draft folder"><i class="fa fa-pencil"></i> 存为草稿</a>-->
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import '../../common/js/z_packge.js'
import { modal } from '../../common/js/modal.js'
import VueEditor from 'vue2-editor'
Vue.use(VueEditor);
export default {
name: "createNews",
data(){
return {
content: '',
theme:'' ,
brief:'',
data1: [],
data2: [],
defaultProps: {
children: 'children',
label: 'departName'
},
departmentId:'',
departmentName:'',
receiveDeptIds:'',
treeShow:false,
treeShowReceive:true,
}
},
methods:{
treeShowHide(){
let vm=this;
vm.treeShow=true;
},
getNodeData(data){
var vm=this;
vm.departmentName=data.departName;
vm.departmentId=data.id;
vm.treeShow=false;
},
getData(){
var getRoleListUrl = '/department/list';
var thisM = this;
$.ajaxSend(getRoleListUrl,{}).done(function (data) {
thisM.data2.push(data.payload.results.root);
thisM.data1.push(data.payload.results.root);
});
},
getCheckedKeys(){
let vm=this;
let receiveDept= this.$refs.tree.getCheckedKeys();
vm.receiveDeptIds=receiveDept.join(',');
if(vm.theme==''||typeof(vm.theme)==undefined){
modal.error($.i18n.prop('Please_fill_in_the_notice_heading'));
return false;
}
if(vm.departmentName==''||typeof(vm.departmentName)==undefined){
modal.error($.i18n.prop('Please_select_the_publisher'));
return false;
}
if(vm.receiveDeptIds==''||typeof(vm.receiveDeptIds)==undefined){
modal.error($.i18n.prop('Please_select_the_notification_recipient'));
return false;
}
if(vm.content==''||typeof(vm.content)==undefined){
modal.error($.i18n.prop('Please_fill_in_the_contents_of_the_notice'));
return false;
}
/**添加附件处理字段**picIds*/
var files = $('.picC').find('li');
let fileIds=[];
$.each(files, function (index, item) {
fileIds.push($(item).attr('picIds'));
});
var params ={
title: vm.theme,
publishName: vm.departmentName,
publishDeptId: vm.departmentId,
content: vm.content,
receiveDeptIds: vm.receiveDeptIds,
brief: vm.ctbrife(this.content),
attachmentIds:fileIds
};
let url = '/notice/save';
$.ajaxSend(url,params).done(function (data) {
if (data.code==='00000000') {
modal.success($.i18n.prop('Publish_successfully'));
vm.content ='';
vm.theme = '';
vm.$router.push('/notice')
}
});
},
cancle(){
window.history.back(-1);
},
ctbrife(str){
// str = str.replace(/\<c:if\b[^>]*>([\s\S]*?)</c:if>/g,'')
str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
//str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
str=str.replace(/ /ig,'');//去掉
return str.substring(0,40);
}
},
filters:{
ctbrife: function(str){
str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
//str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
str=str.replace(/ /ig,'');//去掉
return str.substring(0,40);
}
},
mounted(){
this.getData();
}
}
</script>