/*
 *@description:明细
 *@author: hudw
 *@date: 2022-03-14 15:14:53
*/
<template>
  <a-page-header style="padding: 0">
    <span slot="title" style="font-size: 14px">证件资料</span>
    <updateFormModal ref="updateFormModal" :visible.sync="visible" :view="card_view" @ok="handle_ok" :title="card_title" :currentData="card_data" />
    <a-space v-if="st !== 3" slot="extra">
      <p-button @click="add_card" :disabled="!currentMainRow && !btnSave" type="primary" icon="plus">新增</p-button>
      <p-button @click="isEnable_item(1)" :disabled="mx_selectedRowKeys.length === 0" type="primary">启用</p-button>
      <p-button @click="isEnable_item(0)" :disabled="mx_selectedRowKeys.length === 0" type="danger">停用</p-button>
      <p-button @click="delete_card(null)" :disabled="mx_selectedRowKeys.length === 0" type="danger">删除</p-button>
    </a-space>
    <p-table
      :id="$route.name + '_papers'"
      :autoLoad="false"
      :dataSource.sync="dataSource"
      :selectedRowKeys.sync="mx_selectedRowKeys"
      :scroll="{ x: true, y: 300 }"
      ref="table"
      bordered
      :columns="certificateColumns"
      :remoteUrl="{ url: getCertificateUrl, method: 'post' }"
      dragle
      :rowSelectType="st !== 3 ? 2 : 0"
    >
      <template slot="operation" slot-scope="text, record">
        <a href="javascript:;" @click="show_info_item(record)">查看</a>
        <a-divider v-if="st !== 3" type="vertical" />
        <a href="javascript:;" v-if="st !== 3" @click="update_item(record)" :disabled="!record.status">修改</a>
        <a-divider v-if="st !== 3" type="vertical" />
        <p-switch v-if="st !== 3" :replaceFields="{ true: 10, false: 0 }" @click="toggle_item(record)" :checked="record.status" size="small"></p-switch>
        <a-divider v-if="st !== 3" type="vertical" />
        <a v-if="st !== 3" href="javascript:;" @click.stop="delete_card(record)">删除</a>
      </template>
    </p-table>
  </a-page-header>
</template>
<script>
import { certificateColumns } from './setConfig.js'
import { getCertificateUrl, savePaper, paperIsEnable, removeCard } from '../../js/api'
import updateFormModal from '@/blocks/components/papersUpdateModal/index.updateFormModal.vue'

export default {
  components: { updateFormModal },
  props: {
    clearAll: {
      type: Boolean,
      default: false,
    },
    btnSave: {
      type: Boolean,
      default: false,
    },
    st: {
      type: Number,
      default: 1,
    },
    currentMainRow: {
      type: Object,
      default: () => null,
    },
  },
  watch: {
    clearAll(is) {
      if (is) {
        this.dataSource = []
      }
    },
    currentMainRow(record) {
      this.dataSource = []
      if (!record) {
        this.dataSource = []
      } else {
        record.id && this.reload({ data: { id: record.id } })
      }
    },
  },
  // {
  //         picture:JSON.stringify([{url:'https://www.surely.cool/surely-vue-logo.png'}])
  //       }
  data() {
    return {
      dataSource: [],
      activeKey: '3',
      getCertificateUrl,
      certificateColumns: certificateColumns(this),
      mx_remoteParams: {},
      mx_selectedRowKeys: [],
      transferData: [],
      targetKeys: [],
      visible: false,
      card_title: '',
      card_view: 0,
      card_data: null,
    }
  },

  methods: {
    isEnable_item(number) {
      let arr = this.mx_selectedRowKeys.map((id) => {
        return { id }
      })
      return paperIsEnable(this, arr, number, this.currentMainRow.id)
    },

    show_info_item(record) {
      this.card_view = 3
      this.visible = true
      this.card_title = '查看证件'
      this.card_data = record
    },
    update_item(record) {
      this.card_view = 2
      this.visible = true
      this.card_title = '修改证件'
      this.card_data = record
    },
    //证证新增
    add_card() {
      this.visible = true
      this.card_view = 1
      this.card_title = '新增证件'
      this.card_data = null
    },
    delete_card(record) {
      let data = []
      let { id } = this.currentMainRow || {}
      if (record === null) {
        this.mx_selectedRowKeys.forEach((key) => {
          data.push({ deliverymanId: id, paperId: key })
        })
      } else {
        data = [{ deliverymanId: id, paperId: record.id }]
      }
      removeCard(this, data, id)
    },
    reload(args) {
      return this.$refs.table.reload(args)
    },
    handle_ok(...ages) {
      //true:缓存数据跟主表一起保存，//false:直接调接口保存提交
      return this.btnSave ? this.cache_item(...ages) : this.save_item(...ages)
    },
    async cache_item(submit, close) {
      let values = await submit()
      if (values) {
        if (this.card_view === 2) {
          let index = this.dataSource.findIndex((item) => item.id === values.id)
          if (index > -1) {
            this.dataSource[index] = values
          }
        } else if (this.card_view === 1) {
          //   values.id = 'new_' + (+new Date())
          this.dataSource.unshift(values)
        }

        this.$emit('cache', this.dataSource)
        this.visible = false
      }
    },
    async save_item(submit, close) {
      if (!this.currentMainRow) return
      let values = await submit()
      if (values === null) return close()

      const data = {
        deliverymanId: this.currentMainRow.id,
        deliverymanCode: this.currentMainRow.code,
        deliverymanName: this.currentMainRow.name,
        ...values,
      }
      return savePaper(this, this.card_view, data).then(() => {
        this.reload({ data: { id: this.currentMainRow.id } }).then(() => {
          this.$refs.table.activeID = values.id
        })
      })
    },
    toggle_item(record) {
      // if (this.btnSave) {
      //   record.status = +(!record.status)
      //   this.$emit('cache', this.dataSource)
      //   return
      // }
      let status = +!record.status
      return paperIsEnable(this, [{ id: record.id }], status, this.currentMainRow.id).then(() => {
        this.$refs.table.activeID = record.id
      })
    },
  },
}
</script>
