324 lines
10 KiB
Vue
324 lines
10 KiB
Vue
|
<template>
|
||
|
|
<page-header-wrapper>
|
||
|
|
<Grid :columns="['400px', 1]" :rows="gridRows">
|
||
|
|
<a-card
|
||
|
|
title="想定列表"
|
||
|
|
class="my-card my-card-has-title"
|
||
|
|
:bordered="false"
|
||
|
|
v-loading="xd.loading"
|
||
|
|
style="grid-row: 1 / 3"
|
||
|
|
>
|
||
|
|
<template #extra>
|
||
|
|
<a-icon type="sync" style="font-size: 30px" @click="getXdListData()" />
|
||
|
|
</template>
|
||
|
|
<a-tree
|
||
|
|
:treeData="xd.listData"
|
||
|
|
:replaceFields="{ title: 'name', key: 'id' }"
|
||
|
|
:selectedKeys.sync="xd.selectedKeys"
|
||
|
|
@select="handleChangeXdSelected"
|
||
|
|
>
|
||
|
|
</a-tree>
|
||
|
|
</a-card>
|
||
|
|
<a-card title="气象环境" class="my-card my-card-has-title" :bordered="false">
|
||
|
|
<template #extra>
|
||
|
|
<a-button type="primary" style="margin-right: 20px" @click="handleOpenAddQxhjModal">新增</a-button>
|
||
|
|
<a-icon
|
||
|
|
v-if="layoutRight === 'qxhj'"
|
||
|
|
type="fullscreen-exit"
|
||
|
|
style="font-size: 32px"
|
||
|
|
@click="layoutRight = 'auto'"
|
||
|
|
/>
|
||
|
|
<a-icon v-else type="fullscreen" style="font-size: 32px" @click="layoutRight = 'qxhj'" />
|
||
|
|
</template>
|
||
|
|
<AntQueryTable
|
||
|
|
ref="qxhj-table"
|
||
|
|
height="100%"
|
||
|
|
:queryConfig="qxhj.queryConfig"
|
||
|
|
:tableConfig="qxhj.tableConfig"
|
||
|
|
:pageConfig="qxhj.pageConfig"
|
||
|
|
:showTool="qxhj.showTool"
|
||
|
|
>
|
||
|
|
<template #tablecell-action="{ record }">
|
||
|
|
<a-button type="text-primary" icon="edit" @click="handleOpenEditQxhjModal(record)"></a-button>
|
||
|
|
</template>
|
||
|
|
</AntQueryTable>
|
||
|
|
</a-card>
|
||
|
|
<a-card title="电磁环境" class="my-card my-card-has-title" :bordered="false">
|
||
|
|
<template #extra>
|
||
|
|
<a-button type="primary" style="margin-right: 20px" @click="handleOpenAddDchjModal">新增</a-button>
|
||
|
|
<a-icon
|
||
|
|
v-if="layoutRight === 'dchj'"
|
||
|
|
type="fullscreen-exit"
|
||
|
|
style="font-size: 32px"
|
||
|
|
@click="layoutRight = 'auto'"
|
||
|
|
/>
|
||
|
|
<a-icon v-else type="fullscreen" style="font-size: 32px" @click="layoutRight = 'dchj'" />
|
||
|
|
</template>
|
||
|
|
<AntQueryTable
|
||
|
|
ref="dchj-table"
|
||
|
|
height="100%"
|
||
|
|
:queryConfig="dchj.queryConfig"
|
||
|
|
:tableConfig="dchj.tableConfig"
|
||
|
|
:pageConfig="dchj.pageConfig"
|
||
|
|
:showTool="dchj.showTool"
|
||
|
|
>
|
||
|
|
<template #tablecell-action="{ record }">
|
||
|
|
<a-button type="text-primary" icon="edit" @click="handleOpenEditDchjModal(record)"></a-button>
|
||
|
|
</template>
|
||
|
|
</AntQueryTable>
|
||
|
|
</a-card>
|
||
|
|
</Grid>
|
||
|
|
<AntFormModal
|
||
|
|
:visible.sync="qxhjModal.visible"
|
||
|
|
:title="qxhjModal.title"
|
||
|
|
:formItems="qxhjModal.formItems"
|
||
|
|
:formRules="qxhjModal.formRules"
|
||
|
|
:formData="qxhjModal.formData"
|
||
|
|
:onSubmit="handleSubmitQxhj"
|
||
|
|
@success="handleSubmitQxhjSuccess"
|
||
|
|
></AntFormModal>
|
||
|
|
<AntFormModal
|
||
|
|
:visible.sync="dchjModal.visible"
|
||
|
|
:title="dchjModal.title"
|
||
|
|
:formItems="dchjModal.formItems"
|
||
|
|
:formRules="dchjModal.formRules"
|
||
|
|
:formData="dchjModal.formData"
|
||
|
|
:onSubmit="handleSubmitDchj"
|
||
|
|
@success="handleSubmitDchjSuccess"
|
||
|
|
></AntFormModal>
|
||
|
|
</page-header-wrapper>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'Bzhjsjk',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
layoutRight: 'auto',
|
||
|
|
xd: {
|
||
|
|
loading: false,
|
||
|
|
listData: [],
|
||
|
|
selectedKeys: [],
|
||
|
|
},
|
||
|
|
|
||
|
|
qxhj: {
|
||
|
|
queryConfig: false,
|
||
|
|
tableConfig: {
|
||
|
|
table: {},
|
||
|
|
immediate: false,
|
||
|
|
query: (queryParams) =>
|
||
|
|
this.$http({
|
||
|
|
url: `/environment/weather/list`,
|
||
|
|
method: 'get',
|
||
|
|
params: { id: this.xd.selectedKeys[0], ...queryParams },
|
||
|
|
}),
|
||
|
|
columns: [
|
||
|
|
{ dataIndex: 'serial' },
|
||
|
|
{ title: '区域', dataIndex: 'area' },
|
||
|
|
{ title: '日期', dataIndex: 'date' },
|
||
|
|
{ title: '天气', dataIndex: 'weather' },
|
||
|
|
{ title: '大气压', dataIndex: 'airPressure' },
|
||
|
|
{ title: '空气质量', dataIndex: 'airQuality' },
|
||
|
|
{ title: '湿度', dataIndex: 'humidity' },
|
||
|
|
{ title: '降水量', dataIndex: 'precipitation' },
|
||
|
|
{ title: '能见度', dataIndex: 'visibility' },
|
||
|
|
{ title: '风向', dataIndex: 'windDirection' },
|
||
|
|
{ title: '风力', dataIndex: 'windPower' },
|
||
|
|
{ title: '风速', dataIndex: 'windSpeed' },
|
||
|
|
{ dataIndex: 'action', width: 100 },
|
||
|
|
],
|
||
|
|
},
|
||
|
|
pageConfig: true,
|
||
|
|
showTool: false,
|
||
|
|
},
|
||
|
|
qxhjModal: {
|
||
|
|
visible: false,
|
||
|
|
title: '',
|
||
|
|
mode: '',
|
||
|
|
formItems: [
|
||
|
|
{
|
||
|
|
label: '区域',
|
||
|
|
prop: 'area',
|
||
|
|
component: 'AntOriginSelect',
|
||
|
|
options: { dataSource: () => this.$http({ url: `/system/area/getTreeSelect`, method: 'get' }) },
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '日期',
|
||
|
|
prop: 'date',
|
||
|
|
component: 'a-date-picker',
|
||
|
|
options: { format: 'YYYY/MM/DD', valueFormat: 'YYYY/MM/DD' },
|
||
|
|
},
|
||
|
|
{ label: '天气', prop: 'weather' },
|
||
|
|
{ label: '大气压', prop: 'airPressure' },
|
||
|
|
{ label: '空气质量', prop: 'airQuality' },
|
||
|
|
{ label: '湿度', prop: 'humidity' },
|
||
|
|
{ label: '降水量', prop: 'precipitation' },
|
||
|
|
{ label: '能见度', prop: 'visibility' },
|
||
|
|
{ label: '风向', prop: 'windDirection' },
|
||
|
|
{ label: '风力', prop: 'windPower' },
|
||
|
|
{ label: '风速', prop: 'windSpeed' },
|
||
|
|
],
|
||
|
|
formRules: {},
|
||
|
|
formData: {},
|
||
|
|
},
|
||
|
|
|
||
|
|
dchj: {
|
||
|
|
queryConfig: false,
|
||
|
|
tableConfig: {
|
||
|
|
table: {},
|
||
|
|
immediate: false,
|
||
|
|
query: (queryParams) =>
|
||
|
|
this.$http({
|
||
|
|
url: `/environment/ebe/list`,
|
||
|
|
method: 'get',
|
||
|
|
params: { id: this.xd.selectedKeys[0], ...queryParams },
|
||
|
|
}),
|
||
|
|
columns: [
|
||
|
|
{ dataIndex: 'serial' },
|
||
|
|
{ title: '区域', dataIndex: 'area' },
|
||
|
|
{ title: '持续时间', dataIndex: 'duration' },
|
||
|
|
{ title: '环境变化趋势', dataIndex: 'environmentalChangeTrends' },
|
||
|
|
{ title: '环境复杂度', dataIndex: 'environmentalComplexity' },
|
||
|
|
{ title: '磁场强度', dataIndex: 'fieldStrength' },
|
||
|
|
{ title: '频率', dataIndex: 'frequency' },
|
||
|
|
{ title: '频率区间', dataIndex: 'frequencyRang' },
|
||
|
|
{ title: '干扰幅度', dataIndex: 'interferenceAmplitude' },
|
||
|
|
{ title: '干扰源', dataIndex: 'interferenceSource' },
|
||
|
|
{ title: '干扰类型', dataIndex: 'interferenceType' },
|
||
|
|
{ title: '波型', dataIndex: 'waveType' },
|
||
|
|
{ dataIndex: 'action', width: 100 },
|
||
|
|
],
|
||
|
|
},
|
||
|
|
pageConfig: true,
|
||
|
|
showTool: false,
|
||
|
|
},
|
||
|
|
dchjModal: {
|
||
|
|
visible: false,
|
||
|
|
title: '',
|
||
|
|
mode: '',
|
||
|
|
formItems: [
|
||
|
|
{
|
||
|
|
label: '区域',
|
||
|
|
prop: 'area',
|
||
|
|
component: 'AntOriginSelect',
|
||
|
|
options: { dataSource: () => this.$http({ url: `/system/area/getTreeSelect`, method: 'get' }) },
|
||
|
|
},
|
||
|
|
{ label: '持续时间', prop: 'duration' },
|
||
|
|
{ label: '环境变化趋势', prop: 'environmentalChangeTrends' },
|
||
|
|
{ label: '环境复杂度', prop: 'environmentalComplexity' },
|
||
|
|
{ label: '磁场强度', prop: 'fieldStrength' },
|
||
|
|
{ label: '频率', prop: 'frequency' },
|
||
|
|
{ label: '频率区间', prop: 'frequencyRang' },
|
||
|
|
{ label: '干扰幅度', prop: 'interferenceAmplitude' },
|
||
|
|
{ label: '干扰源', prop: 'interferenceSource' },
|
||
|
|
{ label: '干扰类型', prop: 'interferenceType' },
|
||
|
|
{ label: '波型', prop: 'waveType' },
|
||
|
|
],
|
||
|
|
formRules: {},
|
||
|
|
formData: {},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
gridRows() {
|
||
|
|
return {
|
||
|
|
auto: [1, 1],
|
||
|
|
qxhj: [1, '56px'],
|
||
|
|
dchj: ['56px', 1],
|
||
|
|
}[this.layoutRight]
|
||
|
|
},
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getXdListData()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
async getXdListData() {
|
||
|
|
try {
|
||
|
|
this.xd.loading = true
|
||
|
|
const res = await this.$http({
|
||
|
|
url: `/baseData/scenario/all`,
|
||
|
|
method: 'get',
|
||
|
|
})
|
||
|
|
this.xd.listData = res.data
|
||
|
|
if (this.xd.selectedKeys.length === 0) {
|
||
|
|
this.xd.selectedKeys = [this.xd.listData[0].id]
|
||
|
|
this.handleChangeXdSelected()
|
||
|
|
}
|
||
|
|
} catch (error) {
|
||
|
|
console.log(error)
|
||
|
|
} finally {
|
||
|
|
this.xd.loading = false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleChangeXdSelected() {
|
||
|
|
this.$refs['qxhj-table'].commitAction('query')
|
||
|
|
this.$refs['dchj-table'].commitAction('query')
|
||
|
|
},
|
||
|
|
|
||
|
|
handleOpenAddQxhjModal() {
|
||
|
|
this.qxhjModal.title = '新建气象环境'
|
||
|
|
this.qxhjModal.mode = 'add'
|
||
|
|
this.qxhjModal.formData = { sceneId: this.xd.selectedKeys[0] }
|
||
|
|
this.qxhjModal.visible = true
|
||
|
|
},
|
||
|
|
async handleOpenEditQxhjModal(record) {
|
||
|
|
try {
|
||
|
|
const res = await this.$http({
|
||
|
|
url: `/environment/weather/${record.id}`,
|
||
|
|
method: 'get',
|
||
|
|
})
|
||
|
|
this.qxhjModal.title = `编辑气象环境`
|
||
|
|
this.qxhjModal.mode = 'edit'
|
||
|
|
this.qxhjModal.formData = { ...res.data }
|
||
|
|
this.qxhjModal.visible = true
|
||
|
|
} catch (error) {
|
||
|
|
console.log(error)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleSubmitQxhj(formData) {
|
||
|
|
return this.$http({
|
||
|
|
url: `/environment/weather/save`,
|
||
|
|
method: 'post',
|
||
|
|
data: formData,
|
||
|
|
})
|
||
|
|
},
|
||
|
|
handleSubmitQxhjSuccess() {
|
||
|
|
this.$refs['qxhj-table'].commitAction('query')
|
||
|
|
},
|
||
|
|
|
||
|
|
handleOpenAddDchjModal() {
|
||
|
|
this.dchjModal.title = '新建电磁环境'
|
||
|
|
this.dchjModal.mode = 'add'
|
||
|
|
this.dchjModal.formData = { sceneId: this.xd.selectedKeys[0] }
|
||
|
|
this.dchjModal.visible = true
|
||
|
|
},
|
||
|
|
async handleOpenEditDchjModal(record) {
|
||
|
|
try {
|
||
|
|
const res = await this.$http({
|
||
|
|
url: `/environment/ebe/${record.id}`,
|
||
|
|
method: 'get',
|
||
|
|
})
|
||
|
|
this.dchjModal.title = `编辑电磁环境`
|
||
|
|
this.dchjModal.mode = 'edit'
|
||
|
|
this.dchjModal.formData = { ...res.data }
|
||
|
|
this.dchjModal.visible = true
|
||
|
|
} catch (error) {
|
||
|
|
console.log(error)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleSubmitDchj(formData) {
|
||
|
|
return this.$http({
|
||
|
|
url: `/environment/ebe/save`,
|
||
|
|
method: 'post',
|
||
|
|
data: formData,
|
||
|
|
})
|
||
|
|
},
|
||
|
|
handleSubmitDchjSuccess() {
|
||
|
|
this.$refs['dchj-table'].commitAction('query')
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped></style>
|