update Modal Icons

This commit is contained in:
梁灏 2018-06-25 21:11:42 +08:00
parent 36e46e5a77
commit 06a4433d86
2 changed files with 21 additions and 35 deletions

View file

@ -1,44 +1,30 @@
<template> <template>
<div> <div>
<Button @click="instance('info')">Info</Button> <Button type="primary" @click="modal1 = true">Display dialog box</Button>
<Button @click="instance('success')">Success</Button> <Modal
<Button @click="instance('warning')">Warning</Button> v-model="modal1"
<Button @click="instance('error')">Error</Button> title="Common Modal dialog box title"
@on-ok="ok"
@on-cancel="cancel">
<p>Content of dialog</p>
<p>Content of dialog</p>
<p>Content of dialog</p>
</Modal>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data () {
return {
modal1: false
}
},
methods: { methods: {
instance (type) { ok () {
const title = 'Title'; this.$Message.info('Clicked ok');
const content = '<p>Content of dialog</p><p>Content of dialog</p>'; },
switch (type) { cancel () {
case 'info': this.$Message.info('Clicked cancel');
this.$Modal.info({
title: title,
content: content,
closable: true
});
break;
case 'success':
this.$Modal.success({
title: title,
content: content
});
break;
case 'warning':
this.$Modal.warning({
title: title,
content: content
});
break;
case 'error':
this.$Modal.error({
title: title,
content: content
});
break;
}
} }
} }
} }

View file

@ -9,7 +9,7 @@
<div :class="[prefixCls + '-content']"> <div :class="[prefixCls + '-content']">
<a :class="[prefixCls + '-close']" v-if="closable" @click="close"> <a :class="[prefixCls + '-close']" v-if="closable" @click="close">
<slot name="close"> <slot name="close">
<Icon type="ios-close-empty"></Icon> <Icon type="ios-close"></Icon>
</slot> </slot>
</a> </a>
<div :class="[prefixCls + '-header']" v-if="showHead"><slot name="header"><div :class="[prefixCls + '-header-inner']">{{ title }}</div></slot></div> <div :class="[prefixCls + '-header']" v-if="showHead"><slot name="header"><div :class="[prefixCls + '-header-inner']">{{ title }}</div></slot></div>