zszq-trs/YLErpWeb/Views/trade/_part/SalesCommission.cshtml

@*交易编辑销售提成组件*@
@model SalesCommissionModel
@{
    Layout = null;
    var Model2 = Model ?? new SalesCommissionModel();
}

@if (!AppHelper.UseFutureVersion("销售提成", "V2"))
{
    <script>
        (function (global) {

            function salesCommissionCtrl(el, options) {
                this.reset = function () { };
                this.getValue = function () { return null };
                this.changeSalesmen = function () { return null };
            }

            global.SalesCommissionCtrl = salesCommissionCtrl;

        }(window));
    </script>
    return;
}

@{
    object sales = null;
    if (PS.Config.ErpElement.SaleMode == YLErp.Configuration.Enums.SaleMode.SaleMen)
    {
        sales = JsDataModel.GetSales();
    }
    else if (PS.Config.ErpElement.SaleMode == YLErp.Configuration.Enums.SaleMode.CustomerManager)
    {
        sales = JsDataModel.GetCustomerManager();
    }
}

<link href="~/Statics/libs/selectize/css/selectize.bootstrap.css" rel="stylesheet" />
<style>
    .selectize-control { display: inline-block; width: 152px; }

    .selectize-input { height: auto !important; min-height: 28px; padding: 5px; }

        .selectize-input.input-active { background-color: #ffe !important; }
</style>

<template id="salesCommissionTpl">
    <div class="form-group">
        <label class="formlabel half salesmenlable"> @(PS.Config.ErpElement.SaleMode == YLErp.Configuration.Enums.SaleMode.SaleMen ?"销售员":"客户经理")</label>
        <select name="SalesSelect" class="form-input" id="Salesmen" multiple @(Model2.Disabled ? "disabled" : "")></select>
    </div>
    @if (PS.Config.SalesCommissionCalculation == "公式1")
    {
        <div class="form-group">
            <label class="formlabel half">计提比例</label>
            <div class="d-inline-block position-relative">
                <input class="text-box form-input" type="text" id="CommissionAmount" name="CommissionAmount" @(Model2.Disabled ? "disabled" : "")>
                <a href="javascript:;" class="position-absolute change-commission-fmt" style="right:8px;top:5px;" title="百分比格式">
                    <i class="fa"></i>
                </a>
            </div>
        </div>
    }
    else
    {
        <div class="form-group">
            <label class="formlabel half">提成金额</label>
            <div class="d-inline-block position-relative">
                <input class="text-box form-input" type="text" id="CommissionAmount" name="CommissionAmount" @(Model2.Disabled ? "disabled" : "")>
                <a href="javascript:;" class="position-absolute change-commission-fmt" style="right:8px;top:5px;" title="点击后切换为百分比格式">
                    <i class="fa"></i>
                </a>
            </div>
        </div>
    }
</template>

<script src="~/Statics/libs/selectize/js/selectize.min.js?v=@(HtmlUtil.JsVersion)"></script>

<script>
    (function (global) {

        var sales = @Json.Serialize(sales);
        var rateMode = "@(PS.Config.SalesCommissionCalculation == "公式1")" === "True";
        var fixedFmt = { precision: 2 };

        function changeCommissionFmt(inputCtrl) {
            return function () {
                let fixed = !$(this).data('fixed');
                $(this).data('fixed', fixed).attr('title', fixed ? '点击后切换为百分比格式' : '点击后切换为固定值格式')
                    .children().removeClass(fixed ? "fa-percent" : "fa-rmb").addClass(fixed ? "fa-rmb" : "fa-percent");
                //这个"%"不要去掉
                inputCtrl.setOptions({ append: fixed ? "" : "%" });
                inputCtrl.setValue(0);
            };
        }

        function getValue($s, inputCtrl, $a) {
            return {
                SalesIds: $s.val().map(x => parseInt(x)),
                Commission: inputCtrl.getValue(),
                CommissionFixed: $a.data('fixed')
            };
        }

        function changeSalesmen($s, clientId, doNothingIfHasValue) {
            if (doNothingIfHasValue) {
                let val = $s.val();
                if (Array.isArray(val) ? val.length : val) return;
            }
            if (clientId > 0) {
                main.post("/SalesCommissionManage/GetClientDefaultSalesmen", { ClientId: clientId }).done(function (data) {
                    data && $s[0].selectize.setValue(data);
                });
            }
        }

        function __init(el, opts) {
            opts = $.extend({ SalesIds: [], Commission: (rateMode?'1':'0'), CommissionFixed: !rateMode }, opts);

            let $d = $($('#salesCommissionTpl').html());
            let $s = $d.first().find('select:first');
            let $i = $d.last().find('input:first');
            let $a = $d.last().find('a');

            $s.selectize({
                options: sales,
                valueField: 'id',
                labelField: 'Name',
                searchField: ['Name', 'PinYin'],
                items: opts.SalesIds,
                plugins: ['remove_button']
            });

            //这个"%"不要去掉
            let inputCtrl = FastVue.numberInput($i, opts.CommissionFixed ? { precision: 2 } : { precision: 2, append: '%' });
            inputCtrl.setValue(opts.Commission);

            $a.children().addClass(opts.CommissionFixed ? "fa-rmb" : "fa-percent");
           var temp = $a.data('fixed', !!opts.CommissionFixed);
            if (!rateMode) {
                $(temp).on('click', changeCommissionFmt(inputCtrl));
            }

            $(el).replaceWith($d);

            this.getValue = getValue.bind(null, $s, inputCtrl, $a);

            this.changeSalesmen = changeSalesmen.bind(null, $s);

            this.reset = function ($s, inputCtrl) {
                $s[0].selectize.clear();
                if (rateMode) {
                    inputCtrl.setValue('1');
                } else {
                    inputCtrl.setValue('0');
                }
            }.bind(this, $s, inputCtrl);
        }

        function salesCommissionCtrl(el, options) {
            __init.call(this,el, options);
        }

        global.SalesCommissionCtrl = salesCommissionCtrl;

    }(window));
</script>