<template>
  <div class="container resource">

  <div class="pop-banner clearfix">
    <div class="operate-btns">
    </div>
    <h3 class="current-module">商品主数据审核</h3>
  </div>
  
  <!-- start-->
  <div class="pd-form fast-search-form">
    <div class="group-row">
      <div class="form-group">
        <label for="in1" class="label">申请公司</label>
        <div class="control">
          <input type="text" value="" id="cn1" maxlength="20" placeholder='申请公司' v-model="proposecorpname" v-rule>
        </div>
      </div>
      <div class="form-group">
        <label for="in1" class="label">商品</label>
        <div class="control">

          <input type="text" value="" id="cn2" maxlength="50" placeholder='商品' v-model="goodsname" v-rule>
        </div>
      </div>
    </div>
    <div class="group-row">
      <div class="form-group">
        <label for="in1" class="label">申请时间</label>
        <div class="control control-date">
              <div style="width: 42%;float: left">
                <datepicker :target.sync='startDate' :readonly="readonlyFlag"></datepicker>
              </div>
              <span class="text-and" style="width: 45px">至</span>
              <div style="width: 42%;float: right;">
                <datepicker :target.sync="endDate" :readonly="readonlyFlag"></datepicker>
              </div>
          </div>
      </div>
      <div class="form-group">
        <label for="cn3" class="label">状态</label>
        <div class="control control-filtering control-filtering-green">
          <a :class="{'active all':approvestate==''}" href="javascript:;" @click="approvestate=''" class="option">所有</a>
          <a :class="{'active all':approvestate=='Y'}" href="javascript:;" @click="approvestate='Y'" class="option">未审批</a>
          <a :class="{'active all':approvestate=='N'}" href="javascript:;" @click="approvestate='N'" class="option">已审批</a>
        </div>
      </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(false)">查 询</button>
    </div>
  </div>

  <table class="itable itable-thead-13px itable-bordertop itable-td-long-text" cellpadding="10px"  Cellspacing="2">
    <thead>
      <tr>
        <th class="w50">序号</th>
        <th class="w120 t-left">商品名称</th>
        <th class="w120">规格</th>
        <th class="w120 t-left">生产厂商</th>
        <th class="w120 t-left">供应商</th>
        <th class="w90">申请时间</th>
        <th class="w90">操作</th>
      </tr>
    </thead>
    <tbody> 
      <tr v-for="item in list">
        <td>{{$index+1}}</td>
        <td class="t-left">{{item.GoodsName}}</td>
        <td>{{item.GoodsSpec}}</td>
        <td class="t-left">{{item.Producer}}</td>
        <td class="t-left">{{item.ProposeCorpName}}</td>
        <td>{{item.ProposeDate}}</td>
        <td><a class="btn-d btn-d-activate" v-link="{path:'/dataadminGoodsList/'+item.GUID}">明细</a></td>
      </tr>
    </tbody>
  </table> 

 
    <pagination 
      @page-change="getData"
      :class="['m-20-0']"
      :page-no.sync="search.pageNo"
      :total-pages.sync="search.totalPages">  
    </pagination>

</div>
</template>
<script>
module.exports={
  data: function(){
    return {    
      list:{},  
      goodsname:'',
      proposecorpname:'',
       // 状态查询类名的控制
      approvestate:'',
      startDate:'',
      endDate:'',
      search:{
          pageNo: 1,
          totalPages: 1,
          pageSize:5
      },
    };
  },
  methods: {
    getData: function(falg){
      var self = this;
      var search=self.search;
      if(falg==false){
          search.pageNo=1;
      }
      Ajax.get('/mainDataCheck/findAllPropose',{'page':search.pageNo,'pageSize':search.pageSize,
        'goodsname':self.goodsname,'proposecorpname':self.proposecorpname,'approvestate':self.approvestate,
        'startDate':self.startDate,'endDate':self.endDate}).
          then(function(response){
            if (response.data.errorCode==99) {
              layer.msg(response.data.message);
            }
            var res=response.data.data;
            self.list=res.list;
            search.totalPages=res.totalPages;
            search.pageNo=res.pageNo;
        })    
    },
   },
  route:{
    activate : function(){
      this.getData();
    }
  },
  watch:{
    'approvestate':function(){
      this.getData();
    }
  }
};
</script>