<div ng-controller="SOB5">
  <script>
    showMenu("SO");
  </script>

  <div class="row">
    <div class="col-sm-38">
      <h4>SOB5-บันทึก-ปรับปรุง ใบสั่งขาย / ใบรับจอง (SO) Basic</h4></div>
    <div class="col-sm-10">
      <p>Version: {{controllerMsg}}</p>
    </div>
  </div>
  <form class="form-horizontal" ng-submit="submit()">
    <div class="form-group">


      <div class="row" id="documentList" ng-show="runMode==='LIST'">
        <div class="row">
          <label class="col-sm-2 control-label">สถานะ </label>
          <div class="col-sm-16">
            <input id="status" ej-dropdownlist e-datasource="statusDocument" e-value="formData.list.status" e-popupHeight="280px" e-width="290"
            />
          </div>

          <label class="col-sm-2 control-label">จาก </label>
          <div class="col-sm-6">
            <input type="text" id="fromDate" ej-datepicker ng-model-options="{updateOn: 'default'}" e-value="formData.list.fromDate"
              e-dateformat="dd/MM/yyyy" e-enablestrictmode="true" e-width="110" />
          </div>

          <label class="col-sm-2 control-label">ถึง </label>
          <div class="col-sm-6">
            <input type="text" id="toDate" ej-datepicker ng-model-options="{updateOn: 'default'}" e-value="formData.list.toDate" e-dateformat="dd/MM/yyyy"
              e-enablestrictmode="true" e-width="110" />
          </div>

          <label class="col-sm-3 control-label">ผู้ดูแล </label>
          <div class="col-sm-6">
            <input type="text" id="saleCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.list.saleCode"
              ng-model="formData.list.salecode" e-select="saleCode" e-width="110" />
          </div>

          <div class="col-sm-4">
            <button type="button" id="btnQuery" class="btn btn-default" ng-click="process()">Query</button>
          </div>
        </div>

        <div id="GridDocumentList" ej-grid ng-data="gridDataList"></div>
      </div>

      <div class="row" id="documentForm" ng-show="runMode!=='LIST'">
        <div class="row">
          <label class="col-sm-6 control-label">*โครงการ</label>
          <div class="col-md-8 col-lg-8">
            <input type="text" id="TPrjCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODTPrjCode"
              e-select="TPrjCode" ng-disabled="runMode=='VIEW'"/>
          </div>
          <label class="col-sm-9 control-label">*สมุด</label>
          <div class="col-md-11 col-lg-11">
            <input type="text" id="TSBkCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODTSBkCode"
              e-select="TSBkCode" ng-disabled="runMode=='VIEW'"/>
          </div>
          <label class="col-sm-5 control-label">*เลขที่เอกสาร</label>
          <div class="col-md-8 col-lg-8">
            <input type="text" id="DOC_NO" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODNo"
            ng-disabled="runMode=='VIEW'"/>
          </div>
        </div>

        <div class="row">
          <label class="col-sm-6 control-label">*ลูกค้า</label>
          <div class="col-md-8 col-lg-7">
            <input type="text" id="TARNCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODTARNCode"
              e-select="TARNCode" ng-keydown="e_TARNCode($event)" ng-disabled="runMode=='VIEW'"/>
          </div>
          <div class="col-md-20 col-lg-21">
            <input type="text" id="TARNName" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false"
              e-value="formData.VS4TSO.TSODCustomerName" ng-disabled="true" e-width="300" />
          </div>
          <label class="col-sm-5 control-label">*วันที่</label>
          <div class="col-sm-7">
            <input type="text" id="DOC_DATE" ej-datepicker ng-model-options="{updateOn: 'default'}" e-value="formData.VS4TSO.TSODDate"
              e-dateformat="dd/MM/yyyy" e-enablestrictmode="true" e-enabled="onEdit" />
          </div>
        </div>

        <div class="row">
          <label class="col-sm-6 control-label">สาขา</label>
          <div class="col-md-8 col-lg-7">
            <input type="text" id="TARDCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODTARDCode"
              e-select="TARDCode" ng-disabled="runMode=='VIEW'"/>
          </div>

          <div class="col-md-9 col-lg-10">
            <input type="text" id="TARDName" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false"
              e-value="formData.TARDName" ng-disabled="true" e-width="150" />
          </div>

          <label class="col-sm-5 control-label">ส่วนลดเริ่มต้น</label>
          <div class="col-md-6 col-lg-6">
            <input type="text" id="TARNDiscount" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false"
              e-value="formData.TARNDiscount" ng-disabled="true" e-width="60" />
          </div>

          <label class="col-sm-5 control-label">ช่องราคา</label>
          <div class="col-sm-7">
            <input id="PRICE_CHANNEL" ej-dropdownlist e-datasource="priceChannel" e-value="formData.VS4TSO.TSODPriceChannel" e-popupHeight="320px"
             e-enabled="onEdit" />
          </div>
        </div>

        <div class="row">
          <label class="col-sm-6 control-label">พนักงานขาย</label>
          <div class="col-md-8 col-lg-8">
            <input type="text" id="TEmpCode" ej-autocomplete e-datasource="" e-showpopupbutton="true" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODTEmpCode"
              e-select="TEmpCode" ng-disabled="runMode=='VIEW'"/>
          </div>

          <label class="col-sm-2 control-label">QT</label>
          <div class="col-md-8 col-lg-8">
            <input type="text" id="REF_NO2" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODRefNo2"
            ng-disabled="runMode=='VIEW'"/>
          </div>

          <label class="col-sm-2 control-label">PO</label>
          <div class="col-md-8 col-lg-8">
            <input type="text" id="REF_NO" ej-autocomplete e-datasource="" e-showpopupbutton="false" e-showemptyresulttext="false" e-value="formData.VS4TSO.TSODRefNo"
            ng-disabled="runMode=='VIEW'"/>
          </div>


          <label class="col-sm-5 control-label">*กำหนดส่ง</label>
          <div class="col-sm-7">
            <input type="text" id="DELIVERY_DATE" ej-datepicker ng-model-options="{updateOn: 'default'}" e-value="formData.VS4TSO.TSODDeliveryDate"
              e-dateformat="dd/MM/yyyy" e-enablestrictmode="true" e-enabled="onEdit"/>
          </div>
        </div>

        <div id="Grid1" ej-grid ng-data="gridData"></div>

        <div class="row">
          <div class="col-md-28 col-lg-28">
            <!--<div class="row">
              <label class="col-sm-10 control-label">ใส่บางคำของสินค้า ที่จะค้นหาก่อนกดปุ่ม</label>
              <div class="col-sm-16">
                <input type="text" id="SEARCH" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false" e-width="200"
                  ng-model="formData.SEARCH" ng-keydown="search($event)" ng-disabled="runMode=='VIEW'"/>
              </div>
              <button type="button" id="btnAddProduct" class="btn glyphicon glyphicon-search" ng-click="TPOSCode()"></button>
            </div>-->
            <div class="row">
              <label class="col-sm-10 control-label">หมายเหตุ</label>
              <div class="col-sm-34">
                <textarea id="REMARK" name="REMARK" style="width:360px;height:85px;" ng-model="formData.VS4TSO.TSODDescription" ng-disabled="runMode=='VIEW'"></textarea>
              </div>
            </div>
            <div class="row">
              <label class="col-sm-10 control-label">เงินมัดจำ</label>
              <div class="col-sm-10">
                <input type="text" id="DEPOSIT" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false" e-width="100"
                  ng-model="formData.VS4TSO.TSODDepositText" class="textAlignRight" ng-keydown="recalculate($event)" ng-disabled="runMode=='VIEW'"/>
              </div>
              <label class="col-sm-4 control-label">Terms</label>
              <div class="col-sm-3">
                <input type="text" id="CONDITION1" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  e-width="35" ng-model="formData.VS4TSO.TSODCondition1" class="textAlignRight" ng-disabled="runMode=='VIEW'"/>
              </div>
              <label class="col-sm-2 control-label">/</label>
              <div class="col-sm-3">
                <input type="text" id="CONDITION_DAY1" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  e-width="35" ng-model="formData.VS4TSO.TSODConditionDay1" class="textAlignRight" ng-disabled="runMode=='VIEW'"/>
              </div>
              <label class="col-sm-3 control-label">N/</label>
              <div class="col-sm-3">
                <input type="text" id="CONDITION_DAY" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  e-width="35" ng-model="formData.VS4TSO.TSODConditionDay" ng-keydown="recalculate($event)" class="textAlignRight" ng-disabled="runMode=='VIEW'"/>
              </div>
            </div>
          </div>

          <div class="col-md-20 col-lg-20">
            <div class="row">
              <label class="col-sm-28 control-label">ส่วนลดรายการ</label>
              <div class="col-sm-20">
                <input type="text" id="DISCOUNT_LIST" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  ng-model="formData.DISCOUNT_LIST" ng-disabled="true" class="textAlignRight" />
              </div>
            </div>
            <div class="row">
              <label class="col-sm-28 control-label">ส่วนลดท้ายบิล</label>
              <div class="col-sm-20">
                <input type="text" id="DISCOUNT_BILL" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  ng-model="formData.VS4TSO.TSODDiscountText" class="textAlignRight" ng-keydown="recalculate($event)" ng-disabled="runMode=='VIEW'"/>
              </div>
            </div>
            <div class="row">
              <label class="col-sm-28 control-label">รวมเป็นเงิน</label>
              <div class="col-sm-20">
                <input type="text" id="TOTAL" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false" ng-model="formData.TOTAL"
                  ng-disabled="true" class="textAlignRight" />
              </div>
            </div>
            <div class="row">
              <label class="col-sm-5 control-label">VAT</label>
              <div class="col-sm-10">
                <input id="VAT_TYPE" ej-dropdownlist e-datasource="vatType" e-value="formData.VS4TSO.TSODVATType" e-popupHeight="280px" e-width="60"
                 e-enabled="onEdit" />
              </div>
              <div class="col-sm-8">
                <input type="text" id="VAT_RATE" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  e-width="60" ng-model="formData.VS4TSO.TSODVATRate" ng-keydown="recalculate($event)" ng-disabled="runMode=='VIEW'" class="textAlignRight" />
              </div>
              <label class="col-sm-5 control-label">%</label>
              <div class="col-sm-20">
                <input type="text" id="VAT_TOTAL" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  ng-model="formData.VAT_TOTAL" ng-disabled="true" class="textAlignRight" />
              </div>
            </div>
            <div class="row">
              <label class="col-sm-28 control-label">รวมเป็นเงินทั้งสิ้น</label>
              <div class="col-sm-20">
                <input type="text" id="GRAND_TOTAL" e-datasource="" ej-autocomplete e-showpopupbutton="false" e-showemptyresulttext="false"
                  ng-model="formData.GRAND_TOTAL" ng-disabled="true" class="textAlignRight" />
              </div>
            </div>
          </div>
        </div>
      </div>
      <!--Set buttons-->
      <div id="buttonBar" class="row"></div>
      <script>
        showButtonBar("DOCUMENT");
      </script>
    </div>
  </form>
  <div ng-show="formReady">
    <a href="" ng-click="toggleQuery()" ng-show="!showQuery">Show Query</a>
    <a href="" ng-click="toggleQuery()" ng-show="showQuery">Hide Query</a>
    <label ng-show="showQuery">{{formData.reportQuery}}</label>
  </div>
</div>