<template>
    <div class="flex" style="flex:1;">
      <criteria-paged :model="model" v-ref:paged>
        <criteria partial="criteria" @condition-changed='$parent.selfSearch' v-ref:cri>
          <div novalidate class="form-inline" partial>
            <div class="form-group">
                <label>表具编号:</label>
                <input type="text" class="form-control" placeholder="表具编号" v-model="model.f_meternumber"
                        v-on:keyup.enter="search" :size="model.f_meternumber ? model.f_meternumber.length*2 : 4"
                        condition="f_meternumber like '{}'">
              </div>
              <div class="form-group">
                <label>生产厂家:</label>
                <input type="text" class="form-control" placeholder="生产厂家" v-model=""
                        v-on:keyup.enter="search"
                        condition="">
              </div>
              <div class="form-group">
                <button class="btn btn-success width-80" type="button" @click="$parent.$parent.search()">查询</button>
              </div>
              <div class="form-group">
                <button class="btn btn-success width-80" type="button" @click="$parent.$parent.add()">入库</button>
              </div>
            </div>
        </criteria>
        <div partial='list'>
          <data-grid :model="model" v-ref:grid >
            <template partial='head'>
              <tr>
                <th>序号</th>
                <th>表具编号</th>
                <th>表具类型</th>
                <th>表具底数</th>
                <th>表具流程</th>
                <th>表具状态</th>
                <th>操作</th>
              </tr>
            </template>
            <template partial='body'>
              <td style="text-align: center;">{{$index + 1}}</td>
              <td style="text-align: center;">{{row.f_meternumber}}</td>
              <td style="text-align: center;">{{row.f_gasmodel_id}}</td>
              <td style="text-align: center;">{{row.f_meter_base}}</td>
              <!--<td style="text-align: center;">{{row.defname}}</td>-->
              <td style="text-align: center;">{{row.f_meter_state}}</td>
              <td style="text-align: center;">{{row.f_table_state}}</td>
              <td style="text-align: center;">
                <dropdown v-if="row.f_meter_state != '报废'">
                  <button type="button" data-toggle="dropdown" style="border: 0px;background: none;" @click="$parent.$parent.$parent.meterflow(row.f_meter_state)">
                    <span class="glyphicon glyphicon-th-list"  style="position: inherit;"></span>
                  </button>
                 <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-right">
                    <li v-for="met in $parent.$parent.$parent.meters">
                      <a href="#" @click="">{{met}}</a>
                    </li>
                  </ul>
                </dropdown>
              </td>
            </template>
          </data-grid>
        </div>
      </criteria-paged>
    </div>
</template>
<script>
  import { PagedList } from 'vue-client'
  import Vue from 'vue'

  let meterReady = async function(self,defname){
    console.log("bb",self.meters)
    let meter = await Vue.resetget("rs/logic/meterflow",{data:''},{resolveMsg: null,rejectMsg: null})
    console.log("aa",meter.data[defname])
    self.meters = meter.data[defname]
  }

  export default {
    title: '调拨',
    data(){
      return {
        model: new PagedList('/rs/sql/querymeter', 20),
        meters: []
      }
    },
    ready() {
      this.search()
    },
    methods: {
      search () {
        this.$refs.paged.$refs.cri.search()
      },
      selfSearch (args) {
        args.condition =  `${args.condition}`
        this.model.search(args.condition, args.model)
      },
      add(){
        this.$dispatch('add')
      },
      meterflow(defname){
        meterReady(this,defname)
        console.log("aaaa",this.meters)
      }
    }

  }
</script>
