AnalysisSystemForRadionuclide_vue/src/views/spectrumAnalysis/components/Modals/SampleInfomationModal.vue

<template>
  <custom-modal v-model="visible" :width="750" title="Sample Infomation">
    <a-spin :spinning="isLoading">
      <div class="sample-infomation">
        <a-row>
          <a-col class="sample-infomation-item" :span="12" v-for="(item, index) in columns" :key="index">
            <div class="label">{{ item.title }}:</div>
            <div class="value">{{ data[item.key] }}</div>
          </a-col>
        </a-row>
      </div>
    </a-spin>
    <div slot="custom-footer" style="text-align: center">
      <a-space :size="20">
        <a-button type="primary" @click="handleExportToExcel">Export to Excel</a-button>
        <a-button @click="visible = false">Close</a-button>
      </a-space>
    </div>
  </custom-modal>
</template>

<script>
import { getAction, getFileAction } from '@/api/manage'
import ModalMixin from '@/mixins/ModalMixin'
import { saveAs } from 'file-saver'
import SampleDataMixin from '../../SampleDataMixin'

const columns = [
  {
    title: 'Station Id',
    key: 'stationId',
  },
  {
    title: 'Detector Id',
    key: 'detectorId',
  },
  {
    title: 'Sample Id',
    key: 'sampleId',
  },
  {
    title: 'Sample Geometry',
    key: 'sampleGeometry',
  },
  {
    title: 'Sample Quantity',
    key: 'sampleQuantity',
  },
  {
    title: 'Sample Type',
    key: 'sampleType',
  },
  {
    title: 'Collection Start',
    key: 'collectStart',
  },
  {
    title: 'Sampling Time',
    key: 'samplingTime',
  },
  {
    title: 'Collection Stop',
    key: 'collectStop',
  },
  {
    title: 'Decay Time',
    key: 'decayTime',
  },
  {
    title: 'Acquisition Start',
    key: 'acquisitionStart',
  },
  {
    title: 'Acquisition Time',
    key: 'acquisitionTime',
  },
  {
    title: 'Acquisition Stop',
    key: 'acquisitionStop',
  },
  {
    title: 'Avg Flow Rate',
    key: 'avgFlowRate',
  },
]

export default {
  mixins: [ModalMixin, SampleDataMixin],
  data() {
    this.columns = columns
    return {
      isLoading: false,
      data: {},
      fileName: '',
    }
  },
  methods: {
    async getInfo() {
      try {
        this.isLoading = true
        const { sampleId, inputFileName: fileName } = this.sampleData
        const { success, result, message } = await getAction('/gamma/sampleInformation', {
          sampleId,
          fileName,
        })
        if (success) {
          result.sampleId = sampleId
          this.data = result
        } else {
          this.$message.error(message)
        }
      } catch (error) {
        console.error(error)
      } finally {
        this.isLoading = false
      }
    },

    beforeModalOpen() {
      this.data = {}
      this.getInfo()
    },
    // 导出到Excel
    handleExportToExcel() {
      this.fileName = ''
      const { sampleId, inputFileName: fileName } = this.sampleData
      if (Object.keys(this.data).length > 0) {
        let name = this.newSampleData.inputFileName.split('.')[0]
        let params = {
          sampleId,
          fileName,
        }
        getFileAction('/gamma/exportSampleInformation', params).then((res) => {
          if (res.code && res.code == 500) {
            this.$message.warning('This operation fails. Contact your system administrator')
          } else {
            const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
            saveAs(blob, `${name}_Sample Infomation`)
          }
        })
        // let _this = this
        // this.$confirm({
        //   title: 'Please enter file name',
        //   content: h => <a-input v-model={_this.fileName} />,
        //   okText: 'Cancle',
        //   cancelText: 'Save',
        //   okButtonProps: { style: { backgroundColor: '#b98326', color: '#fff', borderColor: 'transparent' } },
        //   cancelButtonProps: { style: { color: '#fff', backgroundColor: '#31aab0', borderColor: 'transparent' } },
        //   onOk() {
        //     console.log('Cancel')
        //   },
        //   onCancel() {
        //     if (_this.fileName) {
        //       let params = {
        //         sampleId,
        //         fileName
        //       }
        //       getFileAction('/gamma/exportSampleInformation', params).then(res => {
        //         if (res.code && res.code == 500) {
        //           this.$message.warning('This operation fails. Contact your system administrator')
        //         } else {
        //           const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
        //           saveAs(blob, `${_this.fileName}`)
        //         }
        //       })
        //     }
        //   }
        // })
      } else {
        this.$message.warning('No downloadable data')
      }
    },
  },
}
</script>

<style lang="less" scoped>
.sample-infomation {
  background-color: #143644;
  padding: 20px;

  &-item {
    display: flex;
    height: 30px;

    .label {
      width: 150px;
      color: #5b9cba;
    }
  }
}
</style>