141 lines
2.2 KiB
Vue
141 lines
2.2 KiB
Vue
<template>
|
|
<div class="detailed-infomation">
|
|
<a-form :labelCol="{ style: { width: 120 } }">
|
|
<a-row v-for="(row, index) in items" :key="index">
|
|
<a-col v-for="(item, i) in row" :key="i" :span="item.span || 4">
|
|
<a-form-item :label="item.label">
|
|
{{ data[item.name] }}
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
const items = [
|
|
[
|
|
{
|
|
label: 'Sample Id',
|
|
name: 'sampleId'
|
|
},
|
|
{
|
|
label: 'Data Type',
|
|
name: 'dataType'
|
|
},
|
|
{
|
|
label: 'Collection Start',
|
|
name: 'collectionStart',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Acquisition Start',
|
|
name: 'acquisitionStart',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Auto.Cat',
|
|
name: 'autoCat'
|
|
}
|
|
],
|
|
[
|
|
{
|
|
label: 'Station Code',
|
|
name: 'stationCode'
|
|
},
|
|
{
|
|
label: 'Spectral Qualifier',
|
|
name: 'spectralQualifier'
|
|
},
|
|
{
|
|
label: 'Sampling Time',
|
|
name: 'samplingTime',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Acq.Real',
|
|
name: 'acqReal',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Category',
|
|
name: 'category'
|
|
}
|
|
],
|
|
[
|
|
{
|
|
label: 'Detector Code',
|
|
name: 'detectorCode'
|
|
},
|
|
{
|
|
label: 'SRID',
|
|
name: 'srid'
|
|
},
|
|
{
|
|
label: 'Quantity',
|
|
name: 'quantity',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Acq.Live',
|
|
name: 'acqLive',
|
|
span: 6
|
|
}
|
|
],
|
|
[
|
|
{
|
|
label: 'System Type',
|
|
name: 'systemType'
|
|
},
|
|
{
|
|
label: 'Sample Status',
|
|
name: 'sampleStatus'
|
|
},
|
|
{
|
|
label: 'Flow Rate',
|
|
name: 'flowRate',
|
|
span: 6
|
|
},
|
|
{
|
|
label: 'Decay Time',
|
|
name: 'decayTime',
|
|
span: 6
|
|
}
|
|
]
|
|
]
|
|
export default {
|
|
props: {
|
|
data: {
|
|
type: Object,
|
|
default: () => ({
|
|
sampleId: 1,
|
|
dataType: 'SAMPLEPHD'
|
|
})
|
|
}
|
|
},
|
|
created() {
|
|
this.items = items
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.detailed-infomation {
|
|
width: 1200px;
|
|
|
|
.ant-form-item {
|
|
margin-bottom: 0;
|
|
|
|
::v-deep {
|
|
.ant-form-item-label > label {
|
|
color: #ade6ee;
|
|
}
|
|
|
|
.ant-form-item-children {
|
|
color: #0cecca;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|