LSSE-front/src/views/simulationScene/database/bzhjsjk.vue
2025-09-21 11:55:44 +08:00

307 lines
9.0 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"
width="900px"
: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: `/baseData/weatherResource/list`,
method: 'get',
params: { id: this.xd.selectedKeys[0], ...queryParams },
}),
columns: [
{ dataIndex: 'serial' },
{ title: '天气类型', dataIndex: 'weatherType' },
{ title: '持续开始时间', dataIndex: 'lastBegTime' },
{ title: '持续结束时间', dataIndex: 'lastEndTime' },
// { dataIndex: 'action', width: 100 },
],
},
pageConfig: true,
showTool: false,
},
qxhjModal: {
visible: false,
title: '',
mode: '',
formItems: [
{
label: '天气类型',
prop: 'weatherType',
component: 'AntOriginSelect',
options: {
dataSource: () => ({
data: [
{ title: 'rain', id: 'rain' },
{ title: 'snow', id: 'snow' },
],
}),
},
},
{
label: '持续开始时间',
prop: 'lastBegTimeStr',
component: 'a-date-picker',
options: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' },
},
{
label: '持续结束时间',
prop: 'lastEndTimeStr',
component: 'a-date-picker',
options: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' },
},
],
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: 'fieldStrength' },
{ title: '频率', dataIndex: 'ebeR' },
{ title: '经度', dataIndex: 'ebeLon' },
{ title: '纬度', dataIndex: 'ebeLat' },
{ dataIndex: 'action', width: 100 },
],
},
pageConfig: true,
showTool: false,
},
dchjModal: {
visible: false,
title: '',
mode: '',
formItems: [
{
label: '电磁强度',
prop: 'fieldStrength',
component: 'AntOriginSelect',
options: {
dataSource: () => ({
data: [
{ title: '高', id: '高' },
{ title: '中', id: '中' },
{ title: '低', id: '低' },
],
}),
},
},
{ label: '频率', prop: 'ebeR' },
{ label: '经度', prop: 'ebeLon', component: 'LongitudeInput' },
{ label: '纬度', prop: 'ebeLat', component: 'LatitudeInput' },
],
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 = { scenarioId: this.xd.selectedKeys[0] }
this.qxhjModal.visible = true
},
handleOpenEditQxhjModal(record) {
this.qxhjModal.title = `编辑气象环境`
this.qxhjModal.mode = 'edit'
this.qxhjModal.formData = { ...record }
this.qxhjModal.visible = true
},
handleSubmitQxhj(formData) {
return this.$http({
url: `/baseData/weatherResource/add`,
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>