Calculation/app/view/stage/detail.ejs

<% include ./stage_sub_menu.ejs %>
<div class="panel-content">
    <div class="panel-title">
        <div class="title-main d-flex">
            <% include ./stage_sub_mini_menu.ejs %>
            <div>
                <div class="d-inline-block">
                    <div class="form-group">
                        <button class="btn btn-sm btn-light text-primary" href="#choose" data-toggle="modal" data-target="#choose">设置生成规则</button>
                    </div>
                </div>
            </div>
            <div class="ml-auto">
                <!--完成中间计量-->
                <% if (!ctx.stage.readOnly) { %>
                    <% if (ctx.stage.check_detail) { %>
                        <a href="javascirpt: void(0);" data-toggle="modal" data-target="#done" class="btn btn-success btn-sm pull-right">完成本期中间计量</a>
                    <% } else { %>
                        <% if (ctx.stage.user_id = ctx.session.sessionUser.accountId) {%>
                        <span class="text-success" id="locked-hint">请继续完成上报审批。如需修改计量，点击 <a href="/tender/<%- ctx.tender.id %>/measure/stage/<%- ctx.stage.order %>/detail/unlock">编辑</a></span>
                        <% } else { %>
                        <span class="text-success" id="locked-hint">已完成，请继续完成「上报审批」 <a href="/tender/<%- ctx.tender.id %>/measure/stage/<%- ctx.stage.order %>/detail/unlock">解锁编辑</a></span>
                        <% } %>
                    <% } %>
                <% } %>
            </div>
        </div>
    </div>
    <div class="content-wrap">
        <div class="c-header p-0">
        </div>
        <div class="row w-100 sub-content">
            <!--左栏-->
            <div class="c-body col-8">
                <!--上部分-->
                <div class="sjs-height-0" id="detail-spread">
                </div>
            </div>
            <!--右栏-->
            <div class="c-body col">
                <div class="sjs-bar-1">
                    <ul class="nav nav-tabs">
                        <li class="nav-item">
                            <a class="nav-link active" data-toggle="tab" href="#zhongjian" role="tab">中间计量数据</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#xmujmx" role="tab">项目节明细</a>
                        </li>
                    </ul>
                </div>
                <div class="tab-content">
                    <div class="tab-pane active" id="zhongjian">
                        <div class="sjs-sh-1" style="overflow: auto;">
                            <% if (!stage.readOnly && stage.check_detail) { %>
                            <div class="d-flex justify-content-end mt-1 mr-1">
                                <a href="javascript: void(0);" class="btn btn-sm btn-outline-primary" id="edit-detail">编辑</a>
                                <a href="javascript: void(0);" class="btn btn-sm btn-outline-success mr-1" id="save-detail" style="display: none;">保存</a>
                                <a href="javascript: void(0);" class="btn btn-sm btn-outline-secondary" id="cancel-detail" style="display: none;">取消</a>
                            </div>
                            <% } %>
                            <div class="form-group">
                                <label>变更令号：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" id="bgl-code">
                            </div>
                            <div class="form-group">
                                <label>部位：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" value="" id="bw-name">
                            </div>
                            <div class="form-group">
                                <label>起始桩号：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" value="" id="start-peg">
                            </div>
                            <div class="form-group">
                                <label>终止桩号：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" value="" id="end-peg">
                            </div>
                            <div class="form-group">
                                <label>计量单元：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" value="" id="unit-name">
                            </div>
                            <div class="form-group">
                                <label>图号：</label>
                                <input class="form-control form-control-sm" type="text" readonly="" value="" id="drawing-code">
                            </div>
                            <div class="form-group">
                                <label>计算式说明：</label>
                                <textarea class="form-control" readonly="" id="calc-memo"></textarea>
                            </div>
                            <div class="form-group">
                                <div class="d-flex justify-content-between my-3">
                                    <label>计算草图：</label>
                                    <% if (!stage.readOnly && stage.check_detail) { %>
                                    <a href="#edit-img" data-toggle="modal" data-target="#edit-img" id="modify-img">添加草图</a>
                                    <% } %>
                                </div>
                                <p id="calc-img"><img src="" class="d-100" width="100%"></p>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="xmujmx">
                        <div class="sjs-sh-1" style="overflow: auto;">
                            <div class="sjs-height-3">
                                <table class="table table-bordered">
                                    <thead>
                                    <tr><th>编号</th><th>名称</th><th>本期计量数量/金额</th></tr>
                                    </thead>
                                    <tbody id="leaf-xmj-list">
                                    </tbody>
                                </table>
                            </div>
                            <div class="sjs-bottom">
                                <ul class="nav nav-tabs">
                                    <li class="nav-item">
                                        <a class="nav-link active">部位明细</a>
                                    </li>
                                </ul>
                                <div class="tab-content">
                                    <div class="tab-pane active">
                                        <div class="sjs-bottom-2">
                                            <table class="table table-sm table-bordered">
                                                <thead>
                                                <tr><th>部位</th><th>台帐数量</th><th>本期计量数量</th></tr>
                                                </thead>
                                                <tbody id="pos-list">
                                                <tr><td>0#桥台1#桩</td><td>126</td><td>40</td></tr>
                                                <tr><td>0#桥台2#桩</td><td>126</td><td>40</td></tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    const readOnly = <%- (stage.readOnly || !stage.check_detail) %>;
    const stage = JSON.parse('<%- JSON.stringify(ctx.stage) %>');
    const imType = JSON.parse('<%- JSON.stringify(imType) %>');
</script>