<template>
  <div class="flex">
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri>
        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
          <div class="row">
            <div class="col-sm-3">
              <label for="f_meter_type" class="font_normal_body">气表类型</label>
              <v-select :value.sync="model.f_meter_type"
                        v-model="model.f_meter_type"
                        :options='$parent.$parent.meterType' placeholder='气表类型'
                        close-on-select
                        condition="f_meter_type = '{}'"  style="width: 60%"></v-select>
            </div>
             <div class="col-sm-3">
               <label class="font_normal_body">气表品牌</label>
               <input  type="text" class="input_search" style="width:60%"  v-model="model.f_meter_brand" placeholder='气表品牌'
               condition="f_meter_brand like '%{}%'"
               >
             </div>
            <div class="span" style="float:right;">
             <button class="button_search" @click="$parent.$parent.search()" v-el:cx>查询</button>
             <button class="button_new" @click="$parent.$parent.addNew()">新增</button>
           </div>
          </div>
       </div>
      </criteria>
      <data-grid  :model="model" partial='list' v-ref:grid  class="list_area table_sy" >
        <template partial='head'>
          <tr>
            <th><nobr>序号</nobr></th>
             <th><nobr>气表品牌</nobr></th>
             <th><nobr>气表类型</nobr></th>
             <th><nobr>别名</nobr></th>
             <th><nobr>卡号</nobr></th>
             <th><nobr>使用户数</nobr></th>
            <th><nobr>操作</nobr></th>
          </tr>
        </template>
        <template partial='body'>
          <tr>
            <td style="text-align:center"><nobr>{{$index+1}}</nobr></td>
            <td style="text-align:center"><nobr>{{row.f_meter_brand}}</nobr></td>
            <td style="text-align:center"><nobr>{{row.f_meter_type}}</nobr></td>
            <td style="text-align:center"><nobr>{{row.f_alias}}</nobr></td>
            <td style="text-align:center"><nobr>{{row.f_cardnumber}}</nobr></td>
            <td style="text-align:center"><nobr>{{row.counts}}</nobr></td>
            <td style="text-align:center"><nobr><button class="btn btn-link" @click.stop="$parent.$parent.$parent.operate(row.id)">使用公司</button></nobr></td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>

    <add-usering-org :show.sync="allBrandsView" :f_gasbrand_id="f_gasbrand_id" @select-changed="selected" @success="success"></add-usering-org>

  </div>
</template>

<script>
/**
*阶梯气价查询列表
*/
import { PagedList } from 'vue-client'
import AddUseringOrg from "./AddUseringOrg ";
// import ResSelectGroup from "system-clients/src/components/server/ResSelectGroup";

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

export default {
  components: {AddUseringOrg},

  title: '气表品牌管理导航',
  data () {
    return {
      isChange: false,
      model: new PagedList('rs/sql/getBrandsList', 20),
      meterbrand: [],
      f_gasbrand_id:'',
      allBrandsView: false,
      meterType: [{label: '金额卡表', value: '金额卡表'}, {label: '气量卡表', value: '气量卡表'},{label: '机表', value: '机表'},{label: '物联网表', value: '物联网表'}],
      // 公司下拉
      curorgid: [this.$login.f.orgid],

      f_orgid: '',

      f_filialename: ''
    }
  },
  props: {
    items: {
      type: String,
      default: '*'
    },
    tablename: {
      type: String,
      default: 't_gasbrand'
    },
    orderitem: {
      type: Number,
      default: 'id'
    },
    row: {},
    visiable: true,
    f_filialeid:{
      type: String
    }
  },
  ready () {
    asyncReadyGen(this)
  },
  methods: {
    selfSearch (args) {
      this.allBrandsView = false
      // if (!this.f_orgid) {
      //   this.getorg([this.$login.f.orgid])h
      // }
      args.condition = `${args.condition}`
      this.model.search(args.condition, args.model)
    },
    search () {
      this.$dispatch('search')
    },
    getorg (orgid, orgname) {
      this.f_orgid = this.$login.convertToIn(orgid)
      this.f_filialename = orgname ? orgname[0] : ''
      this.f_filialeid = orgid ? orgid[0] : ''
    },
    selected(){},
    success(){
      console.log("============")
      this.allBrandsView = false
    },
    addNew () {
      this.$dispatch('add')
    },
    operate (id) {
      console.log(id,"=============")
      this.f_gasbrand_id = id
      this.allBrandsView = true
    },
    async delFromOrg (row) {

      console.log('删除关联关系', row)

      // 删除气表与组织的关系
      try {
        await this.$resetdelete('rs/entity/t_gasbrand_orgid', {id: row.f_connec_id}, {resolveMsg: '删除成功', rejectMsg: '删除失败！！'})
        this.$dispatch('success')
      } catch (error) {
        this.$dispatch('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>
