<template>
  
<div class="container resource close-left-menu contaNEW">

  <div class="pop-banner clearfix">
    <div class="operate-btns">
      <a class="fbtn fb-download">导出</a>
    </div>
    <h3 class="current-module">医院库存查询</h3>
  </div>
  
  
  <!--supply-productlist start-->
  <div class="supply-productlist clearfix">
  
    <div class="pd-form fast-search-form ">
      <div class="group-row">
        <div class="form-group"> 
          <!-- <label for="cn1" class="label lable-xf pl10">商品信息</label> -->
          <div class="control">
            <input type="text" v-model="goodsname" title="商品信息" placeholder="商品信息" maxlength="50" v-rule>
          </div>
        </div>
        <div class="form-group">
          <!-- <label for="cn1" class="label lable-xf pl10">有效期</label> -->
          <div class="control control-date" style="height:34px;overflow: inherit;">
              <div style="width: 42%;float: left">
                <datepicker :target.sync='productiondate' :readonly="readonlyFlag" title="有效期起" placeholder="有效期起"styleobj="width:100% !important;border-radius:8px 0px 0px 8px !important;"></datepicker>
              </div>
              <span class="text-and" style="width: 45.7px">—</span>
              <div style="width: 48%;float: right;">
                <datepicker :target.sync="expiredate" :readonly="readonlyFlag" title="有效期止" placeholder="有效期止"styleobj="width:100% !important;border-radius:0px 8px 8px 0px !important;"></datepicker>
              </div>
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
          <!-- <label for="cn1" class="label lable-xf pl10">医院</label> -->
          <div class="control">
            <input type="text" v-model="medname" id="cn1" title="医院" placeholder="医院" maxlength="20" v-rule>
          </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">查 询</button>
      </div>
    </div>
    
    <table class="itable itable-td-long-text">
      <thead id="t_header">
        <tr>
          <th class="w40">序号</th>
          <th class="w130">医院</th>
          <th class="w260">商品</th>
          <th class="w80">单位</th>
          <th class="w80">库存数量</th>
          <th class="w80">批号</th>
          <th class="w80">生产日期</th>
          <th class="w80">有效期</th>
          <!-- <th class="w80">操作</th> -->
        </tr>
      </thead>
      <tbody class="txt_v"  >
        <tr v-for="item in list" v-if="list">
          <td>{{$index+1}}
            <div class="pro-pic" v-bind:style="{backgroundImage: 'url('+item.path+')'}">
              <span class="pic-max blue-search"></span>
            </div>
<!--             <imagebox v-bind:imgarr="item.bigPath">
                 <span class="pic-max blue-search"></span>
            </imagebox> -->
          </td>
          <td class="t-left pr10">{{item.medname}}</td>
          <td class="t-left">
            <div class="p-lr-10">
              {{item.goodsCode}}
              <br>
              <span class="p-tit-green">{{item.goodsname}}</span><br>
              {{item.goodsspec}}<br>
              {{item.producer}}<br>
              {{item.registkey}}
            </div>
          </td>
          <td>{{item.unitstyle}}</td>
          <td class="t-right pr10">{{item.stockqty}}</td>
          <td class="t-left pr10">{{item.lot}}</td>
          <td>{{item.productiondate|getYMD}}</td>
          <td>{{item.expiredate|getYMD}}</td>
        </tr>
        <tr v-else>  
            <td colspan="10">
            暂无符合条件的记录
            </td>
        </tr>
        
      </tbody>
    </table>
    
    <pagination
      @page-change="getData"
      :page-no.sync="search.page"
      :total-pages.sync="search.totalPages">  
    </pagination>

  </div>
  <!--supply-productlist end-->

</div>

</template>
<script>
module.exports={
  data: function(){
    return {      
      list:{},
      datalist:{},

      goodsname:null,
      productiondate:null,
      expiredate:null,
      medname:null,
      search:{
          page: 1,
          totalPages: 1,
          pageSize:50
      },
      read:true
    };
  },
  methods: {
    getData: function(){
      var self = this;
      Ajax.post('/supplierReport/getMedStocklist',{'pageNo':self.search.page,'pageSize':self.search.pageSize,
        'goodsname':self.goodsname,'productiondate':self.productiondate,'expiredate':self.expiredate,'medname':self.medname}).
          then(function(response){
            var res=response.data.data;
            
            var list=res.list;
            var path, imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径;
            for(var a=0;a<list.length;a++){
                var pictcontent=JSON.parse(list[a].pictcontent)
                path=imgReg.test(pictcontent[0].thumbnail.path) ? pictcontent[0].thumbnail.path : pictcontent[0].thumbnail.path+pictcontent[0].thumbnail.name;
                list[a].path=path;

            }
            self.list=list;
            self.search.totalPages=res.totalPages;
        })    
    },
   },
  route:{
    activate : function(){
      this.getData();
    }
  }
};
</script>