create.vue

<style  lang="less">
@background-color: #fff;
@title-color: #101317;


// .fullscreen .ivu-modal-body{
//     padding-bottom:0px;
// }
.news-carousel-create {
    .fullscreen .ivu-modal-body {
        padding-bottom:0px;
    }
    .ivu-modal .ivu-modal-content .ivu-modal-footer {
        height: 0px;
    }  
}
</style>
<template>
    <Modal v-model="visible" title="新建图文" fullscreen class="news-carousel-create"
        :mask-closable="false">
        <div slot="close"></div>
        <div slot="footer"></div>
        <div slot="header" style="margin-top:-1px;height:46px">
            <span style="font-size:16px;margin-left:-2px;width:64px;
                height:22px;
                font-size:16px;
                font-family:PingFangSC;
                font-weight:400;
                color:rgba(85,85,85,1);
                line-height:22px;">新建图文</span>
            <i-button style="float:right;height:32px;width:75px;margin-top:-4px;" @click="doCancel">取消</i-button>

            <i-button  style="float:right;height:32px;width:75px;background:#409C9C;margin-top:-4px;margin-right:10px;color:white" @click="doOk" :loading="loading">保存</i-button>

        </div>
       <div style="height: calc(100% + 70px);margin-left:-16px;margin-top:-16px;width:calc(100% + 30px)">
            <Editor  :article="article" v-if="VIF" :fieldList="fieldList" :vision="visible" :topic="topic" ref="editor"></Editor>
        </div>
        
    </Modal>
</template>
<script>

import Editor from './custom-field-editor';

export default {
    data(){
        return {
            article: {
              
            },
            VIF:false,
            loading: false,
            username:"tenant",
        }
    },
    props : {
        value: {
            type: Boolean
        },
        groupId: {
            type: String,
            default:function(){
                return ""
            }
        },
        topic: {
            type: String,
            default:function(){
                return ""
            }
        },
        functionGroup: {
            type: String,
            required:true,
            default:function(){
                return ""
            }
        },
        fieldList:{
            type:Array,
            required:false,
            default:function(){
                return null
            }
        }
    },
    mounted(){
        this.refresh();
        this.getUsername();
    },
    methods:{
        getUsername(){
            // SEDU.Util.getAuthcInfo().then((authcInfo) => {
            //     this.username = authcInfo.username;
            // }).catch((XMLHttpRequest, textStatus, errorThrown) => {
            //     console.log(errorThrown)
            // });
        },
        refresh(){
            let url = "/gms/bill/newed/bill.announcementBillDefine";
            var that = this;
            GMS.$http.get(url).then(response=>
                {
                    that.VIF = true;
                    that.article = response.data.content;
                    that.article.typeName = "article";
                    that.article.functionGroup = that.functionGroup;
                    that.article.params = "";
                    that.article.sticky = false;
                    if(that.groupId&&that.groupId!=""){
                        that.article.group={
                            _type:"com.jiuqi.gov.sedu.news.entity.NewsGroupEntity",
                            id:that.groupId
                        }
                    }
                }).catch(error => {
                    console.log("加载新建页面报错!");
                })
        },
        doOk(){
            this.$refs.editor.validate((valid,content,params) => {
                if (!valid) {
                    return;
                }
                this.loading = true;
                var that = this;
                that.article.content = content;
                that.article.params = JSON.stringify(params);
                that.article.group = that.functionGroup.name;
                let url = "/gms/bill/saved/bill.announcementBillDefine";
                var jsonData = JSON.stringify(that.article)
                GMS.$http.post(url,jsonData,{
                    headers: {
                        post: {
                        'Content-Type': 'application/json',
                        },
                    }
                }).then(response => {
                    that.$Modal.remove();
                    that.$emit('保存成功', that.article);
                    that.$parent.refresh();
                    that.visible = false;
                    that.loading = false;
                }).catch(error =>{
                    console.log("保存报错");
                    that.loading = false;
                })
            })       
        },

        doCancel() {
            this.visible = false;
        },
    },
    components: {
        Editor
    },
    watch : {
        'visible' : function(val){
            if(val){
                this.refresh();
            }
        }
    },
    computed : {
        visible: {
            set : function(val){
                this.$emit('input', val);
            },
            get : function(){
                return this.value;
            }
        }
    }
}
</script>