Stackedit/src/components/modals/LinkModal.vue
2022-06-02 07:45:13 +08:00

42 lines
1.1 KiB
Vue

<template>
<modal-inner aria-label="插入链接">
<div class="modal__content">
<p>请为您的链接提供<b> url </b></p>
<form-entry label="URL" error="url">
<input slot="field" class="textfield" type="text" v-model.trim="url" @keydown.enter="resolve">
</form-entry>
</div>
<div class="modal__button-bar">
<button class="button" @click="reject()">取消</button>
<button class="button button--resolve" @click="resolve">确认</button>
</div>
</modal-inner>
</template>
<script>
import modalTemplate from './common/modalTemplate';
export default modalTemplate({
data: () => ({
url: '',
}),
methods: {
resolve(evt) {
evt.preventDefault(); // Fixes https://github.com/mafgwo/stackedit/issues/1503
if (!this.url) {
this.setError('url');
} else {
const { callback } = this.config;
this.config.resolve();
callback(this.url);
}
},
reject() {
const { callback } = this.config;
this.config.reject();
callback(null);
},
},
});
</script>