<template>
  <div>
    <a-card :bordered="false" v-show="visible" class="card" :title="modalTitle">
      <a-row :gutter="48" slot="extra">
        <a-col :md="48" :sm="48">
          <span class="table-page-search-submitButtons" style="float: right">
            <a-popconfirm v-if="$auth('repair-application-forms-deal') && (DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.NOT_ALLOCATED === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.ALLOCATED === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)" title="是否要接收？" @confirm="receive">
              <a-button>接收</a-button>
            </a-popconfirm>
<!--            <a-button v-if="DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status" style="margin-left: 8px" type="primary" @click="handleEdit()">编辑</a-button>-->
            <a-button v-if="$auth('repair-application-forms-finish') && DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status" style="margin-left: 8px" type="primary" @click="handleFinish()">委外维修完成</a-button>
            <!--          <a-button v-if="$auth('repair-application-forms-finish') && DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status" style="margin-left: 8px" type="primary" @click="handleSparePick">领用备件</a-button>-->
            <a-button style="margin-left: 8px" @click="handleCancel">返回</a-button>
          </span>
        </a-col>
      </a-row>
      <a-layout>
        <a-layout-content style="background-color: rgb(255, 255, 255)">
          <a-divider orientation="left">委外详情</a-divider>
          <detail-list title="" :col="3">
            <detail-list-item term="委外单号">{{ model.no }}</detail-list-item>
            <detail-list-item term="委外类别">{{ outTypeMap[model.outType] }}</detail-list-item>
            <detail-list-item term="委外时间">{{ model.applyTime }}</detail-list-item>
            <detail-list-item term="委外状态"><badge :text="BaseTool.Object.getField(statusMap,model.status)" :status="DictCache.COLOR.REPAIR_APPLICATION_FORM_STATUS[model.status]"/></detail-list-item>
          </detail-list>
          <detail-list title="" :col="1">
            <!--<detail-list-item term="故障描述">{{ BaseTool.Object.getField(this.descripitionMap, model.content) }}</detail-list-item>-->
            <detail-list-item term="故障描述">{{ model.content }}</detail-list-item>
          </detail-list>
          <detail-list title="" :col="1">
            <detail-list-item term="维修描述">{{ model.repairContent }}</detail-list-item>
          </detail-list>
          <detail-list title="维修图片：" :col="6">
            <upload-image-detail :images-list="model.repairFileList"/>
          </detail-list>
          <a-divider orientation="left">验收详情</a-divider>
          <detail-list title="" :col="3">
            <detail-list-item term="验收开始时间">{{ model.checkStartTime }}</detail-list-item>
            <detail-list-item term="验收结束时间">{{ model.checkEndTime }}</detail-list-item>
            <detail-list-item term="验收人员">{{ model.checkUserName }}</detail-list-item>
            <detail-list-item term="验收描述">{{ model.checkContent }}</detail-list-item>
          </detail-list>
          <detail-list title="验收图片：" :col="6">
            <upload-image-detail :images-list="model.checkFileList"/>
          </detail-list>
        </a-layout-content>
      </a-layout>
      <title-divider title="费用清单" width="90px"></title-divider>
      <div class="table-operator" v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)">
        <a-button type="primary" @click="handleAddFee">
          <a-icon type="plus"/>
          添加
        </a-button>
      </div>
      <a-table
        :data-source="dataFee"
        :columns="columnsFee"
        tableLayout="auto"
        rowKey="id">
        <span slot="action" slot-scope="record">
          <template>
            <a @click="handleViewFee(record)">查看</a>
            <operation-button
              v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)"
              @click="handleEditFee(record)" >修改</operation-button>

            <operation-button
              v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)"
              :type="2"
              title="确认删除该笔费用？"
              @confirm="batchDeleteFee(record.id)" >删除</operation-button>
          </template>
        </span>
      </a-table>
<!--      <title-divider title="原因分析" width="90px"></title-divider>-->
<!--      <div class="table-operator" v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)">-->
<!--        <a-button type="primary" @click="handleAddReason">-->
<!--          <a-icon type="plus"/>-->
<!--          添加-->
<!--        </a-button>-->
<!--      </div>-->
<!--      <a-table-->
<!--        :data-source="dataReason"-->
<!--        :columns="columnsReason"-->
<!--        tableLayout="fixed"-->
<!--        rowKey="id">-->
<!--        <span slot="action" slot-scope="record">-->
<!--          <template>-->
<!--            <a @click="handleViewReason(record)">查看</a>-->
<!--            <operation-button-->
<!--              v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)"-->
<!--              @click="handleEditReason(record)" >修改</operation-button>-->

<!--            <operation-button-->
<!--              v-if="$auth('repair-application-forms-finish') && ( DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.PROCESSING === model.status || DictCache.VALUE.REPAIR_APPLICATION_FORM_STATUS.REBACK === model.status)"-->
<!--              :type="2"-->
<!--              title="确认删除该记录？"-->
<!--              @confirm="batchDeleteReason(record.id)" >删除</operation-button>-->
<!--          </template>-->
<!--        </span>-->
<!--      </a-table>-->

    </a-card>
    <check-form ref="checkForm" @ok="handleOk" />
    <base-out-form ref="outForm" @ok="handleOk" />
    <finish-form ref="finishForm" @ok="handleOk" />
    <dispatch-form ref="dispatchForm" @ok="handleCancel" />
    <assign-form ref="assignForm" @ok="handleCancel" />
    <spare-pick-base-form ref="baseModal" @ok="handleOk"/>
    <repair-project-select-Modal :type="'checkbox'" ref="repairProjectSelectModal" @selected="handleRepairProjectSelected"/>
    <!--    <spare-part-info-select-modal :type="'checkbox'" ref="spareSelectModal" @selected="handleSpareSelected"/>-->
    <base-form-for-repair ref="baseFormForRepair" @ok="handleOk" />
    <spare-store-select-modal ref="spareStoreSelectModal" @selected="handleSpareStoreSelected"/>
    <fee-base-form ref="feeForm" @ok="handleOk" />
    <fee-detail ref="feeDetail" @ok="handleOk" />
    <reason-base-form ref="reasonForm" @ok="handleOk" />
    <reason-detail ref="reasonDetail" @ok="handleOk" />
  </div>
</template>

<script>
import DetailList from '@/components/tools/DetailList'
import { fetchRepairApplicationForm, approve, receive } from '@/api/repair/application-form'
import CheckForm from './CheckForm'
import BaseOutForm from './BaseOutForm'
import FinishForm from './FinishOutForm'
import DispatchForm from './DispatchForm'
import AssignForm from './AssignForm'
import SparePickBaseForm from '../../../store/sparepickform/modules/BaseForm'
import SparePartUsedSelectTable from '@/views/sqarepartmanage/sparepartused/modules/SparePartUsedSelectTable'
import SparePickFormSelectTable from '@/views/store/sparepickform/modules/SparePickFormSelectTable'
import RepairProjectSelectModal from '@/views/repair/repairproject/modules/RepairProjectSelectModal'
import { selectRepairProjectListByRepairId, addRepairProjectRelationBatch, deleteRepairProjectRelations } from '@/api/repair/repairprojectrelation'
import SparePartInfoSelectModal from '@/views/sqarepartmanage/sparepartinfo/modules/SparePartInfoSelectModal'
import BaseFormForRepair from '@/views/sqarepartmanage/sparepartused/modules/BaseFormForRepair'
import { selectSparePartUsedListByRepairId, addSparePartUsedBatch, deleteSparePartUseds } from '@/api/sqarepartmanage/sparepartused'
import SpareStoreSelectModal from '@/views/store/sparestore/modules/SpareStoreSelectModal'
import BaseTool from '@/utils/tool'
import FeeBaseForm from '@/views/repair/fee/modules/BaseForm'
import FeeDetail from '@/views/repair/fee/modules/Detail'
import { deleteRepairFees, fetchRepairFee, queryRepairFee } from '@/api/repair/fee'
import ReasonBaseForm from '@/views/repair/repair-reason/modules/BaseForm'
import ReasonDetail from '@/views/repair/repair-reason/modules/Detail'
import { deleteRepairReasons, fetchRepairReason, queryRepairReason } from '@/api/repair/repair-reason'

const DetailListItem = DetailList.Item

export default {
  name: 'RepairApplicationFormDetail',
  components: {
    CheckForm,
    DetailList,
    ReasonBaseForm,
    ReasonDetail,
    DetailListItem,
    FinishForm,
    BaseOutForm,
    DispatchForm,
    FeeDetail,
    AssignForm,
    FeeBaseForm,
    SparePickBaseForm,
    SparePartUsedSelectTable,
    SparePickFormSelectTable,
    RepairProjectSelectModal,
    SparePartInfoSelectModal,
    BaseFormForRepair,
    SpareStoreSelectModal
  },
  data () {
    return {
      confirmLoading: false,
      mdl: {},
      modalTitle: null,
      needStopMap: {},
      dispatchList: [],
      visible: false,
      // 下拉框map
      sourceMap: {},
      outTypeMap: {},
      typeMap: {},
      levelMap: {},
      descripitionMap: {},
      selectedRowKeys: [],
      statusMap: {},
      repairProjectMap: {},
      repairTechnologyMap: {},
      activeKey: 'a',
      data: [],
      dataSpare: [],
      dataFee: [],
      dataReason: [],
      // 表头
      columns: [
        {
          title: '序号',
          dataIndex: 'index',
          customRender: (text, record, index) => {
            return `${index + 1}`
          }
        },
        {
          title: '编码',
          dataIndex: 'no'
        },
        {
          title: '名称',
          dataIndex: 'name'
        },
        {
          title: '维修类别',
          dataIndex: 'type',
          customRender: (text, record, index) => {
            return this.BaseTool.Object.getField(this.repairProjectMap, text)
          }
        },
        {
          title: '维修工艺',
          dataIndex: 'technology',
          customRender: (text, record, index) => {
            return this.BaseTool.Object.getField(this.repairTechnologyMap, text)
          }
        },
        {
          title: '标准工时',
          dataIndex: 'standardHours'
        },
        {
          title: '标准费用',
          dataIndex: 'standardMoney'
        },
        {
          title: '考核工时',
          dataIndex: 'checkHours'
        },
        {
          title: '操作',
          key: 'action',
          width: '200px',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      columnsSpare: [
        {
          title: '序号',
          dataIndex: 'index',
          customRender: (text, record, index) => {
            return `${index + 1}`
          }
        },
        {
          title: '备件名称',
          dataIndex: 'spareId',
          customRender: (text, record, index) => {
            return record.spareName
          }
        },
        {
          title: '数量',
          dataIndex: 'num'
        },
        {
          title: '价格',
          dataIndex: 'price'
        },
        {
          title: '总价',
          dataIndex: 'totalPrice'
        },
        {
          title: '更换日期',
          dataIndex: 'startDate'
        },
        {
          title: '操作',
          key: 'action',
          width: '200px',
          align: 'center',
          scopedSlots: { customRender: 'actionSpare' }
        }
      ],
      columnsFee: [
        {
          title: '序号',
          dataIndex: 'index',
          customRender: (text, record, index) => {
            return `${index + 1}`
          }
        },
        {
          title: '费用金额',
          dataIndex: 'fee',
          customRender: (text, record, index) => {
            return this.BaseTool.Amount.formatter(text)
          }
        },
        {
          title: '费用类别',
          dataIndex: 'type',
          customRender: (text, record, index) => {
            return this.BaseTool.Object.getField(this.typeMap, text)
          }
        },
        {
          title: '费用原因',
          dataIndex: 'reason'
        },
        {
          title: '费用描述',
          dataIndex: 'descripition'
        },
        {
          title: '备注',
          dataIndex: 'remark'
        },
        {
          title: '操作',
          key: 'action',
          width: '200px',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      columnsReason: [
        {
          title: '序号',
          dataIndex: 'index',
          width: '70',
          customRender: (text, record, index) => {
            return `${index + 1}`
          }
        },
        {
          title: '分析时间',
          dataIndex: 'analyzeTime',
          width: '200px'
        },
        {
          title: '问题描述',
          dataIndex: 'problemDesc',
          ellipsis: true,
          width: '200px'
        },
        {
          title: '原因分析',
          dataIndex: 'reasonAnalysis',
          ellipsis: true,
          width: '200px'
        },
        {
          title: '改进措施',
          dataIndex: 'improveMeasure',
          ellipsis: true,
          width: '200px'
        },
        {
          title: '操作',
          key: 'action',
          width: '200px',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      model: {
        'id': null,
        'sbId': null,
        'partId': null,
        'repairUserId': null,
        'needStop': null,
        'no': null,
        'source': null,
        'applyTime': null,
        'level': null,
        'content': null,
        'status': null,
        'remark': null,
        'updateTime': null,
        'createdUserId': null,
        'updateUserId': null,
        'createdUserName': null,
        'sbName': null,
        'partName': null,
        'updateUserName': null,
        'repairFormVO': null,
        'repairCheckVO': null
      }
    }
  },
  created () {
    // 下拉框map
    this.sourceMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_APPLICATION_FORM_SOURCE)
    this.levelMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_APPLICATION_FORM_LEVEL)
    this.statusMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_APPLICATION_FORM_STATUS)
    this.statusRepairMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_FORM_STATUS)
    this.statusCheckMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_CHECK_STATUS)
    this.needStopMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.YES_NO)
    this.repairProjectMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_PROJECT_TYPE)
    this.repairTechnologyMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_TECHNOLOGY_TYPE)
    this.descripitionMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIRE_ACTION)
    this.typeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_FEE_TYPE)
    this.outTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.REPAIR_OUT_TYPE)
  },
  methods: {
    base (record) {
      this.visible = true
      this.modalTitle = '详情'
      this.model = record
      this.activeKey = 'a'
      this.dispatchList = JSON.parse(record.repairDispatchList)
      this.init()
    },
    init () {
      queryRepairFee({ repairId: this.model.id }).then(res => {
        this.dataFee = res.data
      })
      queryRepairReason({ repairId: this.model.id }).then(res => {
        this.dataReason = res.data
      })
    },
    handleCancel () {
      this.visible = false
      this.confirmLoading = false
      this.$emit('ok')
    },
    receive () {
      this.model.status = 3
      receive(this.model).then(() => {
        // const modal = this.$refs.finishForm
        // modal.base(that.model)
      })
    },
    batchDeleteFee (id) {
      let ids = []
      if (this.BaseTool.String.isBlank(id)) {
        const length = this.selectedRows.length
        if (length === 0) {
          this.$message.info('请选择要删除的记录')
          return
        }
        ids = this.selectedRows.map(item => item.id)
      } else {
        ids = [id]
      }
      deleteRepairFees(ids).then(res => {
        this.$message.info('删除成功')
        this.handleOk()
      })
    },
    handleAddFee () {
      const modal = this.$refs.feeForm
      modal.base(null, this.model)
    },
    handleEditFee (record) {
      fetchRepairFee({ id: record.id }).then(res => {
        const modal = this.$refs.feeForm
        const data = res.data
        data.repairNo = this.model.no
        modal.base(data, this.model)
      })
    },
    handleViewFee (record) {
      fetchRepairFee({ id: record.id }).then(res => {
        const modal = this.$refs.feeDetail
        modal.base(res.data)
      })
    },
    batchDeleteReason (id) {
      let ids = []
      if (this.BaseTool.String.isBlank(id)) {
        const length = this.selectedRows.length
        if (length === 0) {
          this.$message.info('请选择要删除的记录')
          return
        }
        ids = this.selectedRows.map(item => item.id)
      } else {
        ids = [id]
      }
      deleteRepairReasons(ids).then(res => {
        this.$message.info('删除成功')
        this.handleOk()
        this.$refs.table.clearSelected()
      })
    },
    handleAddReason () {
      const modal = this.$refs.reasonForm
      this.visible = false
      modal.base(null, this.model)
    },
    handleEditReason (record) {
      fetchRepairReason({ id: record.id }).then(res => {
        const modal = this.$refs.reasonForm
        this.visible = false
        modal.base(res.data, this.model)
      })
    },
    handleViewReason (record) {
      fetchRepairReason({ id: record.id }).then(res => {
        const modal = this.$refs.reasonDetail
        modal.base(res.data)
      })
    },
    handleOk () {
      this.loading = true
      fetchRepairApplicationForm({ id: this.model.id }).then(res => {
        this.loading = false
        this.model = res.data
        this.visible = true
        this.dispatchList = JSON.parse(this.model.repairDispatchList)
      })
      this.init()
    },
    handleEdit () {
      const modal = this.$refs.finishForm
      modal.base(this.model)
    },
    handleFinish () {
      const modal = this.$refs.finishForm
      modal.base(this.model)
    },
    batchDelete (id) {
      let ids = []
      if (this.BaseTool.String.isBlank(id)) {
        if (length === 0) {
          this.$message.info('请选择要删除的记录')
          return
        }
        ids = this.selectedRows.map(item => item.id)
      } else {
        ids = [id]
      }
      deleteRepairProjectRelations(ids).then(res => {
        this.$message.info('删除成功')
        this.handleOk()
      })
    },
    onSelectChange (selectedRowKeys) {
      console.log('selectedRowKeys changed: ', selectedRowKeys)
      this.selectedRowKeys = selectedRowKeys
    }
  }
}
</script>
