Calculation/app/view/file/config_dir.ejs

<% include ../shares/delete_hint_modal.ejs %>

<div class="panel-content">
    <div class="panel-title fluid">
        <div class="title-main d-flex justify-content-between">
            <div>配置目录/<%- ctx.subProject.name %></div>
            <div class="ml-auto">
                <a href="/sp/<%- ctx.subProject.id %>/filesjs" class="btn btn-outline-primary btn-sm">返回资料管理</a>
            </div>
        </div>
    </div>
    <div class="content-wrap">
        <div class="c-body">
            <div class="sjs-height-0">
                <div class="d-flex align-items-center mb-2 p-1">
                    <span>资料管理/<%- ctx.subProject.name %>（当前状态：<span class="<%- ctx.subProject.lock_file ? 'text-success' : 'text-warning' %>"><%- ctx.subProject.lock_file ? '锁定' : '未锁定' %></span>）</span>
                    <% if (canManageDir) { %>
                    <form class="mb-0 ml-2" method="POST" action="/sp/<%- ctx.subProject.id %>/config-dir/lock">
                        <input type="hidden" name="_csrf_j" value="<%= ctx.csrf %>" />
                        <input type="hidden" name="lock" value="1" />
                        <button class="btn btn-sm <%- ctx.subProject.lock_file ? 'btn-outline-secondary' : 'btn-primary' %>" <%- ctx.subProject.lock_file ? 'disabled' : '' %>>锁定</button>
                    </form>
                    <form class="mb-0 ml-1" method="POST" action="/sp/<%- ctx.subProject.id %>/config-dir/lock">
                        <input type="hidden" name="_csrf_j" value="<%= ctx.csrf %>" />
                        <input type="hidden" name="lock" value="0" />
                        <button class="btn btn-sm <%- ctx.subProject.lock_file ? 'btn-primary' : 'btn-outline-secondary' %>" <%- ctx.subProject.lock_file ? '' : 'disabled' %>>解锁</button>
                    </form>
                    <% } %>
                    <div class="alert alert-warning py-1 px-2 mb-0 ml-2">
                        <i class="fa fa-exclamation-circle"></i>
                        <%- ctx.subProject.lock_file ? '当前为“锁定”状态，用户仅可查看资料管理，无法上传文件。' : '请先“锁定”资料管理，禁止用户上传文件,避免引起编辑冲突。' %>
                    </div>
                </div>
                <div class="d-flex flex-row mb-2">
                    <div class="p-1">
                        <% if (ctx.subProject.lock_file && canManageDir) { %>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-add-sibling"><i class="fa fa-plus fa-fw"></i> 同层</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-add-child"><i class="fa fa-plus fa-fw"></i> 子项</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-move-up"><i class="fa fa-arrow-up fa-fw"></i> 上移</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-move-down"><i class="fa fa-arrow-down fa-fw"></i> 下移</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-move"><i class="fa fa-exchange fa-fw"></i> 移动</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-danger" id="cd-delete"><i class="fa fa-trash-o fa-fw"></i> 删除</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-edit-name"><i class="fa fa-pencil fa-fw"></i> 编辑目录</a>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-edit-tips"><i class="fa fa-file-text-o fa-fw"></i> 上报说明</a>
                        <% } %>
                        <% if (ctx.subProject.lock_file && canAuthUser) { %>
                        <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="cd-auth-user"><i class="fa fa-user-plus fa-fw"></i> 授权用户</a>
                        <% } %>
                    </div>
                </div>
                <div id="config-dir-spread" style="width: 100%; height: calc(100% - 90px);"></div>
            </div>
        </div>
    </div>
</div>

<!-- 授权用户 Modal -->
<div class="modal fade" id="auth-user-modal" data-backdrop="static">
    <div class="modal-dialog modal-lgx" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">授权用户</h5>
            </div>
            <div class="modal-body">
                <div class="mb-3">当前目录：<strong id="auth-user-filing-name"></strong></div>
                <div class="d-flex align-items-center mb-3">
                    <div class="dropdown mr-4">
                        <button class="btn btn-outline-primary btn-sm dropdown-toggle" type="button" id="cd-auth-user-dropdown"
                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">添加用户</button>
                        <div class="dropdown-menu" aria-labelledby="cd-auth-user-dropdown"
                             style="width:260px; max-height:330px; overflow-y:auto;">
                            <dl class="list-unstyled book-list mb-0" id="cd-auth-user-options"></dl>
                        </div>
                    </div>
                    <a href="javascript:void(0);" class="cd-auth-list-action text-muted mr-4" id="cd-auth-batch-delete"
                       aria-disabled="true" tabindex="-1">批量删除</a>
                    <a href="javascript:void(0);" class="cd-auth-list-action text-muted mr-4 d-none" id="cd-auth-add-other"
                       aria-disabled="true" aria-hidden="true" tabindex="-1">添加至其他目录</a>
                    <a href="javascript:void(0);" class="cd-auth-list-action text-muted d-none" id="cd-auth-cover-other"
                       aria-disabled="true" aria-hidden="true" tabindex="-1">覆盖至其他目录</a>
                </div>
                <div class="modal-height-400 scroll-y">
                    <table class="table table-bordered table-sm">
                        <thead>
                        <tr class="text-center">
                            <th width="65px" class="align-middle"><input type="checkbox" id="cd-auth-user-select-all" class="mr-1">选择</th>
                            <th class="align-middle">用户</th>
                            <th width="70px" class="align-middle">查看</th>
                            <th width="100px" class="align-middle"><input type="checkbox" class="cd-auth-permission-all" data-permission="upload_reference"><br>上传/引用</th>
                            <th width="90px" class="align-middle"><input type="checkbox" class="cd-auth-permission-all" data-permission="edit_file"><br>编辑文件</th>
                            <th width="90px" class="align-middle"><input type="checkbox" class="cd-auth-permission-all" data-permission="edit_dir"><br>编辑目录</th>
                            <th width="90px" class="align-middle"><input type="checkbox" class="cd-auth-permission-all" data-permission="lock_file"><br>锁定文件</th>
                            <th width="65px" class="align-middle">移除</th>
                        </tr>
                        </thead>
                        <tbody id="auth-user-list"></tbody>
                    </table>
                </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="auth-user-save">确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 批量配置至其他目录 Modal -->
<div class="modal fade" id="cd-auth-target-modal" data-backdrop="static" style="z-index: 1060;">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="cd-auth-target-modal-title">添加至其他目录</h5>
            </div>
            <div class="modal-body">
                <div class="border border-danger text-danger px-2 py-2 mb-2" id="cd-auth-cover-warning" style="display:none;">
                    将覆盖目标目录已配置的用户，请谨慎操作
                </div>
                <div class="modal-height-300 scroll-y">
                    <table class="table table-bordered table-sm mb-0">
                        <thead>
                        <tr class="text-center">
                            <th class="align-middle">目录</th>
                            <th width="65px" class="align-middle"><input type="checkbox" id="cd-auth-target-select-all" class="mr-1">选择</th>
                        </tr>
                        </thead>
                        <tbody id="cd-auth-target-list"></tbody>
                    </table>
                </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="cd-auth-target-save" disabled>确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 编辑目录 Modal -->
<div class="modal fade" id="cd-edit-modal" 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-body px-5 py-4">
                <div class="form-group row align-items-center">
                    <label class="col-2 col-form-label text-right" for="cd-edit-parent">目录：</label>
                    <div class="col-10">
                        <select class="form-control form-control-sm" id="cd-edit-parent"></select>
                        <small class="form-text text-warning d-none" id="cd-edit-move-hint"></small>
                    </div>
                </div>
                <div class="form-group row align-items-center">
                    <label class="col-2 col-form-label text-right" for="cd-edit-dir-name">名称：</label>
                    <div class="col-10">
                        <input type="text" class="form-control form-control-sm" id="cd-edit-dir-name" maxlength="100">
                    </div>
                </div>
                <div class="form-group row mb-0">
                    <label class="col-2 col-form-label text-right" for="cd-edit-fixed">固定目录：</label>
                    <div class="col-10 pt-2">
                        <div class="custom-control custom-checkbox">
                            <input type="checkbox" class="custom-control-input" id="cd-edit-fixed">
                            <label class="custom-control-label" for="cd-edit-fixed">固定</label>
                        </div>
                        <small class="form-text text-muted">固定后，目录无法被用户删除</small>
                    </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="cd-edit-save">确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 移动分类 Modal -->
<div class="modal fade" id="cd-move-modal" 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-body">
                <p>将 <strong id="cd-move-source-name"></strong> 移动到：</p>
                <div class="modal-height-300 scroll-y">
                    <table class="table table-bordered table-sm">
                        <thead><tr class="text-center"><th width="40px">选择</th><th>目标分类</th></tr></thead>
                        <tbody id="cd-move-target-list"></tbody>
                    </table>
                </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="cd-move-ok">确定移动</button>
            </div>
        </div>
    </div>
</div>

<!-- 编辑上报说明 Modal -->
<div class="modal fade" id="cd-tips-modal" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">编辑上报说明 - <span id="cd-tips-filing-name"></span></h5>
            </div>
            <div class="modal-body">
                <textarea class="form-control" id="cd-tips-input" rows="4" placeholder="请输入上报说明"></textarea>
            </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="cd-tips-save">保存</button>
            </div>
        </div>
    </div>
</div>

<script>
    // 将模态框移到 body 下，避免 backdrop 遮挡问题
    $('#auth-user-modal, #cd-auth-target-modal, #cd-edit-modal, #cd-move-modal, #cd-tips-modal').appendTo('body');

    const filingData = JSON.parse(unescape('<%- escape(JSON.stringify(filing)) %>'));
    const permissionData = JSON.parse(unescape('<%- escape(JSON.stringify(permissionData)) %>'));
    const filingPermissionData = JSON.parse(unescape('<%- escape(JSON.stringify(filingPermissionData)) %>'));
    const accountList = JSON.parse(unescape('<%- escape(JSON.stringify(accountList)) %>'));
    const configDirLocked = <%- Boolean(ctx.subProject.lock_file) %>;
    const canManageConfigDir = <%- Boolean(canManageDir) %>;
</script>