<template>
<view id="distribution-cash">
    <view class="cashContainer">
        <picker :value="selectedIndex" :range="nameList" @change="change">
            <view class="cash-card content-box">
                <view class="card-item">
                    <!--<image src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3082730538,885471532&fm=27&gp=0.jpg"/>-->
                    <view style="line-height: 40px;color: #8a8a8a" v-if="!sink">
                        您还未选择提现的账户
                    </view>
                    <view class="item__ul" v-else>
                        <view class="item_name">{{bank_name}}</view>
                        <view class="item_num">{{bank_card_number}}</view>
                    </view>
                </view>
                <span class="arrow "></span>
            </view>
        </picker>
        <!--<view class="cash-card content-box" >
            <view class="card-item">
                &lt;!&ndash;<image src=""/>&ndash;&gt;
                <view style="line-height: 40px;color: #8a8a8a" >
                    微信账户
                </view>
            </view>
            <span class="arrow "></span>
        </view>-->
        <view class=" cash-input-container">
            <view class="cash-input-title">提现金额</view>
            <view class="cash-input-area mx-1px-top-bottom">
                <view class="cash-input">
                    <span class="symbol">￥</span>
                    <input type="number" placeholder="请输入提现金额" :value="inputValue" @input="inputMoney"></input>
                    <span class="delete" @tap="eliminate">×</span>
                    <span class="cash__input_all" @tap="allMoney">全部提现</span>
                </view>
            </view>
            <view class="cash-input-money">可提现金额{{balance}}元</view>
        </view>
        <view class="cash-card content-box cash_padding" data-url="/pages/distribution/cashRecord/cashRecord" @tap="jumpItem">
            <span class="toCashRecord">查看提现记录</span>
            <span class="arrow"></span>
        </view>

        <view class="cash-to-card" :style="'background: ' + config.mainColor" @tap="submit">
            确认提现
        </view>
    </view>


</view>

</template>
<script>
/**
 * Created by lcfevr on 2018/5/8.
 */
import {pageLogin, getUrl,config,is} from '@/common/js/utils.js';

export default {
  data() {
    return {
      bankList: '',
      selectedIndex: '',
      bank_name: '',
      bank_card_number: '',
      sink: false,
      balance: '',
      limit: '',
      id: '',
      cash_type: '',
      inputValue: '',
      nameList: [],
      config: ''
    };
  },

  onLoad() {
    // 第三方平台配置颜色
    var bgConfig = this.$cookieStorage.get('globalConfig') || '';
    this.setData({
      config: bgConfig
    });
    this.queryBalance();
    this.queryBankCardList();
  },

  components: {},
  props: {},
  methods: {
    jumpItem(e) {
      var url = e.currentTarget.dataset.url;
      wx.navigateTo({
        url: url
      });
    },

    change(e) {
      console.log(e);
      this.setData({
        selectedIndex: e.detail.value,
        bank_name: this.bankList[e.detail.value].bank.bank_name,
        bank_card_number: this.bankList[e.detail.value].bank_card_number,
        id: this.bankList[e.detail.value].id,
        sink: true
      });
    },

    eliminate() {
      this.setData({
        inputValue: ''
      });
    },

    allMoney() {
      this.setData({
        inputValue: this.balance
      });
    },

    inputMoney(e) {
      this.setData({
        inputValue: e.detail.value
      });
    },

    submit() {
      var bank = {
        bank_name: this.nameList[this.selectedIndex] || '',
        money: Number(this.inputValue),
        id: this.id,
        cash_type: this.cash_type
      };
      var message = null;

      if (!bank.bank_name) {
        message = '请选择账户';
      } else if (!bank.money) {
        message = '请输入提现金额';
      } else if (bank.money > Number(this.balance)) {
        message = '可提现金额不足';
      } else if (bank.money < Number(this.limit)) {
        message = '提现金额不能少于' + this.limit + '元';
      }

      if (message) {
        wx.showModal({
          content: message,
          showCancel: false
        });
      } else {
        var data = {
          amount: Number(this.inputValue),
          bank_account_id: this.id,
          cash_type: this.cash_type
        };
        this.applyCash(data);
      }
    },

    // 直接提取到微信钱包，不需要支付宝以及其他渠道  2018.12.28
    queryBankCardList() {
      this.$http.get({
        api: "api/users/BankAccount/show",
        header: {
          Authorization: this.$cookieStorage.get('user_token')
        }
      }).then(res => {
        if (res.statusCode == 200) {
          res = res.data;

          if (res.status) {
            var arr = [];
            var name = [];
            this.setData({
              cash_type: res.meta.type
            });
            var info = {
              bank: {
                id: '',
                bank_name: '微信钱包'
              },
              id: '',
              bank_card_number: '微信钱包直接提现到微信钱包'
            };
            arr.push(info);
            name.push('微信钱包');
            this.setData({
              bankList: arr,
              nameList: name
            }); //customer_wechat

            /* if (res.meta.type == 'customer_wechat') {
                 var info = {
                     bank:{
                         id: '',
                         bank_name: '微信钱包',
                     },
                     id: '',
                     bank_card_number: '微信钱包直接提现到微信钱包'
                 };
                 arr.push(info);
                 name.push('微信钱包')
                  this.setData({
                     bankList: arr,
                     nameList: name
                 })
             } else {
                 res.data.forEach((val)=>{
                     if(val.bank.bank_name == "支付宝"){
                         arr.push(val);
                         var list = val.bank.bank_name + val.bank_card_number
                         name.push(list)
                         this.setData({
                             bankList: arr,
                             nameList: name
                         })
                     }
                 })
             }*/
          } else {
            wx.showModal({
              content: res.message || '请求失败',
              showCancel: false
            });
          }
        } else {
          wx.showModal({
            content: res.message || '请求失败',
            showCancel: false
          });
        }
      });
    },

    //分销中心余额
    queryBalance() {
      this.$http.get({
        api: "api/distribution/cash/balanceSum",
        header: {
          Authorization: this.$cookieStorage.get('user_token')
        }
      }).then(res => {
        if (res.statusCode == 200) {
          res = res.data;

          if (res.status) {
            this.setData({
              balance: res.data.sumBalance / 100,
              limit: res.data.limit
            });
          } else {
            wx.showModal({
              content: res.message || '请求失败',
              showCancel: false
            });
          }
        } else {
          wx.showModal({
            content: res.message || '请求失败',
            showCancel: false
          });
        }
      });
    },

    //提现
    applyCash(data) {
      this.$http.post({
        api: "api/distribution/cash/apply",
        header: {
          Authorization: this.$cookieStorage.get('user_token')
        },
        data: data
      }).then(res => {
        if (res.statusCode == 200) {
          res = res.data;

          if (res.status) {
            wx.showModal({
              content: '提现申请已提交，将在7天内到账，请注意查收',
              showCancel: false,
              success: res => {
                if (res.confirm || !res.cancel && !res.confirm) {
                  wx.redirectTo({
                    url: '/pages/distribution/distributionCenter/distributionCenter'
                  });
                }
              }
            });
          } else {
            wx.showModal({
              content: res.message || '请求失败',
              showCancel: false
            });
          }
        } else {
          wx.showModal({
            content: res.message || '请求失败',
            showCancel: false
          });
        }
      });
    },

    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  },
  computed: {},
  watch: {}
};
</script>
<style rel="stylesheet/less" lang="less">
    @import "cash";
</style>
