完成form file 弹窗选择文件并保存回显的功能
This commit is contained in:
parent
c0139480f5
commit
ec6cb33835
|
@ -1,29 +1,41 @@
|
|||
<template>
|
||||
<div>
|
||||
<custom-modal v-model="visible" :width="1200" title="Load Data From File">
|
||||
<a-table :data-source="list" :columns="columns" :pagination="false" bordered>
|
||||
<template slot="sampleData" slot-scope="text, record">
|
||||
<phd-select type="file" @change="handleFileChange(record, 'sampleData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
{{ text && text.name }}
|
||||
</phd-select>
|
||||
<a-table :data-source="list" :columns="columns" :loading="loading_list" :pagination="false" bordered>
|
||||
<template slot="sampleData" slot-scope="text">
|
||||
<div class="file-name" :title="text" @click="handleFileSelect">
|
||||
{{ text }}
|
||||
</div>
|
||||
<!-- <phd-select type="file" @change="handleFileChange(record, 'sampleData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
{{ text }}
|
||||
</phd-select> -->
|
||||
</template>
|
||||
<template slot="gasBkData" slot-scope="text, record">
|
||||
<phd-select type="file" @change="handleFileChange(record, 'gasBkData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
<template slot="gasBkData" slot-scope="text">
|
||||
<div class="file-name" :title="text" @click="handleFileSelect">
|
||||
{{ text }}
|
||||
</div>
|
||||
<!-- <phd-select type="file" @change="handleFileChange(record, 'gasBkData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
{{ text && text.name }}
|
||||
</phd-select>
|
||||
</phd-select> -->
|
||||
</template>
|
||||
<template slot="detBkData" slot-scope="text, record">
|
||||
<phd-select type="file" @change="handleFileChange(record, 'detBkData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
<template slot="detBkData" slot-scope="text">
|
||||
<div class="file-name" :title="text" @click="handleFileSelect">
|
||||
{{ text }}
|
||||
</div>
|
||||
<!-- <phd-select type="file" @change="handleFileChange(record, 'detBkData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
{{ text && text.name }}
|
||||
</phd-select>
|
||||
</phd-select> -->
|
||||
</template>
|
||||
<template slot="qcData" slot-scope="text, record">
|
||||
<phd-select type="file" @change="handleFileChange(record, 'qcData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
<template slot="qcData" slot-scope="text">
|
||||
<div class="file-name" :title="text" @click="handleFileSelect">
|
||||
{{ text }}
|
||||
</div>
|
||||
<!-- <phd-select type="file" @change="handleFileChange(record, 'qcData', $event)" @select="handleFileSelect" :title="text && text.name">
|
||||
{{ text && text.name }}
|
||||
</phd-select>
|
||||
</phd-select> -->
|
||||
</template>
|
||||
<template slot="status" slot-scope="text">
|
||||
<span class="status"></span>
|
||||
<template slot="status" slot-scope="text,record">
|
||||
<span :class="[record.detFileStatus&&record.gasFileStatus&&record.qcFileStatus?'status_true':'status_false','status']"></span>
|
||||
</template>
|
||||
</a-table>
|
||||
|
||||
|
@ -68,7 +80,7 @@
|
|||
</div>
|
||||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success">Save</a-button>
|
||||
<a-button type="success" @click="saveFileName">Save</a-button>
|
||||
<a-button type="warn" @click="cancelFileModale">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
|
@ -84,7 +96,7 @@ import { getAction,postAction } from '../../../../api/manage'
|
|||
const columns = [
|
||||
{
|
||||
title: 'SampleData',
|
||||
dataIndex: 'sampleData',
|
||||
dataIndex: 'sampleFileName',
|
||||
width: '23%',
|
||||
ellipsis: true,
|
||||
scopedSlots: {
|
||||
|
@ -93,7 +105,7 @@ const columns = [
|
|||
},
|
||||
{
|
||||
title: 'GasBkData',
|
||||
dataIndex: 'gasBkData',
|
||||
dataIndex: 'gasFileName',
|
||||
width: '23%',
|
||||
ellipsis: true,
|
||||
scopedSlots: {
|
||||
|
@ -102,7 +114,7 @@ const columns = [
|
|||
},
|
||||
{
|
||||
title: 'DetBkData',
|
||||
dataIndex: 'detBkData',
|
||||
dataIndex: 'detFileName',
|
||||
width: '23%',
|
||||
ellipsis: true,
|
||||
scopedSlots: {
|
||||
|
@ -111,7 +123,7 @@ const columns = [
|
|||
},
|
||||
{
|
||||
title: 'QCData',
|
||||
dataIndex: 'qcData',
|
||||
dataIndex: 'qcFileName',
|
||||
width: '23%',
|
||||
ellipsis: true,
|
||||
scopedSlots: {
|
||||
|
@ -157,6 +169,7 @@ export default {
|
|||
list_file: [],
|
||||
columns_file,
|
||||
loading_file: false,
|
||||
loading_list: false,
|
||||
list: this.getInitialList(),
|
||||
ipagination:{
|
||||
current: 1,
|
||||
|
@ -171,6 +184,7 @@ export default {
|
|||
total: 0
|
||||
},
|
||||
selectedRowKeys: [],
|
||||
selectedFiles: [],
|
||||
fileList: [],
|
||||
fileNum: 0,
|
||||
uploading: false
|
||||
|
@ -180,10 +194,10 @@ export default {
|
|||
// 初始化为10*4的表格
|
||||
getInitialList() {
|
||||
return new Array(10).fill(0).map(() => ({
|
||||
sampleData: undefined,
|
||||
gasBkData: undefined,
|
||||
detBkData: undefined,
|
||||
qcData: undefined
|
||||
sampleFileName: undefined,
|
||||
gasFileName: undefined,
|
||||
detFileName: undefined,
|
||||
qcFileName: undefined
|
||||
}))
|
||||
},
|
||||
|
||||
|
@ -222,9 +236,26 @@ export default {
|
|||
pageSize: size
|
||||
})
|
||||
},
|
||||
onSelectChange(selectedRowKeys) {
|
||||
console.log('selectedRowKeys changed: ', selectedRowKeys);
|
||||
this.selectedRowKeys = selectedRowKeys;
|
||||
onSelectChange(selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedFiles = selectedRows.map(item => {
|
||||
return item.name
|
||||
});
|
||||
},
|
||||
saveFileName() {
|
||||
this.visible_file = false
|
||||
this.loading_list = true
|
||||
let params = {
|
||||
fileName: this.selectedFiles.join(",")
|
||||
}
|
||||
getAction("/spectrumAnalysis/getFilesBySampleFile", params).then(res => {
|
||||
this.loading_list = false
|
||||
if (res.success) {
|
||||
this.list =res.result.length>0? res.result:this.getInitialList()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
}
|
||||
})
|
||||
},
|
||||
cancelFileModale() {
|
||||
this.visible_file = false
|
||||
|
@ -315,6 +346,12 @@ export default {
|
|||
|
||||
background-color: #00e170;
|
||||
}
|
||||
.status_true{
|
||||
background-color: #00e170;
|
||||
}
|
||||
.status_false{
|
||||
background-color: red;
|
||||
}
|
||||
::v-deep {
|
||||
@tableBorderColor: #000;
|
||||
|
||||
|
@ -370,4 +407,11 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
.file-name {
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue
Block a user