| 1 |
<div class="cx-vui-popup" v-if="value"> |
| 2 |
<div |
| 3 |
class="cx-vui-popup__overlay" |
| 4 |
v-if="overlay" |
| 5 |
@click="handleCancel" |
| 6 |
></div> |
| 7 |
<div |
| 8 |
class="cx-vui-popup__body" |
| 9 |
:style="'width:' + bodyWidth" |
| 10 |
> |
| 11 |
<div |
| 12 |
class="cx-vui-popup__close" |
| 13 |
v-if="close" |
| 14 |
@click="handleCancel" |
| 15 |
> |
| 16 |
<svg width="20" height="20" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 3.00671L8.00671 7L12 10.9933L10.9933 12L7 8.00671L3.00671 12L2 10.9933L5.99329 7L2 3.00671L3.00671 2L7 5.99329L10.9933 2L12 3.00671Z"/></svg> |
| 17 |
</div> |
| 18 |
<div class="cx-vui-popup__header" v-if="header"> |
| 19 |
<slot name="title"></slot> |
| 20 |
</div> |
| 21 |
<div class="cx-vui-popup__content"> |
| 22 |
<slot name="content"></slot> |
| 23 |
</div> |
| 24 |
<div class="cx-vui-popup__footer" v-if="footer"> |
| 25 |
<cx-vui-button |
| 26 |
:button-style="'accent'" |
| 27 |
:size="'mini'" |
| 28 |
@click="handleOk" |
| 29 |
v-if="showOk" |
| 30 |
><span slot="label">{{ okLabel }}</span></cx-vui-button> |
| 31 |
<cx-vui-button |
| 32 |
:size="'mini'" |
| 33 |
@click="handleCancel" |
| 34 |
v-if="showCancel" |
| 35 |
><span slot="label">{{ cancelLabel }}</span></cx-vui-button> |
| 36 |
</div> |
| 37 |
</div> |
| 38 |
</div> |
