<template>
  <div class="auto">
      <validator name='m'>
        <form novalidate class="form-horizontal select-overspread">
          <div class="row" style="margin-top:10px;">
            <div class="col-sm-4">
              <label for="f_user_name" class="font_normal_body ">客户姓名</label>
              <input class="input_search " style="width:60%"  v-model="model.f_user_name" placeholder='客户姓名' :value="row.f_user_name">
            </div>
            <div class="col-sm-4">
              <label for="f_user_phone" class="font_normal_body ">客户电话</label>
              <input class="input_search " style="width:60%"  v-model="model.f_user_phone" placeholder='电话' :value="row.f_user_phone">
            </div>
            <div class="col-sm-4">
              <label for="f_idnumber" class="font_normal_body ">证件号码</label>
              <input class="input_search " style="width:60%"  v-model="model.f_idnumber" placeholder='证件号码' :value="row.f_idnumber">
            </div>
          </div>
          <div class="row" style="margin-top:10px;">
            <div class="col-sm-8">
              <label for="f_address" class="font_normal_body ">客户地址</label>
              <input class="input_search " style="width:80%"  v-model="model.f_address" placeholder='客户地址' :value="row.f_address" readonly>
            </div>
            <div class="col-sm-4">
              <label for="f_idnumber" class="font_normal_body ">车&emsp;&emsp;号</label>
              <input class="input_search " style="width:60%"  v-model="model.f_meternumber" placeholder='车牌号' :value="row.f_meternumber">
            </div>

          </div>
          <div class="row" style="margin-top:10px;">

            <!--<div class="col-sm-4">-->
              <!--<label for="f_user_name" class="font_normal_body ">左&ensp;右&ensp;表</label>-->
              <!--<input class="input_search " style="width:60%"  v-model="model.f_aroundmeter" placeholder='左右表' :value="row.f_aroundmeter" readonly>-->
            <!--</div>-->
            <div class="col-sm-8">
              <label for="f_user_phone" class="font_normal_body ">备&emsp;&emsp;注</label>
              <input class="input_search " style="width:80%"  v-model="model.f_comments" placeholder='备注' :value="row.f_comments" readonly>
            </div>

          </div>
          <div class="row" style="margin-top:10px;">

            <div :class="[$m.f_gasbrand_id.required ? 'has-error' : 'has-success']" class="col-sm-4">
              <input type="text" v-show="false" v-model="model.f_gasbrand"
                     v-validate:f_gasbrand_id='{required: true }' >

              <label for="f_gasbrand_id" class=" font_normal_body">汽车品牌</label>
              <v-select :value.sync="model.f_gasbrand" @change="verifigasbrand()"
                        :options='meterbrands'
                        :placeholder="model.f_gasbrand[0]!==null?model.f_gasbrand[0].f_meter_brand:'请选择'"
                        v-model='model.f_gasbrand'
                        v-ref:brand
                        close-on-select>
              </v-select>
            </div>


            <div :class="[$m.f_gasmodel_id.required ? 'has-error' : 'has-success']" class="col-sm-4">
              <input type="text" v-show="false" v-model="model.f_gasmodel"
                     v-validate:f_gasmodel_id='{required: true }'>
              <label for="f_gasmodel_id" class=" font_normal_body">汽车型号</label>
              <v-select :value.sync="model.f_gasmodel"
                        :options='model.f_gasbrand[0].gasmodel'
                        :placeholder="model.f_gasbrand[0]!==null?model.f_gasbrand[0].f_meter_style:'请选择'"
                        close-on-select
                        v-model='model.f_gasmodel'
                        v-ref:model></v-select>


            </div>
            <div class="col-sm-4" :class="[$m.pricename.required ? 'has-error' : '']">
              <input type="text" v-show="false" v-model="model.f_price_name" v-validate:pricename='{required: true }'>
              <label class="font_normal_body">气价名称</label>
              <v-select :value.sync="model.f_price_name"
                        v-model="model.f_price_name"
                        placeholder='气价名称'
                        :options="getPricenames"
                        @change="priceChange"
                        close-on-select  v-ref:pricename></v-select>
            </div>
            <div class="col-sm-4 form-group">
              <label class="font_normal_body">&ensp;气价备注</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_price_comments" placeholder='气价备注' disabled>
            </div>

          </div>

          <!--<div class="row" style="margin-top:10px;">-->
            <!--<div class="col-sm-4"-->
                 <!--:class="[$m.gas.required ? 'select-error' : '']">-->
              <!--<label for="f_username" class="font_normal_body">用气性质</label>-->
              <!--<input type="text" v-show="false" v-model="model.f_gasproperties" v-validate:gas='{required: true }'>-->
              <!--<v-select :value.sync="model.f_gasproperties" v-model="model.f_gasproperties"-->
                        <!--:options='gasproperties' placeholder='用气性质'-->
                        <!--close-on-select v-ref:gas></v-select>-->
            <!--</div>-->
            <!--<div class="col-sm-4" :class="[$m.type.required ? 'select-error' : '']">-->
              <!--<label for="pricetype" class="font_normal_body">气价类型</label>-->
              <!--<v-select :value.sync="model.f_price_type" v-model="model.f_price_type"-->
                        <!--placeholder='气价类型' :options="pricetypes"-->
                        <!--close-on-select v-ref:type>-->
              <!--</v-select>-->
              <!--<input type="text" v-show="false" v-model="model.f_price_type" v-validate:type='{required: true }'>-->
            <!--</div>-->
            <!---->
          <!--</div>-->
        </form>
        <div style="text-align:right;">
          <button class="button_search btn-gn" @click="confirm()" :disabled='!$v.valid || validateOk'>确认</button>
          <button class="button_clear btn-gn" @click="clean()">取消</button>
        </div>
      </validator>
  </div>
  <upload :blodid="blodid" v-if="false" isremark="true" fusetype="档案完善"></upload>
</template>
<script>
  export default {
    title: '档案完善',
    data () {
      return {
        model: {
          f_userfiles_id: '',
          f_user_name: '',
          f_user_phone: '',
          f_idnumber: '',
          f_gasproperties: [],
          f_gasbrand: [],
          f_gasmodel: [],
          f_address: '',
          f_price_id: '',
          f_gasbrand_id: '',
          f_gasmodel_id: '',
          // f_meter_brand:'',
          // f_meter_style:'',
          f_price_type: [],
          f_price_name: '',
          f_price_comments: '',
          f_filialeid: '',
          f_userinfo_id: ''
        },
        blodid: '',
        showupload: true,
        gasproperties: [],
        validateOk: false,
        pricetypes: this.$appdata.getParam('气价类型')
      }
    },
    props: ['row'],
    ready () {
      this.blodid = this.row.f_userinfo_id
      this.gasproperties = this.$appdata.getParam(this.row.f_user_type)
      if (this.row.f_gasproperties) {
        this.model.f_gasproperties.push(this.row.f_gasproperties)
      }
      if (this.row.f_price_type) {
        this.model.f_price_type.push(this.row.f_price_type)
      }

      if (this.row.f_gasbrand_id) {
        this.meterbrands.forEach((val) => {
          if (this.row.f_gasbrand_id == val.value.id) {
            this.model.f_gasbrand.push(val.value)
          }
        })
      }

      if (this.row.f_gasmodel_id) {
        console.log('汽车下的型号。。。', this.model.f_gasbrand[0].gasmodel)
        this.model.f_gasbrand[0].gasmodel.forEach((res) => {
          if (this.row.f_gasmodel_id == res.value.id) {
            this.model.f_gasmodel.push(res.value)
          }
        })
      }

      this.model.f_userfiles_id = this.row.f_userfiles_id
      this.model.f_user_type = this.row.f_user_type
      this.model.f_filialeid = this.$login.f.orgid
      this.model.f_userinfo_id = this.row.f_userinfo_id
    },
    methods: {
      priceChange (val) {
        if (val.length > 0) {
          // 展示气价备注
          this.model.f_price_comments = val[0].f_comments ? val[0].f_comments : '无'
        }
      },
      async confirm () {
        this.model.f_gasbrand_id = this.model.f_gasmodel[0].f_gasbrand_id
        this.model.f_gasmodel_id = this.model.f_gasmodel[0].id
        this.model.f_price_id = this.model.f_price_name[0].f_price_id
        this.model.f_gasproperties = this.model.f_price_name[0].f_gasproperties
        this.model.f_user_type = this.model.f_price_name[0].f_user_type
        this.model.f_user_name = this.row.f_user_name
        this.model.f_user_phone = this.row.f_user_phone
        this.model.f_meter_classify = this.model.f_gasbrand[0].f_meter_type

        this.model.f_operator = this.$login.f.name
        this.model.f_operatorid = this.$login.f.id
        this.model.f_orgid = this.$login.f.orgid
        this.model.f_orgname = this.$login.f.orgs
        this.model.f_depid = this.$login.f.depids
        this.model.f_depname = this.$login.f.deps

        await this.$resetpost('rs/logic/file_complete', this.model, {resolveMsg: '档案信息已完善成功', rejectMsg: '档案信息完善失败'})
        this.clean()
      },
      clean () {
        this.$info('取消操作')
        this.$dispatch('refresh', this.row)
      },

      printok () {
        this.$dispatch('success')
      },
      validateBill (val) {
        this.validateOk = !val.isOk
      },

      verifigasbrand () {
        this.verifi()
      },
      verifi () {
        if ((this.row == null) && (this.model.f_meternumber) && (this.model.f_gasbrand)) {
          veri(this)
        }
      }
    },
    computed: {
      meterbrands () {
        return this.$GetSaleParam.getGasbrand()
      },
      getPricenames () {
        let f_filialeid = this.$login.f.orgid
        let result = []
        this.$GetSaleParam.prices.forEach((item) => {
          if (item.f_state === '有效' && f_filialeid == item.f_filialeid) {
            let value = {
              label: item.f_price_name,
              value: item
            }
            result.push(value)
          }
        })
        return Array.from(new Set(result))
      }
    }
  }
</script>

<style>
</style>
