| | |
| | | <template> |
| | | <div class="history-simulation"> |
| | | <div class="left-top"> |
| | | <span @click="getRainData">历史模拟</span> |
| | | <span>历史模拟</span> |
| | | <span class="clickable-text" @click="toggleDetails">{{ |
| | | isCollapsed ? "展开" : "收起" |
| | | }}</span> |
| | |
| | | </div> |
| | | <div class="input-group"> |
| | | <div class="input-item"> |
| | | <label>方案名称:</label> |
| | | <el-input v-model="schemeName" type="text" placeholder="请输入"></el-input> |
| | | </div> |
| | | <div class="input-item"> |
| | | <label>降雨总量:</label> |
| | | <el-input v-model="totalRainfall" type="number" placeholder="请输入"></el-input> |
| | | <span>mm</span> |
| | |
| | | <span>h</span> |
| | | </div> |
| | | </div> |
| | | <div> |
| | | <!-- <div> |
| | | <label>仿真参数:</label> |
| | | <div style="width: 100%; height: 60px; background-color: #fff"></div> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="buttons"> |
| | | <el-button type="primary" @click="openSaveDialog">保存方案</el-button> |
| | |
| | | <el-dialog v-model="saveDialogVisible" title="保存方案" width="50%" :before-close="handleClose" |
| | | custom-class="custom-dialog"> |
| | | <div class="dialog-content"> |
| | | <p><strong>方案名称:</strong>{{ schemeName }}</p> |
| | | <p><strong>所选重点沟:</strong>{{ props.selectedArea }}</p> |
| | | <p><strong>模拟类型:</strong>历史模拟</p> |
| | | <p><strong>历史雨情:</strong>{{ selectedRainfallName }}</p> |
| | |
| | | // const getRainData = () => { |
| | | // getRainfallData() |
| | | // .then((a) => { |
| | | // console.log(a, 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa'); |
| | | // console.log(a, '宏图获取雨量数据'); |
| | | // }) |
| | | // }; |
| | | |
| | |
| | | // 数据绑定 |
| | | const rainfallHistory = ref("2"); // 默认选中第二项 |
| | | const totalRainfall = ref(50); // 降雨总量 |
| | | const schemeName = ref('方案名称'); // 方案名称 |
| | | const rainfallIntensity = ref(70); // 降雨强度 |
| | | const rainfallDuration = ref(5); // 降雨时长 |
| | | const isCollapsed = ref(false); // 控制详情的展开/收起状态 |
| | |
| | | !props.selectedArea || |
| | | !rainfallHistory.value || |
| | | !totalRainfall.value || |
| | | !schemeName.value || |
| | | !rainfallIntensity.value || |
| | | !rainfallDuration.value |
| | | ) { |
| | |
| | | createTime: new Date().toISOString(), // 创建时间 |
| | | taskStatus: 1, // 初始状态为未开始 |
| | | totalRainfall: totalRainfall.value, // 降雨总量 |
| | | schemeName: schemeName.value, // 降雨总量 |
| | | rainfallIntensity: rainfallIntensity.value, // 降雨强度 |
| | | rainfallDuration: rainfallDuration.value, // 降雨时长 |
| | | }; |
| | |
| | | margin-top: 20px; |
| | | display: flex; |
| | | gap: 10px; |
| | | justify-content: space-evenly; |
| | | } |
| | | |
| | | .input-group { |
| | |
| | | |
| | | /* 自定义 Dialog 的 z-index */ |
| | | .custom-dialog { |
| | | z-index: 3000 !important; |
| | | z-index: 5000 !important; |
| | | /* 确保对话框覆盖其他元素 */ |
| | | } |
| | | </style> |