<template>
  <div style="flex:1; " class="flex">
    <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>
           <right-tree :userid.sync='$parent.$parent.userid' :source.sync='$parent.$parent.source'  @re-res="$parent.$parent.getRes" > </right-tree>
         </div>
         <div class="form-group">
           <v-select id="f_meter_brand"
             v-model="model.f_meter_brand"
             placeholder='气表品牌'
             condition="f_meter_brand = '{}'"
             :value.sync="model.f_meter_brand"
             :options='$parent.$parent.meterbrand'
             close-on-select >
           </v-select>
         </div>
         <!-- <div class="form-group">
           <v-select
             :value.sync="model.f_meter_style"
             v-model="model.f_meter_style"
             :options='model.f_meter_brand[0].gasmodel'
             placeholder='气表型号'
             close-on-select>
           </v-select>
         </div> -->
         <div class="form-group">
           <input  type="text" class="form-control" v-model="model.f_manufacturers" placeholder='气表厂家'
           condition="f_manufacturers = '{}'" v-next-el="cx" v-el:qbcj
           :size="model.f_meter_brand ? model.f_meter_brand.length*2 : 4">
         </div>
         <div class="form-group">
           <button class="btn btn-success width-100" @click="$parent.$parent.search()" v-el:cx id="comprehen-gasBra-gasBraLis-查询">查询</button>
         </div>
         <div class="form-group">
           <button class="btn btn-success width-100" @click="$parent.$parent.add()" id="comprehen-gasBra-gasBraLis-新增气表">新增气表</button>
         </div>
       </div>
      </criteria>
      <data-grid  :model="model" partial='list' v-ref:grid>
        <template partial='head'>
          <tr>
             <th>序号</th>
             <th>气表品牌</th>
             <th>气表厂家</th>
             <th>气表类型</th>
             <th>报警气量</th>
             <th>充值上限</th>
             <th>透支额度</th>
             <th>别名</th>
             <th>使用户数</th>
             <th>操作</th>
          </tr>
        </template>
        <template partial='body'>
          <tr>
            <td style="text-align:center">{{$index+1}}</td>
            <td style="text-align:center">{{row.f_meter_brand}}</td>
            <td style="text-align:center">{{row.f_manufacturers}}</td>
            <td style="text-align:center">{{row.f_meter_type}}</td>
            <td style="text-align:center">{{row.f_police_gas}}</td>
            <td style="text-align:center">{{row.f_topup_ceil}}</td>
            <td style="text-align:center">{{row.f_overdr_lines}}</td>
            <td style="text-align:center">{{row.f_alias}}</td>
            <td style="text-align:center">{{row.counts}}</td>
            <td style="text-align:center">
              <button class="btn btn-link " @click.stop="$parent.$parent.$parent.del(row.id)" v-if="row.counts === 0"> 删除 </button>
              <!-- <button class="btn btn-link " @click.stop="$parent.$parent.$parent.modify(row)"> 修改 </button> -->
            </td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
/**
*阶梯气价查询列表
*/
import { PagedList } from 'vue-client'

let asyncReadyGen = async function (self) {
  await self.search()
  await self.$LoadParams.loadParam()
  self.initQueryParam()
}

export default {
  title: '气表品牌管理导航',
  data () {
    return {
      isChange: false,
      // model: new PagedList('rs/sql/singleTable_OrderBy', 20,
      //  {items: '"' + this.items + '"', tablename: '"' + this.tablename + '"', orderitem: '"' + this.orderitem + '"'})
      model: new PagedList('rs/sql/getBrands', 20),
      meterbrand: [],

      filialeNameStr: this.$login.f.f_fengongsi,
      filialeCodeStr: this.$login.f.f_orgids,
      userid:this.$login.f.id,
      source: `tool.getFullTree(this.getRights().where(row.getType() == $organization$))`
    }
  },
  props: {
    items: {
      type: String,
      default: '*'
    },
    tablename: {
      type: String,
      default: 't_gasbrand'
    },
    orderitem: {
      type: Number,
      default: 'id'
    },
    row: {}
  },
  ready () {
    asyncReadyGen(this)
    this.search()
  },
  methods: {
    selfSearch (args) {
      if (args.model.f_meter_brand.length > 0) {
        if (args.model.f_meter_brand[0].f_meter_brand) {
          args.condition = `${args.condition} and f_meter_brand = '${args.model.f_meter_brand[0].f_meter_brand}'`
        }
      }
      args.condition = `${args.condition} and f_filialeids  = '${this.filialeCodeStr}'`
      this.model.search(args.condition, args.model)
    },
    search () {
      this.$dispatch('search')
    },
    getRes (obj) {
      this.filialeNameStr = obj.res
      this.filialeCodeStr = obj.resids
    },
    add () {
      this.$dispatch('add')
    },
    del (id) {
      this.$showMessage('确认删除吗?', ['confirm', 'cancel']).then(
        (response) => {
          if (response === 'confirm') {
            this.transfer(id)
          } else if (response === 'cancel') {
            this.$dispatch('cancel')
          }
        })
    },
    transfer (id) {
      this.$LogicService.delGasBrand(id)
        /*.then(
          (res) => {
            this.$dispatch('success')
          }
        ).catch(
          (error) => {
            this.$dispatch('error', '气表品牌删除', this.data, error)
          }
        )*/
    },
    initQueryParam () {
      let arr = []
      this.$GetSaleParam.getGasbrand().forEach((item) => {
        let temp = {}
        temp.label = item.label
        temp.value = item.value.f_meter_brand
        arr.push(temp)
      })
      this.meterbrand = [{label: '全部', value: ''}, ...arr]
    }
  },
  watch: {
    'model.rows.length' (val) {
      if (val === 1) {
        this.$refs.paged.$refs.grid.select(this.model.rows[0])
      }
    }
  }
}
</script>
