/*
 *@description:
 *@author: hudw
 *@date: 2022-03-14 10:40:55
*/

<template>
  <!-- v-model="tabsKey" -->
  <a-modal class="model-table" :footer="st === 1 ? null : undefined" v-model="sVisible" v-bind="modalConfig" :confirmLoading="confirmLoading" @ok="handleOk">
    <p-card :bordered="false" :loading="loading" :bodyStyle="{ padding: 0, minHeight: '500px' }">
      <a-tabs style="background-color: #fff" @change="tabChange" :activeKey="tabsKey">
        <a-space v-if="tabsKey === 1 && st !== 1" slot="tabBarExtraContent">
          <p-search-modal ref="search" v-show="false" :selectedRowKeys="disableItemId" :open.sync="open" v-bind="searchConfig" @ok="searchModChange" />
          <a-button type="primary" @click.stop="addFee(feeSelectedRowKeys)">添加派车单</a-button>
          <a-button type="primary" @click.stop="removeFee(feeSelectedRowKeys)" :disabled="feeSelectedRowKeys.length === 0">删除派车单</a-button>
        </a-space>
        <a-tab-pane :key="0" tab="结算单信息" forceRender>
          <p-grid-form class="p-grid-view" ref="gird" :span="6" :labelCol="{ span: 8 }" :wrapperCol="{ span: 16 }" :items="fromItems" />
        </a-tab-pane>
        <a-tab-pane :key="1" tab="派车单盘点" forceRender>
          <t-table
            :selectedRowKeys.sync="feeSelectedRowKeys"
            dragle
            bordered
            :id="$route.meta.menuId + '_auditModalTable'"
            :scroll="{ x: true }"
            :columns="columns"
            :data-source.sync="dataSource"
          />
        </a-tab-pane>
      </a-tabs>
    </p-card>
  </a-modal>
</template>
<script>
import { setFromItems } from './setConfig.js';
import { setSearchModal } from './searchModalConfig';
import { loadingBillUrl, getIncomeData } from '../api.js';
import loadingBillColumns from '../mainTable/tableConfig.js';
import { getComputedParameter } from '@/blocks/utils/index.js';

export default {
  name: 'auditModal',
  props: {
    options: {
      type: Object,
      default: () => {},
    },
    recordList: {
      type: null,
    },
    st: {
      type: null,
    },

    title: '',
    visible: false,
    formExtendedField: {
      type: Array,
    },
  },
  data() {
    const columns = loadingBillColumns(this);
    columns.pop();
    const searchConfig = setSearchModal(this);
    searchConfig.tableConfig.columns = columns;
   this.mx_remoteUrl={
        url: loadingBillUrl,
        method: 'post',
      }
    return {
      loading: false,
      open: false,
      searchConfig,

      tabsKey: 0,
      targetKeys: [],
      dataSource: [],
      fromItems: setFromItems(this, this.formExtendedField),
      columns,
      confirmLoading: false,
      details: [],
      sVisible: this.visible,
      feeSelectedRowKeys: [],
    };
  },
  computed: {
    disableItemId() {
      return this.dataSource.map((item) => item.id);
    },
    modalConfig() {
      const { title } = this;
      return { title, width: 1200, destroyOnClose: true, okButtonProps: { props: { disabled: this.dataSource.length === 0 } } };
    },
  },

  watch: {
    visible(value) {
      this.details = [];
      this.tabsKey = 0;

      if (value && this.recordList?.length > 0) {
        this.dataSource = this.recordList
        let arrIds = this.recordList.map(item => {
          return item.id
        });

        getIncomeData(this, arrIds).then((data) => {
          if (data) {
            let form = this.form();
            if (!data.settlementNo) {
              data.settlementNo='结算单号自动生成'
            }
            form.setFieldsValue(data);
          }
        });
      } else {
        this.dataSource = [];
      }
      this.sVisible = value;
    },
    sVisible(value) {
      this.confirmLoading = false;
      if (value && this.view > 0) {
      } else {
      }
      this.$emit('update:visible', value);
    },
    formExtendedField(value) {
      if (value.length > 0) {
        this.fromItems = setFromItems(this, value);
      }
    },
  },
  mounted() {},
  methods: {
    tabChange(value) {
      let form = this.form();
      if (this.st !== 1 && this.tabsKey === 0) {
        return form.validateFields((errors, values) => {
          if (errors) return;
          this.tabsKey = value;
        });
      }
      this.tabsKey = value;
    },
    searchModChange(event, value, array) {
      this.dataSource = this.dataSource.concat(array);
      this.formInit();
    },
    remoteBefore(vnode, res) {

      const { id } = this.recordList;
      res.data.id = id;
    },
    addFee() {
      this.open = true;
    },
    removeFee(arr) {
      this.dataSource = this.dataSource.filter((item) => {
        return !arr.includes(item.id);
      });
      this.feeSelectedRowKeys = [];
      this.formInit();
    },
    add_item() {
      this.details.push({});
      //  this.$refs.table.createRow()
    },
    form() {
      return this.$refs.gird.form;
    },

    handleOk() {
      let form = this.form();
      form.validateFields((errors, values) => {
        if (errors) return;
        values.feeIdList = this.dataSource.map((item) => {
          return item.id;
        });
        this.confirmLoading = true;
        if (values.settlementNo == '结算单号自动生成') {
          values.settlementNo = null
        }
        this.$emit('ok', values, () => {
          this.confirmLoading = false;
        });
      });
    },

    // 重新计算金额
    formInit() {
      let taxAmt = 0;
      this.dataSource.forEach((item) => {
        taxAmt = parseFloat(this.BigJs(taxAmt).plus(item.taxAmt || 0));
      });
      let form = this.form();
      const { taxPoint } = form.getFieldsValue();
      let _tax = taxPoint / 100;
      let noTaxAmt = getComputedParameter(taxAmt / (1 + _tax), 'cost');
      let tax = getComputedParameter(taxAmt - noTaxAmt, 'cost');
      form.setFieldsValue({ taxAmt, tax, noTaxAmt });
    },
  },
};
</script>


