form-receipt.client.view.html

/modules/receipts/client/views/form-receipt.client.view.html

https://gitlab.com/pentacode/poweraire-erp
HTML | 201 lines | 184 code | 13 blank | 4 comment | 0 complexity | 85f40f57cc2adbbcc2147ec2f8d18601 MD5 | raw file

<section>
  <div ng-class="!vm.receipt._id ? 'page-header': 'top-spacing'">
    <h1 data-ng-if="!vm.receipt._id">New Receipt</h1>
  </div>

  <div class="form-detials-important dtl-border-top" data-ng-if="vm.receipt.number">
    <div class="dtl-left">
      <span class="dtl-label">RECEIPT NO:</span> {{vm.receipt.number}} <br />
      <span class="small-font"><span class="dtl-label">PURCHASE ORDER NO:</span> {{vm.purchaseOrder.number}}</span>
    </div>
     <div class="dtl-right small-font">
      {{vm.receipt.created | date: 'EEEE M/d/yy h:mm:ss a'}}
    </div>
    <div class="clear-block"></div>
  </div>
  <div class="col-md-12">
    <form name="vm.form.receiptForm" class="form-horizontal" ng-submit="vm.save(vm.form.receiptForm.$valid)" novalidate>
      <fieldset>
        <div class="form-group" show-errors data-ng-if="!vm.receipt._id && !vm.fromPurchaseUI">
          <label class="control-label reqd" for="supplier">Purchase Order No: </label>
          <!--<input name="supplier" type="text" ng-model="vm.ponumber" class="form-control" placeholder="Purchase Order Number" ng-change="vm.searchPONumber()" typeahead="c as c.number for c in vm.po" typeahead-wait-ms="50" ng-blur="vm.selectPONumber()" required>-->
          <select name="supplier" type="text" ng-model="vm.ponumber" id="supplier" class="form-control" placeholder="Purchase Order Number" ng-options="c as c.number for c in vm.purchaseOrder | orderBy: 'c.date'" ng-change="vm.selectPONumber()"  required></select>
          <div ng-messages="vm.form.receiptForm.supplier.$error" role="alert">
            <p class="help-block error-text" ng-message="required">Purchase Order is required.</p>
          </div>
        </div>
        <div class="form-group" show-errors>
          <label class="control-label" for="supplier">Supplier Name: </label>
          <input name="supplier" type="text" ng-value="vm.receipt.purchaseOrder.supplier.name" id="supplier" class="form-control" disabled>
        </div>
        <div class="form-group" show-errors>
          <label class="control-label" for="date">Date: </label>
          <div class="input-group">
            <input type="text" class="form-control" datepicker-popup="dd-MMMM-yyyy" ng-model="vm.receipt.date" is-open="vm.date.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" placeholder="Date" name="date" ng-disabled="vm.receipt._id" />
            <span class="input-group-btn">
              <button type="button" class="btn btn-default" ng-click="vm.openDate($event)" ng-disabled="vm.receipt._id"><i class="glyphicon glyphicon-calendar"></i></button>
            </span>
            <div ng-messages="vm.form.receiptForm.date.$error" role="alert">
            </div>
          </div>
        </div>
        <div class="form-group" show-errors>
          <label class="control-label" for="description">Comments: </label>
          <textarea name="comments" type="text" ng-model="vm.receipt.comments" id="comments" class="form-control" placeholder="Comments" ng-disabled="vm.receipt._id"></textarea>
          <div ng-messages="vm.form.receiptForm.comments.$error" role="alert">
          </div>
        </div>


        <br/>
        <!--<div class="button-cnt button-group" ng-show="!vm.receipt._id">
            <div class="btn btn-primary" ng-click="vm.addLine(vm.receipt.lines)"><i class="glyphicon glyphicon-plus"></i> Add Lines</div>
        </div>-->

        <table class="table table-bordered table-condensed table-striped table-hover table-responsive">
        <tr>
          <th width="24%">Item</th>
          <th width="13%" class="reqd">Quantity</th>
          <th width="7%">Amount (Php) </th>
          <th width="10%">Status</th>
          <th width="40%" class="reqd">Charge Account</th>
          <th width="7%" class="reqd">Serial</th>
          <th width="10px">Action</th>
        </tr>
        <tr data-ng-if="!vm.receipt.lines.length">
          <td colspan="7" align="center">No records found</td>
        </tr>
        <tr data-ng-repeat="list in vm.receipt.lines">
           <td class="cell-readonly">
              {{vm.getPoLine(list.number)}}
              {{ vm.currentPoLine.item.code }} - {{ vm.currentPoLine.item.description }}
          </td>
          <td>
            <input name="quantity" type="number" ng-model="list.quantity" id="quantity" class="form-control" ng-disabled="vm.receipt._id || vm.statusChecking(vm.currentPoLine.status) " oninput="validity.valid || (value='')" min="0">
          </td>
          <td class="cell-readonly">
              {{ vm.getAmountPerLine(list, vm.currentPoLine) | currency:'' }}
          </td>
          <td class="cell-readonly" data-ng-bind="vm.currentPoLine.status"></td>
          <td >
            <div class="input-group"  popover="{{vm.getPopOverDescription(list.chargeAccount)}}" popover-trigger="mouseenter" popover-popup-delay="500" popover-placement="left" >
              <select name="chargeAccount" type="text" ng-model="list.chargeAccount" id="chargeAccount" class="form-control" ng-options="account._id as account.accountDescription for account in vm.chargeAccount" ng-disabled="vm.receipt._id || vm.statusChecking(vm.currentPoLine.status) "></select>
              <span class="input-group-btn">
              <button type="button" class="btn btn-primary" ng-click="vm.openActionCodeLookup($index)" ng-hide="vm.receipt._id || vm.statusChecking(vm.currentPoLine.status)"><i class="glyphicon glyphicon-search" ></i></button>
              </span>
            </div>
          </td>
          <td>
            <div class="btn btn-primary" data-toggle="modal" data-target="#myModal" ng-click="vm.showSerials(list, $index)"><i class="glyphicon glyphicon-search"></i></div>
          </td>
          <td>
            <div class="btn btn-danger" ng-click="vm.deleteLine($index, vm.receipt._id, vm.currentPoLine)" ng-disabled="vm.receipt._id || vm.statusChecking(vm.currentPoLine.status) "><i class="glyphicon glyphicon-trash"></i></div>
          </td>
        </tr>
        </table>

        <div class="lineTotal"><b>Total: </b>{{ vm.computeTotal(vm.receipt.lines, vm.currentPoLine) | currency:'' }}</div>

        <div ng-show="vm.poLine.length">
        <div class="page-subheader">
          <h4>Completed / Cancelled Items</h4>
        </div>

        <table class="table table-bordered table-condensed table-striped table-hover table-responsive">
        <tr>
          <th width="30%">Item</th>
          <th width="10%">Ordered</th>
          <th width="10%">Received</th>
          <th width="10%">Cancelled</th>
          <th width="15%%">Purchased Price (Php)</th>
          <th width="15%">Status</th>
        </tr>
        <tr data-ng-if="!vm.poLine.length">
          <td colspan="5" align="center">No records found</td>
        </tr>
        <tr data-ng-repeat="list in vm.poLine">
           <td class="cell-readonly">
             {{ list.item.code }} - {{ list.item.description }}
          </td>
          <td class="cell-readonly" data-ng-bind="list.ordered"></td>
          <td class="cell-readonly" data-ng-bind="list.received"></td>
          <td class="cell-readonly" data-ng-bind="list.cancelled"></td>
          <td class="cell-readonly">
              {{ list.purchasedPrice | currency:'' }}
          </td>
          <td class="cell-readonly" data-ng-bind="list.status"></td>
        </tr>
        </table>
        </div>

        <div class="form-group">
          <button type="submit" class="btn btn-success" ng-show="!vm.receipt._id">Save</button>
          <button type="button" class="btn btn-default" ng-show="!vm.receipt._id" ng-click="vm.resetReceipt()">Reset</button>
          <button type="button" class="btn btn-primary" data-ui-sref="receipts.purchaseOrder({ purchaseOrderId: vm.purchaseOrder._id })" data-ng-if="vm.fromPurchaseUI">View Purchase Order</button>
          <button type="button" class="btn btn-default" data-ui-sref="receipts.list">Back</button>
        </div>

      </fieldset>
    </form>

    <div class="form-detials dtl-border" data-ng-if="vm.receipt.created">
      <div class="dtl-left">
        <span class="dtl-label" data-ng-if="vm.receipt.updatedBy">Updated By:</span> {{vm.receipt.updatedBy.username}} <br/>
        <span class="dtl-label" data-ng-if="vm.receipt.updated">Date Updated:</span> {{vm.receipt.updated | date: 'medium'}}
      </div>
      <div class="dtl-right">
        <span class="dtl-label" data-ng-if="vm.receipt.createdBy">Created By:</span> {{vm.receipt.createdBy.username}} <br/>
        <span class="dtl-label" data-ng-if="vm.receipt.created">Date Created:</span> {{vm.receipt.created | date: 'medium'}}
      </div>
      <div class="clear-block"></div>
    </div>
  </div>
</section>


<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header bg-primary text-white">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h3 class="modal-title" id="myModalLabel">Serials</h3>
      </div>
      <div class="modal-body">
        <div class="button-cnt button-group" ng-show="!vm.receipt._id">
            <div class="btn btn-primary" ng-click="vm.addSerial(vm.receipt.lines[vm.currentIndex].serials)"><i class="glyphicon glyphicon-plus"></i> Add Serials</div>
        </div>

        <table class="table table-bordered table-condensed table-striped table-hover table-responsive">
        <tr>
          <th width="25%" class="reqd">Serial #</th>
          <th width="60%" class="reqd">Sub Inventory</th>
          <th width="15%" class="reqd">Quantity</th>
          <th width="10px">Action</th>
        </tr>
        <tr data-ng-if="vm.receipt.lines[vm.currentIndex].serials.length === 0">
          <td colspan="7" align="center">No records found</td>
        </tr>
        <tr data-ng-repeat="se in vm.receipt.lines[vm.currentIndex].serials">
            <td>
              <input name="serialNumber" type="text" ng-model="se.serial" id="serialNumber" required ng-disabled="vm.receipt._id" typeahead="serial._id as serial.displaySerial for serial in vm.existingSerials | filter:$viewValue:$emptyOrMatch" typeahead-on-select='onSerialSelect(se,$item,$label)' class="form-control"  typeahead-click-open >
            </td>
            <td>
              <select name="subInventory" type="text" ng-model="se.subInventory" id="subInventory" class="form-control" ng-options="si._id as si.value for si in vm.subInventories" ng-disabled="vm.receipt._id"></select>
            </td>
            <td>
              <input name="serialQty" type="number" ng-model="se.quantity" id="serialQty" class="form-control" required ng-disabled="vm.receipt._id" oninput="validity.valid || (value='')" min="0">
            </td>
            <td>
              <div class="btn btn-danger" ng-click="vm.deleteSerial($index, vm.receipt._id)" ng-disabled="vm.receipt._id"><i class="glyphicon glyphicon-trash"></i> </div>
            </td>
        </tr>
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" ng-click="saveSerial(vm.currentIndex)" data-dismiss="modal">Okay</button>
      </div>
    </div>
  </div>
</div>