@{
    ViewData["Title"] = "邮件模板配置";
}

<div class="card">
    <div class="card-header">
        <h4 class="card-title">邮件模板配置</h4>
    </div>
    <div class="card-body">
        <div class="mb-4">
            <select name="EmailType" id="EmailType" onchange="changeType()" class="form-control" style="width:150px;">
                <option value="交易确认书">交易确认书</option>
                <option value="结算确认书">结算确认书</option>
                <option value="交易确认书（用印）">交易确认书（用印）</option>
                <option value="结算确认书（用印）">结算确认书（用印）</option>
            </select>
        </div>
        <div class="mb-4">
            <label>邮件标题模板(变量参数:{{客户名称}},{{交易日期}},{{文档编号}})</label>
            <input type="text" name="TitleTemplate" id="TitleTemplate" class="form-control" />
        </div>
        <div class="mb-4">
            <label>邮件内容模板(变量参数:{{客户名称}},{{交易日期}},{{文档编号}})</label>
            <div id="editor"></div>
        </div>
        <div class="mb-4">
            <button class="btn btn-primary" style="width:120px;" onclick="saveData()">保存</button>
        </div>
    </div>
</div>

@section scripts{
    <script src="~/Scripts/ueditor/ueditor.config.js?v=@(HtmlUtil.JsVersion)"></script>
    <script src="~/Scripts/ueditor/ueditor.all.min.js?v=@(HtmlUtil.JsVersion)"></script>
    <script>
        var page = {
            AjaxSaveDataUrl:'@(Url.Action("AjaxSaveMailTemplate"))',
            AjaxGetDetailUrl: '@(Url.Action("AjaxGetMailTemplate"))'
        };

        var ueditor;

        $(function () {
            ueditor = UE.getEditor('editor', {
                autoHeight: false,
                wordCount: false,
                autoHeightEnabled: false,
                initialFrameHeight: 500
            });
            ueditor.ready(changeType);
        });

        function changeType() {
            ueditor.reset();
            ueditor.setContent('');
            var emailType = $('#EmailType').val();
            main.post(page.AjaxGetDetailUrl, { emailType: emailType })
                .done(function (resp) {
                    $('#TitleTemplate').val(resp.data.TitleTemplate);
                    let html = main.decodeHtmlEntity(resp.data.BodyTemplate);
                    ueditor.execCommand('insertHtml', html || "");
                });
        }

        function saveData() {
            var data = {
                EmailType: $('#EmailType').val(),
                TitleTemplate: $.trim($('#TitleTemplate').val())
            };
            data.BodyTemplate = encodeURIComponent(ueditor.getContent());
            if (!data.TitleTemplate) {
                return main.alert('缺少邮件标题模板');
            }
            var $e = $(event.target).prop('disabled', true);
            main.post(page.AjaxSaveDataUrl, data).done(function (resp) {
                layer.msg('保存成功');
            }).always(function () {
                $e.prop('disabled', false);
            });
        }

    </script>
}