Calculation/app/public/js/msg_box.js

'use strict';

/**
 *
 *
 * @author Mai
 * @date
 * @version
 */

(function($){
    // setting = {
    //     id: 'calc-type',
    //     title: '提示',
    //     message: '切换计量模式，已计量数据会被清空。',
    //     ok: {
    //         caption: '确定',
    //         //callback
    //     },
    //     cancel: {
    //         caption: '取消',
    //         //callback
    //     }
    // };
    $.msgBox = function(setting) {
        const html = [];
        html.push('<div class="modal fade" data-backdrop="static" id="' + setting.id + '">');
        html.push('<div class="modal-dialog " role="document" >');
        html.push('<div class="modal-content">');
        html.push('<div class="modal-header">', '<h5 class="modal-title">', setting.title, '</h5>','</div>');
        html.push('<div class="modal-body">', '<h5>', setting.message, '</h5>', '</div>');
        html.push('<div class="modal-footer">');
        if (setting.cancel) {
            html.push('<button type="button" class="btn btn-secondary btn-sm" id="' + setting.id + '-cancel">', setting.cancel.caption, '</button>');
        }
        html.push('<button type="button" class="btn btn-primary btn-sm" id="' + setting.id + '-ok">', setting.ok.caption, '</button>');
        html.push('</div>');
        html.push('</div>');
        html.push('</div>');
        html.push('</div>');
        $('body').append(html.join(''));

        const obj = $('#' + setting.id);
        if (!obj) return;

        const btnOk = $('#' + setting.id + '-ok'), btnCancel =  $('#' + setting.id + '-cancel');
        if (btnOk) {
            btnOk.on('click', function () {
                if (setting.ok.callback) {
                    setting.ok.callback();
                }
                obj.modal('hide');
            });
        }
        if (btnCancel) {
            btnCancel.on('click', function () {
                if (setting.cancel.callback) {
                    setting.cancel.callback();
                }
                obj.modal('hide');
            });
        }
        obj.on('hidden.bs.modal', function () {
            setTimeout(() => { obj.remove(); }, 1000);
        });
        obj.modal('show');
    }
})(jQuery);