Calculation/app/view/contract/setting_modal.ejs

<% if (ctx.session.sessionUser.is_admin) { %>
<!--标段设置-标段属性-->
<div class="modal fade" id="bd-set-1" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">合同设置</h5>
            </div>
            <div class="modal-height-500" style="overflow-y: auto">
                <div class="modal-body">
                    <ul class="nav nav-tabs nav-item mb-2">
                        <li class="nav-item">
                            <a class="nav-link active" data-toggle="tab" href="#htxx" role="tab" aria-selected="true">合同类型</a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane active" id="htxx">
                            <div class="my-2">
                                <a href="javascript:void(0);" class="" id="addType">新增类型</a>
                            </div>
                            <table class="table table-bordered">
                                <thead><tr class="text-center">
                                    <th width="60%">名称</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody class="text-center" id="type-table">
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-sm btn-primary" id="set-type-btn">确认</button>
            </div>
        </div>
    </div>
</div>
<script>
    $(function () {
        function setTypeTable(types) {
            $('#type-table').empty();
            types.forEach(type => {
                const typeRow = `<tr>
                                    <td><input class="form-control form-control-sm" name="value" placeholder="请输入值" value="${type}"></td>
                                    <td>
                                        <a href="javascript:void(0);" class="btn btn-sm text-danger remove-type-btn"><i class="fa fa-remove"></i></a>
                                    </td>
                                </tr>`;
                $('#type-table').append(typeRow);
            });
        }
        $('#bd-set-1').on('show.bs.modal', function () {
            $('#type-table').empty();
            // 看url上是否带有tender
            const is_tender = window.location.pathname.includes('tender') ? 1 : 0;
            console.log(window.location, is_tender);
            postData(`/sp/${spid}/contract/audit/save`, { type: 'get-contract-type', is_tender }, function (types) {
                setTypeTable(types);
            });
        });
        $('#addType').click(function(){
            const newType = `<tr>
                                    <td><input class="form-control form-control-sm" name="value" placeholder="请输入值" value=""></td>
                                    <td>
                                        <a href="javascript:void(0);" class="btn btn-sm text-danger remove-type-btn"><i class="fa fa-remove"></i></a>
                                    </td>
                                </tr>`;
            $('#type-table').append(newType);
        });

        $('body').on('click', '.remove-type-btn', function() {
            const input = $(this).parents('td').siblings('td').eq(0).children('input');
            input.attr('disabled', true);
            // 文字加删除线并移除foucs
            if (input.val() === '') {
                input.removeAttr('placeholder');
            }
            input.css('text-decoration', 'line-through');
            input.blur();
            $(this).remove();
        });

        $('#set-type-btn').click(function() {
            const types = [];
            $('#type-table tr').each(function () {
                const input = $(this).find('input[name="value"]');
                if (!input.prop('disabled')) {
                    const value = input.val().trim();
                    if (value) {
                        types.push(value);
                    }
                }
            });
            console.log(types);
            const is_tender = window.location.pathname.includes('tender') ? 1 : 0;
            postData(`/sp/${spid}/contract/audit/save`, { type: 'set-contract-type', contract_type: types, is_tender }, function (res) {
                toastr.success('设置成功');
                $('#bd-set-1').modal('hide');
            });
        });
    })
</script>
<% } %>