update from old git
This commit is contained in:
@@ -74,6 +74,102 @@
|
||||
<script src="<%=ResolveUrl("~/js/moment.min.js")%>"></script>
|
||||
<script src="<%=ResolveUrl("~/js/sweetalert2/sweetalert2.all.min.js") %>"></script>
|
||||
<script src="<%=ResolveUrl("~/admin/Templates/TBS5ADM001/js/Script.js")%>"></script>
|
||||
|
||||
<script>
|
||||
//全局的VUE組件,操作提示組件
|
||||
Vue.component('message-modal', {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
title: '提示',
|
||||
message: '',
|
||||
status: 'success', // 'success' or 'error'
|
||||
callback: null
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
open({ title = '提示', message = '', status = 'success', callback = null }) {
|
||||
this.title = title;
|
||||
this.message = message;
|
||||
this.status = status;
|
||||
this.callback = callback;
|
||||
this.show = true;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
if (this.callback) this.callback();
|
||||
}
|
||||
},
|
||||
template: `
|
||||
<div class="modal fade" tabindex="-1" :class="{ show: show }" style="display: block;" v-if="show" @click.self="close">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header" :class="status === 'success' ? 'bg-success text-white' : 'bg-danger text-white'">
|
||||
<h5 class="modal-title">{{ title }}</h5>
|
||||
<button type="button" class="btn-close" @click="close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{{ message }}</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn" :class="status === 'success' ? 'btn-success' : 'btn-danger'" @click="close">確定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
});
|
||||
Vue.component('confirm-modal', {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
title: '確認操作',
|
||||
message: '是否確定要執行此操作?',
|
||||
confirmCallback: null,
|
||||
cancelCallback: null
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
open(opts) {
|
||||
this.title = opts.title || '確認操作';
|
||||
this.message = opts.message || '是否確定要執行此操作?';
|
||||
this.confirmCallback = opts.onConfirm || null;
|
||||
this.cancelCallback = opts.onCancel || null;
|
||||
this.show = true;
|
||||
},
|
||||
confirm() {
|
||||
this.show = false;
|
||||
if (this.confirmCallback) this.confirmCallback();
|
||||
},
|
||||
cancel() {
|
||||
this.show = false;
|
||||
if (this.cancelCallback) this.cancelCallback();
|
||||
}
|
||||
},
|
||||
template: `
|
||||
<div class="modal fade" tabindex="-1"
|
||||
:class="{ show: show }"
|
||||
style="display:block;" v-if="show"
|
||||
@click.self="cancel">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-warning text-white">
|
||||
<h5 class="modal-title">{{ title }}</h5>
|
||||
<button type="button" class="btn-close" @click="cancel"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{{ message }}</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" @click="cancel">取消</button>
|
||||
<button type="button" class="btn btn-danger" @click="confirm">確認</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`
|
||||
});
|
||||
</script>
|
||||
|
||||
<asp:ContentPlaceHolder id="footer_script" runat="server">
|
||||
|
||||
</asp:ContentPlaceHolder>
|
||||
|
||||
Reference in New Issue
Block a user