<template>
  <div class="process-container nofixbar">
    <!-- <Row>
      <Col span="24">
        <Operators :batchId="batchId" :server="server"></Operators>
      </Col>
    </Row> -->
    <Row class="mb20">
      <Col span="24">
      <!-- 基本信息  -->
      <BasicInfo
        ref="basicInfo"
        :batchNo="batchNo"
        :server="server"
        :batchId="batchId"
        :basicInfo="basicInfo"
      ></BasicInfo>
      </Col>
    </Row>
    <!-- <Row class="mb20">
      <Col span="24">
        <HeadInfo></HeadInfo>
      </Col>
    </Row>  -->
    <Row class="mb20">
      <Col span="24">
      <PaymentApplyInfo
        ref="paymentApplyInfo"
        :batchId="batchId"
        :applyParams="applyParams"
      ></PaymentApplyInfo>
      </Col>
    </Row>
    <Row class="mb20">
      <Col span="24">
      <PayLineDetailInfo
        ref="payLineDetailInfo"
        :batchId="batchId"
      ></PayLineDetailInfo>
      <!-- <PaymentPreparationInfo ref="paymentPreparationInfo" :batchId="batchId" :applyPrepParams = "applyPrepParams"></PaymentPreparationInfo> -->
      </Col>
    </Row>
    <HeadInfo></HeadInfo>
  </div>
</template>
<script>
import BasicInfo from './components/BasicInfo';
import HeadInfo from './components/HeadInfo';
// import Operators from './components/Operators';
import PaymentApplyInfo from './components/PaymentApplyInfo';
// import PaymentPreparationInfo from './components/PaymentPreparationInfo';
import PayLineDetailInfo from './components/PayLineDetailInfo';
import util from '@paymentPlatformSrc/tools/util.js';
import Server from './server.js';
import { mapState, mapMutations } from 'vuex';
const server = new Server();
const urlParams = util.getUrlParams();
export default {
  components: {
    BasicInfo,
    HeadInfo,
    PaymentApplyInfo,
    // PaymentPreparationInfo,
    // Operators,
    PayLineDetailInfo
  },
  props: {},
  data() {
    return {
      params: {},
      server: server,
      moduleName: 'createPaymentPreparation',
      codeValues: {},
      // batchId:2,
      applyParams: {
        bacthId: ''
      },
      applyPrepParams: {
        batchId: this.batchId
      }
    };
  },
  computed: {
    ...mapState('createPaymentPreparation', {
      batchId: state => state.batchId,
      batchNo: state => state.batchNo,
      basicInfo: state => state.basicInfo,
      basicInfoComponent: state => state.basicInfoComponent,
      paymentApplyInfoComponent: state => state.paymentApplyInfoComponent,
      paymentPreparationInfoComponent: state =>
        state.paymentPreparationInfoComponent,
      payLineDetailInfoComponent: state =>
        state.payLineDetailInfoComponent,
      headInfo: state => state.headInfo,
      paymentApplyInfo: state => state.paymentApplyInfo,
      paymentPreparationInfo: state => state.paymentPreparationInfo
    })
  },
  created: function() {
    // $axios.defaults.headers.crctoken = "eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyaWQiOiJhZG1pbjAwMSIsIm5iZiI6MTUzNTUyNTU0OX0.4mi90zMyH1ABDow4C72_JGm-f8VKTZLr-vBBJLkOBO4#MTM4RTIyREREQURBQzY3NDg0RUJBM0VDQTkyNDAxNEI";
    const urlParams = window.location.href.split('?')[1];
    const paramsArray = urlParams.split('&');
    let paramData = [];
    for (let i = 0; i < paramsArray.length; i++) {
      paramData = paramsArray[i].split('=');
      this.params[paramData[0]] = paramData[1];
    }
    // this.batchNo = this.params.batchNo;
    this.setBatchNo(this.params.batchNo);
    this.setBatchId(this.params.id);
    // this.batchId = this.params.id;
    this.applyParams.batchId = this.params.id;
    this.init();
  },
  beforeMount: function() {},
  mounted: function() {
    document.title = urlParams.menuName || '财务报账系统';
    this.setBasicInfoComponent(this.$refs.basicInfo);
    this.setPaymentApplyInfoComponent(this.$refs.paymentApplyInfo);
    // this.setPaymentPreparationInfoComponent(this.$refs.paymentPreparationInfo);
    // this.basicInfoComponent.init();
    // this.paymentApplyInfoComponent.init();
    // this.paymentPreparationInfoComponent.init();
    this.setPayLineDetailInfoComponent(this.$refs.payLineDetailInfo);
  },
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    ...mapMutations('createPaymentPreparation', [
      'setBatchId',
      'setBatchNo',
      'setBasicInfo',
      'setBasicInfoComponent',
      'setPaymentApplyInfoComponent',
      'setPaymentPreparationInfoComponent',
      'setPayLineDetailInfoComponent',
      'setPaymentApplyInfo',
      'setPaymentPreparationInfo',
      'setValueSet'
    ]),
    queryAndSetValueSet(code) {
      if (!code) {
        return;
      }
      const self = this;
      self.server.QueryValueSetByCode({ code: code }).then(response => {
        this.codeValues[code] = response;
        self.$store.state.createPaymentPreparation.valueSet = this.codeValues;
        if (this.codeValues.length > 2) {
          self.setValueSet(this.codeValues);
        }
      });
    },
    init() {
      const self = this;
      self.setBatchNo(urlParams.batchNo);
      self.setBatchId(urlParams.id);
      // 查询设置基本信息
      // 查询币种值集
      self.queryAndSetValueSet('currency');
      // 查询付款准备状态值集
      self.queryAndSetValueSet('PAY_MENT_STATUS');
      // 查询付款类型值集
      self.queryAndSetValueSet('payType');
      // 查询状态值集
      self.queryAndSetValueSet('payWay');
      // 查询供应商类型值集
      self.queryAndSetValueSet('vendorType');
      self.queryAndSetValueSet('ACCOUNT_TYPE');
      // 查询优先级值集
      self.queryAndSetValueSet('PRIORITY');
      // 查询付款类型值集
      self.queryAndSetValueSet('payState');
      // 查询付款类型值集
      self.queryAndSetValueSet('payType');
      // 查询付款方式值集
      self.queryAndSetValueSet('PAYMENT_MODE');
      // 查询资金计划值集
      self.queryAndSetValueSet('capitalPlan');
      // 查询汇款速度值集
      self.queryAndSetValueSet('remittanceSpeed');
      // 转账类型
      self.queryAndSetValueSet('transfersType');
    }
  }
};
</script>
<style lang="less" >
.process-container {
  overflow: auto;
  width: 100%;
}
.header {
  display: none !important;
}
.tags-con {
  display: none;
}
</style>
