add.pt 10.9 KB
<html metal:use-macro="load: ../base.pt">
  <div metal:fill-slot="content"> <!-- metal:content -->

  <div  class="panel panel-default">
    <div class="panel-heading">
      <h3 class="panel-title"><i class="fa fa-fw fa-plus"></i>&nbsp;${request.title}</h3>
    </div>

    <div class="panel-body">
      <div class="row">
        <div class="col-md-12">


          <form id="cariform" method="POST" enctype="multipart/form-data" accept-charset="utf-8" class="form-horizontal">

          <div class="alert alert-warning" tal:condition="form and form.error and True or False">
          <div class="error-msg-lbl">Kesalahan Pengisian Form</div>
              <p class="error-msg">${form.errormsg}</p>
          </div>

                  <table class="dataTables_filter" width="100%" style="margin: 15px 0 25px 0;">
                    <tbody>
                    <tr>
                      <td valign="top" class="input-group-addon" style="width: 50px;">NOP</td>

                      <td valign="top" tal:define="field form['nop_pemda']" >
                        ${structure:field.serialize()}
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                      <td valign="top" tal:define="field form['nop_desa']">
                        ${structure:field.serialize()}
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                      <td valign="top" tal:define="field form['nop_blok']">
                        ${structure:field.serialize()}
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                      <td valign="top" tal:define="field form['nop_urut']">
                        ${structure:field.serialize()}
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                      <td valign="top" tal:define="field form['nop_jenis']">
                        ${structure:field.serialize()}
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                      <td valign="top" tal:define="field form['tahun']">
                        <input id="tahun" class=" form-control " type="text" value="${request.session['tahun']}" name="tahun">
                        <p id="error-${field.oid}" class="help-block txt-color-red" tal:condition="field.error"
                        tal:repeat="error field.error.messages()">
                        ${error}</p>
                      </td>

                    <td valign="top" width="600px"> <!-- button group -->
                      <button type="submit" class="btn btn-primary" id="btn-cari"   name="cari"><i class="fa fa-fw fa-search"></i>&nbsp;Cari</button>
                      <button type="submit"  class="btn btn-danger" id="btn-save" name="simpan"><i class="fa fa-fw fa-money"></i>&nbsp;Bayar</button>
                      <!-- <button type="button" class="btn btn-success" id="btn-draft" name="btn-cetak">Draft</button> -->
                      <button type="button" class="btn btn-primary" id="btn-pdf" name="btn-pdf"><i class="fa fa-fw fa-file"></i>&nbsp;Cetak</button>
                      <button type="submit" class="btn btn-warning" id="btn-batal"  name="batal"><i class="fa fa-fw fa-undo"></i>&nbsp;Tutup</button>
                    </td>
                  </tr>
                  </tbody>
                </table>

<div class="clearfix"></div>

  <div class="panel panel-default" title="tagihan"><!--  panel tagihan -->
    <div class="panel-heading">Tagihan</div>
    <div class="panel-body">
      <div tal:define="field form['pokok']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>

      <div tal:define="field form['denda']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>

      <div tal:define="field form['jumlah']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>
      <div tal:define="field form['pembayaran_ke']" style="display:none;">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>
    </div>
  </div> <!--  /panel tagihan -->

  <div class="panel panel-default" title="lokasi"> <!--  panel lokasi -->
    <div class="panel-heading">Lokasi OP</div>
    <div class="panel-body">
      <div tal:define="field form['kecamatan']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>
      <div tal:define="field form['kelurahan']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>
    </div>
  </div> <!--  /panel lokasi -->

  <div class="panel panel-default" title="wajib pajak"> <!-- panel wajib pajak -->
    <div class="panel-heading">Wajib Pajak</div>
    <div class="panel-body">
      <div tal:define="field form['nm_wp_sppt']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
          </div>
        </div>
      </div>

      <div tal:define="field form['jln_wp_sppt']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            ${structure:field.serialize()}
            <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
            tal:repeat="error field.error.messages()">${error}</p>
          </div>
        </div>
      </div>

      <div tal:define="field form['kelurahan_wp_sppt']">
        <div class="form-group" title="" id="item-${field.oid}">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            <div class="input-group">
              ${structure:field.serialize()}
              <span class="input-group-addon">RT</span>
              <div tal:define="field form['rt_wp_sppt']">
                ${structure:field.serialize()}
              </div>
              <span class="input-group-addon">RW</span>
              <div tal:define="field form['rw_wp_sppt']">
                ${structure:field.serialize()}
              </div>
            </div>
          </div>
        </div>
      </div>

      <div tal:define="field form['kelurahan_wp_sppt']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            <div class="input-group">
              ${structure:field.serialize()}
              <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
              tal:repeat="error field.error.messages()">${error}</p>
              <span class="input-group-addon">Kota</span>
              <div tal:define="field form['kota_wp_sppt']">
                ${structure:field.serialize()}
              </div>
            </div>
          </div>
        </div>
      </div>

      <div tal:define="field form['kd_pos_wp_sppt']">
        <div class="form-group">
          <label for="${field.oid}" class="control-label col-md-2"
          id="req-${field.oid}">${field.title}</label>
          <div class="col-md-10">
            <div class="input-group">
              ${structure:field.serialize()}
              <span class="input-group-addon">NPWP</span>
              <div tal:define="field form['npwp_sppt']">
                ${structure:field.serialize()}
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div> <!--  /panel wajib pajak -->

</form>
</div>  <!--panel-body-->
</div>
</div>
</div>

</div><!-- /metal:content -->

<div metal:fill-slot="scripts"> <!-- metal:script -->
  <script>
    $(document).ready(function () {
      var oUrl = '/pbbm/dph';
      $('#pokok, #denda, #jumlah, #ke').prop('readonly',true);
      $('#kecamatan, #kelurahan, #nop_pemda').prop('readonly',true);
      $('#nm_wp_sppt, #jln_wp_sppt, #blok_kav_no_wp_sppt').prop('readonly',true);
      $('#rt_wp_sppt, #rw_wp_sppt, #kelurahan_wp_sppt ').prop('readonly',true);
      $('#kota_wp_sppt, #npwp_sppt, #kd_pos_wp_sppt').prop('readonly',true);

      $('#btn-draft').click(function(){
        console.log('cari');
      });

      $("#btn-pdf").click(function () {
        mID = $("#nop_pemda").val()+$("#nop_desa").val()+$("#nop_blok").val()+
              $("#nop_urut").val()+$("#nop_jenis").val();
        mThn = $("#tahun").val();
        // mKe = $("#ke").val();
        url = "/pbbm/dph/stts/rpt?&nop="+mID+"&tahun="+mThn+"&ke="+1;
        window.open(url);
      });

      $('#btn-batal').click(function(){
        location.replace(oUrl);
      });
    });
  </script>
</div> <!-- /metal:script -->

</html>