Skip to content

T
traffic-front
Commit 4152bc68 authored by wangxiaoming's avatar wangxiaoming
Browse files
Options

merge

parent ff491578
Show whitespace changes
Inline Side-by-side
Showing with 192 additions and 190 deletions
package.json
View file @ 4152bc68
......@@ -16,7 +16,6 @@
"file-saver": "^2.0.2",
"gcoord": "^0.2.3",
"js-cookie": "^2.2.1",
"moment": "^2.24.0",
"vue": "^2.6.10",
"vue-baidu-map": "^0.21.20",
"vue-router": "^3.0.3",
......@@ -38,6 +37,7 @@
"less": "^3.0.4",
"less-loader": "^4.1.0",
"lodash": "^4.17.19",
"moment": "^2.27.0",
"script-loader": "^0.7.2",
"vue-template-compiler": "^2.6.10"
},
......
src/main.js
View file @ 4152bc68
......@@ -13,6 +13,7 @@ Vue.use(ElementUI);
Vue.use(BaiduMap, {
ak: 'AZzMTSKLP4lVHphRauTBdINZUFnpWTcu',
});
Object.defineProperty(Vue.prototype, '$moment', { value: moment })
Object.defineProperty(Vue.prototype, '$_', { value: _ });
Vue.config.productionTip = false;
......
src/views/Home.vue
View file @ 4152bc68
......@@ -68,15 +68,15 @@
<script>
// @ is an alias to /src
// import HelloWorld from '@/components/HelloWorld.vue';
import Cookies from "js-cookie";
import Cookies from 'js-cookie';
export default {
name: "home",
name: 'home',
data() {
return {
myId: "",
myId: '',
user: {
name: "张三",
name: '张三',
},
};
},
......@@ -84,34 +84,33 @@ export default {
// HelloWorld,
},
created() {
const myId = Cookies.get("id");
const myId = Cookies.get('id');
this.myId = myId;
const username = Cookies.get("username");
const username = Cookies.get('username');
// console.log(this.$route.params.username);
this.user.name = username;
},
mounted() {
if (this.$route.path.replace("/", "") == "") {
this.goTo("/overview");
if (this.$route.path.replace('/', '') == '') {
this.goTo('/overview');
}
},
computed: {
onRoutes() {
// this.$route.path
// debugger
if (this.$route.path.replace("/", "") == "overview") {
return "1-1";
} else if (this.$route.path.replace("/", "") == "detail") {
return "1-2";
} else if (this.$route.path.replace("/", "") == "task") {
return "2";
} else if (this.$route.path.replace("/", "") == "result") {
return "3-1";
} else if (this.$route.path.replace("/", "") == "resultDetail") {
return "3-2";
} else {
return "1-1";
if (this.$route.path.replace('/', '') == 'overview') {
return '1-1';
} if (this.$route.path.replace('/', '') == 'detail') {
return '1-2';
} if (this.$route.path.replace('/', '') == 'task') {
return '2';
} if (this.$route.path.replace('/', '') == 'result') {
return '3-1';
} if (this.$route.path.replace('/', '') == 'resultDetail') {
return '3-2';
}
return '1-1';
},
},
methods: {
......@@ -124,9 +123,9 @@ export default {
// 退出
esc() {
// alert(1);
Cookies.remove("id");
Cookies.remove('id');
this.$router.push({
name: "login",
name: 'login',
});
},
goTo(path) {
......
src/views/ResultDetail.vue
View file @ 4152bc68
......@@ -231,7 +231,8 @@ export default {
pageSize: 20,
totalCount: 0,
},
currentPage: 1, // 初始页
pagesize: 10, // 每页的数据
tableData: [
],
......@@ -447,11 +448,15 @@ export default {
endTime: this.filters.dateTime[1],
capitalType: this.filters.capitalType,
status: this.filters.status > 0 ? this.filters.status : null,
pageIndex: this.pageOption.pageIndex,
pageSize: this.pageOption.pageSize,
}).then((response) => {
this.searchLoading = false;
if (response.data.code === 200) {
if (response.data.data) {
response.data.data.forEach((val) => {
this.tableData = response.data.data.list;
this.pageOption.totalCount = response.data.data.total;
this.tableData.forEach((val) => {
val.status = val.status == 1 ? '正常' : (val.status == 2 ? '异常' : '新增');
val.imageTime = moment(parseInt(val.imageTime)).format('YYYY-MM-DD HH:mm:ss');
this.capitalOptions.forEach((item) => {
......@@ -460,13 +465,13 @@ export default {
}
});
});
this.tableData = response.data.data;
} else {
this.tableData = [];
}
} else {
this.tableData = [];
}
console.log(`llllllllllllllll${JSON.stringify(this.tableData)}`);
})
.catch((error) => {
this.searchLoading = false;
......@@ -491,12 +496,14 @@ export default {
// 初始页currentPage、初始每页数据数pagesize和数据data
handleSizeChange(size) {
this.pagesize = size;
this.pageOption.pageSize = size;
console.log(this.pagesize); // 每页下拉显示数据
this.getImageGroups();
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage;
this.pageOption.pageIndex = currentPage;
console.log(this.currentPage); // 点击第几页
this.getImageGroups();
},
getAllCapitals() {
axios.post(`${address}getAllCapitals`, {
......
src/views/Task.vue
View file @ 4152bc68
......@@ -153,31 +153,31 @@
</template>
<script>
import axios from "axios";
import gcoord from "gcoord";
import moment from "moment";
import { Message } from "element-ui";
import { address } from "../config";
import { export_json_to_excel } from "@/excel/Export2Excel";
import axios from 'axios';
import gcoord from 'gcoord';
import moment from 'moment';
import { Message } from 'element-ui';
import { address } from '../config';
import { export_json_to_excel } from '@/excel/Export2Excel';
export default {
name: "task",
name: 'task',
data() {
return {
tableData: [],
infoWindow: {
show: false,
contents: "",
contents: '',
},
currentPage: 1, //初始页
pagesize: 10, //每页的数据
currentPage: 1, // 初始页
pagesize: 10, // 每页的数据
options: [
{
value: "beijing",
label: "北京",
value: 'beijing',
label: '北京',
},
],
value: "beijing",
value: 'beijing',
center: { lng: 116.30249408783744, lat: 39.23017874638128 },
infoPosition: { lng: 0, lat: 0 },
infoShow: false,
......@@ -192,14 +192,14 @@ export default {
dialogTableVisible: false,
dataList: [],
isShowPicture: false,
state: "",
state: '',
timeout: null,
bigImgUrl: "",
bigImgUrl: '',
filters: {
equipmentNo: "",
plateNo: "",
channel: "",
channelName: "",
equipmentNo: '',
plateNo: '',
channel: '',
channelName: '',
dateTime: [],
type: 0,
status: true,
......@@ -211,35 +211,35 @@ export default {
pickerOptions: {
shortcuts: [
{
text: "最近一周",
text: '最近一周',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit("pick", [start, end]);
picker.$emit('pick', [start, end]);
},
},
{
text: "最近一个月",
text: '最近一个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit("pick", [start, end]);
picker.$emit('pick', [start, end]);
},
},
{
text: "最近三个月",
text: '最近三个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
picker.$emit("pick", [start, end]);
picker.$emit('pick', [start, end]);
},
},
],
},
searchLoading:false
searchLoading: false,
};
},
mounted() {},
......@@ -253,14 +253,13 @@ export default {
this.infoPosition.lat = e.point.lat;
this.infos.forEach((item) => {
if (item.lng == e.point.lng && item.lat == e.point.lat) {
this.infoWindow.contents =
item.plateNo +
" <br/>日期:" +
item.date +
"<br/>时间:" +
item.time +
"<br/>位置:" +
item.position;
this.infoWindow.contents = `${item.plateNo
} <br/>日期:${
item.date
}<br/>时间:${
item.time
}<br/>位置:${
item.position}`;
}
});
this.infoWindow.show = true;
......@@ -272,17 +271,16 @@ export default {
this.infos.forEach((item) => {
if (item.lng == e.point.lng && item.lat == e.point.lat) {
// 根据坐标信息获取图片
this.bigImgUrl =
address +
"getTrajectImg?channel=" +
item.channel +
"&equipment=" +
item.plateNo +
"&createTime=" +
item.date +
" " +
item.time;
//this.getTrajectImg(item.channel, item.plateNo, item.date + ' ' + item.time);
this.bigImgUrl = `${address
}getTrajectImg?channel=${
item.channel
}&equipment=${
item.plateNo
}&createTime=${
item.date
} ${
item.time}`;
// this.getTrajectImg(item.channel, item.plateNo, item.date + ' ' + item.time);
console.log(item.date);
console.log(item.time);
}
......@@ -292,10 +290,10 @@ export default {
},
getTrajectImg(channel, plateNo, createTime) {
axios
.post(address + `getTrajectImg`, {
channel: channel,
.post(`${address}getTrajectImg`, {
channel,
equipment: plateNo,
createTime: createTime,
createTime,
})
.then((response) => {})
.catch((error) => {
......@@ -304,45 +302,45 @@ export default {
},
exportTravel() {
this.tableData.forEach((item) => {
item.no = item.no + "";
item.no += '';
});
require.ensure([], () => {
//tHeader为存放excel表头标题的数组
// tHeader为存放excel表头标题的数组
const tHeader = [
"序号",
"车牌号",
"开始时间",
"结束时间",
"起点",
"终点",
"巡检距离",
"巡检时长",
"平均车速",
'序号',
'车牌号',
'开始时间',
'结束时间',
'起点',
'终点',
'巡检距离',
'巡检时长',
'平均车速',
];
//filterVal为tHeader标题对应的键值
// filterVal为tHeader标题对应的键值
const filterVal = [
"no",
"plateNo",
"startTime",
"endTime",
"startPoint",
"endPoint",
"inspectDistance",
"inspectTime",
"averageSpeed",
'no',
'plateNo',
'startTime',
'endTime',
'startPoint',
'endPoint',
'inspectDistance',
'inspectTime',
'averageSpeed',
];
//list为要转化为excel文件的数据，是一个数组
// list为要转化为excel文件的数据，是一个数组
const list = this.tableData;
//用map方法处理list数据
const data = list.map((v) => filterVal.map((j) => v[j]));
//自定义excel文件名
const fileName = "巡检任务";
// 用map方法处理list数据
const data = list.map(v => filterVal.map(j => v[j]));
// 自定义excel文件名
const fileName = '巡检任务';
export_json_to_excel(tHeader, data, fileName);
});
},
queryAllEquipment() {
axios
.post(address + `queryAllEquipment`, {})
.post(`${address}queryAllEquipment`, {})
.then((response) => {
if (response.data.code === 200) {
if (response.data.data) {
......@@ -365,30 +363,28 @@ export default {
},
queryTravel() {
if (this.filters.dateTime.length == 0) {
this.filters.dateTime[0] =
moment(
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24)
).format("YYYY-MM-DD") + " 00:00:00";
this.filters.dateTime[1] =
moment(
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24)
).format("YYYY-MM-DD") + " 23:59:59";
this.filters.dateTime[0] = `${moment(
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24),
).format('YYYY-MM-DD')} 00:00:00`;
this.filters.dateTime[1] = `${moment(
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24),
).format('YYYY-MM-DD')} 23:59:59`;
}
let equipmentCode = "";
let equipmentCode = '';
if (this.filters.plateNo && this.filters.plateNo.length > 0) {
this.filters.plateNo.forEach((item) => {
if (equipmentCode == "") {
if (equipmentCode == '') {
equipmentCode += item;
} else {
equipmentCode += "," + item;
equipmentCode += `,${item}`;
}
});
}
this.searchLoading = true;
var that = this;
const that = this;
axios
.post(address + `getTravel`, {
.post(`${address}getTravel`, {
startTime: this.filters.dateTime[0],
endTime: this.filters.dateTime[1],
equipment: equipmentCode,
......@@ -404,15 +400,15 @@ export default {
this.no = 0;
for (var key in response.data.data) {
if (response.data.data[key]) {
let gisArr = response.data.data[key];
const gisArr = response.data.data[key];
gisArr.forEach((val) => {
if (val) {
//计算轨迹长度
let poly = [];
let points = [];
let linkMap = new Map();
let startPoints = [];
let endPoints = [];
// 计算轨迹长度
const poly = [];
const points = [];
const linkMap = new Map();
const startPoints = [];
const endPoints = [];
let distance = 0;
let totalDistance = 0;
val.forEach((item, index) => {
......@@ -420,19 +416,19 @@ export default {
const result = gcoord.transform(
[item.longitude, item.latitude],
gcoord.WGS84,
gcoord.BD09
gcoord.BD09,
);
let dateTime = moment(item.timestamp).format(
"YYYY-MM-DD hh:mm:ss"
const dateTime = moment(item.timestamp).format(
'YYYY-MM-DD hh:mm:ss',
);
this.infos.push({
lng: result[0],
lat: result[1],
channel: key.split("_")[0],
plateNo: key.split("_")[1],
date: dateTime.split(" ")[0],
time: dateTime.split(" ")[1],
channel: key.split('_')[0],
plateNo: key.split('_')[1],
date: dateTime.split(' ')[0],
time: dateTime.split(' ')[1],
position: item.position,
});
poly.push({ lng: result[0], lat: result[1] });
......@@ -443,8 +439,8 @@ export default {
}
if (index < val.length - 1) {
if (
val[index + 1].longitude &&
val[index + 1].latitude
val[index + 1].longitude
&& val[index + 1].latitude
) {
const result1 = gcoord.transform(
[
......@@ -452,16 +448,16 @@ export default {
val[index + 1].latitude,
],
gcoord.WGS84,
gcoord.BD09
gcoord.BD09,
);
if (val[index + 1].linkId == val[index].linkId) {
distance += Math.abs(
val[index + 1].roadEndDis -
val[index].roadEndDis
val[index + 1].roadEndDis
- val[index].roadEndDis,
);
totalDistance += Math.abs(
val[index + 1].roadEndDis -
val[index].roadEndDis
val[index + 1].roadEndDis
- val[index].roadEndDis,
);
} else {
distance += Math.abs(
......@@ -469,16 +465,16 @@ export default {
result1[0],
result1[1],
result[0],
result[1]
)
result[1],
),
);
totalDistance += Math.abs(
this.getDistance(
result1[0],
result1[1],
result[0],
result[1]
)
result[1],
),
);
}
if (distance >= 500) {
......@@ -494,41 +490,41 @@ export default {
});
this.tableData.push({
no: ++this.no,
plateNo: key.split("_")[1],
plateNo: key.split('_')[1],
startTime: moment(val[val.length - 1].timestamp).format(
"YYYY-MM-DD hh:mm:ss"
'YYYY-MM-DD hh:mm:ss',
),
endTime: moment(val[0].timestamp).format(
"YYYY-MM-DD hh:mm:ss"
'YYYY-MM-DD hh:mm:ss',
),
startPoint: val[val.length - 1].position,
endPoint: val[0].position,
inspectDistance:
(totalDistance / 1000).toFixed(1) + "km",
`${(totalDistance / 1000).toFixed(1)}km`,
inspectTime:
(
(val[0].timestamp - val[val.length - 1].timestamp) /
(1000 * 3600)
).toFixed(1) + "h",
`${(
(val[0].timestamp - val[val.length - 1].timestamp)
/ (1000 * 3600)
).toFixed(1)}h`,
averageSpeed:
(
totalDistance /
1000 /
((val[0].timestamp -
val[val.length - 1].timestamp) /
(1000 * 3600))
).toFixed(1) + "km/h",
`${(
totalDistance
/ 1000
/ ((val[0].timestamp
- val[val.length - 1].timestamp)
/ (1000 * 3600))
).toFixed(1)}km/h`,
});
if (points) {
points[0].url = require("../assets/img/zhongdian.png");
points[0].url = require('../assets/img/zhongdian.png');
points[
points.length - 1
].url = require("../assets/img/qidian.png");
].url = require('../assets/img/qidian.png');
}
this.allPoints.push({
no:this.no,
no: this.no,
polylinePath: poly,
points: points,
points,
});
this.carPoints = this.allPoints;
this.center.lng = this.carPoints[0].polylinePath[0].lng;
......@@ -551,25 +547,24 @@ export default {
});
},
getDistance(lng1, lat1, lng2, lat2) {
let EARTH_RADIUS = 6378.137;
let radLat1 = this.rad(lat1);
let radLat2 = this.rad(lat2);
let a = radLat1 - radLat2;
let b = this.rad(lng1) - this.rad(lng2);
let s =
2 *
Math.asin(
const EARTH_RADIUS = 6378.137;
const radLat1 = this.rad(lat1);
const radLat2 = this.rad(lat2);
const a = radLat1 - radLat2;
const b = this.rad(lng1) - this.rad(lng2);
let s = 2
* Math.asin(
Math.sqrt(
Math.pow(Math.sin(a / 2), 2) +
Math.cos(radLat1) *
Math.cos(radLat2) *
Math.pow(Math.sin(b / 2), 2)
)
Math.pow(Math.sin(a / 2), 2)
+ Math.cos(radLat1)
* Math.cos(radLat2)
* Math.pow(Math.sin(b / 2), 2),
),
);
s = s * EARTH_RADIUS;
//s = Math.round(s * 10000d) / 10000d;
s *= EARTH_RADIUS;
// s = Math.round(s * 10000d) / 10000d;
s = Math.round(s * 10000) / 10000;
s = s * 1000; //乘以1000是换算成米
s *= 1000; // 乘以1000是换算成米
return s;
},
rad(d) {
......@@ -585,13 +580,13 @@ export default {
);
},
// 初始页currentPage、初始每页数据数pagesize和数据data
handleSizeChange: function (size) {
handleSizeChange(size) {
this.pagesize = size;
console.log(this.pagesize); //每页下拉显示数据
console.log(this.pagesize); // 每页下拉显示数据
},
handleCurrentChange: function (currentPage) {
handleCurrentChange(currentPage) {
this.currentPage = currentPage;
console.log(this.currentPage); //点击第几页
console.log(this.currentPage); // 点击第几页
},
handler({ BMap, map }) {
console.log(BMap, map);
......@@ -602,7 +597,7 @@ export default {
changeBefore() {},
linkTrail(index, row) {
console.log(index, row);
document.getElementById("ov-map").scrollIntoView();
document.getElementById('ov-map').scrollIntoView();
// this.$nextTick(() => {
// let tablePar = this.$refs["box"];
......@@ -610,7 +605,7 @@ export default {
// });
this.imgs = [];
let point = this.allPoints[index];
const point = this.allPoints[index];
this.carPoints = [];
this.carPoints.push(point);
this.center.lng = this.carPoints[0].polylinePath[0].lng;
......@@ -618,18 +613,18 @@ export default {
},
// 巡检结果查看
linkResult(index, row) {
let equipmentCode = "";
let equipmentCode = '';
if (this.filters.plateNo && this.filters.plateNo.length > 0) {
this.filters.plateNo.forEach((item) => {
if (equipmentCode == "") {
if (equipmentCode == '') {
equipmentCode += item;
} else {
equipmentCode += "," + item;
equipmentCode += `,${item}`;
}
});
}
this.$router.push({
name: "result",
name: 'result',
params: {
startTime: this.filters.dateTime[0],
endTime: this.filters.dateTime[1],
......@@ -643,10 +638,10 @@ export default {
zoomEnd(e) {
this.zoom = e.target.getZoom();
if (
this.carPoints &&
this.carPoints.length > 0 &&
this.carPoints.points &&
this.carPoints.points.length > 0
this.carPoints
&& this.carPoints.length > 0
&& this.carPoints.points
&& this.carPoints.points.length > 0
) {
this.center.lng = this.carPoints[0].points[0].lng;
this.center.lat = this.carPoints[0].points[0].lat;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment