<template>
 <div class="container resource basic-user-info close-left-menu contaNEW" style="min-height: 646px;">
   <div class="pop-banner clearfix">
<!--     <form class="search-bar" @submit.prevent="getData()">
      <div class="search-btn" >
        <input type="submit" value="搜索">
      </div>
      <input type=" text" v-model="search.search_LIKE_realname" placeholder="输入关键字" style="color: #373737;" >
    </form> -->
      <div class="operate-btns">
        <a href="javascript:;" class="fbtn fb-refresh" @click="getData(true)">刷新</a>
        <a href="javascript:;" class="fbtn fb-add" v-if="'/hospital/user:insert' | myqx" v-link="{path:'/basicUserInfoEdit/0'}">添加</a>
    </div>
        <h3 class="current-module">人员信息管理</h3>
  </div>
  <form class="search-bar mb-20">
    <input type="text" placeholder="请输入用户姓名" maxlength="8" v-rule class="ipt" v-model="search.search_LIKE_realname">
    <div class="search-btn" @click='getData'>
      <input type="button">
    </div>
  </form>
  <!--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="w100">管理员</th>
        <th class="w100">操作</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="user in userList">
        <td>{{$index + 1}}</td>
        <td>{{user.realname}}</td>
        <td>{{user.hdeptname}}</td>
        <td>
          <template v-if="user.bizstate=='Y'">
            有效
          </template>
          <template v-if="user.bizstate=='S'">
            停用
          </template>
          <template v-if="user.bizstate=='N'">
            作废
          </template>
        </td>
        <td>{{user.mobiletel}}</td>
        <td>
          <template v-if="user.ishadministrator=='Y'">
            是
          </template>
          <template v-if="user.ishadministrator=='N'||user.ishadministrator==null">
            <span class="text-color-yellow">否</span>
          </template>
        </td>
        <td class="pt9">
          <a class="btn button-green mar-none" v-link="{path:'/basicUserInfoEdit/' + user.guid}" >明细</a>
        </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 {
      userList: [],
      search: {
        search_LIKE_realname: '',
        pageSize: 50,
        page: 1,
        totalPages: 0,
      }
    };
  },
  methods: {
    getData: function(isRefresh){
      var self = this;
      if(isRefresh) {
        this.search.page = 1;
      }
      Ajax.get('/user', 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>