<template>
 <div class="container resource basic-user-info close-left-menu contaNEW" style="min-height: 646px;">
   <div class="pop-banner clearfix"> 
        <h3 class="current-module">供应商人员信息</h3>
  </div>
  <div class="pd-form form-label4em mb-20 fast-search-form">
    <div class="group-row">
        <div class="form-group">
          <!-- <label for="cn1" class="label">单据类型</label> -->
          <div class="control select-style">
           <select v-model="search.billtype">
               <option value="" style='display:none;' selected>请选择单据类型</option>
               <option :value="ite.value"  v-for="ite in licensetypeList">{{ite.label}}</option>
            </select>
          </div>
        </div>
       <div class="form-group">
          <!-- <label for="cn1" class="label">制单日期</label> -->
          <div class="control control-date" style="height:34px;overflow: inherit;">
            <div style="width: 42%;float: left">
                <datepicker :target.sync='search.startdate' :readonly="readonlyFlag" placeholder='制单开始日期' title='制单开始日期' 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="search.enddate" :readonly="readonlyFlag" placeholder='制单结束日期' title='制单结束日期' 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">供应商</label> -->
          <div class="control">
            <input type="text"  maxlength="50" v-rule v-model="search.supplierName" title='供应商名称' placeholder='供应商名称'>
          </div>
        </div> 
        <div class="form-group" >
            <label class="label w80 fl">发送状态</label>
            <div class="control control-filtering control-filtering-green fl w350">
                <a class="option" href="javascript:;" :class="{'all active':search.state==''}" v-on:click="search.state=''">全部</a>
                <a class="option" href="javascript:;" :class="{'all active':search.state=='Y'}" v-on:click="search.state='Y'">已发送</a>
                <a class="option" href="javascript:;" :class="{'all active':search.state=='N'}" v-on:click="search.state='N'">未发送</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">查 询</button>
      </div>
    </div>
  <!--basic-user-list start-->
  <table class="itable user-info-list">
    <thead id="t_header">
      <tr>
        <th class="w60">序号</th>
        <th class="w100">供应商名称</th>
        <th class="w110">证照类型</th>
        <th class="w100">发送消息</th>
        <th class="w130">返回消息</th>
        <th class="w130">发送状态</th> 
        <th class="w130">发送时间</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="user in userList">
        <td>{{$index + 1}}</td>
        <td>{{user.suppliername}}</td>
        <td>{{user.zztype}}</td> 
        <td>{{user.message}}</td>  
        <td>{{user.result}}</td>
        <td>{{user.state}}</td>
        <td>{{user.creattime}}</td>  
      </tr>
    </tbody>
  </table>
  <pagination
   @page-change="getData"
   :class="['m-20-0']"
   :page-no.sync="search.page"
   :total-pages.sync="search.totalPages"></pagination>
</div>
</template>

<script>
module.exports={
  data: function(){
    return {
      licensetypeList:this.ctns.licensetype,
      userList: [],
      search: {
        startdate:'',
        enddate:'',
        zzType:'',
        state:'',
        supplierName: '',
        pageSize: 50,
        page: 1,
        totalPages: 0, 
      }
    };
  },
  methods: {
    getData: function(isRefresh){
      var self = this;
      if(isRefresh) {
        this.search.page = 1;
      }
      Ajax.post('/hospitalReport/getApiLogList', this.search)
        .then(function (response){
          var data = response.data.data;
          self.$set('userList',data.list);
          self.search.totalPages = data.totalPages;
        })
    },
    fun:function(){
        var $this= $('.ipt');
        var current_width;
        var text_length = $this.val().length;//获取当前文本框的长度
        current_width = parseInt(text_length) *14;//该12是改变前的宽度除以当前字符串的长度,算出每个字符的长度
        current_width=current_width>318?current_width:318;

        $this.css("width",current_width+"px");
    }
  },
  route:{
    activate : function(){
      this.getData();

    }
  },
  watch:{
    'search.search_LIKE_realname':function(){
      this.fun();
    }
  }
};
</script>