<template>
  <div class="flex-auto">
    <validator name='v'>
      <form novalidate class="form-horizontal select-overspread " @submit.native.prevent>
        <ul class="nav nav-tabs">
          <li class="active a-tabs"><a href="#">修改气价信息</a></li>
        </ul>
        <div>
          <div class="row">
            <div class="col-sm-4" id="f_user_id">
              <label for="f_userinfo_code" class="font_normal_body">用户编号</label>
              <input class="input_search" style="width:60%" type="text" class="input_search" style="width:60%"
                     v-model="model.f_userinfo_code" @blur.prevent="getinfo()" style="width: 100px"
                     disabled placeholder="用户编号">
            </div>
            <div class="col-sm-4" id="name">
              <label for="f_user_name" class=" font_normal_body">用户姓名</label>
              <input class="input_search" style="width:60%" type="text" class="input_search" style="width:60%"
                     v-model="model.f_user_name" readonly style="width: 100px"
                     placeholder="用户姓名" disabled >

            </div>


            <div class="col-sm-4" id="phone">
              <label for="f_user_phone" class=" font_normal_body">联系方式</label>
              <input class="input_search" style="width:60%" type="text" class="input_search" style="width:60%"
                     v-model="model.f_user_phone" readonly style="width: 100px"
                     placeholder="联系方式" disabled >

            </div>
          </div>

          <div>
            <div class="col-sm-12" id="address">
              <label for="f_address" class=" font_normal_body">地&nbsp;&nbsp;&nbsp;&nbsp;址&nbsp;&nbsp;</label>
              <input class="input_search" type="text" class="input_search" style="width:87%" v-model="model.f_address"
                     readonly
                     placeholder="地址">
            </div>

          </div>

          <div class="row">
            <div class="col-sm-4" :class="[$v.f_price_id.required ? 'has-error' : 'has-success']">
              <label class="font_normal_body">气&nbsp;&nbsp;&nbsp;&nbsp;价&nbsp;&nbsp;</label>
              <input type="text" class="input_search" style="width:60%" v-show="false" v-model="model.f_price_id"
                     v-validate:f_price_id='{required: true }'>
              <v-select id="f_price_name"
                        v-model="model.f_price_id"
                        :value.sync="model.f_price_id"
                        :options='pricename'
                        :value-single="true"
                        close-on-select></v-select>
            </div>
          </div>

          <div style="text-align:right;height:auto;margin-top:6px;">
            <button class="button_search" style="width:80px;" @click="confirm()" :disabled='!$v.valid'>
              确认
            </button>

            <button class="button_export" style="width:80px;" @click="close()">取消</button>
          </div>
        </div>

      </form>


    </validator>

  </div>
</template>
<script>
  import {HttpResetClass} from 'vue-client'

  let initGen = async function (self, val) {
// 获取低保气价
    self.$resetpost('rs/sql/get_priceId',
      {data: {f_orgid: self.$login.f.orgid, condition: `1=1`}},
      {resolveMsg: null, rejectMsg: null}).then((res) => {
        let rs = []
        for (let i = 0; i < res.data.length; i++) {
          let temp = {
            label: res.data[i].f_price_name,
            value: res.data[i].f_price_id
          }
          rs.push(temp)
        }
        self.pricename = [...rs]
      })
  }

  export default {
    title: '低保户',
    props: {
      f_islow_income: {
        type: String,
        default: '1'
      },
      data: {
        type: Object
      }
    },
    data () {
      return {
        pricename: [{value: '', label: ''}],
        model: {
          f_userinfo_code: '',
          f_userinfo_id: '',
          f_user_name: '',
          f_address: '',
          f_price_id: '',
          f_price_name: ''
        }
      }
    },
    methods: {
      async confirm () {
        let http = new HttpResetClass()
        console.log(this.model.f_price_id)
        let res = await http.load('POST', 'rs/logic/stopBasicLiving', {data: this.model}, {
          resolveMsg: null,
          rejectMsg: null
        })
        this.$dispatch('success', 'isBasicLiving')
      },
      getorg (id, name) {
        this.f_filialeid = id[0]
        this.f_filialename = name[0]
      },
      initModel () {
        this.model = {
          f_userinfo_code: '',
          f_userinfo_id: '',
          f_user_name: '',
          f_address: '',
          f_price_id: 0,
          f_price_name: ''
        }
      },
      close () {
        this.$dispatch('close')
      }
    },
    ready () {
      initGen(this)
    },
    watch: {
      data (val) {
        this.model = {
          f_userinfo_code: val.f_userinfo_code,
          f_userinfo_id: val.f_userinfo_id,
          f_user_name: val.f_user_name,
          f_address: val.f_address,
          f_price_id: '',
          f_price_name: ''
        }
      }
    }
  }
</script>
<style lang="less">
  #gas-price-form {
    .form-group {
      margin-left: 0px;
      margin-right: 0px;
    }
  }

</style>
