ly.fan
/
icing-front
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

覆冰

Browse Source
master
fanluyan 2 years ago
parent 04f64d3a72
commit 1b82ef8e5a
14 changed files with 1656 additions and 473 deletions
Show Stats Download Patch File Download Diff File

7
README.md
Unescape Escape View File

@ -1,24 +1,29 @@
# my # 覆冰项目
## Project setup ## Project setup
``` ```
npm install npm install
``` ```
### Compiles and hot-reloads for development ### Compiles and hot-reloads for development
``` ```
npm run serve npm run serve
``` ```
### Compiles and minifies for production ### Compiles and minifies for production
``` ```
npm run build npm run build
``` ```
### Lints and fixes files ### Lints and fixes files
``` ```
npm run lint npm run lint
``` ```
### Customize configuration ### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/). See [Configuration Reference](https://cli.vuejs.org/config/).

46
src/components/Sidebar.vue
Unescape Escape View File

@ -63,31 +63,31 @@ export default {
index: "/icing", index: "/icing",
title: "覆冰监测", title: "覆冰监测",
}, },
{
icon: "el-icon-s-marketing",
index: "/equipmentStatus",
title: "设备状态",
},
// { // {
// icon: "el-icon-files", // icon: "el-icon-s-marketing",
// index: "/property", // index: "/equipmentStatus",
// title: "资产管理", // title: "设备状态",
// subs: [
// {
// index: "/lineInformation",
// title: "线路管理",
// },
// {
// index: "/towerInformation",
// title: "杆塔管理",
// },
// {
// index: "/photographicDevice",
// title: "监测终端管理",
// },
// ],
// }, // },
{
icon: "el-icon-files",
index: "/property",
title: "资产管理",
subs: [
{
index: "/lineInformation",
title: "线路管理",
},
{
index: "/towerInformation",
title: "杆塔管理",
},
{
index: "/photographicDevice",
title: "监测终端管理",
},
],
},
], ],
}; };
}, },

117
src/components/leftTree.vue
Unescape Escape View File

@ -1,5 +1,22 @@
<template> <template>
<div class="leftTreeBox"> <div class="leftTreeBox">
<div class="companyBox">
<span class="spanLabel"
><i class="el-icon-office-building"></i>公司：</span
>
<el-select v-model="companyVal" placeholder="请选择公司">
<!-- <el-option label="捕鱼达人" value="budr"></el-option> -->
<el-option
v-for="item in companyOptions"
:key="item.value"
:label="item.label"
:value="item.value"
@click.native="handleClick(item.value)"
>
</el-option>
</el-select>
</div>
<el-divider></el-divider>
<div class="searchBar"> <div class="searchBar">
<el-input <el-input
placeholder="输入关键字进行过滤" placeholder="输入关键字进行过滤"
@ -10,11 +27,12 @@
</div> </div>
<el-tree <el-tree
ref="tree" ref="tree"
v-loading="treeLoading"
:data="lineTreeData" :data="lineTreeData"
:props="defaultProps" :props="defaultProps"
node-key="id" node-key="id"
:default-expanded-keys="defaultExpandedKeys"
highlight-current highlight-current
:default-expanded-keys="[9]"
:expand-on-click-node="false" :expand-on-click-node="false"
:filter-node-method="filterNode" :filter-node-method="filterNode"
:current-node-key="currentNodekey" :current-node-key="currentNodekey"
@ -23,7 +41,8 @@
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span v-if="node.level === 1"> <span v-if="node.level === 1">
<span class="iconfont icon-dianli" style="margin-right: 6px"></span> <span class="iconfont icon-dianli" style="margin-right: 6px"></span>
<span>{{ node.label }} </span> <!-- <span>{{ node.label }} </span> -->
<span>捕鱼达人</span>
</span> </span>
<span v-else-if="node.level === 2"> <span v-else-if="node.level === 2">
<span class="iconfont icon-dianlihangye" style="margin-right: 6px"> <span class="iconfont icon-dianlihangye" style="margin-right: 6px">
@ -61,6 +80,14 @@ import { getdyTreeListJoggle } from "@/utils/api/index";
export default { export default {
data() { data() {
return { return {
treeLoading: false,
companyVal: "", //公司，
companyOptions: [
{
value: "bydr",
label: "捕鱼达人",
},
],
filterText: "", //查询字段过滤 filterText: "", //查询字段过滤
lineTreeData: [], lineTreeData: [],
defaultExpandedKeys: [], //默认展开 defaultExpandedKeys: [], //默认展开
@ -75,19 +102,18 @@ export default {
}; };
}, },
watch: { watch: {
// filterText(val) {
// console.log(val);
// this.$refs.tree.filter(val);
// console.log(this.$refs.tree);
// },
filterText(newVal) { filterText(newVal) {
this.handleFilter(); // 当 filterText 发生变化时执行过滤操作 this.handleFilter(); // 当 filterText 发生变化时执行过滤操作
}, },
}, },
created() { created() {
this.getLineTreeList(); //获取树状图 this.getLineTreeList(); //获取树状图
this.companyVal = this.companyOptions[0].value;
}, },
methods: { methods: {
handleClick(val) {
console.log(val);
},
handleFilter() { handleFilter() {
// 在输入框输入完成后的500毫秒执行过滤节点方法 // 在输入框输入完成后的500毫秒执行过滤节点方法
setTimeout(() => { setTimeout(() => {
@ -107,51 +133,11 @@ export default {
}, },
//获取树状图列表 //获取树状图列表
getLineTreeList() { getLineTreeList() {
getdyTreeListJoggle({ type: 1 }) this.treeLoading = true;
getdyTreeListJoggle({ type: -1 })
.then((res) => { .then((res) => {
//this.lineTreeData = res.data.list; this.lineTreeData = res.data.list;
this.lineTreeData = [ this.treeLoading = false;
{
id: 4,
name: "公司名称",
dyValue: 220,
list: [
{
id: 209,
name: "线路",
bsManufacturer: "电力公司2",
list: [
{
id: 10323,
towerid: 295,
cmdid: "装置1",
equipname: "XYIGQ10D221000100",
name: "装置1",
address: "上海",
protocol: 65283,
displayname: "XYIGQ10D221000100",
model: null,
onlinestatus: 1,
hasPan: null,
},
{
id: 10556,
towerid: 532,
cmdid: "装置2",
equipname: "",
name: "装置2",
address: null,
protocol: 65283,
displayname: "XYIGQ10C230100005",
model: "",
onlinestatus: 1,
hasPan: 0,
},
],
},
],
},
];
this.currentData = JSON.parse(localStorage.getItem("currentData")); this.currentData = JSON.parse(localStorage.getItem("currentData"));
this.lineTreeData.forEach((node) => { this.lineTreeData.forEach((node) => {
if (node.list) { if (node.list) {
@ -189,7 +175,6 @@ export default {
console.log(err); //代码错误、请求失败捕获 console.log(err); //代码错误、请求失败捕获
}); });
}, },
//点击当前选中的treenode //点击当前选中的treenode
handleNodeClick(data) { handleNodeClick(data) {
this.currentData = data; this.currentData = data;
@ -204,6 +189,20 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 16px 0; padding: 16px 0;
.companyBox {
display: flex;
width: 94%;
margin: 0 auto;
margin-bottom: 8px;
align-items: center;
.spanLabel {
font-size: 14px;
width: 96px;
}
}
.el-divider--horizontal {
margin: 0px 0px 8px 0px;
}
.searchBar { .searchBar {
width: 94%; width: 94%;
margin: 0 auto; margin: 0 auto;
@ -230,6 +229,9 @@ export default {
} }
} }
} }
.disconnect {
color: #d3d3d3;
}
.el-tree--highlight-current .el-tree--highlight-current
.el-tree-node.is-current .el-tree-node.is-current
@ -254,9 +256,14 @@ export default {
} }
} }
} }
}
.disconnect { .el-table thead {
color: #d3d3d3; color: #333;
th {
font-weight: 400;
} }
} }
.el-table {
color: #666;
}
</style> </style>

1
src/main.js
Unescape Escape View File

@ -16,6 +16,7 @@ import "./assets/fonts/iconfont.css"; //按钮
//引入Echarts; //引入Echarts;
import * as echarts from "echarts"; import * as echarts from "echarts";
Vue.prototype.$echarts = echarts; Vue.prototype.$echarts = echarts;
//引入日期// 注册全局 moment //引入日期// 注册全局 moment
import moment from "moment"; import moment from "moment";
Vue.prototype.$moment = moment; Vue.prototype.$moment = moment;

39
src/utils/api/index.js
Unescape Escape View File

@ -19,13 +19,15 @@ export function getdyTreeListJoggle(data) {
}); });
} }
//导出数据 //导出数据
export function getOnlineTerminalListExcel() { export function ExportExcel() {
return request({ return request({
url: "/api/getOnlineTerminalListExcel", url: "/xapi/query.php",
method: "post", method: "get",
params: data,
responseType: "blob", responseType: "blob",
}); });
} }
//修改用户 //修改用户
export function updateUserApi(data) { export function updateUserApi(data) {
return request({ return request({
@ -43,7 +45,28 @@ export function updateUserApi(data) {
// params: data, // params: data,
// }); // });
// } // }
//获取数据接口
export function getDataListJoggle(data) {
return request({
url: "/xapi/query.php",
method: "get",
params: data,
headers: {
"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
},
});
}
//获取相位码
export function funccodeJoggle(data) {
return request({
url: "/xapi/funccode.php",
method: "get",
params: data,
headers: {
"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
},
});
}
//线路 //线路
//1.线路列表信息 //1.线路列表信息
export function getLineListJoggle(data) { export function getLineListJoggle(data) {
@ -173,3 +196,11 @@ export function getProtocolList(data) {
params: data, params: data,
}); });
} }
//获取电压-线路-杆塔等信息
export function getSearchInfo(data) {
return request({
url: "/api/getLineAndGt",
method: "post",
data,
});
}

53
src/utils/request.js
Unescape Escape View File

@ -32,34 +32,35 @@ service.interceptors.response.use(
(response) => { (response) => {
const res = response.data; const res = response.data;
if (res.code !== 200) { // if (res.code !== 200) {
// Message({ // // Message({
// showClose: true, // // showClose: true,
// message: res.msg || "Error", // // message: res.msg || "Error",
// type: "error", // // type: "error",
// duration: 5 * 1000, // // duration: 5 * 1000,
// }); // // });
if (res.code === 401) { // if (res.code === 401) {
Message({ message: res.msg, type: "error", duration: 1500 }); // Message({ message: res.msg, type: "error", duration: 1500 });
router.push("/login"); // router.push("/login");
} // }
if (res.code === 400) { // if (res.code === 400) {
Message({ message: res.msg, type: "error", duration: 1500 }); // Message({ message: res.msg, type: "error", duration: 1500 });
} // }
if (res.code === 500) { // if (res.code === 500) {
Message({ // Message({
showClose: true, // showClose: true,
message: 服务器错误(500), // message: 服务器错误(500),
type: "error", // type: "error",
duration: 1500, // duration: 1500,
}); // });
} // }
return Promise.reject(new Error(res.msg || "Error")); // return Promise.reject(new Error(res.msg || "Error"));
} else { // } else {
return res; // return res;
} // }
return res;
}, },
(error) => { (error) => {
Message({ Message({

3
src/views/equipmentStatus/index.vue
Unescape Escape View File

@ -8,6 +8,7 @@
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%" style="width: 100%"
v-loading="loading"
height="calc(100% - 40px)" height="calc(100% - 40px)"
> >
<el-table-column prop="line" label="线路"></el-table-column> <el-table-column prop="line" label="线路"></el-table-column>
@ -149,7 +150,7 @@ export default {
}, },
data() { data() {
return { return {
msg: "", loading: false,
childFlag: false, childFlag: false,
tableData: [], tableData: [],
childTableDate: [], childTableDate: [],

628
src/views/icing/index.vue
Unescape Escape View File

@ -21,6 +21,7 @@
</el-form-item> </el-form-item>
<el-form-item label="结束日期"> <el-form-item label="结束日期">
<el-date-picker <el-date-picker
@change="changedate"
v-model="formdata.endtime" v-model="formdata.endtime"
type="date" type="date"
placeholder="结束日期" placeholder="结束日期"
@ -32,78 +33,116 @@
<el-button type="primary" @click="onSubmit">查询</el-button> <el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit" <el-button type="primary" @click="exportExcl"
>导出数据</el-button >导出数据</el-button
> >
</el-form-item> </el-form-item>
<el-form-item v-if="termalFlag">
<el-button
v-if="!echartsShow"
type="primary"
@click="lookLineCharts"
>曲线图</el-button
>
<el-button
v-if="echartsShow"
type="primary"
@click="lookTableCharts"
>列表数据</el-button
>
</el-form-item>
</el-form> </el-form>
</div> </div>
<div class="childTableShowBox"> <div class="childTableShowBox" v-if="!echartsShow">
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%" style="width: 100%"
height="calc(100% - 40px)" v-loading="loading"
height="calc(100% - 0px)"
> >
<el-table-column <el-table-column
prop="terminalNumber" prop="cmdid"
label="监测终端编号" label="监测终端编号"
></el-table-column> ></el-table-column>
<el-table-column prop="time" label="时间"></el-table-column>
<el-table-column <el-table-column
prop="functionalUnitIdentifier" prop="updateTime"
label="功能单元识别码" label="时间"
></el-table-column> min-width="120px"
>
<template slot-scope="scope">
<span v-if="scope.row.updateTime">
{{
$moment(scope.row.updateTime * 1000).format(
"YYYY-MM-DD HH:mm:ss"
)
}}</span
>
<span v-else> - </span>
</template>
</el-table-column>
<el-table-column prop="funcCode" label="功能单元识别码">
<template slot-scope="scope">
<span v-if="scope.row.funcCodeName && scope.row.funcCode">
{{ scope.row.funcCodeName }}({{
scope.row.funcCodeHex
}})</span
><span v-else-if="scope.row.funcCodeHex"
>({{ scope.row.funcCodeHex }})</span
>
<span v-else> - </span>
</template>
</el-table-column>
<el-table-column <el-table-column
prop="maxPullForceKg" prop="maxPull"
label="最大拉力(Kg)" label="最大拉力(Kg)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="maxPullForceWindBiasAngle" prop="maxPullWind"
label="最大拉力时风偏角(°)" label="最大拉力时风偏角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="maxPullForceTiltAngle" prop="maxPullTilt"
label="最大拉力时倾斜角(°)" label="最大拉力时倾斜角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minPullForceKg" prop="minPull"
label="最小拉力(Kg)" label="最小拉力(Kg)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minPullForceWindBiasAngle" prop="minPullWind"
label="最小拉力时风偏角(°)" label="最小拉力时风偏角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minPullForceTiltAngle" prop="minPullTilt"
label="最小拉力时倾斜角(°)" label="最小拉力时倾斜角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="maxWindBiasAngle" prop="maxWind"
label="最大风偏角(°)" label="最大风偏角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="maxWindBiasAngleTiltAngle" prop="maxWindTilt"
label="最大风偏角时倾斜角(°)" label="最大风偏角时倾斜角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="maxWindBiasAnglePullForceKg" prop="maxWindPull"
label="最大风偏角时拉力(Kg)" label="最大风偏角时拉力(Kg)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minWindBiasAngle" prop="minWind"
label="最小风偏角(°)" label="最小风偏角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minWindBiasAngleTiltAngle" prop="minWindTilt"
label="最小风偏角时倾斜角(°)" label="最小风偏角时倾斜角(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minWindBiasAnglePullForceKg" prop="minWindPull"
label="最小风偏角时拉力(Kg)" label="最小风偏角时拉力(Kg)"
></el-table-column> ></el-table-column>
</el-table> </el-table>
</div> </div>
<div class="pageNation"> <div class="pageNation" v-if="!echartsShow">
<el-pagination <el-pagination
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@ -114,6 +153,20 @@
> >
</el-pagination> </el-pagination>
</div> </div>
<div class="graphBox" v-if="echartsShow">
<div
class="codeBox"
v-for="(item, index) in codeList"
:key="index"
>
<h3>相位(标识): ({{ item }})</h3>
<div :id="'lineEchart' + index" class="lineChartBox"></div>
</div>
<div class="noDatabox" v-if="codeList.length == 0">
<img src="../../assets/img/nopic1.jpg" />
<p>暂无图表</p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -122,6 +175,7 @@
</template> </template>
<script> <script>
import leftTree from "../../components/leftTree"; import leftTree from "../../components/leftTree";
import { getDataListJoggle, funccodeJoggle } from "@/utils/api/index";
export default { export default {
name: "icing", name: "icing",
components: { components: {
@ -129,15 +183,33 @@ export default {
}, },
data() { data() {
return { return {
msg: "", loading: false,
childFlag: false,
tableData: [], tableData: [],
formdata: {}, formdata: {},
page: 1, // 当前页数 page: 1, // 当前页数
pageSize: 20, // 每页数量 pageSize: 20, // 每页数量
total: 0, //总条数 total: 0, //总条数
qt: "",
id: "",
termId: "",
paramsData: "",
termalFlag: false, //是否是子节点显示 曲线图按钮
echartsShow: false, //显示曲线图页面
codeList: [], //相位码
chartsData: [],
}; };
}, },
watch: {
endtime(newVal) {
if (newVal) {
const date = new Date(newVal);
date.setHours(23);
date.setMinutes(59);
date.setSeconds(59);
this.formdata.endtime = date.getTime();
}
},
},
created() { created() {
var that = this; var that = this;
document.onkeydown = function (e) { document.onkeydown = function (e) {
@ -146,145 +218,381 @@ export default {
that.onSubmit(); // 触发事件 that.onSubmit(); // 触发事件
} }
}; };
},
mounted() {
this.$set( this.$set(
this.formdata, this.formdata,
"starttime", "starttime",
new Date(new Date().toLocaleDateString()).getTime() new Date(new Date().toLocaleDateString()).getTime()
); );
this.$set(this.formdata, "endtime", new Date().getTime()); const currentDate = new Date(); // 获取当前时间
currentDate.setHours(23); // 设置小时为23
currentDate.setMinutes(59); // 设置分钟为59
currentDate.setSeconds(59); // 设置秒数为59
this.$set(this.formdata, "endtime", currentDate.getTime());
}, },
mounted() {},
methods: { methods: {
getCurrentData(data) { getCurrentData(data) {
console.log("执行父组件", data); console.log("执行父组件", data);
this.paramsData = data;
console.log(data);
if (data.dyValue) { if (data.dyValue) {
console.log("电压"); console.log("电压-公司");
this.qt = "all";
this.tableData = [ this.id = data.id;
{ this.getIcingData(data);
terminalNumber: "终端A", this.termalFlag = false;
time: "2023-03-15 08:00:00",
functionalUnitIdentifier: "功能单元1",
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
{
terminalNumber: "终端A",
time: "2023-03-15 08:00:00",
functionalUnitIdentifier: "功能单元1",
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
{
terminalNumber: "终端A",
time: "2023-03-15 08:00:00",
functionalUnitIdentifier: "功能单元1",
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
];
} else if (data.bsManufacturer) { } else if (data.bsManufacturer) {
this.tableData = [ console.log("线路-电压");
{ this.qt = "line";
terminalNumber: "终端A", this.id = data.id;
time: "2023-03-15 08:00:00", this.getIcingData(data);
functionalUnitIdentifier: "功能单元1", this.termalFlag = false;
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
{
terminalNumber: "终端A",
time: "2023-03-15 08:00:00",
functionalUnitIdentifier: "功能单元1",
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
];
} else { } else {
console.log("杆塔"); console.log("装置-杆塔");
this.tableData = [ this.qt = "tower";
{ this.id = data.towerid;
terminalNumber: "终端A", this.termId = data.id;
time: "2023-03-15 08:00:00", this.getIcingData(data);
functionalUnitIdentifier: "功能单元1", this.termalFlag = true;
maxPullForceKg: "20Kg",
maxPullForceWindBiasAngle: "60°",
maxPullForceTiltAngle: "30°",
minPullForceKg: "5Kg",
minPullForceWindBiasAngle: "30°",
minPullForceTiltAngle: "20°",
maxWindBiasAngle: "70°",
maxWindBiasAngleTiltAngle: "45°",
maxWindBiasAnglePullForceKg: "15Kg",
minWindBiasAngle: "20°",
minWindBiasAngleTiltAngle: "30°",
minWindBiasAnglePullForceKg: "8Kg",
},
];
} }
}, },
onSubmit() {}, //覆冰数数据
getIcingData(data) {
console.log(data, this.qt);
const sTime = Math.floor(this.formdata.starttime / 1000);
const eTime = Math.floor(this.formdata.endtime / 1000);
this.loading = true;
getDataListJoggle({
act: "ice_weight",
qt: this.qt,
id: this.id,
bt: sTime,
et: eTime,
p: this.page,
ps: this.pageSize,
})
.then((res) => {
console.log(res);
this.tableData = res.data;
this.total = Number(res.page.totalRecords);
this.loading = false;
this.echartsShow = false;
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
});
},
lookLineCharts() {
//获取相位码和数据
this.echartsShow = true;
console.log("点击了曲线");
this.$nextTick(() => {
this.getchartsData(this.paramsData);
});
},
//获取当天的数据
getchartsData(data) {
console.log(data, this.qt);
const sTime = Math.floor(this.formdata.starttime / 1000);
const eTime = Math.floor(this.formdata.endtime / 1000);
this.loading = true;
getDataListJoggle({
act: "ice_weight",
qt: this.qt,
id: this.id,
bt: sTime,
et: eTime,
p: this.page,
ps: 1000,
})
.then((res) => {
console.log(res);
this.chartsData = res.data;
this.$nextTick(() => {
this.drawLine();
});
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
});
},
lookTableCharts() {
this.echartsShow = false;
this.loading = false;
},
drawLine() {
console.log(this.chartsData);
var timeXData = [];
var legendData = [
"最大拉力",
"最大拉力时风偏角",
"最大拉力时倾斜角",
"最小拉力",
"最小拉力时风偏角",
"最小拉力时倾斜角",
"最大风偏角",
"最大风偏角时倾斜角",
"最大风偏角时拉力",
"最小风偏角",
"最小风偏角时倾斜角",
"最小风偏角时拉力",
];
timeXData = this.chartsData.map((item) =>
this.$moment(item.updateTime * 1000).format("HH:mm:ss")
);
timeXData = [...new Set(timeXData)];
console.log(timeXData);
// var codename = [
// ...new Set(this.chartsData.map((item) => item.funcCodeName)),
// ];
var code = [...new Set(this.chartsData.map((item) => item.funcCodeHex))];
this.codeList = code;
// var finalData = [];
// console.log(this.codeList);
const groupedData = this.chartsData.reduce((acc, item) => {
if (!acc[item.funcCodeHex]) {
acc[item.funcCodeHex] = [];
}
acc[item.funcCodeHex].push(item);
return acc;
}, []);
const result = Object.values(groupedData).map((arr) => [...arr]);
console.log(result);
this.$nextTick(() => {
var roseCharts = document.querySelectorAll(".codeBox");
console.log(roseCharts);
for (var i = 0; i < roseCharts.length; i++) {
// console.log(result[i]);
// console.log(
// "最大封片叫拉力",
// result[i].map((item) => item.minWindPull)
// );
// 通过for循环，在相同class的dom内绘制元素
var myChart = this.$echarts.init(roseCharts[i]);
var option = {
// toolbox: {
// feature: {
// dataZoom: {
// yAxisIndex: "none",
// },
// restore: {},
// saveAsImage: {},
// },
// },
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
animation: false,
label: {
backgroundColor: "#505765",
},
},
},
legend: {
data: legendData,
selected: {
最大拉力: true,
最大拉力时风偏角: false,
最大拉力时倾斜角: false,
最小拉力: false,
最小拉力时风偏角: false,
最小拉力时倾斜角: false,
最大风偏角: false,
最大风偏角时倾斜角: false,
最大风偏角时拉力: false,
最小风偏角: false,
最小风偏角时倾斜角: false,
最小风偏角时拉力: false,
},
// left: 10,
},
dataZoom: [
{
show: true,
realtime: true,
start: 0,
end: 85,
},
{
type: "inside",
realtime: true,
start: 0,
end: 85,
},
],
xAxis: [
{
type: "category",
boundaryGap: false,
axisLine: { onZero: false },
// prettier-ignore
data: timeXData,
},
],
yAxis: [
{
name: "拉力(Kg)",
type: "value",
},
{
name: "偏角（°）",
alignTicks: true,
type: "value",
// inverse: true
},
],
series: [
{
name: "最大拉力",
type: "line",
data: result[i].map((item) => item.maxPull),
},
{
name: "最小拉力",
type: "line",
data: result[i].map((item) => item.minPull),
},
{
name: "最大风偏角时拉力",
type: "line",
data: result[i].map((item) => item.maxWindPull),
},
{
name: "最小风偏角时拉力",
type: "line",
data: result[i].map((item) => item.minWindPull),
},
{
name: "最大拉力时风偏角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.maxPullWind),
},
{
name: "最大拉力时倾斜角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.maxPullTilt),
},
{
name: "最小拉力时风偏角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.minPullWind),
},
{
name: "最小拉力时倾斜角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.minPullTilt),
},
{
name: "最大风偏角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data:result[i].map((item) => item.maxWind),
},
{
name: "最大风偏角时倾斜角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data:result[i].map((item) => item.maxWindTilt),
},
{
name: "最小风偏角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.minWind),
},
{
name: "最小风偏角时倾斜角",
type: "line",
yAxisIndex: 1,
// prettier-ignore
data: result[i].map((item) => item.minWindTilt),
},
],
};
myChart.setOption(option);
console.log("我执行了");
window.addEventListener("resize", () => {
myChart.resize();
});
}
});
},
//结束日期
changedate() {
console.log(new Date(this.formdata.endtime));
const currentDate = new Date(this.formdata.endtime); // 获取当前时间
currentDate.setHours(23); // 设置小时为23
currentDate.setMinutes(59); // 设置分钟为59
currentDate.setSeconds(59); // 设置秒数为59
this.formdata.endtime = currentDate;
console.log("结束时间", this.formdata.endtime);
},
exportExcl() {
const sTime = Math.floor(this.formdata.starttime / 1000);
const eTime = Math.floor(this.formdata.endtime / 1000);
// window.location.href = "/api/api/getOnlineTerminalListExcel?type=" + val;
window.location.href =
"/api/xapi/query.php?act=ice_weight&qt=" +
this.qt +
"&id=" +
this.id +
"&bt=" +
sTime +
"&et=" +
eTime +
"&p=1&ps=20&exp=xls";
},
onSubmit() {
console.log(this.formdata.starttime, this.formdata.endtime);
if (
new Date(this.formdata.starttime).getDate() ===
new Date(this.formdata.endtime).getDate()
) {
this.getIcingData(this.paramsData);
console.log("开始时间和结束时间为同一天");
} else {
this.$message({
duration: 1500,
showClose: true,
message: "请选择同一天",
type: "warning",
});
return;
console.log("开始时间和结束时间不是同一天");
}
// this.getIcingData(this.paramsData);
},
//点击分页 //点击分页
handleCurrentChange(val) { handleCurrentChange(val) {
this.page = val; this.page = val;
// this.picList = []; this.tableData = [];
// this.getPicData(); this.getIcingData(this.paramsData);
}, },
//每页条数 //每页条数
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.pageSize = val;
//this.getPicData(); this.tableData = [];
this.getIcingData(this.paramsData);
}, },
}, },
}; };
@ -310,6 +618,9 @@ export default {
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;
border-left: 1px solid #ddd; border-left: 1px solid #ddd;
.el-table .el-table__cell {
text-align: center;
}
.dataBox { .dataBox {
width: calc(100% - 24px); width: calc(100% - 24px);
height: calc(100% - 24px); height: calc(100% - 24px);
@ -325,6 +636,41 @@ export default {
height: calc(100% - 91px); height: calc(100% - 91px);
} }
} }
.graphBox {
margin: 0 auto;
height: calc(100% - 54px);
overflow: auto;
.codeBox {
width: 100%;
height: 400px;
h3 {
font-size: 14px;
color: #333;
margin-top: 8px;
margin-bottom: 8px;
font-weight: normal;
text-align: center;
}
.lineChartBox {
width: 100%;
height: 372px;
}
}
.noDatabox {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
img {
width: 400px;
}
p {
font-size: 16px;
}
}
}
} }
} }
</style> </style>

68
src/views/lineInformation/index.vue
Unescape Escape View File

@ -7,7 +7,21 @@
>新增</el-button >新增</el-button
> >
</div> </div>
<div class="searchBox">
<el-form :inline="true" :model="formdata" class="demo-form-inline">
<el-form-item>
<el-input
v-model="formdata.search"
placeholder="请输入线路名称或公司名称"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="onReset">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="lineTable"> <div class="lineTable">
<el-table <el-table
ref="multipleTable" ref="multipleTable"
@ -127,10 +141,23 @@ export default {
pageSize: 20, // 每页数量 pageSize: 20, // 每页数量
total: 0, //总条数 total: 0, //总条数
loading: true, loading: true,
formdata: {}, formdata: {
search: "",
},
}; };
}, },
created() {}, created() {
var that = this;
document.onkeydown = function (e) {
var key = window.event.keyCode;
if (key === 13) {
that.onSubmit(); // 触发事件
}
};
// console.log(this.$route.query);
// this.formdata.search = this.$route.query.lineName;
// console.log(this.formdata.search);
},
mounted() { mounted() {
this.lineList(); this.lineList();
}, },
@ -159,7 +186,18 @@ export default {
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
}, },
//查询
onSubmit() {
this.page = 1;
this.lineList();
},
//重置
onReset() {
this.formdata = {};
this.page = 1;
this.pageSize = 20;
this.lineList();
},
// 新建弹窗 // 新建弹窗
handleAddLine() { handleAddLine() {
this.lineDialogTitle = "新增"; this.lineDialogTitle = "新增";
@ -236,6 +274,24 @@ export default {
height: calc(100% - 24px); height: calc(100% - 24px);
padding: 12px; padding: 12px;
border-radius: 4px; border-radius: 4px;
.searchBox {
margin-top: 8px;
.ml10 {
margin-left: 10px;
}
.el-form {
.dybox {
.el-form-item__content {
width: 120px;
}
}
.xlbox {
.el-form-item__content {
width: 160px;
}
}
}
}
} }
.lineBtnGroup { .lineBtnGroup {
@ -245,8 +301,8 @@ export default {
} }
.lineTable { .lineTable {
margin-top: 16px; //margin-top: 16px;
height: calc(100% - 46px); height: calc(100% - 94px);
} }
} }
</style> </style>

3
src/views/photographicDevice/components/addPhotoDialog.vue
Unescape Escape View File

@ -241,6 +241,9 @@ export default {
new Date(this.formInfo.workingDate).getTime() new Date(this.formInfo.workingDate).getTime()
); );
console.log(this.formInfo.workingDate); console.log(this.formInfo.workingDate);
if (this.formInfo.workingDate == 0) {
this.$set(this.formInfo, "workingDate", new Date().getTime());
}
}, },
//通道号值改变 //通道号值改变
changeHandle() { changeHandle() {

347
src/views/photographicDevice/index.vue
Unescape Escape View File

@ -2,7 +2,7 @@
<div class="photoGraphicDevice"> <div class="photoGraphicDevice">
<div class="photoBox"> <div class="photoBox">
<div class="photoGraphicBtnGroup"> <div class="photoGraphicBtnGroup">
<h4>监测终端管理</h4> <h4>终端设备管理</h4>
<div> <div>
<el-button <el-button
type="primary" type="primary"
@ -10,9 +10,73 @@
@click="handleAddPhoto()" @click="handleAddPhoto()"
>新增</el-button >新增</el-button
> >
<el-button
type="primary"
icon="el-icon-document"
@click="handleExport()"
>导出</el-button
>
</div> </div>
</div> </div>
<div class="searchBox">
<el-form :inline="true" :model="formdata" class="demo-form-inline">
<el-form-item label="电压等级" class="dybox">
<el-select v-model="formdata.dyId" @change="getSearchxl">
<el-option
v-for="item in dyOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="线路名称" class="xlbox">
<el-select
v-model="formdata.lineId"
@change="getSearchgt"
filterable
>
<el-option
v-for="item in xlOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="杆塔名称">
<el-select v-model="formdata.towerId" filterable>
<el-option
v-for="item in gtOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否在线" class="isonLineClass">
<el-select v-model="formdata.isonline" filterable>
<el-option
v-for="item in onlineOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-input
v-model="formdata.search"
placeholder="请输入线路/杆塔/设备编号"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="onReset">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="photoGraphicTable"> <div class="photoGraphicTable">
<el-table <el-table
ref="multipleTable" ref="multipleTable"
@ -57,13 +121,7 @@
}}</el-link> }}</el-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column
prop="equipName"
label="设备名称"
show-overflow-tooltip
min-width="150"
>
</el-table-column>
<el-table-column <el-table-column
prop="cmdId" prop="cmdId"
label="设备编号" label="设备编号"
@ -97,8 +155,6 @@
> >
</el-table-column> </el-table-column>
<el-table-column prop="sim" label="SIM卡号" show-overflow-tooltip>
</el-table-column>
<el-table-column <el-table-column
prop="netType" prop="netType"
label="网络类型" label="网络类型"
@ -142,8 +198,7 @@
{{ scope.row.status == 1 ? "运行中" : "已删除" }} {{ scope.row.status == 1 ? "运行中" : "已删除" }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作">
<el-table-column fixed="right" label="操作" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
@click.native.stop="handleRevisePhoto(scope.row)" @click.native.stop="handleRevisePhoto(scope.row)"
@ -155,7 +210,15 @@
type="text" type="text"
class="deleteText" class="deleteText"
@click.native.stop="handleDelete(scope.row)" @click.native.stop="handleDelete(scope.row)"
>删除</el-button v-if="scope.row.status == 1"
>关闭</el-button
>
<el-button
type="text"
class="deleteText"
@click.native.stop="handleOpen(scope.row)"
v-if="scope.row.status == 0"
>打开</el-button
> >
</template> </template>
</el-table-column> </el-table-column>
@ -185,22 +248,41 @@
</div> </div>
</template> </template>
<script> <script>
import { getTerminalJoggle, deleteTerminalJoggle } from "@/utils/api/index"; import {
getTerminalJoggle,
deleteTerminalJoggle,
getSearchInfo,
getTerminalListExcel,
} from "@/utils/api/index";
import moment from "moment"; import moment from "moment";
import addPhotoDialog from "./components/addPhotoDialog.vue"; import addPhotoDialog from "./components/addPhotoDialog.vue";
import addLineDialog from "./components/addLineDialog.vue"; import addLineDialog from "./components/addLineDialog.vue";
import towerDialog from "./components/towerDialog.vue"; import towerDialog from "./components/towerDialog.vue";
export default { export default {
name: "photographicDevice", name: "photographicDevice",
components: { components: {
addPhotoDialog, addPhotoDialog,
addLineDialog, addLineDialog,
towerDialog, towerDialog,
}, },
data() { data() {
return { return {
formdata: {}, dyOptions: [{ id: -1, name: "全部" }], //电压数据
xlOptions: [{ id: -1, name: "全部" }], //线路数据
gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
onlineOptions: [
{ id: -1, name: "全部" },
{ id: 1, name: "在线" },
{ id: 0, name: "离线" },
],
formdata: {
dyId: 9,
lineId: -1,
towerId: -1,
search: "",
isonline: -1,
},
roleUser: "", roleUser: "",
terminalTableData: [], //表格数据 terminalTableData: [], //表格数据
photoDialog: false, //新增弹窗 photoDialog: false, //新增弹窗
@ -212,13 +294,36 @@ export default {
pageSize: 20, // 每页数量 pageSize: 20, // 每页数量
total: 0, //总条数 total: 0, //总条数
loading: true, loading: true,
gpsOptions: [
{
value: "1",
label: "GPS关闭",
},
{
value: "2",
label: "GPS开启",
},
],
gpsvalue: "1",
}; };
}, },
created() { created() {
this.roleUser = localStorage.getItem("role"); this.roleUser = localStorage.getItem("role");
console.log(this.roleUser); console.log(this.roleUser);
var that = this;
document.onkeydown = function (e) {
var key = window.event.keyCode;
if (key === 13) {
that.onSubmit(); // 触发事件
}
};
console.log(this.$route.query);
this.formdata.search = this.$route.query.name;
console.log(this.formdata.search);
}, },
mounted() { mounted() {
this.getSearchdy();
this.terminalList(); this.terminalList();
}, },
methods: { methods: {
@ -241,7 +346,57 @@ export default {
query: { lineName: val.lineName, name: val.towerName }, query: { lineName: val.lineName, name: val.towerName },
}); });
}, },
//获取拍照装置列表数据 //获取电压信息
getSearchdy() {
getSearchInfo({ type: 1 })
.then((res) => {
this.dyOptions = [{ id: -1, name: "全部" }];
this.dyOptions = this.dyOptions.concat(res.data.list);
this.formdata.dyId = this.dyOptions[1].id;
this.getSearchxl();
})
.catch((err) => {});
},
//获取线路数据
getSearchxl() {
getSearchInfo({ type: 2, id: this.formdata.dyId })
.then((res) => {
this.xlOptions = [{ id: -1, name: "全部" }];
this.xlOptions = this.xlOptions.concat(res.data.list);
this.formdata.lineId = this.xlOptions[0].id;
this.getSearchgt();
})
.catch((err) => {});
},
//获取杆塔数据
getSearchgt() {
getSearchInfo({ type: 3, id: this.formdata.lineId })
.then((res) => {
this.gtOptions = [{ id: -1, name: "全部" }];
this.gtOptions = this.gtOptions.concat(res.data.list);
this.formdata.towerId = this.gtOptions[0].id;
})
.catch((err) => {});
},
//查询
onSubmit() {
this.page = 1;
this.terminalList();
},
//重置
onReset() {
this.formdata = {
isonline: -1,
};
this.getSearchdy();
this.page = 1;
this.pageSize = 20;
this.terminalList();
},
////获取拍照装置列表数据
terminalList() { terminalList() {
this.loading = true; this.loading = true;
this.$set(this.formdata, "pageindex", this.page); this.$set(this.formdata, "pageindex", this.page);
@ -265,12 +420,24 @@ export default {
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
}, },
//时间转化
dateFormat(row, column) {
var date = row[column.property];
if (date == undefined) {
return "";
}
return moment(date).format("YYYY-MM-DD HH:mm:ss");
},
// 新建弹窗 // 新建弹窗
handleAddPhoto() { handleAddPhoto() {
this.photoDialogTitle = "新增"; this.photoDialogTitle = "新增";
this.$refs.addPhotoDialogref.display(); this.$refs.addPhotoDialogref.display();
this.$refs.addPhotoDialogref.getdataform(null); this.$refs.addPhotoDialogref.getdataform(null);
}, },
//导出
handleExport() {
window.location.href = "/api/api/getTerminalListExcel";
},
handleLine(data) { handleLine(data) {
this.$refs.addlineDialogref.display(); this.$refs.addlineDialogref.display();
this.$refs.addlineDialogref.getdataform(data); this.$refs.addlineDialogref.getdataform(data);
@ -286,6 +453,49 @@ export default {
this.$refs.addPhotoDialogref.getdataform(data); this.$refs.addPhotoDialogref.getdataform(data);
console.log(data); console.log(data);
}, },
//线缆绘制
handlepicture(data) {
console.log(data);
this.$refs.picturetagsref.display(data);
},
//数据查询
handleSearchCommand(command, row) {
console.log(command, row);
switch (command) {
case "info":
this.$refs.baseInfor_ref.display();
break;
case "workStatus":
this.$refs.workStatus_ref.display();
break;
case "runStatus":
this.$refs.runStatus_ref.display();
break;
case "GPS":
this.$refs.gpsSite_ref.display();
break;
default:
break;
}
},
//参数配置
handleParameterSet(data) {
this.$refs.parameterSetref.display(data);
},
// //新建弹窗handleAddPhoto
// handleAddPhoto() {
// this.photoDialog = true;
// this.photoDialogTitle = "新增";
// },
// //修改弹窗handleRevisePhoto
// handleRevisePhoto(data) {
// this.photoDialog = true;
// this.photoDialogTitle = "修改";
// this.formphotoInfo = Object.assign({}, data);
// },
//删除数据 //删除数据
handleDelete(data) { handleDelete(data) {
console.log(data); console.log(data);
@ -323,7 +533,43 @@ export default {
// }); // });
}); });
}, },
//打开该装置
handleOpen(data) {
console.log(data);
this.deleteArr.push({
termid: data.id,
});
console.log(this.deleteArr);
this.$confirm("确定要打开该装置?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "success",
})
.then(() => {
// 行设置向后台请求删除数据
deleteTerminalJoggle({ list: this.deleteArr, type: 1 }).then(
(res) => {
console.log(res);
this.deleteArr = [];
this.terminalList(); //刷新
}
);
this.$message({
duration: 1500,
type: "success",
message: "打开成功!",
showClose: true,
});
})
.catch(() => {
// this.$message({
// duration: 1500,
// type: "info",
// message: "已取消删除",
// showClose: true,
// });
});
},
//点击分页 //点击分页
handleCurrentChange(val) { handleCurrentChange(val) {
this.page = val; this.page = val;
@ -348,15 +594,64 @@ export default {
height: calc(100% - 24px); height: calc(100% - 24px);
padding: 12px; padding: 12px;
border-radius: 4px; border-radius: 4px;
.photoGraphicBtnGroup { .searchBox {
display: flex; .ml10 {
justify-content: space-between; margin-left: 10px;
align-items: center; }
.el-form {
.dybox {
.el-form-item__content {
width: 120px;
}
}
.xlbox {
.el-form-item__content {
width: 160px;
}
}
.isonLineClass {
.el-form-item__content {
width: 120px;
}
}
}
} }
.photoGraphicTable { }
margin-top: 16px; .photoGraphicBtnGroup {
height: calc(100% - 46px); display: flex;
justify-content: space-between;
align-items: center;
}
.searchBox {
margin-top: 8px;
}
.photoGraphicTable {
// margin-top: 16px;
//margin-top: 36px;
height: calc(100% - 94px);
}
.dropgps {
color: #169e8c;
// margin-left: 16px;
// margin-right: 16px;
cursor: pointer;
font-size: 12px;
width: 80px;
.el-input__inner {
padding: 0px;
border: none;
color: #169e8c;
font-size: 12px;
background-color: transparent;
} }
} }
} }
.gpsdropbox {
.el-select-dropdown__item {
line-height: 27px;
padding: 0 15px;
font-size: 12px;
height: 27px;
}
}
</style> </style>

141
src/views/towerInformation/index.vue
Unescape Escape View File

@ -10,7 +10,55 @@
>新增</el-button >新增</el-button
> >
</div> </div>
<div class="searchBox">
<el-form :inline="true" :model="formdata" class="demo-form-inline">
<!-- <el-form-item label="电压等级" class="dybox">
<el-select v-model="formdata.dyId" @change="getSearchxl">
<el-option
v-for="item in dyOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="线路名称" class="xlbox">
<el-select
v-model="formdata.lineId"
@change="getSearchgt"
filterable
>
<el-option
v-for="item in xlOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="杆塔名称">
<el-select v-model="formdata.towerId" filterable>
<el-option
v-for="item in gtOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-input
v-model="formdata.search"
placeholder="请输入线路/杆塔/地址"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="onReset">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="deviceTable"> <div class="deviceTable">
<el-table <el-table
ref="multipleTable" ref="multipleTable"
@ -128,11 +176,32 @@ export default {
pageSize: 20, // 每页数量 pageSize: 20, // 每页数量
total: 0, //总条数 total: 0, //总条数
loading: true, loading: true,
formdata: {}, dyOptions: [{ id: -1, name: "全部" }], //电压数据
xlOptions: [{ id: -1, name: "全部" }], //线路数据
gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
formdata: {
dyId: -1,
lineId: -1,
towerId: -1,
search: "",
},
};
},
created() {
var that = this;
document.onkeydown = function (e) {
var key = window.event.keyCode;
if (key === 13) {
that.onSubmit(); // 触发事件
}
}; };
console.log(this.$route.query);
this.formdata.search = this.$route.query.name;
console.log(this.formdata.search);
}, },
created() {},
mounted() { mounted() {
//this.getSearchdy();
this.deviceList(); this.deviceList();
}, },
@ -156,7 +225,50 @@ export default {
query: { lineName: val.lineName, name: val.name }, query: { lineName: val.lineName, name: val.name },
}); });
}, },
//获取电压信息
// getSearchdy() {
// getSearchInfo({ type: 1 })
// .then((res) => {
// this.dyOptions = [{ id: -1, name: "全部" }];
// this.dyOptions = this.dyOptions.concat(res.data.list);
// this.formdata.dyId = this.dyOptions[0].id;
// this.getSearchxl();
// })
// .catch((err) => {});
// },
// //获取线路数据
// getSearchxl() {
// getSearchInfo({ type: 2, id: this.formdata.dyId })
// .then((res) => {
// this.xlOptions = [{ id: -1, name: "全部" }];
// this.xlOptions = this.xlOptions.concat(res.data.list);
// this.formdata.lineId = this.xlOptions[0].id;
// this.getSearchgt();
// })
// .catch((err) => {});
// },
// //获取杆塔数据
// getSearchgt() {
// getSearchInfo({ type: 3, id: this.formdata.lineId })
// .then((res) => {
// this.gtOptions = [{ id: -1, name: "全部" }];
// this.gtOptions = this.gtOptions.concat(res.data.list);
// this.formdata.towerId = this.gtOptions[0].id;
// })
// .catch((err) => {});
// },
//查询
onSubmit() {
this.page = 1;
this.deviceList();
},
//重置
onReset() {
this.formdata = {};
this.page = 1;
this.pageSize = 20;
this.deviceList();
},
//获取数据列表 //获取数据列表
deviceList() { deviceList() {
this.loading = true; this.loading = true;
@ -249,6 +361,24 @@ export default {
height: calc(100% - 24px); height: calc(100% - 24px);
padding: 12px; padding: 12px;
border-radius: 4px; border-radius: 4px;
.searchBox {
margin-top: 8px;
.ml10 {
margin-left: 10px;
}
.el-form {
.dybox {
.el-form-item__content {
width: 120px;
}
}
.xlbox {
.el-form-item__content {
width: 160px;
}
}
}
}
} }
.deviceBtnGroup { .deviceBtnGroup {
display: flex; display: flex;
@ -256,8 +386,7 @@ export default {
align-items: center; align-items: center;
} }
.deviceTable { .deviceTable {
margin-top: 16px; height: calc(100% - 94px);
height: calc(100% - 46px);
//background: #fcc; //background: #fcc;
} }
} }

671
src/views/weather/index.vue
Unescape Escape View File

@ -8,25 +8,89 @@
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%" style="width: 100%"
v-loading="loading"
height="calc(100% - 40px)" height="calc(100% - 40px)"
> >
<el-table-column prop="line" label="线路"> </el-table-column> <el-table-column prop="lineName" label="线路"> </el-table-column>
<el-table-column prop="pole" label="杆塔"> </el-table-column> <el-table-column prop="towerName" label="杆塔"> </el-table-column>
<el-table-column prop="terminal" label="终端"> </el-table-column> <el-table-column prop="cmdid" label="终端"> </el-table-column>
<el-table-column prop="time" label="时间"> </el-table-column>
<el-table-column prop="updateTime" label="时间">
<template slot-scope="scope">
<span v-if="scope.row.updateTime">
{{
$moment(scope.row.updateTime * 1000).format(
"YYYY-MM-DD HH:mm:ss"
)
}}</span
>
<span v-else> - </span>
</template>
</el-table-column>
<el-table-column prop="temperature" label="温度(℃)"> <el-table-column prop="temperature" label="温度(℃)">
<template slot-scope="scope">
<span v-if="scope.row.temperature">{{
scope.row.temperature
}}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="humidity" label="湿度(%RH)"> <el-table-column prop="humidity" label="湿度(%RH)">
<template slot-scope="scope">
<span v-if="scope.row.humidity">{{
scope.row.humidity
}}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="windSpeed" label="瞬时风速(m/s)"> <el-table-column prop="windSpeed" label="瞬时风速(m/s)">
<template slot-scope="scope">
<span v-if="scope.row.windSpeed">{{
scope.row.windSpeed
}}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="windDirection" label="瞬时风向(°)"> <el-table-column prop="windDirection" label="瞬时风向(°)">
<template slot-scope="scope">
<span v-if="scope.row.windDirection">{{
scope.row.windDirection
}}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="rainfall" label="雨量(mm/hour)"> <el-table-column prop="rain" label="雨量(mm/hour)">
<template slot-scope="scope">
<span v-if="scope.row.rain">{{ scope.row.rain }}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="pressure" label="气压(hPa(百帕))"> <el-table-column prop="airPressure" label="气压(hPa(百帕))">
<template slot-scope="scope">
<span v-if="scope.row.airPressure">{{
scope.row.airPressure
}}</span>
<span v-else> - </span>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="sunlight" label="日照(W/m2)"> <el-table-column prop="radiationIntensity" label="日照(W/m2)">
<template slot-scope="scope">
<span v-if="scope.row.radiationIntensity">{{
scope.row.radiationIntensity
}}</span>
<span v-else> - </span>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button
type="text"
@click="moreDataClick(scope.row)"
v-if="scope.row.updateTime"
>更多历史数据</el-button
>
<span v-else> 没有数据</span>
</template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="pageNation"> <div class="pageNation">
@ -58,6 +122,7 @@
</el-form-item> </el-form-item>
<el-form-item label="结束日期"> <el-form-item label="结束日期">
<el-date-picker <el-date-picker
@change="changedate"
v-model="formdata.endtime" v-model="formdata.endtime"
type="date" type="date"
placeholder="结束日期" placeholder="结束日期"
@ -70,13 +135,53 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<div class="termalBox">
<h3>当前监测终端</h3>
<el-descriptions direction="vertical" :column="4" border>
<el-descriptions-item label="线路">{{
childMsg.lineName
}}</el-descriptions-item>
<el-descriptions-item label="杆塔">{{
childMsg.towerName
}}</el-descriptions-item>
<el-descriptions-item label="终端">{{
childMsg.cmdid
}}</el-descriptions-item>
</el-descriptions>
</div>
<div class="echartsBox">
<div class="btnbox">
<el-button type="primary" @click="onWdLine"
>温度变化趋势</el-button
>
<el-button type="primary" @click="onSdLine"
>湿度变化趋势</el-button
>
<el-button type="primary" @click="onHidden">隐藏图表</el-button>
</div>
<div id="wDechart" class="chartClass" v-show="wdFlag"></div>
<div id="sDechart" class="chartClass" v-show="sdFlag"></div>
</div>
<div class="childTableShowBox"> <div class="childTableShowBox">
<h3>气象数据列表</h3>
<el-table <el-table
:data="childTableDate" :data="childTableDate"
style="width: 100%" style="width: 100%"
v-loading="loading"
height="calc(100% - 40px)" height="calc(100% - 40px)"
> >
<el-table-column prop="time" label="时间"></el-table-column> <el-table-column prop="updateTime" label="时间">
<template slot-scope="scope">
<span v-if="scope.row.updateTime">
{{
$moment(scope.row.updateTime * 1000).format(
"YYYY-MM-DD HH:mm:ss"
)
}}</span
>
<span v-else> - </span>
</template>
</el-table-column>
<el-table-column <el-table-column
prop="temperature" prop="temperature"
label="温度(℃)" label="温度(℃)"
@ -94,47 +199,47 @@
label="瞬时风向(°)" label="瞬时风向(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="rainfall" prop="precipitation"
label="雨量(mm/hour)" label="雨量(mm/hour)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="pressure" prop="airPressure"
label="气压(hPa(百帕))" label="气压(hPa(百帕))"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="sunlight" prop="radiationIntensity"
label="日照(W/m2)" label="日照(W/m2)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minuteAverageWindSpeed" prop="avgWindSpeed1Min"
label="1分钟平均风速(m/s)" label="1分钟平均风速(m/s)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="minuteAverageWindDirection" prop="avgWindDir1Min"
label="1分钟平均风向(°)" label="1分钟平均风向(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="tenMinuteAverageWindSpeed" prop="avgWindSpeed10Min"
label="10分钟平均风速(m/s)" label="10分钟平均风速(m/s)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="tenMinuteAverageWindDirection" prop="avgWindDir10Min"
label="10分钟平均风向(°)" label="10分钟平均风向(°)"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="tenMinuteMaxWindSpeed" prop="maxSpeed10Min"
label="10分钟最大风速(m/s)" label="10分钟最大风速(m/s)"
></el-table-column> ></el-table-column>
</el-table> </el-table>
</div> </div>
<div class="pageNation"> <div class="pageNation">
<el-pagination <el-pagination
@current-change="handleCurrentChange" @current-change="handlechildCurrentChange"
@size-change="handleSizeChange" @size-change="handlechildSizeChange"
:current-page="page" :current-page="childpage"
:page-size="pageSize" :page-size="childpageSize"
layout="sizes, prev, pager, next, jumper,total" layout="sizes, prev, pager, next, jumper,total"
:total="total" :total="childtotal"
> >
</el-pagination> </el-pagination>
</div> </div>
@ -146,6 +251,7 @@
</template> </template>
<script> <script>
import leftTree from "../../components/leftTree"; import leftTree from "../../components/leftTree";
import { getDataListJoggle } from "@/utils/api/index";
export default { export default {
name: "weather", name: "weather",
components: { components: {
@ -153,7 +259,7 @@ export default {
}, },
data() { data() {
return { return {
msg: "", loading: false,
childFlag: false, childFlag: false,
tableData: [], tableData: [],
childTableDate: [], childTableDate: [],
@ -161,6 +267,17 @@ export default {
page: 1, // 当前页数 page: 1, // 当前页数
pageSize: 20, // 每页数量 pageSize: 20, // 每页数量
total: 0, //总条数 total: 0, //总条数
qt: "",
id: "",
paramsData: "",
childpage: 1, // 当前页数
childpageSize: 20, // 每页数量
childtotal: 0, //总条数
childParma: "",
childMsg: "",
echartsData: "", //echarts数据
wdFlag: true,
sdFlag: false,
}; };
}, },
created() { created() {
@ -172,182 +289,323 @@ export default {
} }
}; };
}, },
watch: {
endtime(newVal) {
if (newVal) {
const date = new Date(newVal);
date.setHours(23);
date.setMinutes(59);
date.setSeconds(59);
this.formdata.endtime = date.getTime();
}
},
},
mounted() { mounted() {
this.$set( //this.getWeatherData();
this.formdata,
"starttime",
new Date(new Date().toLocaleDateString()).getTime()
);
this.$set(this.formdata, "endtime", new Date().getTime());
}, },
methods: { methods: {
getCurrentData(data) { getCurrentData(data) {
console.log("执行父组件", data); console.log("执行父组件", data);
this.paramsData = data;
console.log(data);
if (data.dyValue) { if (data.dyValue) {
console.log("电压"); console.log("电压-公司");
this.msg = "公司所有数据"; this.qt = "all";
this.childFlag = false; this.id = data.id;
this.tableData = [ this.getWeatherData(data);
{ } else if (data.bsManufacturer) {
line: "线路A", console.log("线路-电压");
pole: "杆塔1", this.qt = "line";
terminal: "终端1", this.id = data.id;
time: "2023-03-15 08:00:00", this.getWeatherData(data);
temperature: "25℃", } else {
humidity: "60%", console.log("装置-杆塔");
windSpeed: "0.5m/s", this.qt = "tower";
windDirection: "120°", this.id = data.towerid;
rainfall: "0mm/hour", this.getWeatherData(data);
pressure: "1015hPa", }
sunlight: "500W/m2", //this.getAllData(data);
},
getWeatherData(data) {
this.childFlag = false;
console.log(data, this.qt);
this.loading = true;
getDataListJoggle({
act: "meteo",
qt: this.qt,
id: this.id,
p: this.page,
ps: this.pageSize,
latest: 1,
})
.then((res) => {
console.log(res);
this.tableData = res.data;
this.total = Number(res.page.totalRecords);
this.loading = false;
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
});
},
//点击分页
handleCurrentChange(val) {
this.page = val;
this.tableData = [];
this.getWeatherData(this.paramsData);
},
//每页条数
handleSizeChange(val) {
this.pageSize = val;
this.tableData = [];
this.getWeatherData(this.paramsData);
},
//点击查看更多历史数据
moreDataClick(row) {
this.childFlag = true;
console.log(row);
this.$set(
this.formdata,
"starttime",
new Date(new Date().toLocaleDateString()).getTime()
);
const currentDate = new Date(); // 获取当前时间
currentDate.setHours(23); // 设置小时为23
currentDate.setMinutes(59); // 设置分钟为59
currentDate.setSeconds(59); // 设置秒数为59
this.$set(this.formdata, "endtime", currentDate.getTime());
this.qt = "terminal";
this.id = row.termId;
this.childParma = row;
this.getchildWeatherData(row);
},
//查询时间
onSubmit() {
this.getchildWeatherData(this.childParma);
},
getchildWeatherData(row) {
this.loading = true;
this.childMsg = row;
const sTime = Math.floor(this.formdata.starttime / 1000);
const eTime = Math.floor(this.formdata.endtime / 1000);
getDataListJoggle({
act: "meteo",
qt: this.qt,
id: this.id,
bt: sTime,
et: eTime,
p: this.childpage,
ps: this.childpageSize,
})
.then((res) => {
console.log(res);
this.childTableDate = res.data;
this.childtotal = Number(res.page.totalRecords);
this.loading = false;
//获取温度折线图
this.getAllData(row);
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
});
},
getAllData(row) {
const sTime = Math.floor(this.formdata.starttime / 1000);
const eTime = Math.floor(this.formdata.endtime / 1000);
getDataListJoggle({
act: "meteo",
qt: this.qt,
id: this.id,
bt: sTime,
et: eTime,
p: this.childpage,
ps: 1000,
})
.then((res) => {
console.log(res);
this.echartsData = res.data;
//获取温度折线图
this.getEchart4(this.echartsData);
this.getEchart5(this.echartsData);
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
});
},
onWdLine() {
this.wdFlag = true;
this.sdFlag = false;
},
onSdLine() {
this.wdFlag = false;
this.sdFlag = true;
},
onHidden() {
this.wdFlag = false;
this.sdFlag = false;
},
//获取当天告警分类统计
getEchart4(wd) {
this.$nextTick(() => {
this.$echarts.init(document.getElementById("wDechart"));
this.mywDechart = this.$echarts.init(
document.getElementById("wDechart")
);
console.log(wd);
var xData = [];
var yData = [];
xData = wd.map((item) =>
this.$moment(item.updateTime * 1000).format("HH:mm:ss")
);
yData = wd.map((item) => item.temperature);
let option = {
tooltip: {
trigger: "axis",
}, },
{ grid: {
line: "线路B", //left: "6%", //图表距离容器左侧多少距离
pole: "杆塔2", //right: "6%", //图表距离容器右侧侧多少距离
terminal: "终端2", bottom: "6%", //图表距离容器上面多少距离
time: "2023-03-15 09:00:00", //top: "2%", //图表距离容器下面多少距离
temperature: "23℃",
humidity: "70%",
windSpeed: "0.3m/s",
windDirection: "90°",
rainfall: "0mm/hour",
pressure: "1013hPa",
sunlight: "350W/m2",
}, },
{ title: {
line: "线路C", text: "温度变化趋势",
pole: "杆塔3", x: "center", //设置标题位置居中
terminal: "终端3", textStyle: {
time: "2023-03-15 10:00:00", //设置主标题的文字风格
temperature: "27℃", color: "#333", //字体颜色
humidity: "55%", fontSize: 16, //文字大小
windSpeed: "0.7m/s", fontWeight: "normal",
windDirection: "60°", },
rainfall: "0mm/hour",
pressure: "1017hPa",
sunlight: "650W/m2",
}, },
{ toolbox: {
line: "线路D", show: true,
pole: "杆塔4", feature: {
terminal: "终端4", dataView: { readOnly: false },
time: "2023-03-15 11:00:00", magicType: { type: ["line", "bar"] },
temperature: "24℃", restore: {},
humidity: "65%", saveAsImage: {},
windSpeed: "0.4m/s", },
windDirection: "30°",
rainfall: "0mm/hour",
pressure: "1016hPa",
sunlight: "450W/m2",
}, },
{ xAxis: {
line: "线路E", name: "时间", // 坐标轴名称
pole: "杆塔5", type: "category",
terminal: "终端5", boundaryGap: false,
time: "2023-03-15 12:00:00", data: xData,
temperature: "28℃",
humidity: "50%",
windSpeed: "0.6m/s",
windDirection: "90°",
rainfall: "0mm/hour",
pressure: "1018hPa",
sunlight: "750W/m2",
}, },
]; yAxis: {
} else if (data.bsManufacturer) { name: "温度", // 坐标轴名称
this.msg = "杆塔下所有数据"; type: "value",
this.childFlag = false; axisLabel: {
this.tableData = [ formatter: "{value} °C",
{ },
line: "线路F",
pole: "杆塔6",
terminal: "终端6",
time: "2023-03-15 13:00:00",
temperature: "26℃",
humidity: "60%",
windSpeed: "0.5m/s",
windDirection: "150°",
rainfall: "0mm/hour",
pressure: "1017hPa",
sunlight: "600W/m2",
}, },
{ series: [
line: "线路G", {
pole: "杆塔7", name: "温度",
terminal: "终端7", symbol: "none",
time: "2023-03-15 14:00:00", type: "line",
temperature: "29℃", data: yData,
humidity: "45%", },
windSpeed: "0.7m/s", ],
windDirection: "180°", };
rainfall: "mm/hour, ", this.mywDechart.setOption(option);
pressure: "184hPa（百帕） ", window.addEventListener("resize", () => {
sunlight: "789W/m²", this.mywDechart.resize();
});
});
},
getEchart5(sd) {
this.$nextTick(() => {
this.$echarts.init(document.getElementById("sDechart"));
this.mysDechart = this.$echarts.init(
document.getElementById("sDechart")
);
console.log(sd);
var xData = [];
var yData = [];
xData = sd.map((item) =>
this.$moment(item.updateTime * 1000).format("HH:mm:ss")
);
yData = sd.map((item) => item.humidity);
let option = {
tooltip: {
trigger: "axis",
}, },
{ grid: {
line: "线路H", //left: "6%", //图表距离容器左侧多少距离
pole: "杆塔8 ", //right: "6%", //图表距离容器右侧侧多少距离
terminal: "终端8 ", bottom: "6%", //图表距离容器上面多少距离
time: "24-Mar-23 16:45 ", //top: "2%", //图表距离容器下面多少距离
temperature: "24℃（摄氏度） ",
humidity: "78% （百分比） ",
windSpeed: "1.8m/s（米/秒） ",
windDirection: "88 °（度） ",
rainfall: "至今无数据 ",
pressure: "184hPa（百帕） ",
sunlight: " 无数据 ",
comment: " 天气晴朗，适合户外活动。",
}, },
]; title: {
} else { text: "湿度变化趋势",
console.log("杆塔"); x: "center", //设置标题位置居中
this.msg = "装置当天数据"; textStyle: {
this.childFlag = true; //设置主标题的文字风格
this.childTableDate = [ color: "#333", //字体颜色
{ fontSize: 16, //文字大小
time: "2023-03-15 08:00:00", fontWeight: "normal",
temperature: "25℃", },
humidity: "60%",
windSpeed: "0.5m/s",
windDirection: "120°",
rainfall: "0mm/hour",
pressure: "1015hPa",
sunlight: "500W/m2",
minuteAverageWindSpeed: "无数据",
minuteAverageWindDirection: "无数据",
tenMinuteAverageWindSpeed: "无数据",
tenMinuteAverageWindDirection: "无数据",
tenMinuteMaxWindSpeed: "无数据",
}, },
{ toolbox: {
time: "2023-03-15 09:00:00", show: true,
temperature: "23℃", feature: {
humidity: "70%", dataView: { readOnly: false },
windSpeed: "0.3m/s", magicType: { type: ["line", "bar"] },
windDirection: "90°", restore: {},
rainfall: "0mm/hour", saveAsImage: {},
pressure: "1013hPa", },
sunlight: "350W/m2",
minuteAverageWindSpeed: "无数据",
minuteAverageWindDirection: "无数据",
tenMinuteAverageWindSpeed: "无数据",
tenMinuteAverageWindDirection: "无数据",
tenMinuteMaxWindSpeed: "无数据",
}, },
]; xAxis: {
} name: "时间", // 坐标轴名称
type: "category",
boundaryGap: false,
data: xData,
},
yAxis: {
name: "湿度", // 坐标轴名称
type: "value",
axisLabel: {
formatter: "{value} %RH",
},
},
series: [
{
name: "湿度",
symbol: "none",
type: "line",
data: yData,
},
],
};
this.mysDechart.setOption(option);
window.addEventListener("resize", () => {
this.mysDechart.resize();
});
});
}, },
onSubmit() {}, changedate() {
//点击分页 console.log(new Date(this.formdata.endtime));
handleCurrentChange(val) { const currentDate = new Date(this.formdata.endtime); // 获取当前时间
this.page = val; currentDate.setHours(23); // 设置小时为23
// this.picList = []; currentDate.setMinutes(59); // 设置分钟为59
// this.getPicData(); currentDate.setSeconds(59); // 设置秒数为59
this.formdata.endtime = currentDate;
console.log("结束时间", this.formdata.endtime);
}, },
//每页条数 //点击child分页
handleSizeChange(val) { handlechildCurrentChange(val) {
this.pageSize = val; this.childpage = val;
//this.getPicData(); this.childTableDate = [];
this.getchildWeatherData(this.childParma);
},
//每页条数child分页
handlechildSizeChange(val) {
this.childpageSize = val;
this.childTableDate = [];
this.getchildWeatherData(this.childParma);
}, },
}, },
}; };
@ -358,6 +616,7 @@ export default {
height: calc(100% - 24px); height: calc(100% - 24px);
padding: 12px 12px; padding: 12px 12px;
background: #fff; background: #fff;
.weatherContain { .weatherContain {
display: flex; display: flex;
height: 100%; height: 100%;
@ -371,8 +630,11 @@ export default {
width: 100%; width: 100%;
height: 100%; height: 100%;
flex: 1; flex: 1;
overflow: hidden; overflow: auto;
border-left: 1px solid #ddd; border-left: 1px solid #ddd;
.el-table .el-table__cell {
text-align: center;
}
.dataBox { .dataBox {
width: calc(100% - 24px); width: calc(100% - 24px);
height: calc(100% - 24px); height: calc(100% - 24px);
@ -384,8 +646,53 @@ export default {
} }
.childBox { .childBox {
height: 100%; height: 100%;
.echartsBox {
display: flex;
flex-direction: column;
align-items: center;
.btnbox {
display: flex;
margin-bottom: 8px;
.el-button--primary {
width: auto;
}
}
.chartClass {
height: 450px;
width: 800px;
}
}
.childTableShowBox { .childTableShowBox {
height: calc(100% - 91px); h3 {
font-size: 16px;
font-weight: normal;
margin-bottom: 8px;
text-align: center;
color: #666;
margin-top: 16px;
}
height: calc(100% - 200px);
}
.termalBox {
h3 {
font-size: 16px;
font-weight: normal;
margin-bottom: 4px;
text-align: center;
color: #666;
}
.el-descriptions {
margin-bottom: 16px;
.el-descriptions-item__label.is-bordered-label {
color: #333;
}
.el-descriptions__body
.el-descriptions__table
.el-descriptions-item__cell {
text-align: center;
}
}
} }
} }
} }

5
vue.config.js
Unescape Escape View File

@ -21,8 +21,9 @@ module.exports = defineConfig({
proxy: { proxy: {
"/api": { "/api": {
//表示拦截以/api开头的请求路径 //表示拦截以/api开头的请求路径
//target: "http://47.96.238.157:8093", //阿里云服务器环境
target: "http://180.166.218.222:40080", //dell //target: "http://180.166.218.222:40080", //覆冰项目
target: "http://180.166.218.222:9910", //覆冰项目
// target: "http://192.168.50.42:81", //东视 // target: "http://192.168.50.42:81", //东视
changOrigin: true, //是否开启跨域 changOrigin: true, //是否开启跨域
pathRewrite: { pathRewrite: {

Write Preview
Loading…
Cancel
Save