ConstructionCost/web/building_saas/budget-summary/html/budget-summary.html

<div class="budget-summary">
  <div class="toolsbar px-1 d-flex justify-content-between">
    <div class="tools-btn btn-group align-top">
      <!-- <span id="openConstructionSet" class="btn btn-light btn-sm" data-toggle="tooltip" data-original-title="建设项目设置"
                data-placement="bottom">
        <a href="javascript:void(0);"><i class="fa fa-cog"></i></a>
      </span> -->
      <a href="javascript:void(0)" class="btn btn-light btn-sm" id="budget-upLevel" data-toggle="tooltip"
        data-placement="bottom" data-original-title="升级"><i class="fa fa-arrow-left" aria-hidden="true"></i></a>
      <a href="javascript:void(0)" class="btn btn-light btn-sm" id="budget-downLevel" data-toggle="tooltip"
        data-placement="bottom" data-original-title="降级"><i class="fa fa-arrow-right"
          aria-hidden="true"></i></a>
      <a href="javascript:void(0)" class="btn btn-light btn-sm" id="budget-upMove" data-toggle="tooltip"
        data-placement="bottom" data-original-title="上移"><i class="fa fa-arrow-up" aria-hidden="true"></i></a>
      <a href="javascript:void(0)" class="btn btn-light btn-sm" id="budget-downMove" data-toggle="tooltip"
        data-placement="bottom" data-original-title="下移"><i class="fa fa-arrow-down" aria-hidden="true"></i></a>
    </div>
  </div>
  <div class="sheet-wrapper" id="budget-summary-sheet"></div>
</div>
<div class="modal fade" id="constructionSet" data-backdrop="static">
  <div class="modal-dialog modal-lg" role="document" style="max-width: 800px;">
      <div class="modal-content ui-draggable">
          <div class="modal-header ui-draggable-handle">
              <h5 class="modal-title">建设项目设置</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">×</span>
              </button>
          </div>
          <div class="modal-body">
            <div class="row">
                <div class="col-3">
                    <ul class="nav flex-column nav-pills" role="tablist">
                        <li class="nav-item"><a class="nav-link active show" data-toggle="pill" href="#construction-setting" id="about-construction-calc" role="tab">关于计算</a></li>
                    </ul>
                </div>
                <div class="col-9">
                    <div class="tab-content">
                        <!--关于计算-->
                        <div class="tab-pane fade active show" id="construction-setting" role="tabpanel">
                            <div class="modal-auto-height">
                                <fieldset class="form-group" id="jcybf">
                                    <h5>价差预备费</h5>
                                    <div class="mt-1">
                                        年造价增涨率<input id="costGrowthRate" class="form-control form-control-sm"  value="0" type="text" style="display: inline-block; width: 90px;">%
                                    </div>
                                    <div class="mt-1">
                                        增涨计费年限<input id="growthPeriod" class="form-control form-control-sm"  value="0" type="text" style="display: inline-block; width: 90px;">
                                    </div>
                                </fieldset>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
          <div class="modal-footer">
            <a href="javascript:void(0);" class="btn btn-primary" id="construction-set-ok" data-dismiss="modal">确定</a>
            <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
          </div>
      </div>
  </div>
</div>