fix: BUG修改
This commit is contained in:
kun
parent
a9cc52bac8
commit
fcb4e4838a
@ -514,6 +514,33 @@
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
// 复选框
|
||||
.el-checkbox {
|
||||
.el-checkbox__inner {
|
||||
// width: 18px !important;
|
||||
// height: 18px !important;
|
||||
background-color: transparent;
|
||||
border: 1px solid var(--el-color-primary);
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
// width: 18px !important;
|
||||
// height: 18px !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
// .el-checkbox__inner::after {
|
||||
// width: 13px;
|
||||
// height: 13px;
|
||||
// background: #3f6ab0;
|
||||
// border-radius: 50%;
|
||||
// }
|
||||
.el-checkbox__label {
|
||||
font-size: 20px;
|
||||
color: var(--el-checkbox-checked-text-color);
|
||||
}
|
||||
.el-checkbox__input.is-checked + .el-checkbox__label {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
// 表单
|
||||
.el-form {
|
||||
.el-form-item__label {
|
||||
@ -522,3 +549,8 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
// 滚动条
|
||||
.el-scrollbar__bar.is-horizontal {
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.leftMenu {
|
||||
// width: 290px;
|
||||
width: 300px;
|
||||
// 页面的项目工程
|
||||
:deep(.item) {
|
||||
height: 78px !important;
|
||||
@ -59,6 +59,27 @@
|
||||
width: calc(100% - 300px);
|
||||
height: 100% !important;
|
||||
margin-left: 20px;
|
||||
.search-select {
|
||||
box-shadow: none;
|
||||
:deep() {
|
||||
.el-card {
|
||||
border-radius: 8px;
|
||||
width: 100%;
|
||||
background-color: var(--el-menu-bg-color);
|
||||
}
|
||||
}
|
||||
.topCard {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
:deep(.el-card__body) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
span {
|
||||
color: var(--el-menu-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.el-scrollbar__view) {
|
||||
|
||||
@ -27,33 +27,35 @@
|
||||
</div>
|
||||
</template>
|
||||
</LeftMenu>
|
||||
<div class="table-box"></div>
|
||||
<div class="table-box">
|
||||
<div class="search-select">
|
||||
<el-card shadow="never" class="topCard">
|
||||
<span style="margin: 0 20px 2px 10px; font-size: 18px">分组</span>
|
||||
<el-checkbox-group v-model="checkList">
|
||||
<el-checkbox label="温度"></el-checkbox>
|
||||
<el-checkbox label="风速"></el-checkbox>
|
||||
<el-checkbox label="PM2.5"></el-checkbox>
|
||||
<el-checkbox label="噪音"></el-checkbox>
|
||||
<el-checkbox label="PM10"></el-checkbox>
|
||||
<el-checkbox label="TSP"></el-checkbox>
|
||||
<el-checkbox label="湿度"></el-checkbox>
|
||||
<el-checkbox label="风向"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
<script lang="tsx" setup name="historyDataAnalysis">
|
||||
import { ref, reactive, onMounted, watch } from "vue";
|
||||
import {
|
||||
getDustprojectPage,
|
||||
getDustengineeringPage,
|
||||
getAIQuestionPage,
|
||||
addAIrecords,
|
||||
getAiMonitorDev
|
||||
} from "@/api/modules/goverment";
|
||||
import { videoList, videoDataAdd, videoDataEdit, videoDataDelete } from "@/api/modules/enterpriseApi";
|
||||
import Pagination from "@/components/ProTable/components/Pagination.vue";
|
||||
import { ElMessage, UploadProps } from "element-plus";
|
||||
import type { FormRules, FormInstance, UploadInstance } from "element-plus";
|
||||
import { getDustprojectPage, getDustengineeringPage, getAIQuestionPage } from "@/api/modules/goverment";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { Delete } from "@element-plus/icons-vue";
|
||||
import { jxj_User } from "@/api/types";
|
||||
import { useHandleData } from "@/hooks/useHandleData";
|
||||
import LeftMenu from "@/components/LeftMenu/LeftMenu.vue";
|
||||
import type { ResAiProjectPage, ResAiEngineerPage } from "@/api/types/government/AIwaring";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import { getRealTimePage } from "@/api/modules/project";
|
||||
import { sendIframeMessage } from "@/utils/util";
|
||||
const radio = ref(1);
|
||||
const checkList = ref([]);
|
||||
const pages = ref({
|
||||
pageNo: 1,
|
||||
pageSize: 7,
|
||||
@ -61,80 +63,7 @@ const pages = ref({
|
||||
});
|
||||
const records = ref<ResAiProjectPage[] | ResAiEngineerPage[]>([]);
|
||||
const active = ref(0);
|
||||
const fileList = ref([]);
|
||||
const store = GlobalStore();
|
||||
// 表格配置项
|
||||
const columns: ColumnProps[] = [
|
||||
{ type: "index", label: "序号", width: 80 },
|
||||
// 多级 prop
|
||||
{ prop: "name", label: "设备名称", isShow: false, search: { el: "input" } },
|
||||
{ prop: "deviceName", label: "设备名称", width: 180 },
|
||||
{
|
||||
prop: "temperature",
|
||||
label: "温度",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.temperature + "℃";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "windspeed",
|
||||
label: "风速",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.windspeed + "m/s";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "pm25",
|
||||
label: "PM2.5",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.pm25 + "μg/m³";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "noise",
|
||||
label: "噪音",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.noise + "db";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "pm10",
|
||||
label: "PM10",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.pm10 + "μg/m³";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "tsp",
|
||||
label: "TSP",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.tsp + "μg/m³";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "humidity",
|
||||
label: "湿度",
|
||||
width: 150,
|
||||
render: scoped => {
|
||||
return scoped.row.humidity + "%";
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "winddirection",
|
||||
label: "风向",
|
||||
width: 160,
|
||||
render: scoped => {
|
||||
return scoped.row.winddirection + "风";
|
||||
}
|
||||
},
|
||||
{ prop: "createTime", label: "上报时间", width: 220 }
|
||||
];
|
||||
interface formData {
|
||||
title: string;
|
||||
uploadTime: string;
|
||||
@ -147,46 +76,17 @@ const formData = ref<formData>({
|
||||
remark: "",
|
||||
videoUrl: ""
|
||||
});
|
||||
const visible = ref(false);
|
||||
const title = ref("新增录像");
|
||||
|
||||
const pageable = ref({
|
||||
pageNo: 1,
|
||||
pageSize: 12,
|
||||
total: 0
|
||||
});
|
||||
|
||||
const videoData = ref({
|
||||
records: []
|
||||
});
|
||||
const form = ref({
|
||||
title: "",
|
||||
createTime: "",
|
||||
startTime: "",
|
||||
endTime: ""
|
||||
});
|
||||
// 搜索用的项目sn或者工程sn
|
||||
const searchSn = ref("");
|
||||
|
||||
// 项目或者工程名字
|
||||
const searchName = ref<string>("");
|
||||
// dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total && pageNum && pageSize 这些字段，那么你可以在这里进行处理成这些字段
|
||||
// 或者直接去 hooks/useTable.ts 文件中把字段改为你后端对应的就行
|
||||
const dataCallback = (data: any) => {
|
||||
// console.log(data);
|
||||
return {
|
||||
list: data.records,
|
||||
total: Number(data.total),
|
||||
pageNo: Number(data.current),
|
||||
pageSize: Number(data.size)
|
||||
};
|
||||
};
|
||||
// 如果你想在请求之前对当前请求参数做一些操作，可以自定义如下函数：params 为当前所有的请求参数（包括分页），最后返回请求列表接口
|
||||
// 默认不做操作就直接在 ProTable 组件上绑定 :requestApi="getUserList"
|
||||
const getTableList = (params: any) => {
|
||||
let newParams = JSON.parse(JSON.stringify(params));
|
||||
return getRealTimePage(newParams);
|
||||
};
|
||||
// 页面的项目名称和工程名称的div点击事件
|
||||
const onSearch = async (params: ResAiProjectPage | ResAiEngineerPage) => {
|
||||
const { result } = await getAIQuestionPage(
|
||||
@ -205,7 +105,6 @@ const onSearch = async (params: ResAiProjectPage | ResAiEngineerPage) => {
|
||||
active.value === 0
|
||||
? (searchName.value = (params as ResAiProjectPage).projectName)
|
||||
: (searchName.value = (params as ResAiEngineerPage).engineeringName);
|
||||
getVideoData();
|
||||
};
|
||||
// leftMenu页面的搜索按钮
|
||||
const onSearchInput = async (params: string) => {
|
||||
@ -230,12 +129,6 @@ const onCurChange = async (params: number) => {
|
||||
}
|
||||
pages.value.total = +res.result.total;
|
||||
};
|
||||
const getVideoData = async () => {
|
||||
const res = await videoList({ ...pageable.value, ...form.value });
|
||||
videoData.value.records = res.result.records;
|
||||
console.log(videoData.value);
|
||||
console.log(res);
|
||||
};
|
||||
// 获取项目名称分页
|
||||
const getProPage = async () => {
|
||||
const { result } = await getDustprojectPage(pages.value);
|
||||
@ -262,7 +155,6 @@ watch(
|
||||
pages.value.pageNo = 1;
|
||||
pages.value.total = 0;
|
||||
// console.log(value);
|
||||
|
||||
if (value === 0) {
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
@ -276,7 +168,6 @@ watch(
|
||||
}
|
||||
);
|
||||
onMounted(async () => {
|
||||
getVideoData();
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
searchSn.value = (records.value as ResAiProjectPage[])[0].projectSn;
|
||||
|
||||
@ -76,11 +76,12 @@ const columns: ColumnProps[] = [
|
||||
|
||||
// 多级 prop
|
||||
{ prop: "name", label: "设备名称", isShow: false, search: { el: "input" } },
|
||||
{ prop: "deviceName", label: "设备名称" },
|
||||
{ prop: "type", label: "报警类型", search: { el: "input" } },
|
||||
{ prop: "deviceName", label: "设备名称", width: 220 },
|
||||
{ prop: "type", label: "报警类型", search: { el: "input" }, width: 200 },
|
||||
{
|
||||
prop: "createTime",
|
||||
label: "报警时间",
|
||||
width: 240,
|
||||
search: {
|
||||
el: "date-picker",
|
||||
|
||||
@ -92,12 +93,12 @@ const columns: ColumnProps[] = [
|
||||
}
|
||||
}
|
||||
},
|
||||
{ prop: "thresholdValue", label: "阈值" },
|
||||
{ prop: "alarmValue", label: "超标数据" },
|
||||
{ prop: "offsetValue", label: "超标量" },
|
||||
{ prop: "cause", label: "原因" },
|
||||
{ prop: "solveTime", label: "恢复时间" },
|
||||
{ prop: "solveValue", label: "恢复数据" },
|
||||
{ prop: "thresholdValue", label: "阈值", width: 200 },
|
||||
{ prop: "alarmValue", label: "超标数据", width: 200 },
|
||||
{ prop: "offsetValue", label: "超标量", width: 200 },
|
||||
{ prop: "cause", label: "原因", width: 200 },
|
||||
{ prop: "solveTime", label: "恢复时间", width: 240 },
|
||||
{ prop: "solveValue", label: "恢复数据", width: 200 },
|
||||
{ prop: "operation", label: "操作", fixed: "right", width: 100 }
|
||||
];
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user