<!--医院月度计划-->
<script >

  module.exports = {
    data: function () {
      return {
        // 医院
        hosList: [],
        // 明细数据
        mxList: [],
        // 查询条件
        search: {
          pageSize: 50,
          page: 1,
          totalPages: 0,
          //total: 0,
          search_LIKE_billno: '',
          search_GTE_inputdate: '',
          search_LTE_inputdate: '',
          search_EQ_medguid:'',
          //search_EQ_billState: '',
        },
        readonlyFlag:false,
      };
    },
    methods: {
      getData: function () {
        var self = this;
        Ajax.get('/trplan/list', this.search)
          .then(function (response){
            var data = response.data.data;
            self.$set('mxList',data.list);

            self.search.pageno = data.pageno;
            self.search.totalPages = data.totalPages;
            self.search.total = data.total;
        })          
      },
      goDetail:function(billno){
        var self = this;
        self.$route.router.go('/trplan/orderMonthPlan2/'+billno);
      },
      // 获得供应商的高值耗材的供应关系中的医院
      getMedListRelation:function(){
        var self = this;
        Ajax.get('/trhv/getMedListRelation')
           .then(function (response){
            var data = response.data;
            if(data.errorCode == 0){
              self.hosList = _.map(data.data, function (item) {
                   return {
                       label: item.name,
                       value: item.guid
                   };
              });
            }else{
              layer.msg(data.message);
            }
        })
      },
    },
    route: {
      activate: function () {
        this.getData();
        this.getMedListRelation();
      }
    },
    watch:{
      // 实时监听复选框勾选变化
      'selectMed': function (val) {
        this.search.search_EQ_medguid = val;
      }
    },
  };
</script>
<template>
  <div class="container resource close-left-menu contaNEW">
    <div class="pop-banner clearfix">

      <div class="operate-btns"></div>
      <h3 class="current-module">医院月度计划</h3>
    </div>
    <!--order-orderlist-view start-->
    <div class="order-orderlist-view clearfix">
      <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">
              <input type="text" id="cn1" v-model="search.search_LIKE_billno" title='计划单号' placeholder='计划单号' maxlength="26" v-rule></div>
          </div>
          <div class="form-group form-label">
            <label for="cn2" class="label">医院</label>
            <div class="control">
              <select-ui :list="hosList" v-model='selectMed' class='inp2'></select-ui>
            </div>
          </div>
        </div> 
        <div class="group-row">
          <div class="form-group">
            <!-- <label for="cn3" class="label lable-xf pl10">录入日期</label> -->
            <div class="control control-date" style="height:34px;overflow: inherit;">
              <div style="width:44%;float:left;">
                <datepicker :target.sync="search.search_GTE_inputdate" :readonly="readonlyFlag" styleobj="width:100% !important;border-radius:8px 0px 0px 8px !important;" title='录入日期起' placeholder='录入日期起'></datepicker>
              </div>
              <div class="text-and">—</div>
              <div style="width:48%;float:left;">
                <datepicker :target.sync="search.search_LTE_inputdate"  :readonly="readonlyFlag" styleobj="width:100% !important;border-radius:0px 8px 8px 0px !important;" title='录入日期止' placeholder='录入日期止'></datepicker>
              </div>
            </div>
          </div>
          <button v-on:click="getData()" 
            class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle fr">查 询</button>
        </div>
      </div>
      <table class="itable itable-td-long-text">
        <thead id="t_header">
          <tr>
            <th class="w50">序号</th>
            <th class="w110">计划单号</th>
            <th class="w130">医院名称</th>
            <th class="w80">计划月份</th>
            <th class="w70">明细条数</th>
            <th class="w110">汇总金额</th>
            <th class="w90">录入员</th>
            <th class="w80">录入日期</th>
            <th class="w80">操作</th>
          </tr>
        </thead>
        <tbody class="txt_v">
          <tr>
            <td colspan="10" v-if="mxList.length==0">
            暂无符合条件的记录
            </td>
          </tr>
          <tr v-for="po in mxList">
            <td>{{$index+1}}</td>
            <td class="t-left pr10">{{po.billno}}</td>
            <td class="t-left pr10">
             {{po.medname}}
            </td>
            <td>{{po.planperiod}}</td>
            <td>{{po.detailrecordsum}}</td>
            <td>{{po.detailmoneysum  | numDigit 2 | numFmt}}元</td>
            <td>{{po.operatername}}</td>
            <td>{{po.inputdate|getYMD}} <br> {{po.inputdate|getHMS}}</td>
            <td>  
              <a v-on:click="goDetail(po.billno)" class="btn button-green">明细</a>
            </td>
          </tr>
        </tbody>
      </table>
      <div class="pagination m-20-0" v-if="mxList.length"> 
        <pagination
           @page-change="getData"
           :page-no.sync="search.page"
           :total-pages.sync="search.totalPages">          
        </pagination>
      </div>
    </div>
  </div>
</template>