<el-container class="el-dialog-form">
    <el-dialog ref="dialog"
               top="15px"
               class="el-dialog-form"
               el-dialog
               append-to-body
               v-dialogDrag
               v-bind:title="dialog.name"
               v-bind:visible.sync="show"
               v-bind:style="{'width':dialog.width > 0 ? (dialog.width + 'px') : ''}"
               v-bind:close-on-click-modal="false"
               v-on:close="closeDialog">
        <el-container v-bind:style="$parent.$el && $parent.$el.offsetHeight ? 'max-height:' + ($parent.$el.offsetHeight - 30) + 'px' : ''">
            <el-main>
                <el-form ref="form"
                         v-bind:show-message="!dialog.isShowBorder"
                         v-bind:model="form"
                         v-bind:label-width="dialog.labelWidth + 'px'"
                         v-bind:class="{border:dialog.isShowBorder}">
                    <template v-for="(item,index) in dialog.listFormItem">
                        <el-col v-bind:span="item.width || 24"
                                v-bind:key="index">
                            <el-form-item v-if="!item.isHide || !javaScript.call(dialog,item.isHide,form)"
                                          v-bind:label="item.label || ''"
                                          v-bind:prop="item.prop"
                                          v-bind:rules="item.rules || (item.required ? { required: true, message: item.message || ('请输入' + item.label)} : null)"
                                          v-bind:style="item.color ? 'color:' +  item.color: ''">
                                <el-form-control ref="control"
                                                 v-bind:item="item"
                                                 v-bind:form="form"
                                                 v-model="form[item.prop]"
                                                 v-on:upload-success="(response,file) => $emit('upload-success',response,file)">
                                </el-form-control>
                            </el-form-item>
                        </el-col>
                    </template>
                </el-form>
            </el-main>
            <el-footer v-if="(dialog.isShowSaveButton == null || dialog.isShowSaveButton) || (dialog.isShowCancelButton == null || dialog.isShowCancelButton) || (dialog.listControl && dialog.listControl.length)">
                <el-row type="flex"
                        class="row-bg"
                        v-bind:justify="dialog.justify || 'center'">
                    <template v-for="(control,index) in dialog.listControl">
                        <el-button v-if="!control.isHide"
                                   v-bind:type="control.type"
                                   v-bind:icon="control.icon"
                                   v-bind:size="control.size"
                                   v-bind:key="index"
                                   v-on:click="javaScript.call(this,control.onclick,form)">{{ button.name }}</el-button>
                    </template>
                    <el-button v-if="dialog.isShowSaveButton == null || dialog.isShowSaveButton"
                               type="primary"
                               v-on:click="submitForm">
                        {{ dialog.saveButtonText || '保存'}}
                    </el-button>
                    <el-button v-if="dialog.showCancelButton == null || dialog.isShowCancelButton"
                               v-on:click="closeDialog">
                        {{ dialog.cancelButtonText || '取消'}}
                    </el-button>
                </el-row>
            </el-footer>
        </el-container>
    </el-dialog>
</el-container>
 </script>
<script src="@Url.Content("~/js/component/el-dialog-drag.js")" type="text/javascript"></script>
<script src="@Url.Content("~/js/component/el-dialog-form.js")" type="text/javascript"></script>
