mirrors/element
1
0
Fork 0
mirror of https://github.com/ElemeFE/element.git synced 2025-12-19 12:04:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

update dialog

Browse Source
This commit is contained in:
Leopoldthecoder
2016-08-08 13:59:26 +08:00
parent 82b4582c7e
commit ca59b21011
5 changed files with 73 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
packages/dialog/src/component.vue
View File

@@ -1,16 +1,20 @@
<template>
<div class="el-dialog__wrapper" v-if="visible" transition="dialog-fade" @click.self="handleWrapperClick">
<div class="el-dialog" :class="[sizeClass, customClass]" v-el:dialog :style="{ 'margin-bottom': size !== 'full' ? '50px' : '', 'top': size !== 'full' ? dynamicTop + 'px' : '0' }">
<div class="el-dialog__header">
<span class="el-dialog__title">{{title}}</span>
<div class="el-dialog__headerbtn">
<i class="el-dialog__close el-icon el-icon-close" @click='close()'></i>
<transition name="dialog-fade">
<div class="el-dialog__wrapper" v-show="visible" @click.self="handleWrapperClick">
<div class="el-dialog" :class="[sizeClass, customClass]" ref="dialog" :style="{ 'margin-bottom': size !== 'full' ? '50px' : '', 'top': size !== 'full' ? dynamicTop + 'px' : '0' }">
<div class="el-dialog__header">
<span class="el-dialog__title">{{title}}</span>
<div class="el-dialog__headerbtn">
<i class="el-dialog__close el-icon el-icon-close" @click='close()'></i>
</div>
</div>
<div class="el-dialog__body"><slot></slot></div>
<div class="el-dialog__footer">
<slot name="footer"></slot>
</div>
</div>
<div class="el-dialog__body"><slot></slot></div>
<slot name="footer"></slot>
</div>
</div>
</transition>
</template>
<script>
@@ -60,9 +64,14 @@
},
watch: {
visible(val) {
computedVisible(val) {
if (val) {
this.$els.dialog.scrollTop = 0;
this.$emit('open');
this.$nextTick(() => {
this.$refs.dialog.scrollTop = 0;
});
} else {
this.$emit('close');
}
}
},
@@ -76,7 +85,7 @@
methods: {
handleWrapperClick() {
if (this.closeOnClickModal) {
this.visible = false;
this.computedVisible = false;
}
},
@@ -85,7 +94,7 @@
}
},
ready() {
mounted() {
if (this.visible) {
this.rendered = true;
this.open();