<template>
  <div class="auto">
    <modal :show.sync="blackbatchshow" v-ref:modal large backdrop="false">
    <header slot="modal-header" class="modal-header">
      <h4 class="modal-title">用户批量拉黑</h4>
    </header>
    <article slot="modal-body" class="modal-body">
      <validator name='v'>
        <form novalidate class="form-horizontal select-overspread ">
          <div>
            <div class="row">
<!--              <div class="col-sm-4 form-group" id="f_meternumber">-->
<!--                <label for="f_userinfo_code" class="font_normal_body">表&emsp;&emsp;号</label>-->
<!--                <input class="input_search" style="width:60%" type="text"-->
<!--                       v-model="model.f_meternumber" readonly>-->
<!--              </div>-->
<!--              <div class="col-sm-4 form-group" id="f_card_id">-->
<!--                <label for="f_userinfo_code" class="font_normal_body">卡&emsp;&emsp;号</label>-->
<!--                <input class="input_search" style="width:60%" type="text"-->
<!--                       v-model="model.f_card_id" readonly>-->
<!--              </div>-->
<!--              <div class="col-sm-4 form-group" id="f_userinfo_code">-->
<!--                <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" readonly>-->
<!--              </div>-->
<!--              <div class="col-sm-4 form-group" 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-->
<!--                       placeholder="用户姓名">-->
<!--              </div>-->
<!--              <div class="col-sm-4 form-group" 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-->
<!--                       placeholder="联系方式">-->
<!--              </div>-->
              <div class="col-sm-4 form-group" id="f_limit_times"
                   :class="[$v.f_limit_times.required ? 'has-error' : 'has-success']">
                <label class="font_normal_body">限购次数</label>
                <input class="input_search" style="width:60%" type="number"
                       v-model="model.f_limit_times" v-validate:f_limit_times='{required: true }'
                       placeholder="限购次数">
              </div>
              <div class="col-sm-2 form-group" id="f_limit">
                <v-select
                  width="82%"
                  v-model="f_limit"
                  :value.sync="f_limit"
                  :options='limites'
                  close-on-select>
                </v-select>
              </div>
              <div class="col-sm-3 form-group" id="f_limit_gas" style="right: 3%;">
                <input class="input_search" style="width:60%" type="number" v-if="f_limit=='限购气量'"
                       v-model="model.f_limit_value"
                       v-scale="[model.f_limit_value, 2]"
                       @click="gg()"
                       placeholder="限购气量">
                <input class="input_search" type="number" v-if="f_limit=='限购金额'"
                       v-model="model.f_limit_amount"
                       v-scale="[model.f_limit_amount, 2]"
                       @click="gg()"
                       placeholder="限购金额">

              </div>
            </div>
            <div class="row">
<!--              <div class="col-sm-12 form-group" id="address">-->
<!--                <label for="f_address" class=" font_normal_body">地&emsp;&emsp;址</label>-->
<!--                <input class="input_search" type="text" class="input_search" style="width:87%"-->
<!--                       v-model="model.f_address"-->
<!--                       readonly-->
<!--                       placeholder="地址">-->
<!--              </div>-->
              <div class="col-sm-12 form-group" id="f_comments"
                   :class="[$v.f_comments.required ? 'has-error' : 'has-success']">
                <label for="f_comments" class=" font_normal_body">原&emsp;&emsp;因</label>
                <input class="input_search" type="text" class="input_search" style="width:87%"
                       v-model="model.f_comments"
                       placeholder="原因" v-validate:f_comments='{required: true }'>
              </div>
            </div>
          </div>
        </form>
      </validator>
    </article>
      <footer slot="modal-footer" class="modal-footer">
        <div style="text-align:right;height:auto;margin-top:6px;">
          <button class="button_search" type="button" style="width:80px;" @click="confirm('拉黑')" :disabled='!$v.valid'>
            拉黑
          </button>
          <button class="button_search" type="button" style="width:80px;" @click="close()">
            取消
          </button>
        </div>
      </footer>
    </modal>
  </div>
</template>

<script>
import {HttpResetClass} from "vue-client";

export default {
  name: "BlackListBatch",
  title: '黑名单批量管理',
  props: {
    blackbatchshow: {
      type: Boolean,
      default: false
    },
    data: {
      type: Array,
      default: []
    }
  },
  data () {
    return {
      model: {
        // 限购次数
        f_limit_times: '',
        // 限购气量
        f_limit_value: '',
        // 限购金额
        f_limit_amount: ''
      },
      // 编辑控制
      isBlackList: false,
      f_filialeid: '',  // 所属公司
      f_filialename: '',  // 所属公司名称
      f_limit: '限购气量',
      limites: [{label: '限购气量', value: '限购气量'}, {label: '限购金额', value: '限购金额'}]
    }
  },
  ready () {
    if (this.data) {
      console.log(this.data + '*****************************')
    } else {
      this.initModel()
    }
  },
  watch:{
    'data' (val) {
      this.data = val
      this.initModel()
    }
  },
  methods: {
    close () {
      this.blackbatchshow = false
      this.$dispatch('bacthColse')
    },
    gg () {
      if (this.f_limit[0] === '限购气量') {
        this.model.f_limit_amount = ''
      } else {
        this.model.f_limit_value = ''
      }
    },
    async confirm (type) {
      console.log('所有要添加的数据',this.data)

      let msg = this.data.map((value, index, array)=>{
        let r = {}
        r.f_operat_type = type
        r.f_state = '有效'
        r.f_user_id = value.f_user_id
        r.f_user_name = value.f_user_name
        r.f_comments = this.model.f_comments
        r.f_operator = this.$login.f.name
        r.f_operatorid = this.$login.f.id
        r.f_orgid = this.$login.f.orgid
        r.f_orgname = this.$login.f.orgs
        r.f_depid = this.$login.f.depids
        r.f_depname = this.$login.f.deps
        r.f_operate_date = this.$login.toStandardTimeString()
        r.f_describe = `${this.$login.f.name}对客户${value.f_user_name}进行${type}`
        r.f_userinfo_code = value.f_userinfo_code
        r.f_userinfo_id = {
          f_userinfo_id: value.f_userinfo_id,
          f_user_state: '正常',
          version: 0
        },
        r.f_limit_times = this.model.f_limit_times
        r.f_limit_value = this.model.f_limit_value
        r.f_limit_amount = this.model.f_limit_amount
        return r
      })
      console.log('查看参数msg', msg)
      for (let i = 0; i < msg.length; i++) {
        let v = await this.$resetpost('rs/sql/sale_getUserAndVersion', {data: {condition: `f_userinfo_code='${msg[i].f_userinfo_code}'`, f_orgid: this.$login.f.orgid}}, {
          resolveMsg: null,
          rejectMsg: null
        })
        msg[i].f_userinfo_id.version = v.data[0].version
        let res = await this.$resetpost('rs/logic/backlistOperate', msg[i], {resolveMsg: null, rejectMsg: `${type}失败`})
        if (res.data.code == 500) {
          this.$showMessage(`${type}失败,名单中已拉黑用户无法再拉黑,请先取消拉黑`)
          return
        }
      }
      this.$showMessage(`${type}成功`)
      this.$dispatch('success')
      this.$dispatch('blackclose')
      this.initModel()
    },
    initModel () {
      if (this.data) {
        console.log('initModel', this.data)
      }
    },
  },
}
</script>

<style lang="less">
#gas-price-form {
  .form-group {
    margin-left: 0px;
    margin-right: 0px;
  }
}

</style>
