|
@@ -0,0 +1,244 @@
|
|
|
+<script setup>
|
|
|
+import { ElMessage, ElLoading } from 'element-plus'
|
|
|
+import request from '@/utils/request'
|
|
|
+import { getToken } from '@/utils/auth'
|
|
|
+
|
|
|
+const tableData = ref([
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 10",
|
|
|
+ "no3Hlj1Jqr": "2",
|
|
|
+ "no3Qyc1Jqr": "3",
|
|
|
+ "nh31Jqr": "4"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 11",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 12",
|
|
|
+ "no3Hlj1Jqr": "2",
|
|
|
+ "no3Qyc1Jqr": "3",
|
|
|
+ "nh31Jqr": "4"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 13",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 14",
|
|
|
+ "no3Hlj1Jqr": "2",
|
|
|
+ "no3Qyc1Jqr": "3",
|
|
|
+ "nh31Jqr": "4"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 15",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 16",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 17",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 18",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 19",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "test_hour": "2025/04/22 20",
|
|
|
+ "no3Hlj1Jqr": "5",
|
|
|
+ "no3Qyc1Jqr": "6",
|
|
|
+ "nh31Jqr": "7"
|
|
|
+ }
|
|
|
+
|
|
|
+]);
|
|
|
+const result = ref([]);
|
|
|
+
|
|
|
+// 添加一行
|
|
|
+const onAddTableRow = () => {
|
|
|
+ tableData.value.push({});
|
|
|
+}
|
|
|
+
|
|
|
+// 删除一行
|
|
|
+const onDeleteRow = (index) => {
|
|
|
+ tableData.value.splice(index, 1);
|
|
|
+}
|
|
|
+
|
|
|
+const postAddData = (data) => {
|
|
|
+ return request({
|
|
|
+ url: '/front/configPredictRemote',
|
|
|
+ method: 'post',
|
|
|
+ data: JSON.stringify({ data })
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const onSubmit = async () => {
|
|
|
+
|
|
|
+ if (tableData.value.length === 0) {
|
|
|
+ return ElMessage({
|
|
|
+ message: '内容未填写',
|
|
|
+ type: 'error',
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ if (tableData.value.length < 6) {
|
|
|
+ return ElMessage({
|
|
|
+ message: '至少填写6条数据',
|
|
|
+ type: 'error',
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const loading = ElLoading.service({
|
|
|
+ lock: true,
|
|
|
+ text: 'Loading',
|
|
|
+ background: 'rgba(0, 0, 0, 0.7)',
|
|
|
+ })
|
|
|
+
|
|
|
+ const { data } = await postAddData(tableData.value);
|
|
|
+
|
|
|
+ result.value = data.map(item => {
|
|
|
+ const ext = JSON.parse(item.ext);
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ feedbackText: ext.feedback
|
|
|
+ }
|
|
|
+ }).sort((a, b) => {
|
|
|
+ return a.id - b.id
|
|
|
+ });
|
|
|
+
|
|
|
+ loading.close();
|
|
|
+};
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <section class="container space-x-10">
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" @click="onAddTableRow">新增一行</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="left">
|
|
|
+ <el-table :data="tableData" style="width: 100%" border>
|
|
|
+ <el-table-column type="index" label="序号" width="60" align="center" />
|
|
|
+ <el-table-column prop="test_hour" label="日期" align="center">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-date-picker v-model="row.test_hour" type="datetime" format="YYYY/MM/DD HH" time-format="HH"
|
|
|
+ value-format="YYYY/MM/DD HH" style="width: 100%;" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="no3Hlj1Jqr" label="好氧池硝酸盐">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-input v-model="row.no3Hlj1Jqr" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="no3Qyc1Jqr" label="缺氧池硝酸盐">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-input v-model="row.no3Qyc1Jqr" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="nh31Jqr" label="缺氧池氨氮">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-input v-model="row.nh31Jqr" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="80" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button @click="onDeleteRow(scope.$index)" type="danger" size="small">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ <h4>执行结果:</h4>
|
|
|
+ <el-divider />
|
|
|
+ <div>
|
|
|
+ <div v-for="item in result" :key="item.id">
|
|
|
+ <p>后反馈设置值: {{ item.base_para }}</p>
|
|
|
+ <p>基础控制系数: {{ item.control_coef }}</p>
|
|
|
+ <p>当前控制系数: {{ item.coef }}</p>
|
|
|
+ <p>子区间: {{ item.cate }}</p>
|
|
|
+ <p>档位: {{ item.subcate }}</p>
|
|
|
+ <p>反馈类型: {{ item.feedback_type == 'postFeedback' ? '后反馈' : '前反馈' }}</p>
|
|
|
+ <p>日志内容: {{ item.feedbackText }}</p>
|
|
|
+ <p>更新时间: {{ item.update_time }}</p>
|
|
|
+ <el-divider />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <el-divider />
|
|
|
+
|
|
|
+ <div class="btn-wrap">
|
|
|
+ <el-button type="primary" size="large" @click="onSubmit">运 行</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <dl style="padding: 20px 0 0 40px">
|
|
|
+ <dt>注意事项</dt>
|
|
|
+ <li>日期需要填写最近3三天内连续的时间</li>
|
|
|
+ <li>数据至少填写6行</li>
|
|
|
+ </dl>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.container {
|
|
|
+ display: flex;
|
|
|
+ padding: 30px;
|
|
|
+
|
|
|
+ .left {
|
|
|
+ width: 800px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right {
|
|
|
+ width: 400px;
|
|
|
+ min-height: 300px;
|
|
|
+ padding: 30px;
|
|
|
+ background: #f8f6e4;
|
|
|
+
|
|
|
+ h4 {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #4a4a4a;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.btn-wrap {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.el-time-spinner {
|
|
|
+ .el-time-spinner__wrapper {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-time-spinner__wrapper:nth-child(2) {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|