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

  <div class="pop-banner clearfix">
    <!-- <div class="current-operate"></div> -->
    <div class="operate-btns">
     <a href="javascript:void(0)" class="fbtn fb-send">发送提醒</a>
    </div> 
    <h3 class="current-module">证照到期提醒</h3> 
  </div>
  

  <!--order-orderlist-view start-->
  <div class="order-orderlist-view clearfix">
    
    <div class="pd-form form-label4em mb-40 fast-search-form">
      <div class="group-row">
        <div class="form-group">
          <!-- <label class="label">证照类型</label> -->
          <div class="control select-style">
            <select v-model="flag">
               <option value="" selected="">请选择证照类型</option>
               <option value="11">企业证照</option>
               <option value="12">厂商证照</option>
               <option value="13">代理商</option>
               <option value="14">售后机构</option>
            </select>
          </div>
        </div>
         <div class="form-group">
          <!-- <label for="cn1" class="label">预警日期</label> -->
          <div class="control control-date">
              <input type="text" v-model="reminderdate" style="width: 368px !important;" title='预警日期' placeholder='预警日期'><span class="text-and w90">天以内到期</span>
          </div>
        </div>
      </div>
      <div class="group-row">
     <div class="form-group">
          <!-- <label for="cn1" class="label">供应商</label> -->
          <div class="control">
            <input type="text" v-model="suppliername" title='供应商' placeholder='供应商'>
          </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-bordertop itable-td-long-text">
      <thead>
        <tr>
          <th class="w30">序号</th> 
          <th class="w200">供应商</th>
          <th class="w130">证照名称</th>
          <th class="w100">发证日期</th>
          <th class="w100">有效期至</th>
          <th class="w100">剩余天数</th>
          <th class="w100">提醒次数</th>
          <th class="w100">备注</th>
          <!-- <th class="w80">有效期</th> -->
          <!-- <th class="w80">操作</th> -->
        </tr>
      </thead>
        <tbody class="txt_v">
        <tr v-if="list==null || list.length==0" >
            <td colspan="8">暂无符合条件的记录</td>
        </tr>
        <tr v-for="item in list" v-else>
            <td class="w30">
                <div class="checkbox-control">{{$index+1}}
                    <input type="checkbox" :id="item.licguid" v-model='item.checked'>
                    <label class="checkbox checkboxlist-mr" :for="item.licguid"></label>
                </div>
            </td>
            <td class="t-left pl10">{{item.suppliername}}</td>
            <td>
                <div class="pro-pic">
                    <imagebox v-bind:imgarr="[{img:item.pathOriginal,txt:''}]">
                        <img class="pro-pic" style="margin-top: 0px;"
                             :src="item.pathThumbnail">
                        <span class="pic-max blue-search"></span>
                    </imagebox>
                </div>
            </td>
            <td class="t-left pr10">{{item.begindate|getYMD}}</td>
            <td>{{item.enddate|getYMD}}</td>
            <td>{{item.diffdate}}</td>
            <td>{{item.remarks}}</td>
            <td>{{item.remindcount}}</td>
        </tr>
        </tbody>
    </table>

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


  </div>
  <!--order-orderlist-view end-->

</div>
</template>
<script>
module.exports={
  data: function(){
    return {      
      list:{},
      datalist:{},
      flag:'0',
      reminderdate:'',
      suppliername:'',
      search:{
          page: '1',
          totalPages: '1',
          pageSize:'5'
      },
    };
  },
  methods: {
    getData: function(){
      var self = this;
      Ajax.post('/distributorReport/getExpReminderDaysList',{
        'page':self.search.page,'pageSize':self.search.pageSize,
        'reminderdate':self.reminderdate,'suppliername':self.suppliername,'medname':self.medname,'flag':self.flag}).
          then(function(response){
            var res=response.data.data;
            var path, imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径;
            for(var a=0;a<res.length;a++){
                var pictcontent=JSON.parse(res[a].pictcontent)
                path= imgReg.test(pictcontent[0].original.path) ? pictcontent[0].original.path : pictcontent[0].original.path+pictcontent[0].original.name;
                res[a].path=path;
            }
            self.list=res.list;
            self.search.page=res.pageNo;
            self.search.totalPages=res.totalPages;
            // self.init();
        })    
    },
    init:function () {
      var self=this;
      self.falg='0';
      self.reminderdate='';
      self.suppliername='';

    }
   },
  route:{
    activate : function(){
      this.getData();
    }
  }
};
</script>