feat: 文件转换功能

This commit is contained in:
Xu Zhimeng 2023-10-20 16:54:13 +08:00
parent 961f9752f6
commit 26c4b05abb
7 changed files with 475 additions and 334 deletions

View File

@ -1,6 +1,11 @@
import { Modal } from 'ant-design-vue'
import { saveAs } from 'file-saver'
import JSZip from 'jszip'
import Vue from 'vue'
import signMd5Utils from '@/utils/encryption/signMd5Utils'
import Axios from 'axios'
import { ACCESS_TOKEN, TENANT_ID } from '@/store/mutation-types'
import { message } from 'ant-design-vue'
/**
* 弹窗填入文件名保存文件
@ -85,3 +90,52 @@ export const zipFile = async (fileList, zipName) => {
const content = await zip.generateAsync({ type: 'blob' })
return new File([content], zipName, { type: content.type })
}
/**
* 根据响应头获取文件名
* @param {String} contentDisposition
*/
export function getFileNameByHeaderContentDisposition(contentDisposition) {
const patt = new RegExp('file[Nn]ame=([^;]+\\.[^\\.;]+);*')
contentDisposition = decodeURI(contentDisposition)
const result = patt.exec(contentDisposition)
let fileName = result[1]
fileName = fileName.replace(/"/g, '')
return fileName
}
export const fetchAndDownload = async (url, data) => {
const apiBaseUrl = window._CONFIG['domianURL'] || '/jeecg-boot'
const sign = signMd5Utils.getSign(url, data)
const response = await Axios({
baseURL: apiBaseUrl,
method: 'post',
url,
data: data,
headers: {
'X-Sign': sign,
'X-TIMESTAMP': signMd5Utils.getTimestamp(),
'X-Access-Token': Vue.ls.get(ACCESS_TOKEN),
'tenant-id': Vue.ls.get(TENANT_ID)
}
})
const { status, headers, data: responseData } = response
if (status == 200) {
if (typeof responseData == 'object') {
const { message: msg } = responseData
message.error(msg)
throw new Error(msg)
} else {
const disposition = headers['content-disposition']
const fileName = getFileNameByHeaderContentDisposition(disposition)
if (typeof responseData == 'string') {
const blob = new Blob([responseData], { type: headers['content-type'] })
saveAs(blob, fileName)
return fileName
}
}
} else {
message.error('This operation fails. Contact your system administrator')
throw new Error('This operation fails. Contact your system administrator')
}
}

View File

@ -3,10 +3,10 @@
<a-form-model class="settings" :labelCol="{ style: { width: '75px', textAlign: 'center' } }">
<div class="top-left">
<a-form-model-item label="MSG_ID">
<a-input v-model="canberraIecImsParams.msgId"></a-input>
<a-input v-model="params.msg_id"></a-input>
</a-form-model-item>
<a-form-model-item label="Comment">
<a-textarea v-model="canberraIecImsParams.comment"></a-textarea>
<a-textarea v-model="params.comment"></a-textarea>
</a-form-model-item>
<title-over-border title="Collection Block">
<a-form-model-item label="Start Time">
@ -14,7 +14,7 @@
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="canberraIecImsParams.startTime"
v-model="params.collect_start"
/>
</a-form-model-item>
<a-form-model-item label="Stop Time">
@ -22,12 +22,12 @@
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="canberraIecImsParams.stopTime"
v-model="params.collect_stop"
/>
</a-form-model-item>
<div>
<p>Total air volume sampled</p>
<a-input v-model="canberraIecImsParams.totalAir"></a-input>
<a-input-number v-model="params.air_volume" style="width: 100%;"></a-input-number>
</div>
</title-over-border>
</div>
@ -35,43 +35,43 @@
<div class="header-block-list">
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.designatorEditable"></a-checkbox>
Designator
</div>
<a-input v-model="canberraIecImsParams.designator"></a-input>
<a-input :disabled="!states.designatorEditable" v-model="params.designator"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.stationCodeEditable"></a-checkbox>
Station code
</div>
<a-input v-model="canberraIecImsParams.stationCode"></a-input>
<a-input :disabled="!states.stationCodeEditable" v-model="params.station"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.detectorCodeEditable"></a-checkbox>
Detector code
</div>
<a-input v-model="canberraIecImsParams.detectorCode"></a-input>
<a-input :disabled="!states.detectorCodeEditable" v-model="params.detector"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.sampleGeometryEditable"></a-checkbox>
Sample geometry
</div>
<a-input v-model="canberraIecImsParams.sampleGeometry"></a-input>
<a-input :disabled="!states.sampleGeometryEditable" v-model="params.sam_geom"></a-input>
</div>
</div>
<div class="system-type-and-spectrum-qualifier">
<title-over-border title="System type" class="system-type">
<a-radio-group v-model="canberraIecImsParams.systemType">
<a-radio-group v-model="params.sys_type">
<a-radio value="P">P</a-radio>
<a-radio value="G">G</a-radio>
<a-radio value="B">B</a-radio>
</a-radio-group>
</title-over-border>
<title-over-border title="Spectrum qualifier" class="spectrum-qualifier">
<a-radio-group v-model="canberraIecImsParams.spectrumQualifier">
<a-radio-group v-model="params.quantity">
<a-radio value="PREL">PREL</a-radio>
<a-radio value="FULL">FULL</a-radio>
</a-radio-group>
@ -80,44 +80,27 @@
<div class="identifications">
<div>
<p>Sample reference identification</p>
<a-input v-model="canberraIecImsParams.sampleRef"></a-input>
<a-input v-model="params.srId"></a-input>
</div>
<div>
<p>Background measurement identification</p>
<a-input v-model="canberraIecImsParams.backgroundMea"></a-input>
<a-input v-model="params.bgMeasureId"></a-input>
</div>
</div>
<div class="transmit-time">
<a-checkbox>Transmit time</a-checkbox>
<a-checkbox v-model="states.transmitTimeEditable">Transmit time</a-checkbox>
<custom-date-picker
:disabled="!states.transmitTimeEditable"
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="canberraIecImsParams.transmitTime"
v-model="params.transmit"
/>
</div>
</title-over-border>
</a-form-model>
<title-over-border title="Spectrum Transfer" class="spectrum-transfer">
<div class="title-container">
<div class="title">
<a-upload name="file" :multiple="true" :showUploadList="false" :beforeUpload="ortecBeforeUpload">
<div>Canberra IEC1455(.IEC)</div>
</a-upload>
</div>
<div class="data-type">
Data type
<div class="data-type-select">
<custom-select :option="[{ label: 'SAMPLEPHD', value: 1 }]" />
</div>
</div>
<div class="title">
<a-upload name="file" :multiple="true" :showUploadList="false" :beforeUpload="imsBeforeUpload">
<div>IMS .ims .rms</div>
</a-upload>
</div>
</div>
<a-transfer :render="(item) => item.title" :data-source="dataSource" :target-keys="targetKeys" />
<spectrum-transfer-com :params="params" :fileOptions="fileOptions" />
</title-over-border>
</div>
</template>
@ -125,50 +108,58 @@
<script>
import TitleOverBorder from '../../../TitleOverBorder.vue'
import moment from 'moment'
import { cloneDeep } from 'lodash'
import SpectrumTransferCom from './SpectrumTransferCom.vue'
const initParams = {
msg_id: '123456789',
comment: '',
collect_start: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
collect_stop: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
air_volume: '0',
designator: '3',
station: 'CNL06',
detector: 'CNL06_001',
sam_geom: 'DISC70MMX5MM',
sys_type: 'P',
quantity: 'FULL',
srId: '123456789',
bgMeasureId: '0',
transmit: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
}
const initStates = {
designatorEditable: false,
stationCodeEditable: false,
detectorCodeEditable: false,
sampleGeometryEditable: false,
transmitTimeEditable: false,
}
export default {
components: { TitleOverBorder },
components: { TitleOverBorder, SpectrumTransferCom },
data() {
return {
canberraIecImsParams: {
msgId: '123456789',
comment: '',
startTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
stopTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
totalAir: '0',
designator: '3',
stationCode: 'CNL06',
detectorCode: 'CNL06_001',
sampleGeometry: 'DISC70MMX5MM',
systemType: 'P',
spectrumQualifier: 'FULL',
sampleRef: '123456789',
backgroundMea: '0',
transmitTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
},
dataSource: [],
targetKeys: [],
params: cloneDeep(initParams),
states: cloneDeep(initStates),
fileOptions: [
{
title: 'Canberra IEC1455(.IEC)',
accept: '.IEC',
transformUrl: '/gamma/ftransit/IecToIms',
},
{
title: 'IMS.ims.rms',
accept: '.IMS,.RMS,.PHD',
transformUrl: '/gamma/ftransit/ImsToIec'
},
],
}
},
methods: {
ortecBeforeUpload(file, fileList) {
console.log(file, fileList)
this.dataSource = fileList.map((item) => {
return {
key: item.uid,
title: item.name,
}
})
},
imsBeforeUpload(file, fileList) {
console.log(file, fileList)
let arr = fileList.map((item) => {
return {
key: item.uid,
title: item.name,
}
})
this.targetKeys = arr.map((item) => item.key)
this.dataSource.push(...arr)
beforeModalOpen() {
this.params = cloneDeep(initParams)
this.states = cloneDeep(initStates)
},
},
}
@ -261,67 +252,5 @@ export default {
.spectrum-transfer {
margin-top: 20px;
.title-container {
display: flex;
.title {
flex: 1;
text-align: center;
background-color: #225a6a;
height: 32px;
line-height: 32px;
/deep/.ant-upload {
width: 100%;
cursor: pointer;
}
}
}
.data-type {
width: 166px;
padding: 0 8px;
position: relative;
text-align: center;
z-index: 1;
line-height: 32px;
&-select {
top: 100%;
left: 0;
position: absolute;
padding: 8px;
width: 100%;
}
}
.ant-transfer {
margin-top: 8px;
display: flex;
align-items: flex-end;
::v-deep {
.ant-transfer {
&-list {
flex: 1;
&-header {
display: none;
}
}
&-operation {
width: 150px;
.ant-btn {
width: 100%;
height: 32px;
margin-bottom: 20px;
text-align: center;
}
}
}
}
}
}
</style>

View File

@ -1,11 +1,7 @@
<template>
<div class="int-spc-canberra-iec-transfer">
<div class="spectrum-transfer">
<div class="title-container">
<div class="title">Select .SPC File</div>
<div class="title">Select .IEC File</div>
</div>
<a-transfer></a-transfer>
<spectrum-transfer-com :fileOptions="fileOptions" :showDataType="false" />
<div class="desc">
<p>使用说明</p>
@ -17,64 +13,31 @@
</template>
<script>
import TitleOverBorder from '../../../TitleOverBorder.vue'
import SpectrumTransferCom from './SpectrumTransferCom.vue'
export default {
components: { TitleOverBorder }
components: { SpectrumTransferCom },
data() {
return {
fileOptions: [
{
title: 'Select .SPC File',
accept: '.SPC',
transformUrl: '/gamma/ftransit/SpcToIec',
},
{
title: 'Select .IEC File',
accept: '.IEC',
transformUrl: '/gamma/ftransit/IecToSpc',
},
],
}
},
}
</script>
<style lang="less" scoped>
.spectrum-transfer {
margin-top: 20px;
.title-container {
display: flex;
gap: 66px;
.title {
flex: 1;
text-align: center;
background-color: #225a6a;
height: 32px;
line-height: 32px;
}
}
.ant-transfer {
margin-top: 8px;
display: flex;
align-items: center;
::v-deep {
.ant-transfer {
&-list {
flex: 1;
height: 400px;
&-header {
display: none;
}
}
&-operation {
width: 50px;
.ant-btn {
width: 100%;
height: 32px;
text-align: center;
&:first-child {
margin-bottom: 50px;
}
}
}
}
}
}
.desc {
margin-top: 20px;
@ -82,5 +45,17 @@ export default {
margin-bottom: 0;
}
}
.spectrum-transfer-com {
grid-template-rows: 30px 450px;
grid-template-columns: 1fr 75px 1fr;
::v-deep {
.operators {
justify-content: center;
gap: 80px;
}
}
}
}
</style>

View File

@ -3,10 +3,10 @@
<a-form-model class="settings" :labelCol="{ style: { width: '75px', textAlign: 'center' } }">
<div class="top-left">
<a-form-model-item label="MSG_ID">
<a-input v-model="intSpacImsParams.msgId"></a-input>
<a-input v-model="params.msg_id"></a-input>
</a-form-model-item>
<a-form-model-item label="Comment">
<a-textarea v-model="intSpacImsParams.comment"></a-textarea>
<a-textarea v-model="params.comment"></a-textarea>
</a-form-model-item>
<title-over-border title="Collection Block">
<a-form-model-item label="Start Time">
@ -14,7 +14,7 @@
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="intSpacImsParams.startTime"
v-model="params.collect_start"
/>
</a-form-model-item>
<a-form-model-item label="Stop Time">
@ -22,12 +22,12 @@
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="intSpacImsParams.stopTime"
v-model="params.collect_stop"
/>
</a-form-model-item>
<div>
<p>Total air volume sampled</p>
<a-input v-model="intSpacImsParams.totalAir"></a-input>
<a-input-number v-model="params.air_volume" style="width: 100%;"></a-input-number>
</div>
</title-over-border>
</div>
@ -35,43 +35,43 @@
<div class="header-block-list">
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.designatorEditable"></a-checkbox>
Designator
</div>
<a-input v-model="intSpacImsParams.designator"></a-input>
<a-input :disabled="!states.designatorEditable" v-model="params.designator"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.stationCodeEditable"></a-checkbox>
Station code
</div>
<a-input v-model="intSpacImsParams.stationCode"></a-input>
<a-input :disabled="!states.stationCodeEditable" v-model="params.station"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.detectorCodeEditable"></a-checkbox>
Detector code
</div>
<a-input v-model="intSpacImsParams.detectorCode"></a-input>
<a-input :disabled="!states.detectorCodeEditable" v-model="params.detector"></a-input>
</div>
<div class="header-block-item">
<div>
<a-checkbox></a-checkbox>
<a-checkbox v-model="states.sampleGeometryEditable"></a-checkbox>
Sample geometry
</div>
<a-input v-model="intSpacImsParams.sampleGeometry"></a-input>
<a-input :disabled="!states.sampleGeometryEditable" v-model="params.sam_geom"></a-input>
</div>
</div>
<div class="system-type-and-spectrum-qualifier">
<title-over-border title="System type" class="system-type">
<a-radio-group v-model="intSpacImsParams.systemType">
<a-radio-group v-model="params.sys_type">
<a-radio value="P">P</a-radio>
<a-radio value="G">G</a-radio>
<a-radio value="B">B</a-radio>
</a-radio-group>
</title-over-border>
<title-over-border title="Spectrum qualifier" class="spectrum-qualifier">
<a-radio-group v-model="intSpacImsParams.spectrumQualifier">
<a-radio-group v-model="params.quantity">
<a-radio value="PREL">PREL</a-radio>
<a-radio value="FULL">FULL</a-radio>
</a-radio-group>
@ -80,44 +80,27 @@
<div class="identifications">
<div>
<p>Sample reference identification</p>
<a-input v-model="intSpacImsParams.sampleRef"></a-input>
<a-input v-model="params.srId"></a-input>
</div>
<div>
<p>Background measurement identification</p>
<a-input v-model="intSpacImsParams.backgroundMea"></a-input>
<a-input v-model="params.bgMeasureId"></a-input>
</div>
</div>
<div class="transmit-time">
<a-checkbox>Transmit time</a-checkbox>
<a-checkbox v-model="states.transmitTimeEditable">Transmit time</a-checkbox>
<custom-date-picker
:disabled="!states.transmitTimeEditable"
show-time
format="YYYY/MM/DD HH:mm:ss"
valueFormat="YYYY/MM/DD HH:mm:ss"
v-model="intSpacImsParams.transmitTime"
v-model="params.transmit"
/>
</div>
</title-over-border>
</a-form-model>
<title-over-border title="Spectrum Transfer" class="spectrum-transfer">
<div class="title-container">
<div class="title">
<a-upload name="file" :multiple="true" :showUploadList="false" :beforeUpload="ortecBeforeUpload">
<div>ORTEC int.spc</div>
</a-upload>
</div>
<div class="data-type">
Data type
<div class="data-type-select">
<custom-select :option="[{ label: 'SAMPLEPHD', value: 1 }]" />
</div>
</div>
<div class="title">
<a-upload name="file" :multiple="true" :showUploadList="false" :beforeUpload="imsBeforeUpload">
<div>IMS .ims .rms</div>
</a-upload>
</div>
</div>
<a-transfer :render="(item) => item.title" :data-source="dataSource" :target-keys="targetKeys" />
<spectrum-transfer-com :params="params" :fileOptions="fileOptions" />
</title-over-border>
</div>
</template>
@ -125,50 +108,58 @@
<script>
import TitleOverBorder from '../../../TitleOverBorder.vue'
import moment from 'moment'
import { cloneDeep } from 'lodash'
import SpectrumTransferCom from './SpectrumTransferCom.vue'
const initParams = {
msg_id: '123456789',
comment: '',
collect_start: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
collect_stop: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
air_volume: '0',
designator: '3',
station: 'CNL06',
detector: 'CNL06_001',
sam_geom: 'DISC70MMX5MM',
sys_type: 'P',
quantity: 'FULL',
srId: '123456789',
bgMeasureId: '0',
transmit: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
}
const initStates = {
designatorEditable: false,
stationCodeEditable: false,
detectorCodeEditable: false,
sampleGeometryEditable: false,
transmitTimeEditable: false,
}
export default {
components: { TitleOverBorder },
components: { TitleOverBorder, SpectrumTransferCom },
data() {
return {
intSpacImsParams: {
msgId: '123456789',
comment: '',
startTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
stopTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
totalAir: '0',
designator: '3',
stationCode: 'CNL06',
detectorCode: 'CNL06_001',
sampleGeometry: 'DISC70MMX5MM',
systemType: 'P',
spectrumQualifier: 'FULL',
sampleRef: '123456789',
backgroundMea: '0',
transmitTime: moment(new Date()).format('YYYY/MM/DD HH:mm:ss'),
},
dataSource: [],
targetKeys: [],
params: cloneDeep(initParams),
states: cloneDeep(initStates),
fileOptions: [
{
title: 'ORTEC int.spc',
accept: '.SPC',
transformUrl: '/gamma/ftransit/SpcToIms',
},
{
title: 'IMS.ims.rms',
accept: '.IMS,.RMS,.PHD',
transformUrl: '/gamma/ftransit/ImsToSpc'
},
],
}
},
methods: {
ortecBeforeUpload(file, fileList) {
console.log(file, fileList)
this.dataSource = fileList.map((item) => {
return {
key: item.uid,
title: item.name,
}
})
},
imsBeforeUpload(file, fileList) {
console.log(file, fileList)
let arr = fileList.map((item) => {
return {
key: item.uid,
title: item.name,
}
})
this.targetKeys = arr.map((item) => item.key)
this.dataSource.push(...arr)
beforeModalOpen() {
this.params = cloneDeep(initParams)
this.states = cloneDeep(initStates)
},
},
}
@ -261,67 +252,5 @@ export default {
.spectrum-transfer {
margin-top: 20px;
.title-container {
display: flex;
.title {
flex: 1;
text-align: center;
background-color: #225a6a;
height: 32px;
line-height: 32px;
/deep/.ant-upload {
width: 100%;
cursor: pointer;
}
}
}
.data-type {
width: 166px;
padding: 0 8px;
position: relative;
text-align: center;
z-index: 1;
line-height: 32px;
&-select {
top: 100%;
left: 0;
position: absolute;
padding: 8px;
width: 100%;
}
}
.ant-transfer {
margin-top: 8px;
display: flex;
align-items: flex-end;
::v-deep {
.ant-transfer {
&-list {
flex: 1;
&-header {
display: none;
}
}
&-operation {
width: 150px;
.ant-btn {
width: 100%;
height: 32px;
margin-bottom: 20px;
text-align: center;
}
}
}
}
}
}
</style>

View File

@ -0,0 +1,255 @@
<template>
<div class="spectrum-transfer-com">
<div class="title">
<a-upload
name="file"
:multiple="true"
:showUploadList="false"
:beforeUpload="beforeLeftFileUpload"
:accept="fileOptions[0].accept"
>
<div>{{ fileOptions[0].title }}</div>
</a-upload>
</div>
<div class="data-type">
<template v-if="showDataType"> Data type </template>
</div>
<div class="title">
<a-upload
name="file"
:multiple="true"
:showUploadList="false"
:beforeUpload="beforeRightFileUpload"
:accept="fileOptions[1].accept"
>
<div>{{ fileOptions[1].title }}</div>
</a-upload>
</div>
<div class="file-list">
<div
class="file-item"
:class="{ active: leftSelFileIndex == index }"
v-for="(file, index) in leftFileList"
:key="index"
@click="handleFileClick('left', index)"
>
{{ file.name }}
</div>
</div>
<div class="operators">
<div class="data-type-select" v-if="showDataType">
<custom-select :options="dataTypeList" v-model="dataType" />
</div>
<div class="transit">
<a-button :disabled="leftSelFileIndex == null" type="primary" @click="handleTransfer('right')">
<a-icon type="double-right" />
</a-button>
</div>
<div class="transit">
<a-button :disabled="rightSelFileIndex == null" type="primary" @click="handleTransfer('left')">
<a-icon type="double-left" />
</a-button>
</div>
</div>
<div class="file-list">
<div
class="file-item"
:class="{ active: rightSelFileIndex == index }"
v-for="(file, index) in rightFileList"
:key="index"
@click="handleFileClick('right', index)"
>
{{ file.name }}
</div>
</div>
</div>
</template>
<script>
import { fetchAndDownload } from '@/utils/file'
import { isNullOrUndefined } from '@/utils/util'
const dataTypeList = ['SAMPLEPHD', 'BLANKPHD', 'DETBKPHD', 'CALIBPHD', 'QCPHD']
const rules = {
msg_id: `MSG_ID can't be null`,
designator: `Designator can't be null!`,
station: `Station code can't be null!`,
detector: `Detector code can't be null!`,
sam_geom: `Sample geometry can't be null!`,
srId: `Sample reference identification can't be null!`,
air_volume: `The format of Total air volume sampled is error!`,
}
export default {
props: {
params: {
type: Object,
default: () => ({}),
},
fileOptions: {
type: Array,
},
showDataType: {
type: Boolean,
default: true,
},
},
data() {
this.dataTypeList = dataTypeList.map((item) => ({
label: item,
value: item,
}))
return {
dataType: dataTypeList[0],
leftFileList: [],
rightFileList: [],
leftSelFileIndex: null,
rightSelFileIndex: null,
}
},
methods: {
beforeLeftFileUpload(file) {
this.leftFileList = [...this.leftFileList, file]
return false
},
beforeRightFileUpload(file) {
this.rightFileList = [...this.rightFileList, file]
return false
},
handleFileClick(side, index) {
if (side == 'left') {
this.leftSelFileIndex = index
} else {
this.rightSelFileIndex = index
}
},
validateForm() {
const entries = Object.entries(this.params)
if (entries.length) {
for (const item of entries) {
const [k, v] = item
const rule = rules[k]
if (rule) {
//
if (typeof v == 'string' && (!v || !v.trim())) {
this.$message.warn(rule)
return false
} else if (typeof v == 'object' && isNullOrUndefined(v)) {
this.$message.warn(rule)
return false
}
}
}
}
return true
},
//
async handleTransfer(target) {
const validate = this.validateForm()
if (!validate) {
return
}
let url = this.fileOptions[1].transformUrl
let file = this.rightFileList[this.rightSelFileIndex]
const formData = new FormData()
if (target == 'right') {
url = this.fileOptions[0].transformUrl
file = this.leftFileList[this.leftSelFileIndex]
Object.entries(this.params).forEach(([k, v]) => {
if (['collect_start', 'collect_stop', 'transmit'].includes(k)) {
v = v + '.0'
}
formData.append(k, v)
})
}
if (!file.size) {
return
}
formData.append('file', file)
if (this.showDataType) {
formData.append('data_type', this.dataType)
}
try {
const fileName = await fetchAndDownload(url, formData)
if (target == 'left') {
this.leftFileList.push({
name: fileName,
})
} else {
this.rightFileList.push({
name: fileName,
})
}
} catch (error) {
console.error(error)
}
},
},
}
</script>
<style lang="less" scoped>
.spectrum-transfer-com {
display: grid;
grid-template-rows: 30px 175px;
grid-template-columns: 1fr 166px 1fr;
row-gap: 8px;
column-gap: 10px;
}
.title {
text-align: center;
background-color: #225a6a;
line-height: 30px;
/deep/.ant-upload {
width: 100%;
cursor: pointer;
}
}
.data-type {
text-align: center;
line-height: 30px;
}
.file-list {
background-color: #225a6a;
overflow: auto;
}
.file-item {
padding: 0 5px;
height: 30px;
line-height: 30px;
cursor: pointer;
&.active {
background-color: #296d81;
}
}
.operators {
display: flex;
flex-direction: column;
justify-content: space-between;
.transit {
.ant-btn {
height: 40px;
width: 100%;
}
}
}
</style>

View File

@ -1,5 +1,5 @@
<template>
<custom-modal v-model="visible" :width="1080" title="File-Format-Ftransit" :footer="null">
<custom-modal v-model="visible" :width="1080" title="File-Format-Ftransit" :footer="null" destroy-on-close>
<a-tabs :animated="false">
<a-tab-pane tab="INT.SPC<=>.IMS" key="1">
<int-spc-ims-transfer />

View File

@ -743,7 +743,6 @@ export default {
{
type: 'a-menu-item',
title: 'Ftransit',
show: this.isGamma || this.isBetaGamma,
handler: () => (this.ftransltModalVisible = true),
},
{