Skip to content

T
traffic-front
Commit 858179d4 authored by wangxiaoming's avatar wangxiaoming
Browse files
Options

提交一版

parent b406d4b3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 907 additions and 166 deletions
package.json
View file @ 858179d4
......@@ -16,10 +16,11 @@
"file-saver": "^2.0.2",
"gcoord": "^0.2.3",
"js-cookie": "^2.2.1",
"videojs-contrib-hls": "^5.15.0",
"videojs-flash": "^2.1.2",
"vue": "^2.6.11",
"vue-baidu-map": "^0.21.22",
"vue-router": "^3.3.4",
"videojs-flash": "^2.1.2",
"vue-video-player": "^5.0.2",
"vuex": "^3.5.1",
"xlsx": "^0.16.5"
......
public/index.html
View file @ 858179d4
......@@ -6,6 +6,18 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>巡检平台</title>
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
<script type="text/javascript">
var Ip=returnCitySN['cip']
var cityname=returnCitySN['cname']
localStorage.setItem('Ip', Ip)
localStorage.setItem('cityname', cityname)
</script>
</head>
<body>
......
public/players/rtc_player.html
View file @ 858179d4
......@@ -17,14 +17,16 @@
<body>
<img src='https://ossrs.net/gif/v1/sls.gif?site=ossrs.net&path=/player/rtcplayer'/>
<div class="container">
<div class="form-inline">
<!--<input type="text" id="txt_url" class="input-xxlarge" value="">-->
<div class="container" style=" margin-top: -75px;
height: 95%;
width: 100%;">
<!--<div class="form-inline">
&lt;!&ndash;<input type="text" id="txt_url" class="input-xxlarge" value="">&ndash;&gt;
<button class="btn btn-primary" id="btn_play" style="display:none">播放视频</button>
</div>
</div>-->
<label></label>
<video style="width:1000px;height:700px" id="rtc_media_player" controls autoplay></video>
<!-- <label></label>-->
<video style="width:100%;height:550px" id="rtc_media_player" controls autoplay></video>
<!-- <label></label>
SessionID: <span id='sessionid'></span>
......@@ -38,11 +40,19 @@
</footer>-->
</div>
<script type="text/javascript">
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r != null) return decodeURI(r[2]); return null; //返回参数值
}
var pc = null; // Global handler to do cleanup when replaying.
$(function(){
var startPlay = function() {
$('#rtc_media_player').show();
var urlObject = parse_rtmp_url("webrtc://152.136.233.116/live/livestream?eip=152.136.233.116");
var url =getUrlParam("url");
console.log("liveUrl"+url);
//"webrtc://152.136.233.116/live/livestream"
var urlObject = parse_rtmp_url(url);
var schema = window.location.protocol;
// Close PC when user replay.
......
src/config-prod-81.js 0 → 100644
View file @ 858179d4
const address = '/roadlinks/';
const videoAddress = 'http://106.52.130.113:8000';
const photoAddress = 'http://106.52.130.113:8000';
const imgAddress = '/roadlinks/';// 测试环境
const title = '安徽省道路综合巡检平台';
export {
address, photoAddress, imgAddress, videoAddress,
};
src/config-prod.js 0 → 100644
View file @ 858179d4
const address = '/roadlinks/';
const videoAddress = 'http://106.52.130.113:8000';
const photoAddress = 'http://106.52.130.113:8000';
const imgAddress = '/roadlinks/';// 测试环境
const title = '安徽省道路综合巡检平台';
export {
address, photoAddress, imgAddress, videoAddress,
};
src/config.js
View file @ 858179d4
// const address = 'http://152.136.233.116:8083/roadlinks/';
// const address = '/roadlinks/';
const address = 'http://127.0.0.1:8088/roadlinks/'; // 本地
// const address = '/roadlinks/'; // 测试环境
// const address = 'http://vmax.corp.roadlinks.cn:8088/roadlinks/';
// const address = 'http://127.0.0.1:8088/roadlinks/';
// const address = 'http://193.112.197.170:8080/roadlinks/';
// const address = 'http://172.16.40.196:29980/roadlinks/';
const videoAddress = 'http://152.136.233.116:8000';
const photoAddress = 'http://152.136.233.116:8000';
// const imgAddress = '/roadlinks/';// 测试环境
const imgAddress = 'http://152.136.233.116:8083/roadlinks/'; // 本地
// const imgApi = 'http://152.136.233.116:8083/roadlinks/getCapitalImg?imgName='; //这个没用到啊
const address = '/roadlinks/';
const videoAddress = 'http://106.52.130.113:8000';
const photoAddress = 'http://106.52.130.113:8000';
const imgAddress = '/roadlinks/';// 测试环境
const title = '安徽省道路综合巡检平台';
export {
address, photoAddress, imgAddress, videoAddress,
};
src/cookie.js 0 → 100644
View file @ 858179d4
import Cookies from 'js-cookie';
const TokenKey = `${process.env.VUE_APP_COOKIES_PREFIX}token`;
export function getToken() {
return Cookies.get('id');
}
export function setToken(token) {
return Cookies.set(TokenKey, token);
}
export function removeToken() {
return Cookies.remove(TokenKey);
}
export function getCookie(key) {
return Cookies.get(process.env.VUE_APP_COOKIES_PREFIX + key);
}
export function getCookieByKey(key) {
return Cookies.get(key);
}
export function setCookie(key, val) {
return Cookies.set(process.env.VUE_APP_COOKIES_PREFIX + key, val);
}
export function removeCookie(key) {
return Cookies.remove(process.env.VUE_APP_COOKIES_PREFIX + key);
}
export function removeCookieByKey(key) {
return Cookies.remove(key);
}
src/main.js
View file @ 858179d4
......@@ -9,17 +9,21 @@ import moment from 'moment';
import VueVideoPlayer from 'vue-video-player';
import axios from 'axios';
import store from '@/store';
import App from './App.vue';
import router from './router';
import store from './store';
// require videojs style
import 'video.js/dist/video-js.css';
// import 'vue-video-player/src/custom-theme.css'
Vue.use(VueVideoPlayer);
const hls = require('videojs-contrib-hls');
Vue.use(hls);
Vue.use(ElementUI);
Vue.use(BaiduMap, {
......@@ -47,10 +51,50 @@ router.beforeEach((to, from, next) => {
next();
}
});
axios.interceptors.request.use(
(config) => {
config.baseURL = '/';
config.withCredentials = true; // 允许携带token ,这个是解决跨域产生的相关问题
config.timeout = 6000;
const token = Cookies.get('id');
if (token) {
config.headers = {
AuthId: token,
Authorization: `Bearer ${token}`,
};
}
if (config.url === 'refresh') {
config.headers = {
Authorization: `Bearer ${token}`,
};
}
return config;
},
error => Promise.reject(error),
);
router.afterEach((to, from, next) => {
window.scrollTo(0, 0);
});
const permission = {
inserted(el, binding, vnode) {
const { value } = binding;
const roles = JSON.parse(localStorage.getItem('permission'));
if (value && value instanceof Array && value.length > 0) {
const permissionRoles = value;
const hasPermission = roles.some(role => permissionRoles.includes(role));
if (!hasPermission) {
el.parentNode && el.parentNode.removeChild(el);
}
} else {
throw new Error('need roles! Like v-permission="[\'admin\',\'editor\']"');
}
},
};
Vue.directive('permission', permission);
new Vue({
router,
store,
......
src/permission.js 0 → 100644
View file @ 858179d4
const permission = {
equipmentCheck: '001',
equipmentList: '002',
userManagement: '003',
userAuthorization: '004',
equipmentList_edit: '002.001',
userManagement_edit: '003.001',
};
export {
permission,
};
src/request.js 0 → 100644
View file @ 858179d4
import axios from 'axios';
import { MessageBox, Message } from 'element-ui';
import store from '@/store';
import router from '@/router';
import { getToken } from './cookie';
// request interceptor
axios.interceptors.request.use(
(config) => {
// do something before request is sent
if (store.getters.token) {
// eslint-disable-next-line no-param-reassign
config.headers.Authorization = '22222';
}
return config;
},
(error) => {
// do something with request error
console.log(error); // for debug
return Promise.reject(error);
},
);
// response interceptor
axios.interceptors.response.use(
/**
* If you want to get http information such as headers or status
* Please return response => response
*/
/**
* Determine the request status by custom code
* Here is just an example
* You can also judge the status by HTTP Status Code
*/
(response) => {
const res = response.data;
// -1 通用错误提示
if (res.code === -1) {
Message({
message: res.message || 'Error',
type: 'error',
duration: 3 * 1000,
});
return Promise.reject(new Error(res.message || 'Error'));
}
return res;
},
(error) => {
if (error.response.status === 401) {
MessageBox.confirm('用户信息过期，请重新登录', '提示', {
confirmButtonText: '重登录',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
store.dispatch('user/resetToken').then(() => {
location.reload();
});
});
} else if (error.response.status === 403) {
router.push({ path: '/403' });
} else {
Message({
message: error.message,
type: 'error',
duration: 3 * 1000,
});
}
return Promise.reject(error);
},
);
src/router.js
View file @ 858179d4
......@@ -8,6 +8,11 @@ import Result from './views/Result.vue';
import ResultDetail from './views/ResultDetail.vue';
import Video from './views/Video.vue';
import Live from './views/Live.vue';
import EquipmentCheck from './views/equipment/EquipmentCheck.vue';
import EquipmentList from './views/equipment/EquipmentList.vue';
import ResetPassword from './views/userManagement/ResetPassword.vue';
import UserAuthorization from './views/userManagement/UserAuthorization.vue';
import UserManagement from './views/userManagement/UserManagement.vue';
Vue.use(Router);
......@@ -57,6 +62,31 @@ export default new Router({
name: 'live',
component: Live,
},
{
path: '/equipmentCheck',
name: 'equipmentCheck',
component: EquipmentCheck,
},
{
path: '/equipmentList',
name: 'equipmentList',
component: EquipmentList,
},
{
path: '/resetPassword',
name: 'resetPassword',
component: ResetPassword,
},
{
path: '/userAuthorization',
name: 'userAuthorization',
component: UserAuthorization,
},
{
path: '/userManagement',
name: 'userManagement',
component: UserManagement,
},
],
},
// 注册页面
......
src/store.js
View file @ 858179d4
......@@ -3,9 +3,10 @@ import Vuex from 'vuex';
Vue.use(Vuex);
export default new Vuex.Store({
const store = new Vuex.Store({
state: {
provinceId: 109,
permissionList: [],
},
mutations: {
......@@ -13,4 +14,9 @@ export default new Vuex.Store({
actions: {
},
changePermissionList(state, payload) {
state.permissionList = payload;
},
});
export default store;
src/views/Detail.vue
View file @ 858179d4
......@@ -40,8 +40,8 @@
<el-table
:data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"
style="width: calc(100vw - 240px);overflow:hidden;"
border="true"
highlight-current-row="true"
:border="true"
:highlight-current-row="true"
>
<el-table-column label="序号" prop="no"></el-table-column>
<el-table-column label="道路资产名称" prop="name"></el-table-column>
......@@ -235,8 +235,8 @@ export default {
if (response.data.code === 200) {
this.capitalOptions = [];
if (response.data.data) {
console.log(response.data.data);
const { capitals } = response.data.data;
/* console.log(response.data.data);*/
const capitals = response.data.data;
const nameSet = new Set();
capitals.forEach((val) => {
nameSet.add(val.capitalName);
......@@ -247,7 +247,6 @@ export default {
}
});
}
} else {
}
})
.catch((error) => {
......@@ -277,21 +276,20 @@ export default {
if (response.data.data) {
const nameMap = new Map();
response.data.data.forEach((val) => {
if (val.lng && val.lat) {
// nameSet.add(val.capitalName);
let num = 1;
if (nameMap.has(val.capitalName)) {
num = nameMap.get(val.capitalName) + 1;
nameMap.set(val.capitalName, num);
} else {
nameMap.set(val.capitalName, num);
}
this.tableData.push({
no: ++this.no,
name: val.capitalName + num,
position: val.position,
});
/* if (val.lng && val.lat) { */
// nameSet.add(val.capitalName);
let num = 1;
if (nameMap.has(val.capitalName)) {
num = nameMap.get(val.capitalName) + 1;
nameMap.set(val.capitalName, num);
} else {
nameMap.set(val.capitalName, num);
}
this.tableData.push({
no: ++this.no,
name: val.capitalName + num,
position: val.position,
});
});
}
}
......@@ -364,7 +362,8 @@ export default {
this.tableData = [];
Message({
message: response.data.message,
// type: 'error',
duration: 3 * 1000,
type: 'error',
// duration: '800',
});
}
......
src/views/Home.vue
View file @ 858179d4
<template>
<div class="home">
<el-container>
<el-aside width="200px">
<el-aside width="200px" style="background-color: #323346">
<el-scrollbar style="width: 200px;height:100%">
<el-menu
:default-active="onRoutes"
active-text-color="#41afdd"
......@@ -9,7 +10,13 @@
class="el-menu-vertical-demo"
>
<div class="logo">
<img src="../assets/logo_new.png" alt />
<div v-if="provinceId ==109">
<img style="width:100px;height:80px" src="../assets/logo_anhui.png" alt />
</div>
<div v-else-if="provinceId != 109">
<img style="width:100px;height:80px" src="../assets/logo_new.png" alt />
</div>
</div>
<el-submenu index="1">
<span slot="title" class="submenu_parent">道路资产管理</span>
......@@ -66,11 +73,59 @@
<span slot="title" style="font-size: 16px">停车视频查看</span>
</el-menu-item>
</el-submenu>
<el-submenu index="5" v-permission="[permission.equipmentCheck,permission.equipmentList]">
<span slot="title" class="submenu_parent" >&nbsp;&nbsp;设备管理&nbsp;&nbsp;</span>
<el-menu-item
v-permission="[permission.equipmentCheck]"
index="5-1"
@click="goTo('/equipmentCheck')"
style="background:#252639 !important"
>
<span slot="title" style="font-size: 16px">设备信息审核</span>
</el-menu-item>
<el-menu-item
v-permission="[permission.equipmentList]"
index="5-2"
@click="goTo('/equipmentList')"
style="background:#252639 !important"
>
<span slot="title" style="font-size: 16px">设备信息列表</span>
</el-menu-item>
</el-submenu>
<el-submenu index="6" v-permission="[permission.userAuthorization,permission.userManagement]">
<span slot="title" class="submenu_parent" >&nbsp;&nbsp;账户管理&nbsp;&nbsp;</span>
<el-menu-item
v-permission="[permission.userManagement]"
index="6-1"
@click="goTo('/userManagement')"
style="background:#252639 !important"
>
<span slot="title" style="font-size: 16px">账户管理</span>
</el-menu-item>
<el-menu-item
v-permission="[permission.userAuthorization]"
index="6-2"
@click="goTo('/userAuthorization')"
style="background:#252639 !important"
>
<span slot="title" style="font-size: 16px">授权账户</span>
</el-menu-item>
<!-- <el-menu-item
index="6-3"
@click="goTo('/resetPassword')"
style="background:#252639 !important"
>
<span slot="title" style="font-size: 16px">修改密码</span>
</el-menu-item>-->
</el-submenu>
</el-menu>
</el-scrollbar>
</el-aside>
<el-container>
<el-header>
<div class="header-title">安徽省道路综合巡检平台（测试）</div>
<div class="header-title">{{menuTitle}}</div>
<span>欢迎您，</span>
<span>{{user.name}}</span>
<el-button type="text" class="exitSys" @click="esc">退出</el-button>
......@@ -87,11 +142,17 @@
// @ is an alias to /src
// import HelloWorld from '@/components/HelloWorld.vue';
import Cookies from 'js-cookie';
import store from '@/store';
import { title } from '../config';
import { permission } from '../permission';
export default {
name: 'home',
data() {
return {
permission,
provinceId: localStorage.getItem('provinceId'),
menuTitle: title,
myId: '',
user: {
name: '张三',
......@@ -118,16 +179,50 @@ export default {
// this.$route.path
// debugger
if (this.$route.path.replace('/', '') == 'overview') {
this.menuTitle = '资产汇总';
return '1-1';
} if (this.$route.path.replace('/', '') == 'detail') {
this.menuTitle = '资产明细';
return '1-2';
} if (this.$route.path.replace('/', '') == 'task') {
this.menuTitle = '巡检任务管理';
return '2';
} if (this.$route.path.replace('/', '') == 'result') {
this.menuTitle = '巡检结果查看';
return '3-1';
} if (this.$route.path.replace('/', '') == 'resultDetail') {
this.menuTitle = '巡检结果明细';
return '3-2';
}
if (this.$route.path.replace('/', '') == 'live') {
this.menuTitle = '实时视频查看';
return '4-1';
}
if (this.$route.path.replace('/', '') == 'video') {
this.menuTitle = '停车视频查看';
return '4-2';
}
if (this.$route.path.replace('/', '') == 'equipmentCheck') {
this.menuTitle = '设备信息审核';
return '5-1';
}
if (this.$route.path.replace('/', '') == 'equipmentList') {
this.menuTitle = '设备信息列表';
return '5-2';
}
if (this.$route.path.replace('/', '') == 'userManagement') {
this.menuTitle = '账户管理';
return '6-1';
}
if (this.$route.path.replace('/', '') == 'userAuthorization') {
this.menuTitle = '授权账户';
return '6-2';
}
if (this.$route.path.replace('/', '') == 'resetPassword') {
this.menuTitle = '修改密码';
return '6-3';
}
return '1-1';
},
},
......@@ -154,11 +249,14 @@ export default {
</script>
<style lang="less" scoped>
.el-scrollbar__wrap{
overflow-x: hidden;
}
.logo {
line-height: 50px;
}
.exitSys {
color: black;
color: blue;
background: 0 0;
padding-left: 0;
padding-right: 0;
......
src/views/Live.vue
View file @ 858179d4
......@@ -60,8 +60,9 @@
</div>
</div>
<el-dialog :visible.sync="isShowVideo" >
<video-player
<el-dialog :visible.sync="isShowVideo" width="1000px" height="5900px">
<iframe style="width:100%;height:600px" id="live" :src=playerSrc></iframe>
<!-- <video-player
@play="onPlayerPlay($event)"
@pause="onPlayerPause($event)"
......@@ -79,7 +80,7 @@
:options="playerOptions"
class="vjs-custom-skin videoPlayer"
:playsinline="true"
/>
/>-->
</el-dialog>
<el-dialog :visible.sync="isShowTip" width="250px">
<span>设备未启动</span>
......@@ -103,11 +104,13 @@ import { address } from '../config';
import 'video.js/dist/video-js.css';
import 'vue-video-player/src/custom-theme.css';
import 'videojs-flash';
import Cookies from 'js-cookie';
export default {
name: 'video',
data() {
return {
playerSrc: '',
isShowTip: false,
plateNoOptions: [],
searchData: [],
......@@ -160,17 +163,31 @@ export default {
height: '360',
autoplay: true,
sources: [{
type: 'rtmp/flv',
src: 'rtmp://58.200.131.2:1935/livetv/hunantv',
type: 'application/x-mpegURL',
src: '',
}],
techOrder: ['flash'],
notSupportedMessage: '设备已停止',
controls: true,
poster: '',
},
liveItem: {
},
timer: '',
liveUrl: 'webrtc://152.136.233.116/live/',
liveIp: '?eip=152.136.233.116',
};
},
mounted() {},
watch: {
isShowVideo(newValue) {
if (!newValue) {
this.liveStop();
}
},
},
mounted() {
this.timer = setInterval(this.watchLive, 10000);
},
created() {
this.queryAllEquipment();
const searchVal = sessionStorage.getItem('videoSearchVal');
......@@ -198,54 +215,113 @@ export default {
this.getParkVideos();
},
methods: {
liveStop() {
this.playerOptions.sources[0].src = '';
axios
.post(`${address}liveStop`, {
sessionId: Cookies.get('sessionId'),
ip: localStorage.getItem('Ip'),
channelCode: this.liveItem.channelCode,
code: this.liveItem.code,
})
.then((res) => {
console.log('暂停视频');
})
.catch((error) => {
console.log(error);
});
},
watchLive() {
// eslint-disable-next-line eqeqeq
if (this.isShowVideo == true) {
axios
.post(`${address}liveStart`, {
ip: localStorage.getItem('Ip'),
channelCode: this.liveItem.channelCode,
code: this.liveItem.code,
sessionId: Cookies.get('sessionId'),
})
.then((res) => {
console.log('发送心跳');
}).catch((error) => {
console.log(error);
});
}
},
// listen event
onPlayerPlay(player) {
axios
.post(`${address}liveStart`, {
ip: localStorage.getItem('Ip'),
channelCode: this.liveItem.channelCode,
code: this.liveItem.code,
sessionId: Cookies.get('sessionId'),
})
.then((res) => {
console.log('开始播放');
}).catch((error) => {
console.log(error);
});
console.log('player play!', player);
},
onPlayerPause(player) {
console.log('player pause!', player);
},
onPlayerEnded(player) {
console.log('player ended!', player);
},
onPlayerLoadeddata(player) {
console.log('player Loadeddata!', player);
},
onPlayerWaiting(player) {
console.log('player Waiting!', player);
},
onPlayerPlaying(player) {
console.log('player Playing!', player);
},
// 时间跳动
onPlayerTimeupdate(player) {
// console.log('player Timeupdate!', player.currentTime());
},
onPlayerCanplay(player) {
console.log('player Canplay!', player);
},
onPlayerCanplaythrough(player) {
console.log('player Canplaythrough!', player);
},
// or listen state event
playerStateChanged(playerCurrentState) {
console.log('player current update state', playerCurrentState);
},
// player is ready
playerReadied(player) {
// seek to 10s
/*
onPlayerPause(player) {
this.liveStop();
console.log('player pause!', player);
},
onPlayerEnded(player) {
console.log('player end!', player);
},
onPlayerLoadeddata(player) {
console.log('player Loadeddata!', player);
},
onPlayerWaiting(player) {
console.log('player Waiting!', player);
},
onPlayerPlaying(player) {
console.log('player Playing!', player);
},
// 时间跳动
onPlayerTimeupdate(player) {
// console.log('player Timeupdate!', player.currentTime());
},
onPlayerCanplay(player) {
console.log('player Canplay!', player);
},
onPlayerCanplaythrough(player) {
console.log('player Canplaythrough!', player);
},
// or listen state event
playerStateChanged(playerCurrentState) {
console.log('player current update state', playerCurrentState);
},
// player is ready
playerReadied(player) {
// seek to 10s
console.log('example player 1 readied', player);
player.currentTime(10);
console.log('example 01: the player is readied', player);
},
player.currentTime(10);
console.log('example 01: the player is readied', player);
}, */
// 播放
playVideos(item) {
this.liveItem = item;
axios
.post(`${address}getIfParkStart`, { vehicleId: 1 })
.post(`${address}getIfParkStart`, { vehicleId: item.id })
.then((response) => {
if (response.data.code === 200) {
if (response.data.data && response.data.data.length > 0) {
const channelAndDevid = `${item.code}_${item.channelCode}`;
const random = Math.random();
//webrtc:// 152.136.233.116/live/DefaultstringE3060400FFFBEBBF_zjhn?eip=152.136.233.116
// this.playerSrc = `players/rtc_player.html?url=${this.liveUrl}DefaultstringE3060400FFFBEBBF_zjhn${this.liveIp}&random=${random}`;
this.playerSrc = `players/rtc_player.html?url=${this.liveUrl}${channelAndDevid}${this.liveIp}&random=${random}`;
/* const channel = item.channelCode;
const devid = item.code;
const src = `http://152.136.233.116:1965/live/${devid}_${channel}.m3u8`;
this.playerOptions.sources[0].src = 'http://152.136.233.116:1965/live/livestream.m3u8'; */
this.onPlayerPlay();
this.isShowVideo = true;
} else {
this.isShowTip = true;
......@@ -278,7 +354,8 @@ export default {
} else {
Message({
message: response.data.message,
// type: 'error',
duration: 3 * 1000,
type: 'error',
// duration: '800',
});
}
......@@ -287,6 +364,7 @@ export default {
console.log(error);
});
},
getParkVideos() {
this.searchLoading = true;
const that = this;
......
src/views/Login.vue
View file @ 858179d4
......@@ -17,7 +17,7 @@
@keyup.enter.native="handleLogin"
v-model="loginForm.username"
auto-complete="off"
placeholder="请输入用户名"
placeholder="请输入手机号"
>
<i slot="prefix" class="elxingmingyonghumingnicheng"></i>
</el-input>
......@@ -50,45 +50,50 @@
</el-form-item>
</el-form>
</div>
<div class="has-text-centered register">
<span @click="register">创建一个账户</span>
<div class="has-text-right register">
<span style="margin-left:260px" @click="register">立即注册</span>
<!-- <span >丨</span>
<span >忘记密码</span>-->
</div>
</div>
</div>
</template>
<script>
import axios from "axios";
import { Message } from "element-ui";
import { constants } from "fs";
import Cookies from "js-cookie";
import { address } from "../config.js";
import axios from 'axios';
import { Message } from 'element-ui';
import { constants } from 'fs';
import Cookies from 'js-cookie';
import store from '@/store';
import { address } from '../config.js';
export default {
name: "userlogin",
name: 'userlogin',
data() {
// 用户名自定义验证规则
return {
fontstyle: {},
loginForm: {
username: "",
password: "",
verifycode: "",
username: '',
password: '',
verifycode: '',
},
checked: false,
identifyCodes: "1234567890",
identifyCode: "",
identifyCodes: '1234567890',
identifyCode: '',
loginRules: {
// 绑定在form表单中的验证规则
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
{ required: true, message: '请输入手机号', trigger: 'blur' },
{ validator: this.isExists, trigger: 'blur' },
],
password: [
{ required: true, message: "请输入密码", trigger: "blur" },
{ min: 6, message: "密码长度最少为6位", trigger: "blur" },
{ required: true, message: '请输入密码', trigger: 'blur' },
{ min: 6, message: '密码长度最少为6位', trigger: 'blur' },
],
},
passwordType: "password",
passwordType: 'password',
};
},
created() {},
......@@ -99,10 +104,25 @@ export default {
computed: {},
props: [],
methods: {
isExists(rule, value, callback) {
axios
.post(`${address}getUserInfoByUserName`, {
username: this.loginForm.username,
}).then((res) => {
// eslint-disable-next-line eqeqeq
if (res.data.code != 200) {
callback(new Error('手机号不存在'));
} else {
callback();
}
}).catch(() => {
callback(new Error('手机号不存在'));
});
},
// 跳转到home页
goToHome(id, username) {
this.$router.push({
name: "home",
name: 'home',
params: {
id,
username,
......@@ -111,16 +131,16 @@ export default {
},
// 创建用户
register() {
this.$router.push({ path: "/registered" });
this.$router.push({ path: '/registered' });
},
// 通过改变input的type使密码可见
showPassword() {
this.fontstyle === ""
? (this.fontstyle = "color: red")
: (this.fontstyle = ""); // 改变密码可见按钮颜色
this.passwordType === ""
? (this.passwordType = "password")
: (this.passwordType = "");
this.fontstyle === ''
? (this.fontstyle = 'color: red')
: (this.fontstyle = ''); // 改变密码可见按钮颜色
this.passwordType === ''
? (this.passwordType = 'password')
: (this.passwordType = '');
},
// 点击登入按钮
handleLogin() {
......@@ -128,35 +148,38 @@ export default {
if (valid) {
// 路由跳转到任务页面
axios
.post(address + "login", {
.post(`${address}login`, {
username: this.loginForm.username,
password: this.loginForm.password,
})
.then((response) => {
if (response.data.code === 200) {
Cookies.set("id", response.data.data.id);
Cookies.set("username", this.loginForm.username);
Message({
message: `登录${response.data.message}`,
type: "success",
duration: "800",
});
setTimeout(() => {
this.goToHome();
}, 1000);
Cookies.set('id', response.data.data.id);
Cookies.set('username', this.loginForm.username);
Cookies.set('sessionId', response.data.data.sessionId);
store.state.provinceId = response.data.data.provinceId;
store.state.permissionList = response.data.data.permissionList;
localStorage.setItem('permission', JSON.stringify(store.state.permissionList));
localStorage.setItem('provinceId', store.state.provinceId);
this.goToHome();
} else {
Message({
message: response.data.message,
type: "error",
type: 'error',
duration: 3 * 1000,
});
}
console.log(response.data);
})
.catch((error) => {
console.log(error);
Message({
message: '密码输入错误',
type: 'error',
duration: 3 * 1000,
});
});
} else {
console.log("error submit!!");
console.log('error submit!!');
return false;
}
});
......@@ -193,7 +216,9 @@ export default {
.iconstyle {
color: #409eff;
}
.has-text-right {
text-align: right;
}
.information {
width: 470px;
display: block;
......
src/views/Overview.vue
View file @ 858179d4
......@@ -2,18 +2,18 @@
<div class="overview">
<div class="box">
<el-row class="warp">
<div class="overview-line">淮南管理处道路资产汇总情况如下，总共{{totalnum}}个。</div>
<div class="overview-line">{{office}}管理处道路资产汇总情况如下，总共{{totalnum}}个。</div>
<!-- 任务表 -->
<div class="overview-table">
<el-table
:data="tableData"
style="width: 99.9%"
border="true"
:border="true"
row-key="id"
default-expand-all
:cell-style="setUpFont"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
highlight-current-row="true"
:highlight-current-row="true"
>
<el-table-column label="序号" width="200" prop="no"></el-table-column>
<el-table-column label="道路资产名称" prop="name"></el-table-column>
......@@ -61,6 +61,7 @@ export default {
name: 'overview',
data() {
return {
office: '淮南',
tableData: [],
typeData: [
{ value: 0, label: '全部' },
......@@ -203,8 +204,8 @@ export default {
this.no = 0;
this.tableId = 0;
if (response.data.data) {
console.log(response.data.data);
const { capitals } = response.data.data;
/* console.log(`llllll${JSON.stringify(response.data.data)}`); */
const capitals = response.data.data;
this.totalnum = capitals.length;
const capitalTypeMap = new Map();
const capitalNameMap = new Map();
......@@ -268,9 +269,8 @@ export default {
}
this.tableData.push(tableItem);
}
console.log(this.tableData);
/* console.log(`llllllll${JSON.stringify(this.tableData)}`); */
}
} else {
}
})
.catch((error) => {
......@@ -341,7 +341,8 @@ export default {
this.tableData = [];
Message({
message: response.data.message,
// type: 'error',
duration: 3 * 1000,
type: 'error',
// duration: '800',
});
}
......
src/views/Registered.vue
View file @ 858179d4
This diff is collapsed.
src/views/Result.vue
View file @ 858179d4
This diff is collapsed.
src/views/ResultDetail.vue
View file @ 858179d4
......@@ -49,6 +49,20 @@
</el-form-item>
<el-form-item>
<el-date-picker
v-show="linkDetail==true"
v-model="filters.dateTime"
type="datetimerange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
:default-time="['00:00:00', '23:59:59']"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions"
></el-date-picker>
<el-date-picker
v-show="linkDetail==false"
v-model="filters.dateTime"
type="daterange"
align="right"
......@@ -81,7 +95,7 @@
>
<el-table-column width="80" type="index" label="序号" align="center"></el-table-column>
<el-table-column width="180" label="巡检时间" prop="imageTime" align="center"></el-table-column>
<el-table-column width="120" label="巡检目标" prop="type2" align="center"></el-table-column>
<el-table-column width="120" label="巡检目标" prop="info" align="center"></el-table-column>
<el-table-column width="400" label="目标位置" prop="position" align="center"></el-table-column>
<el-table-column width="100" label="目标状态" prop="status" align="center"></el-table-column>
<el-table-column
......@@ -190,13 +204,14 @@ import echarts from 'echarts';
import moment from 'moment';
import { export_json_to_excel } from '@/excel/Export2Excel';
import elDragDialog from '@/components/el-drag-dialog';
import { address, imgAddress } from '../config';
import { address, photoAddress } from '../config';
export default {
name: 'detail',
directives: { elDragDialog },
data() {
return {
linkDetail: false,
searchData: [],
tableData: [],
startTime: null,
......@@ -240,11 +255,11 @@ export default {
},
{
label: '抛洒物',
value: 2,
value: 1,
},
{
label: '护栏',
value: 3,
value: 2,
},
{
label: '龙门架',
......@@ -313,13 +328,17 @@ export default {
value: 1,
},
{
label: '异常',
label: '丢失',
value: 2,
},
{
label: '新增',
value: 3,
},
{
label: '异常',
value: 4,
},
],
pickerOptions: {
shortcuts: [
......@@ -376,6 +395,7 @@ export default {
const that = this;
if (this.$route.params.startTime) {
this.linkDetail = true;
that.startTime = this.$route.params.startTime;
}
if (this.$route.params.endTime) {
......@@ -417,15 +437,15 @@ export default {
).format('YYYY-MM-DD')} 23:59:59`;
}
this.startTime = new Date(this.filters.dateTime[0]).getTime();
this.endTime = new Date(this.filters.dateTime[1]).getTime();
const startTime = this.filters.dateTime[0];
const endTime = this.filters.dateTime[1];
sessionStorage.setItem('resultDetailSearchVal', JSON.stringify(this.filters));
this.searchLoading = true;
const that = this;
axios
.post(`${address}getImageFeaturesByGroup`, {
startTimeMill: that.startTime,
endTimeMill: that.endTime,
startTime,
endTime,
equipment: that.filters.equipment,
status: that.filters.status,
capitalType: that.filters.capitalType,
......@@ -438,15 +458,15 @@ export default {
if (response.data.data) {
this.pageOption.totalCount = response.data.data.total;
response.data.data.list.forEach((val) => {
val.status = val.status == 1 ? '正常' : val.status == 2 ? '异常' : '正常';
val.imageTime = moment(parseInt(val.imageTime)).format(
val.status = this.getStatusInfo(val.status, val.disposeType);
val.imageTime = moment.unix(val.imageTime).format(
'YYYY-MM-DD HH:mm:ss',
);
this.capitalOptions.forEach((item) => {
/* this.capitalOptions.forEach((item) => {
if ((val.type2 != 0 && val.type2 == item.value) || (val.type1 != 0 && val.type1 == item.value)) {
val.type2 = item.label;
val.info = item.label;
}
});
}); */
});
that.tableData = response.data.data.list;
} else {
......@@ -460,6 +480,17 @@ export default {
console.log(error);
});
},
getStatusInfo(status, disposeType) {
// eslint-disable-next-line eqeqeq
/* if (disposeType == 1) {
return '正常';
} */
// eslint-disable-next-line no-nested-ternary,eqeqeq
return status == 0 ? '正常' : status == 1 ? '新增' : status == 2 ? '丢失'
// eslint-disable-next-line no-nested-ternary,eqeqeq
: status == 3 ? '异常' : status == 4 ? '异常' : '异常'; // 3是抛洒 4护栏
},
getTableData() {
let tmpTable = [];
const ct = this.filters.capitalType;
......@@ -580,12 +611,43 @@ export default {
showDialog2() {
this.dialogVisible1 = false;
this.dialogVisible2 = true;
A;
},
showPicture(index, row) {
console.log(JSON.stringify(row));
this.imgContent = `${row.info}|${row.status}|${row.position}`;
this.bigImgUrl = `${imgAddress}getCapitalImg?imgPath=${row.imagePath}`;
this.bigImgUrl = photoAddress + row.imagePath;
const statusStr = `${row.type},${row.type1}`;
axios
.get(
`${address}getTrajectImgLocationByImageId?imageId=${row.imageId}&status=${statusStr}&type2=${row.type2}`,
)
// eslint-disable-next-line no-unused-vars
.then((response) => {
const styleArray = response.data.data;
this.customStyle = [];
// 拼接 展示的资产信息
styleArray.forEach((e, styleIndex) => {
e.index = styleIndex + 1;
const point = JSON.parse(e.vector).location;
// eslint-disable-next-line eqeqeq
if (point.length == 4) {
this.positionLeft = point[0];
this.positionRight = point[1];
this.positionWidth = point[2] - point[0];
this.positionHeight = point[3] - point[1];
this.customStyle = {
top: `${this.positionRight / this.hscale}px`,
left: `${this.positionLeft / this.scale}px`,
width: `${this.positionWidth / this.scale}px`,
height: `${this.positionHeight / this.hscale}px`,
};
}
});
});
const vectorData = JSON.parse(row.vector);
if (vectorData && vectorData.location) {
const point = vectorData.location;
if (point.length == 4) {
......@@ -605,7 +667,7 @@ export default {
this.isShowPicture = true;
if (row.status == '异常') {
this.dialogVisible1 = true;
this.groupId = row.groupId;
this.groupId = row.id;
this.tableIndex = index;
}
},
......
src/views/Task.vue
View file @ 858179d4
This diff is collapsed.
src/views/Video.vue
View file @ 858179d4
......@@ -53,10 +53,10 @@
>
<el-table-column width="100" type="index" label="序号" align="center"></el-table-column>
<el-table-column width="120" label="车牌号" prop="equipment" align="center"></el-table-column>
<el-table-column width="120" label="车牌号" prop="plateNo" align="center"></el-table-column>
<el-table-column width="200" label="开始时间" prop="startTime" align="center"></el-table-column>
<el-table-column width="200" label="结束时间" prop="endTime" align="center"></el-table-column>
<el-table-column width="200" label="视频时长" prop="videoTime" align="center"></el-table-column>
<el-table-column width="200" label="视频时长" prop="duration" align="center"></el-table-column>
<el-table-column width="200" label="停车地点" prop="position" align="center"></el-table-column>
<el-table-column fixed="right" min-width="100" label="视频列表" align="center">
<template slot-scope="scope">
......@@ -227,7 +227,8 @@ export default {
} else {
Message({
message: response.data.message,
// type: 'error',
duration: 3 * 1000,
type: 'error',
// duration: '800',
});
}
......@@ -260,8 +261,8 @@ export default {
const that = this;
axios
.post(`${address}getParkVideos`, {
startTimeMill: that.startTime,
endTimeMill: that.endTime,
startTime: this.filters.dateTime[0],
endTime: this.filters.dateTime[1],
equipment: that.filters.equipment,
pageIndex: this.pageOption.pageIndex,
pageSize: this.pageOption.pageSize,
......@@ -273,6 +274,7 @@ export default {
this.pageOption.totalCount = response.data.data.total;
that.tableData = response.data.data.list;
that.tableData.forEach((e) => {
e.duration += '秒';
e.startTime = this.$moment(
e.startTime,
).format('YYYY-MM-DD HH:mm:ss');
......
src/views/equipment/EquipmentCheck.vue 0 → 100644
View file @ 858179d4
This diff is collapsed.
src/views/equipment/EquipmentList.vue 0 → 100644
View file @ 858179d4
This diff is collapsed.
src/views/userManagement/ResetPassword.vue 0 → 100644
View file @ 858179d4
This diff is collapsed.
src/views/userManagement/UserAuthorization.vue 0 → 100644
View file @ 858179d4
<template>
<el-container>
<div class="box" style="height:600px;margin-left:20%;margin-top:30px">
<el-form label-width="100px" ref="createForm" :model="createForm" :rules="rules" >
<el-form-item label="手机号:" prop="phoneNum">
<el-input placeholder="请输入手机号码" style="width:325px"
v-model="createForm.phoneNum" clearable />
</el-form-item>
<el-form-item label="账号等级:" prop="roleId">
<el-radio-group v-model="createForm.roleId" @change="changeRole">
<div style="margin-top:10px"><el-radio label="1" > 超级管理员</el-radio></div>
<div style="margin-top:20px" >
<el-radio label="2" >省级管理员</el-radio>
<el-select
v-show="createForm.roleId==2"
v-model="createForm.provinceId"
style="width:200px"
clearable
filterable
placeholder="请选择省份"
>
<el-option
v-for="item in provinceOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</div>
<div style="margin-top:20px" value=3> <el-radio label="3" > 市级管理员</el-radio>
<el-select
@change="getCityOptions"
v-show="createForm.roleId==3"
v-model="createForm.provinceId"
style="width:200px"
clearable
filterable
placeholder="请选择省份"
>
<el-option
v-for="item in provinceOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
<el-select
v-model="createForm.cityId"
v-show="createForm.roleId==3"
style="width:200px"
clearable
filterable
placeholder="请选择市区"
>
<el-option
v-for="item in cityOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</div>
</el-radio-group>
</el-form-item>
<el-footer style="text-align: center">
<el-button type="warning" @click="commitAuth()">授权</el-button>
</el-footer>
</el-form>
</div>
</el-container>
</template>
<style lang="less" scope>
</style>
<script>
import axios from 'axios';
import { Message } from 'element-ui';
import moment from 'moment';
import { address, photoAddress } from '../../config';
export default {
name: 'equipmentList',
data() {
return {
provinceOptions: [],
cityOptions: [],
createForm: {
cityId: '',
provinceId: '',
phoneNum: '',
roleId: '',
},
rules: {
phoneNum: [
{ required: true, message: '请输入手机号码', trigger: 'blur' },
{
min: 11, max: 11, message: '请输入11位手机号码', trigger: 'blur',
},
{
pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
message: '请输入正确的手机号码',
trigger: 'blur',
},
],
roleId: [
{ required: true, message: '请选择账号等级', trigger: 'blur' },
],
},
};
},
mounted() {
},
created() {
this.queryAllProvince();
},
methods: {
getCityOptions() {
this.cityOptions = [];
if (this.createForm.provinceId) {
this.queryCityByProvince(this.createForm.provinceId);
}
},
queryCityByProvince(provinceId) {
const parentIds = [];
parentIds.push(provinceId);
axios
.post(`${address}selectAllAreasByLevelByParent`, {
parentIds,
})
.then((response) => {
if (response.data.code === 200) {
if (response.data.data) {
this.cityOptions = response.data.data;
}
}
})
.catch((error) => {
console.log(error);
});
},
queryAllProvince() {
axios
.post(`${address}selectAllAreasByLevelByParent`, {})
.then((response) => {
if (response.data.code === 200) {
if (response.data.data) {
this.provinceOptions = response.data.data;
}
}
})
.catch((error) => {
console.log(error);
});
},
commitAuth() {
// eslint-disable-next-line consistent-return
this.$refs.createForm.validate((valid) => {
if (valid) {
// eslint-disable-next-line eqeqeq
if (this.createForm.roleId == 2) {
if (!this.createForm.provinceId) {
Message({
message: '请选择省份',
type: 'warn',
duration: 3 * 1000,
});
return false;
}
}
// eslint-disable-next-line eqeqeq
if (this.createForm.roleId == 3) {
if (!this.createForm.provinceId) {
Message({
message: '请选择省份',
type: 'warn',
duration: 3 * 1000,
});
return false;
}
if (!this.createForm.cityId) {
Message({
message: '请选择市区',
type: 'warn',
duration: 3 * 1000,
});
return false;
}
}
axios
.post(`${address}userAuthentication`, {
roleId: this.createForm.roleId,
userName: this.createForm.phoneNum,
cityId: this.createForm.cityId,
provinceId: this.createForm.provinceId,
authStatus: 0,
})
.then((response) => {
if (response.data.code === 200) {
Message({
message: '账户授权成功',
type: 'success',
duration: 3 * 1000,
});
this.createForm = {
cityId: '',
provinceId: '',
phoneNum: '',
roleId: '',
};
}
})
.catch((error) => {
console.log(error);
});
} else {
return false;
}
});
},
changeRole() {
this.createForm.provinceId = '';
this.createForm.cityId = '';
},
},
};
</script>
src/views/userManagement/UserManagement.vue 0 → 100644
View file @ 858179d4
This diff is collapsed.
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