hitch-sb-antd/src/views/sb/info/modules/DetailBak.vue

<template>
  <a-card :bordered="false" v-show="visibleDetail" class="card" :title="modalTitle">
    <div v-show="visible">
      <a-row :gutter="48" slot="extra">
        <a-col :md="48" :sm="48">
          <span class="table-page-search-submitButtons" style="float: right">
            <a-badge :count="numPartInfo" title="设备部位总数" :number-style="{ backgroundColor: '#52c41a' }">
              <a-button style="margin-left: 16px" type="default" @ok="handleOk" @click="partInfoListView()">设备部位</a-button>
            </a-badge>
            <a-badge :count="numModelbom" title="备件总数" :number-style="{ backgroundColor: '#52c41a' }">
              <a-button style="margin-left: 16px" type="default" @ok="handleOk" @click="handleViewBom()">备件BOM</a-button>
            </a-badge>
            <a-badge :count="numCheckStandard" title="维护项目总数" :number-style="{ backgroundColor: '#52c41a' }">
              <a-button style="margin-left: 16px" type="default" @ok="handleOk" @click="handleViewCheck()">维护项目</a-button>
            </a-badge>
            <!--            <a-badge :count="numNumCheckjob" title="待保养任务总数" :number-style="{ backgroundColor: '#52c41a' }">
              <a-button style="margin-left: 16px" type="default" @ok="handleOk" @click="checkJobTableWaitDoListView()">待保养任务</a-button>
            </a-badge>-->
            <a-button style="margin-left: 8px" type="primary" @click="handleCancel()">返回</a-button>
          </span>
        </a-col>
      </a-row>

      <a-descriptions bordered title="基本信息">
        <a-descriptions-item label="设备（新号）">{{ model.no }}</a-descriptions-item>
        <a-descriptions-item label="设备（旧号）">{{ model.zbh }}</a-descriptions-item>
        <a-descriptions-item label="设备描述">{{ model.name }}</a-descriptions-item>
        <a-descriptions-item label="型号">{{ model.model }}</a-descriptions-item>
        <a-descriptions-item label="ABC 标识">{{ BaseTool.Object.getField(levelMap,model.level) }}</a-descriptions-item>
        <a-descriptions-item label="设备类型">{{ model.typeName }}</a-descriptions-item>
        <a-descriptions-item label="自定义类型">{{ BaseTool.Object.getField(useTypeMap,model.useType) }}</a-descriptions-item>
        <a-descriptions-item label="生产商">{{ model.producerName }}</a-descriptions-item>
        <a-descriptions-item label="大小尺寸">{{ model.zz }}</a-descriptions-item>
        <a-descriptions-item label="系列号(出厂编号)">{{ model.zzh }}</a-descriptions-item>
        <a-descriptions-item label="使用人">{{ model.saveUserName }}</a-descriptions-item>
        <a-descriptions-item label="维修人">{{ model.repairUserName }}</a-descriptions-item>
        <a-descriptions-item label="第二维修人">{{ model.repairUserSecondName }}</a-descriptions-item>
        <a-descriptions-item label="购置日期">{{ model.buyDate }}</a-descriptions-item>
        <a-descriptions-item label="投用日期">{{ model.startDate }}</a-descriptions-item>
        <a-descriptions-item label="状态"><badge :status="DictCache.COLOR.SB_INFO_STATUS[model.status]" :text="statusMap[model.status]"></badge></a-descriptions-item>
        <a-descriptions-item label="备注">{{ model.remark }}</a-descriptions-item>
        <a-descriptions-item v-show="model.useType == 5" label="注册代码">{{ model.registerNo }}</a-descriptions-item>
        <a-descriptions-item label="介质属性">{{ model.characterType }}</a-descriptions-item>
        <a-descriptions-item label="使用登记证编号">{{ model.usedNo }}</a-descriptions-item>
        <a-descriptions-item label="维护供应商">{{ model.supplier }}</a-descriptions-item>
        <a-descriptions-item label="设备批号">{{ model.batchNo }}</a-descriptions-item>
        <a-descriptions-item label="预计工作年限">{{ model.workYear }}</a-descriptions-item>
        <a-descriptions-item label="设计到期年限">{{ model.retirementDate }}</a-descriptions-item>
        <a-descriptions-item label="登记日期">{{ model.registerDate }}</a-descriptions-item>
      </a-descriptions>
      <a-descriptions bordered v-show="model.useType == 4" title="计量信息">
        <a-descriptions-item label="测量设备编号">{{ model.cardNo }}</a-descriptions-item>
        <a-descriptions-item label="准确度等级">{{ model.fdjxh }}</a-descriptions-item>
        <a-descriptions-item label="检定日期">{{ model.checkDate }}</a-descriptions-item>
        <a-descriptions-item label="检定周期">{{ model.checkPeriod }}</a-descriptions-item>
        <a-descriptions-item label="检定有效期">{{ model.nextCheckDate }}</a-descriptions-item>
        <a-descriptions-item label="检定单位">{{ model.dph }}</a-descriptions-item>
        <a-descriptions-item label="检定人">{{ model.zaiz }}</a-descriptions-item>
        <a-descriptions-item label="检定结论">{{ BaseTool.Object.getField(rlTypeMap,model.rlType) }}</a-descriptions-item>
        <a-descriptions-item label="是否周检查">{{ BaseTool.Object.getField(colorMap,model.color) }}</a-descriptions-item>
        <a-descriptions-item label="检定证书编号">{{ model.sbdh }}</a-descriptions-item>
        <a-descriptions-item label="预警天数">{{ model.seatNumber }}</a-descriptions-item>
      </a-descriptions>
      <a-descriptions bordered title="文件信息">
        <a-descriptions-item label="维保手册">
          <a-upload
            :multiple="true"
            :fileList="BaseTool.UPLOAD.transImg(model.repairFileList)"
          >
          </a-upload>
        </a-descriptions-item>
        <a-descriptions-item label="使用手册">
          <a-upload
            :multiple="true"
            :fileList="BaseTool.UPLOAD.transImg(model.useFileList)"
          >
          </a-upload>
        </a-descriptions-item>
        <a-descriptions-item label="验收文件">
          <a-upload
            :multiple="true"
            :fileList="BaseTool.UPLOAD.transImg(model.recheckFileList)"
          >
          </a-upload>
        </a-descriptions-item>
      </a-descriptions>
      <title-divider title="相关数据" width="90px"></title-divider>
      <q-tabs :activeKey="activeKey" @change="changeTab">
        <q-tab-pane key="1" tab="报修记录">
          <repair-application-form-table :type="2" :table-params="{sbId: model.id, sbName: model.name}" ref="repairApplicationFormTable" />
        </q-tab-pane>
        <q-tab-pane key="2" tab="配件记录">
          <spare-part-used-select-table :type="2" :table-params="{sbId: model.id, modelId: model.modelId}" ref="sparePartUsedSelectTable"/>
        </q-tab-pane>
        <q-tab-pane key="3" tab="保养任务">
          <check-job-table :type="2" :check-type="2" :table-params="{sbId: model.id}" ref="spotJobTable" />
        </q-tab-pane>
      </q-tabs>
    </div>
    <detail-sb-bom ref="detailSbBomModal" @ok="handleOk"/>
    <detail-sb-check ref="detailSbCheckModal" @ok="handleOk"/>
    <part-info-list ref="partInfoList" />
    <!--    <check-job-table-wait-do :type="2" :check-type="2" ref="checkJobTableWaitDo" @ok="handleOk"/>-->
  </a-card>
</template>

<script>
import DetailList from '@/components/tools/DetailList'
import RepairApplicationFormTable from '@/views/repair/application-form/modules/RepairApplicationFormTable'
import CheckJobTable from '@/views/check/checkjob/modules/CheckJobTable'
// import CheckJobTableWaitDo from '@/views/check/checkjob/modules/CheckJobTableWaitDo'
import { fetchFirmProducer } from '@/api/firm/producer'
import { queryNumCheckStandard } from '@/api/check/checkstandard'
import { queryNumCheckjob } from '@/api/check/checkjob'
import { queryNumPartInfo } from '@/api/part/info'
import { queryNumModelbom } from '@/api/sb/modelbom'
import SparePartUsedSelectTable from '@/views/sqarepartmanage/sparepartused/modules/SparePartUsedSelectTable'
import SbRunFillPageTable from '@/views/sb/run-fill/modules/SbRunFillPageTable'
import SbInspectionFillPageTable from '@/views/sb/inspection-fill/modules/SbInspectionFillPageTable'
import DetailSbBom from '@/views/sb/modelbom/modules/DetailSbBom'
import DetailSbCheck from '@/views/check/checkstandard/modules/DetailSbCheck'
import PartInfoList from '@/views/part/info/modules/PartInfoList'
const DetailListItem = DetailList.Item

export default {
  name: 'SbInfoDetail',
  components: {
    DetailList,
    DetailListItem,
    RepairApplicationFormTable,
    CheckJobTable,
    SparePartUsedSelectTable,
    SbRunFillPageTable,
    SbInspectionFillPageTable,
    DetailSbBom,
    DetailSbCheck,
    PartInfoList
  },
  data () {
    return {
      confirmLoading: false,
      mdl: {},
      modalTitle: null,
      visible: false,
      visibleDetail: false,
      activeKey: '3',
      collapseActiveKey: '1',
      model: {
        'no': null,
        'financingNo': null,
        'name': null,
        'modelId': null,
        'typeId': null,
        'isShow': null,
        'isChild': null,
        'parentId': null,
        'level': null,
        'useType': null,
        'rate': null,
        'month': null,
        'usedMonth': null,
        'initialValue': null,
        'currentValue': null,
        'cutValue': null,
        'producerId': null,
        // 'sourceType': null,
        // 'sourceSbId': null,
        // 'parentId': null,
        'unit': null,
        // 'position': null,
        // 'guigeId': null,
        'useCompanyName': null,
        'useProjectName': null,
        'useDeptName': null,
        'useGroupName': null,
        'useUserName': null,
        'saveDeptName': null,
        'saveUserName': null,
        'repairUserName': null,
        'totalMiles': null,
        'totalHours': null,
        // 'lastBaoyangTime': null,
        // 'lastBaoyangMiles': null,
        // 'lastBaoyangHours': null,
        // 'baoyangTimes': null,
        'buyDate': null,
        'startDate': null,
        // 'nextCheckDate': null,
        // 'guaranteeDate': null,
        // 'workYear': null,
        // 'retirementDate': null,
        // 'depreciationType': null,
        'wbFile': null,
        'useFile': null,
        'checkFile': null,
        'sbImage': null,
        'sbFileList': null,
        'qrCode': null,
        'status': null,
        'remark': null,
        'parentName': null,
        'createdUserName': null,
        'typeName': null,
        'producerName': null,
        'zzh': null,
        'fdjxh': null,
        'fdjh': null,
        'cph': null,
        'dph': null,
        'zz': null,
        'rlType': null,
        'color': null,
        'seatNumber': null,

        'registerNo': null,
        'characterType': null,
        'usedNo': null,
        'supplier': null,
        'repairUserSecond': null,
        'batchNo': null,
        'workYear': null,
        'retirementDate': null,
        'registerDate': null
      },
      numCheckStandard: 0,
      numNumCheckjob: 0,
      numModelbom: 0,
      numPartInfo: 0,
      firmProducerLevelMap: {},
      firmSupplier: {},
      firmProducer: {},
      statusMap: {},
      useTypeMap: {},
      levelMap: {},
      unitMap: {},
      colorMap: {},
      rlTypeMap: {},
      sourceTypeMap: {}
    }
  },
  created () {
    this.depreciationTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SBINFO_DEPRECIATIONTYPE)
    this.levelMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SBINFO_LEVEL)
    this.firmProducerLevelMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.FIRM_PRODUCER_LEVEL)
    this.statusMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_INFO_STATUS)
    this.unitMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SBINFO_UNIT)
    this.colorMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_COLOR)
    this.rlTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.RANLIAO_TYPE)
    this.sourceTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SBTYPE_SOURCETYPE)
    this.useTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_USE_TYPE)
  },
  computed: {
  },
  methods: {
    handleViewBom (record) {
      this.visible = false
      const modal = this.$refs.detailSbBomModal
      modal.base(this.model)
    },
    handleViewCheck (record) {
      this.visible = false
      const modal = this.$refs.detailSbCheckModal
      modal.base(this.model)
    },
    base (record) {
      this.visible = true
      this.visibleDetail = true
      this.modalTitle = '详情'
      this.model = record
      this.activeKey = '1'
      this.collapseActiveKey = '0'
      this.fetchNum()
      fetchFirmProducer({ id: this.model.producerId }).then(res => {
        this.firmProducer = res.data
      })
    },
    fetchNum () {
      Promise.all([queryNumPartInfo({ sbId: this.model.id }), queryNumModelbom({ sbId: this.model.id }), queryNumCheckStandard({ sbId: this.model.id }), queryNumCheckjob({ sbId: this.model.id })])
        .then((values) => {
          this.numPartInfo = values[0].data
          this.numModelbom = values[1].data
          this.numCheckStandard = values[2].data
          this.numNumCheckjob = values[3].data
        })
    },
    changeTab (activeKey) {
      this.activeKey = activeKey
      if (this.activeKey === '1' && this.BaseTool.Object.isNotBlank(this.$refs.repairApplicationFormTable)) {
        this.$refs.repairApplicationFormTable.handleOk()
        return
      }
      if (this.activeKey === '2' && this.BaseTool.Object.isNotBlank(this.$refs.sparePartUsedSelectTable)) {
        this.$refs.sparePartUsedSelectTable.handleOk()
        return
      }
      if (this.activeKey === '3' && this.BaseTool.Object.isNotBlank(this.$refs.spotJobTable)) {
        this.$refs.spotJobTable.handleOk()
        return
      }
      if (this.activeKey === '4' && this.BaseTool.Object.isNotBlank(this.$refs.pollingJobTable)) {
        this.$refs.pollingJobTable.handleOk()
        return
      }
      if (this.activeKey === '5' && this.BaseTool.Object.isNotBlank(this.$refs.spotCheckJobTable)) {
        this.$refs.spotCheckJobTable.handleOk()
        return
      }
      if (this.activeKey === '6' && this.BaseTool.Object.isNotBlank(this.$refs.spotCheckJobTable)) {
        this.$refs.spotCheckJobTable.handleOk()
        return
      }
      if (this.activeKey === '7' && this.BaseTool.Object.isNotBlank(this.$refs.sbOilPageTable)) {
        this.$refs.sbOilPageTable.handleOk()
        return
      }
      if (this.activeKey === '8' && this.BaseTool.Object.isNotBlank(this.$refs.sbInspectionFillPageTable)) {
        this.$refs.sbInspectionFillPageTable.handleOk()
      }
    },
    getQrcodeSrc: (dom) => {
      console.log(11, 22)
    },
    handleCancel (values) {
      this.visible = false
      this.visibleDetail = false
      this.confirmLoading = false
      this.$emit('ok', values)
    },
    handleOk () {
      this.visible = true
      this.fetchNum()
    },
    partInfoListView () {
      const modal = this.$refs.partInfoList
      modal.base({ sbId: this.model.id }, { sbId: this.model.id })
    },
    checkJobTableWaitDoListView () {
      const modal = this.$refs.checkJobTableWaitDo
      modal.base({ sbId: this.model.id }, { sbId: this.model.id, status: 1 })
    }
  }
}
</script>
<style scoped>
/* For demo */
.ant-carousel {
  width: 300px;
  height: 300px;
}
.ant-carousel >>> .slick-slide {
  text-align: center;
  height: 300px;
  line-height: 300px;
  overflow: hidden;
}

.ant-carousel >>> .slick-slide h3 {
  color: #fff;
}
</style>