order-out-query.vue 9.81 KB
<template>
	<div class="container resource   close-left-menu contaNEW">
      <div class="pop-banner clearfix">
        <div class="operate-btns"> </div>
        <h3 class="current-module">出库单查询</h3>
      </div><!-- {{dual}} -->
      <!-- start-->
        <div class="pd-form fast-search-form">
            <div class="group-row">
                <div class="form-group">
                    <div class="control">
                        <input type="text" v-model="search.search_LIKE_billno"
                               placeholder="出库单号" title="出库单号"></div>
                </div>
                <div class="form-group">
                    <div class="control">
                        <input type="text" v-model="search.search_LIKE_medname"
                               placeholder="采购单位" title="采购单位"></div>
                </div>
               <!-- <div class="form-group form-label">
                    <label class="label" for='cn25'>采购单位</label>
                    <div class="control">
                        <select-ui :list="hosList" v-model='selectMed' class='inp4' id='cn25'></select-ui>
                    </div>
                </div>-->
            </div>
            <div class="group-row">
                <div class="form-group">
                    <label for="cn3" class="label"><!-- 出库日期 --></label>
                    <div class="control control-date" style="height:34px;overflow: inherit;">
                        <div style="width:44%;float:left;height:32px;">
                            <datepicker :target.sync="search.search_GTE_dodate" :readonly="readonlyFlag" title='出库开始日期' placeholder='出库开始日期' styleobj="width:100% !important;border-radius:8px 0px 0px 8px !important;"></datepicker>
                        </div>
                        <span class="text-and">-</span>
                        <div style="width:48%;float:left;height:32px;">
                            <datepicker :target.sync="search.search_LTE_dodate" :readonly="readonlyFlag" title='出库结束日期' placeholder='出库结束日期'
                                        styleobj="width:100% !important;border-radius:0px 8px 8px 0px !important;"></datepicker>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="cn1" class="label w70">业务状态</label>
                    <div class="control control-filtering control-filtering-green"
                         style="float:left;width:350px;">
                        <a class="option" :class="{'all active':search.search_EQ_billstate==''}" href="javascript:void(0)" @click="search.search_EQ_billstate=''">全部</a>
                        <a class="option" :class="{'all active':search.search_EQ_billstate=='D01'}" href="javascript:void(0)" @click="search.search_EQ_billstate='D01'">待提交</a>
                        <a class="option" :class="{'all active':search.search_EQ_billstate=='D02'}" href="javascript:void(0)" @click="search.search_EQ_billstate='D02'">已提交</a>
                        <a class="option" :class="{'all active':search.search_EQ_billstate=='D03'}" href="javascript:void(0)" @click="search.search_EQ_billstate='D03'">已完结</a>
                    </div>
                </div>

            </div>
            <!--<div class="group-row">
                <div class="form-group">
                    <div class="control">
                        <input type="text" v-model="search.search_LIKE_supplierpobillno" title='采购单号' placeholder='采购单号'></div>
                </div>
            </div>-->
            <div class="group-row t-right">
                <button v-on:click="getData(true)" class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle">查 询</button>
            </div>
        </div>

       <!-- <div class="pd-form fast-search-form">
        <div class="group-row">
          <div class="form-group">
            <label for="cn1" class="label">出库单号</label>
            <div class="control">
              <input type="text"  id="cn1" v-model='search.search_LIKE_billno'> </div>
          </div>
          <div class="form-group">
            <label class="label">采购单位</label>
            <div class="control">
              <input type="text"  id="cn1" v-model='search.search_LIKE_medname'> </div>
          </div>
        </div>
        <div class="group-row">
          <div class="form-group">
            <label for="cn3" class="label">出库日期</label>
            <div class="control control-date">
              <div style="width: 42%;float: left">
               <datepicker :target.sync="search.search_GTE_dodate" :readonly="readonlyFlag"></datepicker>
              </div>
              <span class="text-and" style="width: 45px"></span>
              <div style="width: 42%;float: right;">
                 <datepicker :target.sync="search.search_LTE_dodate" :readonly="readonlyFlag"></datepicker>
              </div>
            </div>
          </div>
           <div class="form-group">
            <label for="cn3" class="label">订货日期</label>
            <div class="control control-date">
              <div style="width: 42%;float: left">
              <datepicker :target.sync="search.search_GTE_billdate" :readonly="readonlyFlag"></datepicker>
              </div>
              <span class="text-and" style="width: 45px"></span>
              <div style="width: 42%;float: right;">
                  <datepicker :target.sync="search.search_LTE_billdate" :readonly="readonlyFlag"></datepicker>
              </div>
            </div>
          </div>
        </div>
        <div class="form-group">
          <label for="cn1" class="label">业务状态</label>
          <div class="control control-filtering">
            <a class="{{ stateAll }} option" @click="state('2')">全部</a>
            <a class="{{ stateNo }} option" @click="state('0')"> 待提交</a>
            <a class="{{ stateYes }} option" @click="state('1')">已提交</a>
          </div>
        </div>
        <div class="group-row t-right">
          <button class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle" @click="getData(true)" >查 询</button>
        </div>
      </div>-->
      <table class="itable  itable-thead-13px">
        <thead>
          <tr>
            <th class="w50">序号</th>
            <th class="w100">采购单位</th>
            <th class="w100">出库单号</th>
            <th class="w60">单据类型</th>
            <th class="w80">业务状态</th>
            <th class="w60">明细条目数</th>
            <th class="w80">出库金额(元)</th>
            <th class="w100">采购单号</th>
            <th class="w80">出库日期</th>
            <th class="w80">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr v-if="orderoutQueryList.length==0"><td colspan="10">暂无数据!</td></tr>
            <tr v-for="orderoutquery in orderoutQueryList">
            <td>{{ $index + 1 }}</td>
            <td class="td-purchasing_unit t-left">{{orderoutquery.medname}}</td>
            <td class="td-document_number  t-left">{{orderoutquery.billno}}</td>
            <td class="td-bill_Type">{{orderoutquery.billtype | billtype}}</td>
            <td class="td-document_status">{{orderoutquery.billstate | billstate_trdo}}</td>
            <td class="td-number_of_detail">{{orderoutquery.countsum}}</td>
            <td class="td-detail_amount">{{orderoutquery.detailsum}}</td>
            <td class="td-order_code  t-left">{{orderoutquery.medplanbillno}}</td>
            <td class="td-date_of_entry">{{orderoutquery.dodate | getYMD}}</td>
            <td>
            <a class="btn button-green"   v-link="{ path: '/orderOutQueryView/' + orderoutquery.guid}">明细</a>
                <!-- <div class="from-button">
                <a href="javascript:;" class="green-button p-lr-10"
                   v-link="{ path: '/orderOutQueryView/' + orderoutquery.guid}">明细<i>|</i></a>
                <a href="javascript:;" class="green-button p-lr-10"
                   v-link="{ path: '/planTrack/' + orderoutquery.guid}" v-if="authoritySetting.twoTraceFlag">单据跟踪</a>
                </div> -->
            <!-- v-if="authoritySetting.twoDetailFlag" -->
              <!--<a class=" green-button p-lr-10"  v-link="{ path: '/orderOutQueryView/' + orderoutquery.guid}" >明细</a>-->
              <!--<a class="green-button"  v-link="{ path: '/orderOutQueryTrack/' + orderoutquery.guid}" v-if="authoritySetting.twoTraceFlag">单据跟踪</a>-->

            </td>
          </tr>
        </tbody>
      </table>
      <pagination
         @page-change="getData(false)"
         :class="['m-20-0']"
         :page-no.sync="search.page"
         :total-pages.sync="search.totalPages"></pagination>

    </div>
</template>

<script>
module.exports={
  data: function(){
    return {
      orderoutQueryList: [], 
      search: {
        pageSize: 10,
        page: 1,
        totalPages: 0,
        search_LIKE_billno: '',
        search_LIKE_medname: '',
        search_GTE_dodate: '',
        search_LTE_dodate: '',
        search_GTE_billdate: '',
        search_LTE_billdate: '',
        search_EQ_billstate: '', 
      }, 
    };
  },
  watch:{
      'search.search_EQ_billstate':function(){
        this.getData();
      }
    },    
  methods: { 
    getData: function(isRefresh){
      var self = this;
      if(isRefresh) {
        this.search.page = 1;
      }  
      // console.log(this.$store.state.user);
      Ajax.get('/distrbutorOrder/orderoutQueryList', this.search)
        .then(function (response){
          var data = response.data.data;
          self.$set('orderoutQueryList',data.list);
          self.search.totalPages = data.totalPages;
      })
    },
  },
  route:{
    activate : function(){  
      
      this.getData(true); 
    }
  }
};
</script>