Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
V
video-monitoring
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
刘怀志
video-monitoring
Commits
41d6280b
Commit
41d6280b
authored
Aug 01, 2024
by
69237
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
sunyu 上面按钮.1分为3
parent
e88422d2
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
494 additions
and
325 deletions
+494
-325
index.vue
src/components/TopNav/index.vue
+122
-56
index.js
src/router/index.js
+121
-124
index.vue
src/views/history/index.vue
+179
-72
vue.config.js
vue.config.js
+72
-73
No files found.
src/components/TopNav/index.vue
View file @
41d6280b
...
...
@@ -7,24 +7,69 @@
style=
"margin-right: 120px"
>
<template>
<el-menu-item
class=
"menuStyle"
style=
"font-size: small;background-color: #F6F6FA;border-top-right-radius: 15px;border-top-left-radius: 15px;text-align: center;margin-left: 1px"
index=
"/monitoring/video"
<el-menu-item
class=
"menuStyle"
style=
"
font-size: small;
background-color: #f6f6fa;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
text-align: center;
margin-left: 1px;
"
index=
"/monitoring/video"
>
<i
style=
"width: 10px;height: 10px;margin-top: -12px"
></i>
首页
</el-menu-item
<i
style=
"width: 10px; height: 10px; margin-top: -12px"
></i>
首页
</el-menu-item>
<el-menu-item
class=
"menuStyle"
style=
"
font-size: small;
background-color: #f6f6fa;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
text-align: center;
margin-left: 1px;
"
index=
"/employee/employee"
>
<el-menu-item
class=
"menuStyle"
style=
"font-size: small;background-color: #F6F6FA;border-top-right-radius: 15px;border-top-left-radius: 15px;text-align: center;margin-left: 1px"
index=
"/employee/employee"
<i
style=
"width: 10px; height: 10px; margin-top: -12px"
></i>
员工信息
</el-menu-item>
<el-menu-item
class=
"menuStyle"
style=
"
font-size: small;
background-color: #f6f6fa;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
text-align: center;
margin-left: 1px;
"
index=
"/monitoringhistory/history"
v-if=
"!this.backTag"
>
<i
style=
"width: 10px;height: 10px;margin-top: -12px"
></i>
员工信息
</el-menu-item
>
<el-menu-item
class=
"menuStyle"
style=
"font-size: small;background-color: #F6F6FA;border-top-right-radius: 15px;border-top-left-radius: 15px;text-align: center;margin-left: 1px"
index=
"/monitoringhistory/history"
>
<i
style=
"width: 10px;height: 10px;margin-top: -12px"
></i>
历史记录
</el-menu-item
<i
style=
"width: 10px; height: 10px; margin-top: -12px"
></i>
历史记录
</el-menu-item>
<el-menu-item
class=
"menuStyle"
style=
"
font-size: small;
background-color: #f6f6fa;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
text-align: center;
margin-left: 1px;
"
index=
"/monitoringhistory/history"
v-if=
"this.backTag"
@
click=
"changeBackTag()"
>
<i
style=
"width: 10px; height: 10px; margin-top: -12px"
></i>
返回历史记录
</el-menu-item>
</
template
>
<!-- 顶部菜单超出数量折叠 -->
...
...
@@ -50,33 +95,34 @@ import { constantRoutes } from "@/router";
import
Menu
from
"@/views/system/menu/index.vue"
;
// 隐藏侧边栏路由
const
hideList
=
[
'/index'
,
'/user/profile'
];
const
hideList
=
[
"/index"
,
"/user/profile"
];
export
default
{
components
:
{
Menu
},
components
:
{
Menu
},
data
()
{
return
{
backTag
:
false
,
newTopNev
:
[
{
path
:
'/monitoring/video'
,
icon
:
'el-icon-house'
,
name
:
'首页'
,
path
:
"/monitoring/video"
,
icon
:
"el-icon-house"
,
name
:
"首页"
,
},
{
path
:
'/employee/employee'
,
icon
:
'el-icon-user'
,
name
:
'员工信息'
,
path
:
"/employee/employee"
,
icon
:
"el-icon-user"
,
name
:
"员工信息"
,
},
{
path
:
'/monitoringhistory/history'
,
icon
:
'el-icon-view'
,
name
:
'历史记录'
,
}
path
:
"/monitoringhistory/history"
,
icon
:
"el-icon-view"
,
name
:
"历史记录"
,
}
,
],
// 顶部栏初始数
visibleNumber
:
5
,
// 当前激活菜单的 index
currentIndex
:
'/monitoring/video'
currentIndex
:
"/monitoring/video"
,
};
},
computed
:
{
...
...
@@ -108,11 +154,12 @@ export default {
this
.
routers
.
map
((
router
)
=>
{
for
(
var
item
in
router
.
children
)
{
if
(
router
.
children
[
item
].
parentPath
===
undefined
)
{
if
(
router
.
path
===
"/"
)
{
if
(
router
.
path
===
"/"
)
{
router
.
children
[
item
].
path
=
"/"
+
router
.
children
[
item
].
path
;
}
else
{
if
(
!
this
.
ishttp
(
router
.
children
[
item
].
path
))
{
router
.
children
[
item
].
path
=
router
.
path
+
"/"
+
router
.
children
[
item
].
path
;
if
(
!
this
.
ishttp
(
router
.
children
[
item
].
path
))
{
router
.
children
[
item
].
path
=
router
.
path
+
"/"
+
router
.
children
[
item
].
path
;
}
}
router
.
children
[
item
].
parentPath
=
router
.
path
;
...
...
@@ -141,17 +188,27 @@ export default {
// },
},
beforeMount
()
{
window
.
addEventListener
(
'resize'
,
this
.
setVisibleNumber
)
window
.
addEventListener
(
"resize"
,
this
.
setVisibleNumber
);
},
beforeDestroy
()
{
window
.
removeEventListener
(
'resize'
,
this
.
setVisibleNumber
)
window
.
removeEventListener
(
"resize"
,
this
.
setVisibleNumber
);
},
mounted
()
{
this
.
currentIndex
=
this
.
$route
.
path
this
.
$store
.
dispatch
(
'app/toggleSideBarHide'
,
true
);
this
.
currentIndex
=
this
.
$route
.
path
;
this
.
$store
.
dispatch
(
"app/toggleSideBarHide"
,
true
);
this
.
setVisibleNumber
();
},
created
()
{
this
.
getinfo
();
},
methods
:
{
changeBackTag
()
{
this
.
backTag
=
false
;
},
getinfo
()
{
let
self
=
this
;
self
.
backTag
=
this
.
$router
.
params
.
backTag
;
},
// 根据宽度计算设置显示栏数
setVisibleNumber
()
{
const
width
=
document
.
body
.
getBoundingClientRect
().
width
/
3
;
...
...
@@ -159,26 +216,26 @@ export default {
},
// 菜单选择事件
handleSelect
(
key
,
keyPath
)
{
console
.
info
(
'key'
,
key
)
console
.
info
(
"key"
,
key
);
this
.
currentIndex
=
key
;
const
route
=
this
.
routers
.
find
(
item
=>
item
.
path
===
key
);
const
route
=
this
.
routers
.
find
(
(
item
)
=>
item
.
path
===
key
);
if
(
this
.
ishttp
(
key
))
{
// http(s):// 路径新窗口打开
window
.
open
(
key
,
"_blank"
);
}
else
if
(
!
route
||
!
route
.
children
)
{
// 没有子路由路径内部打开
const
routeMenu
=
this
.
childrenMenus
.
find
(
item
=>
item
.
path
===
key
);
const
routeMenu
=
this
.
childrenMenus
.
find
(
(
item
)
=>
item
.
path
===
key
);
if
(
routeMenu
&&
routeMenu
.
query
)
{
let
query
=
JSON
.
parse
(
routeMenu
.
query
);
this
.
$router
.
push
({
path
:
key
,
query
:
query
});
}
else
{
this
.
$router
.
push
({
path
:
key
});
}
this
.
$store
.
dispatch
(
'app/toggleSideBarHide'
,
true
);
this
.
$store
.
dispatch
(
"app/toggleSideBarHide"
,
true
);
}
else
{
// 显示左侧联动菜单
this
.
activeRoutes
(
key
);
this
.
$store
.
dispatch
(
'app/toggleSideBarHide'
,
false
);
this
.
$store
.
dispatch
(
"app/toggleSideBarHide"
,
false
);
}
},
// 当前激活的路由
...
...
@@ -191,15 +248,15 @@ export default {
}
});
}
if
(
routes
.
length
>
0
)
{
if
(
routes
.
length
>
0
)
{
this
.
$store
.
commit
(
"SET_SIDEBAR_ROUTERS"
,
routes
);
}
else
{
this
.
$store
.
dispatch
(
'app/toggleSideBarHide'
,
true
);
this
.
$store
.
dispatch
(
"app/toggleSideBarHide"
,
true
);
}
},
ishttp
(
url
)
{
return
url
.
indexOf
(
'http://'
)
!==
-
1
||
url
.
indexOf
(
'https://'
)
!==
-
1
}
return
url
.
indexOf
(
"http://"
)
!==
-
1
||
url
.
indexOf
(
"https://"
)
!==
-
1
;
}
,
},
};
</
script
>
...
...
@@ -233,48 +290,57 @@ export default {
// padding: 0 5px !important;
// margin: 0 10px !important;
//}
.menuStyle
{
box-shadow
:
0
0
8px
#
D4D9E
5
;
.menuStyle
{
box-shadow
:
0
0
8px
#
d4d9e
5
;
height
:
60px
;
border-bottom
:
transparent
;
}
.menuStyle
:hover
{
color
:
#30B08F
;
.menuStyle
:hover
{
color
:
#30b08f
;
border-bottom
:
0px
transparent
;
}
::v-deep
.el-menu
::before
{
::v-deep
.el-menu
::before
{
color
:
transparent
;
}
::v-deep
.el-submenu
{
::v-deep
.el-submenu
{
height
:
60px
;
}
.el-menu--horizontal
>
.el-menu-item
{
.el-menu--horizontal
>
.el-menu-item
{
margin-top
:
19px
;
height
:
60px
;
line-height
:
35px
;
}
.el-menu--horizontal
>
.el-menu-item.is-active
{
.el-menu--horizontal
>
.el-menu-item.is-active
{
margin-top
:
12px
;
}
//.el-menu--horizontal > .el-menu-item.is-active{
// //margin-top: 30px;
// height: 60px;
// line-height: 30px;
//}
.el-menu-item.is-active
{
.el-menu-item.is-active
{
font-weight
:
bolder
;
line-height
:
45px
;
color
:
white
!
important
;
background-color
:
#0
D8EEE
!
important
;
background-color
:
#0
d8eee
!
important
;
}
.el-menu-item
{
width
:
130px
;
color
:
#2
E2E2E
!
important
;
background-color
:
#F6F6FA
!
important
;
color
:
#2
e2e2e
!
important
;
background-color
:
#f6f6fa
!
important
;
}
.el-menu--horizontal
>
.el-submenu
{
.el-menu--horizontal
>
.el-submenu
{
height
:
10px
;
}
//.el-menu--horizontal > .el-submenu.is-active{
// height: 80px;
//}
...
...
src/router/index.js
View file @
41d6280b
import
Vue
from
'vue'
import
Router
from
'vue-router'
import
Vue
from
"vue"
;
import
Router
from
"vue-router"
;
Vue
.
use
(
Router
)
Vue
.
use
(
Router
)
;
/* Layout */
import
Layout
from
'@/layout'
import
Layout
from
"@/layout"
;
/**
* Note: 路由配置项
...
...
@@ -31,213 +31,210 @@ import Layout from '@/layout'
// 公共路由
export
const
constantRoutes
=
[
{
path
:
'/redirect'
,
path
:
"/redirect"
,
component
:
Layout
,
hidden
:
true
,
children
:
[
{
path
:
'/redirect/:path(.*)'
,
component
:
()
=>
import
(
'@/views/redirect'
)
}
]
path
:
"/redirect/:path(.*)"
,
component
:
()
=>
import
(
"@/views/redirect"
),
}
,
]
,
},
{
path
:
'/login'
,
component
:
()
=>
import
(
'@/views/login'
),
hidden
:
true
path
:
"/login"
,
component
:
()
=>
import
(
"@/views/login"
),
hidden
:
true
,
},
{
path
:
'/register'
,
component
:
()
=>
import
(
'@/views/register'
),
hidden
:
true
path
:
"/register"
,
component
:
()
=>
import
(
"@/views/register"
),
hidden
:
true
,
},
{
path
:
'/404'
,
component
:
()
=>
import
(
'@/views/error/404'
),
hidden
:
true
path
:
"/404"
,
component
:
()
=>
import
(
"@/views/error/404"
),
hidden
:
true
,
},
{
path
:
'/401'
,
component
:
()
=>
import
(
'@/views/error/401'
),
hidden
:
true
path
:
"/401"
,
component
:
()
=>
import
(
"@/views/error/401"
),
hidden
:
true
,
},
{
path
:
''
,
path
:
""
,
component
:
Layout
,
redirect
:
'index'
,
redirect
:
"index"
,
children
:
[
{
path
:
'index'
,
component
:
()
=>
import
(
'@/views/video/index'
),
name
:
'Index'
,
meta
:
{
title
:
'首页'
,
icon
:
'dashboard'
,
affix
:
true
}
}
]
path
:
"index"
,
component
:
()
=>
import
(
"@/views/video/index"
),
name
:
"Index"
,
meta
:
{
title
:
"首页"
,
icon
:
"dashboard"
,
affix
:
true
},
}
,
]
,
},
{
path
:
'/user'
,
path
:
"/user"
,
component
:
Layout
,
hidden
:
true
,
redirect
:
'noredirect'
,
redirect
:
"noredirect"
,
children
:
[
{
path
:
'profile'
,
component
:
()
=>
import
(
'@/views/system/user/profile/index'
),
name
:
'Profile'
,
meta
:
{
title
:
'个人中心'
,
icon
:
'user'
}
}
]
path
:
"profile"
,
component
:
()
=>
import
(
"@/views/system/user/profile/index"
),
name
:
"Profile"
,
meta
:
{
title
:
"个人中心"
,
icon
:
"user"
},
},
],
},
{
path
:
'/monitoring'
,
path
:
"/monitoring"
,
component
:
Layout
,
hidden
:
false
,
redirect
:
'/monitoring/video'
,
redirect
:
"/monitoring/video"
,
children
:
[
{
path
:
'video'
,
component
:
()
=>
import
(
'@/views/video/index'
),
name
:
'Video'
,
meta
:
{
title
:
'视频监控'
,
icon
:
'user'
}
}
]
path
:
"video"
,
component
:
()
=>
import
(
"@/views/video/index"
),
name
:
"Video"
,
meta
:
{
title
:
"视频监控"
,
icon
:
"user"
},
}
,
]
,
},
{
path
:
'/monitoringPlayback'
,
path
:
"/monitoringPlayback"
,
component
:
Layout
,
hidden
:
false
,
redirect
:
'monitoringPlayback/playback'
,
redirect
:
"monitoringPlayback/playback"
,
children
:
[
{
path
:
'playback'
,
component
:
()
=>
import
(
'@/views/video/playback'
),
name
:
'Playback'
,
meta
:
{
title
:
'视频回放'
,
icon
:
'user'
}
}
]
path
:
"playback"
,
component
:
()
=>
import
(
"@/views/video/playback"
),
name
:
"Playback"
,
meta
:
{
title
:
"视频回放"
,
icon
:
"user"
},
}
,
]
,
},
{
path
:
'/monitoringhistory'
,
path
:
"/monitoringhistory"
,
component
:
Layout
,
hidden
:
false
,
redirect
:
'monitoringhistory/history'
,
redirect
:
"monitoringhistory/history"
,
children
:
[
{
path
:
'history'
,
component
:
()
=>
import
(
'@/views/history/index'
),
name
:
'History'
,
meta
:
{
title
:
'历史记录'
,
icon
:
'user'
}
}
]
path
:
"history"
,
component
:
()
=>
import
(
"@/views/history/index"
),
name
:
"History"
,
meta
:
{
title
:
"历史记录"
,
icon
:
"user"
},
}
,
]
,
},
{
path
:
'/employee'
,
path
:
"/employee"
,
component
:
Layout
,
hidden
:
false
,
redirect
:
'employee'
,
redirect
:
"employee"
,
children
:
[
{
path
:
'employee'
,
component
:
()
=>
import
(
'@/views/employee/index'
),
name
:
'employee'
,
meta
:
{
title
:
'员工信息'
,
icon
:
'user'
}
}
]
}
]
path
:
"employee"
,
component
:
()
=>
import
(
"@/views/employee/index"
),
name
:
"employee"
,
meta
:
{
title
:
"员工信息"
,
icon
:
"user"
},
},
],
},
];
// 动态路由,基于用户权限动态去加载
export
const
dynamicRoutes
=
[
{
path
:
'/system/user-auth'
,
path
:
"/system/user-auth"
,
component
:
Layout
,
hidden
:
true
,
permissions
:
[
'system:user:edit'
],
permissions
:
[
"system:user:edit"
],
children
:
[
{
path
:
'role/:userId(
\\
d+)'
,
component
:
()
=>
import
(
'@/views/system/user/authRole'
),
name
:
'AuthRole'
,
meta
:
{
title
:
'分配角色'
,
activeMenu
:
'/system/user'
}
}
]
path
:
"role/:userId(
\\
d+)"
,
component
:
()
=>
import
(
"@/views/system/user/authRole"
),
name
:
"AuthRole"
,
meta
:
{
title
:
"分配角色"
,
activeMenu
:
"/system/user"
},
}
,
]
,
},
{
path
:
'/system/role-auth'
,
path
:
"/system/role-auth"
,
component
:
Layout
,
hidden
:
true
,
permissions
:
[
'system:role:edit'
],
permissions
:
[
"system:role:edit"
],
children
:
[
{
path
:
'user/:roleId(
\\
d+)'
,
component
:
()
=>
import
(
'@/views/system/role/authUser'
),
name
:
'AuthUser'
,
meta
:
{
title
:
'分配用户'
,
activeMenu
:
'/system/role'
}
}
]
path
:
"user/:roleId(
\\
d+)"
,
component
:
()
=>
import
(
"@/views/system/role/authUser"
),
name
:
"AuthUser"
,
meta
:
{
title
:
"分配用户"
,
activeMenu
:
"/system/role"
},
}
,
]
,
},
{
path
:
'/system/dict-data'
,
path
:
"/system/dict-data"
,
component
:
Layout
,
hidden
:
true
,
permissions
:
[
'system:dict:list'
],
permissions
:
[
"system:dict:list"
],
children
:
[
{
path
:
'index/:dictId(
\\
d+)'
,
component
:
()
=>
import
(
'@/views/system/dict/data'
),
name
:
'Data'
,
meta
:
{
title
:
'字典数据'
,
activeMenu
:
'/system/dict'
}
}
]
path
:
"index/:dictId(
\\
d+)"
,
component
:
()
=>
import
(
"@/views/system/dict/data"
),
name
:
"Data"
,
meta
:
{
title
:
"字典数据"
,
activeMenu
:
"/system/dict"
},
}
,
]
,
},
{
path
:
'/monitor/job-log'
,
path
:
"/monitor/job-log"
,
component
:
Layout
,
hidden
:
true
,
permissions
:
[
'monitor:job:list'
],
permissions
:
[
"monitor:job:list"
],
children
:
[
{
path
:
'index/:jobId(
\\
d+)'
,
component
:
()
=>
import
(
'@/views/monitor/job/log'
),
name
:
'JobLog'
,
meta
:
{
title
:
'调度日志'
,
activeMenu
:
'/monitor/job'
}
}
]
path
:
"index/:jobId(
\\
d+)"
,
component
:
()
=>
import
(
"@/views/monitor/job/log"
),
name
:
"JobLog"
,
meta
:
{
title
:
"调度日志"
,
activeMenu
:
"/monitor/job"
},
}
,
]
,
},
{
path
:
'/tool/gen-edit'
,
path
:
"/tool/gen-edit"
,
component
:
Layout
,
hidden
:
true
,
permissions
:
[
'tool:gen:edit'
],
permissions
:
[
"tool:gen:edit"
],
children
:
[
{
path
:
'index/:tableId(
\\
d+)'
,
component
:
()
=>
import
(
'@/views/tool/gen/editTable'
),
name
:
'GenEdit'
,
meta
:
{
title
:
'修改生成配置'
,
activeMenu
:
'/tool/gen'
}
}
]
}
]
path
:
"index/:tableId(
\\
d+)"
,
component
:
()
=>
import
(
"@/views/tool/gen/editTable"
),
name
:
"GenEdit"
,
meta
:
{
title
:
"修改生成配置"
,
activeMenu
:
"/tool/gen"
},
}
,
]
,
}
,
]
;
// 防止连续点击多次路由报错
let
routerPush
=
Router
.
prototype
.
push
;
let
routerReplace
=
Router
.
prototype
.
replace
;
// push
Router
.
prototype
.
push
=
function
push
(
location
)
{
return
routerPush
.
call
(
this
,
location
).
catch
(
err
=>
err
)
}
return
routerPush
.
call
(
this
,
location
).
catch
(
(
err
)
=>
err
);
}
;
// replace
Router
.
prototype
.
replace
=
function
push
(
location
)
{
return
routerReplace
.
call
(
this
,
location
).
catch
(
err
=>
err
)
}
return
routerReplace
.
call
(
this
,
location
).
catch
(
(
err
)
=>
err
);
}
;
export
default
new
Router
({
mode
:
'history'
,
// 去掉url中的#
mode
:
"history"
,
// 去掉url中的#
scrollBehavior
:
()
=>
({
y
:
0
}),
routes
:
constantRoutes
})
routes
:
constantRoutes
,
})
;
src/views/history/index.vue
View file @
41d6280b
<
template
>
<div
class=
"app-container"
>
<div
style=
"background-color: white;height: 95vh;padding-left: 30px;padding-right: 30px"
>
<div
style=
"
background-color: white;
height: 95vh;
padding-left: 30px;
padding-right: 30px;
"
>
<div>
<span
style=
"display: flex;justify-content: flex-start;align-items: center;"
><div
style=
"border: 1px solid #116FBB;width: 2px;height: 20px;margin-right: 5px"
></div><h5
style=
"color: #116FBB;font-weight: bolder"
>
历史记录
</h5></span>
<span
style=
"
display: flex;
justify-content: flex-start;
align-items: center;
"
><div
style=
"
border: 1px solid #116fbb;
width: 2px;
height: 20px;
margin-right: 5px;
"
></div>
<h5
style=
"color: #116fbb; font-weight: bolder"
>
历史记录
</h5></span
>
</div>
<el-form
:model=
"queryParams"
ref=
"queryForm"
size=
"small"
:inline=
"true"
v-show=
"showSearch"
label-width=
"100px"
>
<el-form
:model=
"queryParams"
ref=
"queryForm"
size=
"small"
:inline=
"true"
v-show=
"showSearch"
label-width=
"100px"
>
<el-form-item
prop=
"monitoringName"
>
<el-input
v-model
.
trim=
"queryParams.monitoringName"
...
...
@@ -17,13 +44,16 @@
</el-form-item>
<el-form-item
prop=
"monitorState"
>
<el-select
v-model=
"queryParams.monitorState"
placeholder=
"请选择监控状态"
clearable
>
<el-select
v-model=
"queryParams.monitorState"
placeholder=
"请选择监控状态"
clearable
>
<el-option
value=
"0"
>
进行中
</el-option>
<el-option
value=
"1"
>
已完成
</el-option>
</el-select>
</el-form-item>
<el-form-item
prop=
"monitorTime"
>
<el-date-picker
placeholder=
"请选择监控时间"
...
...
@@ -50,68 +80,121 @@
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!--
</el-form-item>
-->
<div
style=
"margin-left: 92%"
>
<div
style=
"margin-left: 90%"
>
<el-form-item>
<el-button
type=
"primary"
icon=
"el-icon-search"
size=
"mini"
@
click=
"handleQuery"
>
搜索
</el-button>
<el-button
icon=
"el-icon-refresh"
size=
"mini"
@
click=
"resetQuery"
>
重置
</el-button>
<el-button
type=
"primary"
icon=
"el-icon-search"
size=
"mini"
@
click=
"handleQuery"
>
搜索
</el-button
>
<el-button
icon=
"el-icon-refresh"
size=
"mini"
@
click=
"resetQuery"
>
重置
</el-button
>
</el-form-item>
</div>
</el-form>
<!--
<el-table
v-loading=
"loading"
:data=
"histableList"
@
selection-change=
"handleSelectionChange"
>
-->
<el-table
:data=
"histableList"
@
selection-change=
"handleSelectionChange"
style=
"min-height: 650px"
>
<el-table-column
type=
"selection"
width=
"55"
align=
"center"
/>
<el-table-column
label=
"序号"
align=
"center"
width=
"100"
prop=
"id"
/>
<el-table
:data=
"histableList"
@
selection-change=
"handleSelectionChange"
style=
"min-height: 650px"
>
<el-table-column
type=
"selection"
width=
"55"
align=
"center"
/>
<el-table-column
label=
"序号"
align=
"center"
width=
"100"
prop=
"id"
/>
<!--
<template
slot-scope=
"scope"
>
-->
<!--
<span>
{{
(
scope
.
$index
+
1
)
+
(
queryParams
.
pageNum
-
1
)
*
queryParams
.
pageSize
}}
</span>
-->
<!--
</
template
>
-->
<el-table-column
label=
"监控点名称"
align=
"center"
prop=
"monitoringName"
/>
<el-table-column
label=
"监控开始时间"
align=
"center"
prop=
"monitoringStarttime"
width=
"300"
>
<el-table-column
label=
"监控点名称"
align=
"center"
prop=
"monitoringName"
/>
<el-table-column
label=
"监控开始时间"
align=
"center"
prop=
"monitoringStarttime"
width=
"300"
>
<
template
slot-scope=
"scope"
>
<span>
{{
parseTime
(
scope
.
row
.
monitoringStarttime
,
'{y
}
-{m
}
-{d
}
{h
}
:{i
}
:{s
}
'
)
}}
<
/span
>
<span>
{{
parseTime
(
scope
.
row
.
monitoringStarttime
,
"{y
}
-{m
}
-{d
}
{h
}
:{i
}
:{s
}
"
)
}}
<
/span
>
<
/template
>
<
/el-table-column
>
<
el
-
table
-
column
label
=
"监控结束时间"
align
=
"center"
prop
=
"monitoringFinallytime"
width
=
"500"
>
<
el
-
table
-
column
label
=
"监控结束时间"
align
=
"center"
prop
=
"monitoringFinallytime"
width
=
"400"
>
<
template
slot
-
scope
=
"scope"
>
<
span
>
{{
parseTime
(
scope
.
row
.
monitoringFinallytime
,
'{y
}
-{m
}
-{d
}
{h
}
:{i
}
:{s
}
'
)
}}
<
/span
>
<
span
>
{{
parseTime
(
scope
.
row
.
monitoringFinallytime
,
"{y
}
-{m
}
-{d
}
{h
}
:{i
}
:{s
}
"
)
}}
<
/span
>
<
/template
>
<
/el-table-column
>
<
el
-
table
-
column
label
=
"监控时间"
align
=
"center"
prop
=
"monitorTime"
width
=
"180"
>
<
el
-
table
-
column
label
=
"监控时间"
align
=
"center"
prop
=
"monitorTime"
width
=
"180"
>
<
template
slot
-
scope
=
"scope"
>
<
span
>
{{
formatHoursAsHMS
(
scope
.
row
.
monitorTime
)
}}
<
/span
>
<
/template
>
<
/el-table-column
>
<
el
-
table
-
column
label
=
"监控状态"
align
=
"center"
prop
=
"monitorState"
width
=
"500"
>
<
el
-
table
-
column
label
=
"监控状态"
align
=
"center"
prop
=
"monitorState"
width
=
"200"
>
<
template
slot
-
scope
=
"scope"
>
<
span
:
class
=
"scope.row.monitorState === '0' ? 'green-text' : 'black-text'"
>
{{
scope
.
row
.
monitorState
===
'0'
?
'·进行中'
:
'·已完成'
}}
<
/span
>
<
span
:
class
=
"
scope.row.monitorState === '0' ? 'green-text' : 'black-text'
"
>
{{
scope
.
row
.
monitorState
===
"0"
?
"·进行中"
:
"·已完成"
}}
<
/spa
n
>
<!--
<
dict
-
tag
:
options
=
"dict.type.history_state"
:
value
=
"scope.row.monitorState"
/>-->
<
/template
>
<
/el-table-column
>
<
el
-
table
-
column
label
=
"操作"
align
=
"center"
class
-
name
=
"small-padding fixed-width"
>
<
el
-
table
-
column
label
=
"操作"
align
=
"center"
class
-
name
=
"small-padding fixed-width"
>
<
template
slot
-
scope
=
"scope"
>
<
el
-
button
style
=
"border: transparent;background-color: transparent;color: green;font-size: 20px"
style
=
"
border: transparent;
background-color: transparent;
color: green;
font-size: 20px;
"
size
=
"mini"
plain
icon
=
"el-icon-view"
class
=
"green-icon"
@
click
=
"handleUpdate(scope.row)"
><
/el-button
>
<
/template
>
<
/el-table-column
>
<
/el-table
>
<
pagination
style
=
"display: flex;align-items: center;justify-content: center;"
style
=
"display: flex; align-items: center; justify-content: center"
:
total
=
"total"
:
page
.
sync
=
"queryParams.pageNum"
:
limit
.
sync
=
"queryParams.pageSize"
...
...
@@ -119,7 +202,12 @@
/>
<!--
添加或修改
history
对话框
-->
<
el
-
dialog
:
title
=
"title"
:
visible
.
sync
=
"open"
width
=
"500px"
append
-
to
-
body
>
<
el
-
dialog
:
title
=
"title"
:
visible
.
sync
=
"open"
width
=
"500px"
append
-
to
-
body
>
<
el
-
form
ref
=
"form"
:
model
=
"form"
:
rules
=
"rules"
label
-
width
=
"80px"
>
<
/el-form
>
<
div
slot
=
"footer"
class
=
"dialog-footer"
>
...
...
@@ -132,21 +220,28 @@
<
/template
>
<
script
>
import
{
listHistable
,
getHistable
,
delHistable
,
addHistable
,
updateHistable
}
from
"@/api/system/histable"
;
import
{
parseTime
}
from
"../../utils/ruoyi"
;
import
{
listHistable
,
getHistable
,
delHistable
,
addHistable
,
updateHistable
,
}
from
"@/api/system/histable"
;
import
{
parseTime
}
from
"../../utils/ruoyi"
;
export
default
{
name
:
"Histable"
,
dicts
:
[
'history_state'
],
dicts
:
[
"history_state"
],
data
()
{
return
{
carryRowCode
:{
id
:
""
,
monitoringName
:
""
,
backTag
:
true
,
carryRowCode
:
{
id
:
""
,
monitoringName
:
""
,
monitoringStarttime
:
""
,
monitoringFinallytime
:
""
,
monitorState
:
""
,
monitorTime
:
""
,
monitorState
:
""
,
monitorTime
:
""
,
}
,
// 遮罩层
loading
:
true
,
...
...
@@ -173,12 +268,12 @@ export default {
monitoringName
:
null
,
monitorTime
:
null
,
monitorState
:
null
,
id
:
null
,
id
:
null
,
}
,
// 表单参数
form
:
{
}
,
// 表单校验
rules
:
{
}
rules
:
{
}
,
}
;
}
,
created
()
{
...
...
@@ -190,7 +285,7 @@ export default {
const
intHours
=
Math
.
floor
(
hours
);
// 使用 padStart 方法确保小时数始终有两位数字
const
hoursStr
=
intHours
.
toString
().
padStart
(
2
,
'0'
);
const
hoursStr
=
intHours
.
toString
().
padStart
(
2
,
"0"
);
// 返回格式化的字符串
return
`${hoursStr
}
:00:00`
;
...
...
@@ -199,12 +294,11 @@ export default {
/** 查询history列表 */
getList
()
{
this
.
loading
=
true
;
listHistable
(
this
.
queryParams
).
then
(
response
=>
{
listHistable
(
this
.
queryParams
).
then
(
(
response
)
=>
{
this
.
histableList
=
response
.
rows
;
this
.
total
=
response
.
total
;
this
.
loading
=
false
;
}
);
}
,
// 取消按钮
cancel
()
{
...
...
@@ -224,7 +318,7 @@ export default {
CREATEBY
:
null
,
UPDATETIME
:
null
,
UPDATEBY
:
null
,
delFlag
:
null
delFlag
:
null
,
}
;
this
.
resetForm
(
"form"
);
}
,
...
...
@@ -240,9 +334,9 @@ export default {
}
,
// 多选框选中数据
handleSelectionChange
(
selection
)
{
this
.
ids
=
selection
.
map
(
item
=>
item
.
ID
)
this
.
single
=
selection
.
length
!==
1
this
.
multiple
=
!
selection
.
length
this
.
ids
=
selection
.
map
(
(
item
)
=>
item
.
ID
);
this
.
single
=
selection
.
length
!==
1
;
this
.
multiple
=
!
selection
.
length
;
}
,
/** 新增按钮操作 */
handleAdd
()
{
...
...
@@ -252,27 +346,33 @@ export default {
}
,
/** 修改按钮操作 */
handleUpdate
(
row
)
{
this
.
carryRowCode
=
row
;
this
.
$router
.
push
({
name
:
"back"
,
query
:
{
backTag
:
true
,
}
,
}
);
this
.
carryRowCode
=
row
;
// 查看详情页面(把id换成code)
this
.
$router
.
push
({
path
:
'/monitoringPlayback/playback'
,
this
.
$router
.
push
({
path
:
"/monitoringPlayback/playback"
,
query
:
{
carryRowCode
:
this
.
carryRowCode
}
}
)
carryRowCode
:
this
.
carryRowCode
,
}
,
}
);
}
,
/** 提交按钮 */
submitForm
()
{
this
.
$refs
[
"form"
].
validate
(
valid
=>
{
this
.
$refs
[
"form"
].
validate
(
(
valid
)
=>
{
if
(
valid
)
{
if
(
this
.
form
.
ID
!=
null
)
{
updateHistable
(
this
.
form
).
then
(
response
=>
{
updateHistable
(
this
.
form
).
then
(
(
response
)
=>
{
this
.
$modal
.
msgSuccess
(
"修改成功"
);
this
.
open
=
false
;
this
.
getList
();
}
);
}
else
{
addHistable
(
this
.
form
).
then
(
response
=>
{
addHistable
(
this
.
form
).
then
(
(
response
)
=>
{
this
.
$modal
.
msgSuccess
(
"新增成功"
);
this
.
open
=
false
;
this
.
getList
();
...
...
@@ -284,21 +384,28 @@ export default {
/** 删除按钮操作 */
handleDelete
(
row
)
{
const
IDs
=
row
.
ID
||
this
.
ids
;
this
.
$modal
.
confirm
(
'是否确认删除history编号为"'
+
IDs
+
'"的数据项?'
).
then
(
function
()
{
return
delHistable
(
IDs
);
}
).
then
(()
=>
{
this
.
getList
();
this
.
$modal
.
msgSuccess
(
"删除成功"
);
}
).
catch
(()
=>
{
}
);
this
.
$modal
.
confirm
(
'是否确认删除history编号为"'
+
IDs
+
'"的数据项?'
)
.
then
(
function
()
{
return
delHistable
(
IDs
);
}
)
.
then
(()
=>
{
this
.
getList
();
this
.
$modal
.
msgSuccess
(
"删除成功"
);
}
)
.
catch
(()
=>
{
}
);
}
,
/** 导出按钮操作 */
handleExport
()
{
this
.
download
(
'system/histable/export'
,
{
...
this
.
queryParams
}
,
`histable_${new Date().getTime()
}
.xlsx`
)
}
}
this
.
download
(
"system/histable/export"
,
{
...
this
.
queryParams
,
}
,
`histable_${new Date().getTime()
}
.xlsx`
);
}
,
}
,
}
;
<
/script
>
<
style
scoped
>
...
...
vue.config.js
View file @
41d6280b
'use strict'
const
path
=
require
(
'path'
)
"use strict"
;
const
path
=
require
(
"path"
);
function
resolve
(
dir
)
{
return
path
.
join
(
__dirname
,
dir
)
return
path
.
join
(
__dirname
,
dir
)
;
}
const
CompressionPlugin
=
require
(
'compression-webpack-plugin'
)
const
CompressionPlugin
=
require
(
"compression-webpack-plugin"
);
const
name
=
process
.
env
.
VUE_APP_TITLE
||
'若依管理系统'
// 网页标题
const
name
=
process
.
env
.
VUE_APP_TITLE
||
"若依管理系统"
;
// 网页标题
const
port
=
process
.
env
.
port
||
process
.
env
.
npm_config_port
||
80
// 端口
const
port
=
process
.
env
.
port
||
process
.
env
.
npm_config_port
||
80
;
// 端口
// vue.config.js 配置说明
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
...
...
@@ -20,16 +20,16 @@ module.exports = {
// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.ruoyi.vip/admin/,则设置 baseUrl 为 /admin/。
publicPath
:
process
.
env
.
NODE_ENV
===
"production"
?
"/"
:
"/"
,
// 在npm run build 或 yarn build 时 ,生成文件的目录名称(要和baseUrl的生产环境路径一致)(默认dist)
outputDir
:
'dist'
,
outputDir
:
"dist"
,
// 用于放置生成的静态资源 (js、css、img、fonts) 的;(项目打包之后,静态资源会放在这个文件夹下)
assetsDir
:
'static'
,
assetsDir
:
"static"
,
// 是否开启eslint保存检测,有效值:ture | false | 'error'
lintOnSave
:
process
.
env
.
NODE_ENV
===
'development'
,
lintOnSave
:
process
.
env
.
NODE_ENV
===
"development"
,
// 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
productionSourceMap
:
false
,
// webpack-dev-server 相关配置
devServer
:
{
host
:
'0.0.0.0'
,
host
:
"0.0.0.0"
,
port
:
port
,
open
:
true
,
proxy
:
{
...
...
@@ -38,93 +38,92 @@ module.exports = {
target
:
`http://127.0.0.1:8080`
,
changeOrigin
:
true
,
pathRewrite
:
{
[
'^'
+
process
.
env
.
VUE_APP_BASE_API
]:
''
}
}
[
"^"
+
process
.
env
.
VUE_APP_BASE_API
]:
""
,
}
,
}
,
},
disableHostCheck
:
true
disableHostCheck
:
true
,
},
css
:
{
loaderOptions
:
{
sass
:
{
sassOptions
:
{
outputStyle
:
"expanded"
}
}
}
sassOptions
:
{
outputStyle
:
"expanded"
}
,
}
,
}
,
},
configureWebpack
:
{
name
:
name
,
resolve
:
{
alias
:
{
'@'
:
resolve
(
'src'
)
}
"@"
:
resolve
(
"src"
),
}
,
},
plugins
:
[
// http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
new
CompressionPlugin
({
cache
:
false
,
// 不启用文件缓存
test
:
/
\.(
js|css|html|jpe
?
g|png|gif|svg
)?
$/i
,
// 压缩文件格式
filename
:
'[path][base].gz[query]'
,
// 压缩后的文件名
algorithm
:
'gzip'
,
// 使用gzip压缩
minRatio
:
0.8
,
// 压缩比例,小于 80% 的文件不会被压缩
deleteOriginalAssets
:
false
// 压缩后删除原文件
})
cache
:
false
,
// 不启用文件缓存
test
:
/
\.(
js|css|html|jpe
?
g|png|gif|svg
)?
$/i
,
// 压缩文件格式
filename
:
"[path][base].gz[query]"
,
// 压缩后的文件名
algorithm
:
"gzip"
,
// 使用gzip压缩
minRatio
:
0.8
,
// 压缩比例,小于 80% 的文件不会被压缩
deleteOriginalAssets
:
false
,
// 压缩后删除原文件
})
,
],
},
chainWebpack
(
config
)
{
config
.
plugins
.
delete
(
'preload'
)
// TODO: need test
config
.
plugins
.
delete
(
'prefetch'
)
// TODO: need test
config
.
plugins
.
delete
(
"preload"
);
// TODO: need test
config
.
plugins
.
delete
(
"prefetch"
);
// TODO: need test
// set svg-sprite-loader
config
.
module
.
rule
(
"svg"
).
exclude
.
add
(
resolve
(
"src/assets/icons"
)).
end
();
config
.
module
.
rule
(
'svg'
)
.
exclude
.
add
(
resolve
(
'src/assets/icons'
))
.
end
()
config
.
module
.
rule
(
'icons'
)
.
rule
(
"icons"
)
.
test
(
/
\.
svg$/
)
.
include
.
add
(
resolve
(
'src/assets/icons'
))
.
include
.
add
(
resolve
(
"src/assets/icons"
))
.
end
()
.
use
(
'svg-sprite-loader'
)
.
loader
(
'svg-sprite-loader'
)
.
use
(
"svg-sprite-loader"
)
.
loader
(
"svg-sprite-loader"
)
.
options
({
symbolId
:
'icon-[name]'
symbolId
:
"icon-[name]"
,
})
.
end
()
.
end
()
;
config
.
when
(
process
.
env
.
NODE_ENV
!==
'development'
,
config
=>
{
config
.
plugin
(
'ScriptExtHtmlWebpackPlugin'
)
.
after
(
'html'
)
.
use
(
'script-ext-html-webpack-plugin'
,
[{
config
.
when
(
process
.
env
.
NODE_ENV
!==
"development"
,
(
config
)
=>
{
config
.
plugin
(
"ScriptExtHtmlWebpackPlugin"
)
.
after
(
"html"
)
.
use
(
"script-ext-html-webpack-plugin"
,
[
{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline
:
/runtime
\.
.*
\.
js$/
}])
.
end
()
inline
:
/runtime
\.
.*
\.
js$/
,
},
])
.
end
();
config
.
optimization
.
splitChunks
({
chunks
:
'all'
,
cacheGroups
:
{
libs
:
{
name
:
'chunk-libs'
,
test
:
/
[\\/]
node_modules
[\\/]
/
,
priority
:
10
,
chunks
:
'initial'
// only package third parties that are initially dependent
},
elementUI
:
{
name
:
'chunk-elementUI'
,
// split elementUI into a single package
test
:
/
[\\/]
node_modules
[\\/]
_
?
element-ui
(
.*
)
/
,
// in order to adapt to cnpm
priority
:
20
// the weight needs to be larger than libs and app or it will be packaged into libs or app
},
commons
:
{
name
:
'chunk-commons'
,
test
:
resolve
(
'src/components'
),
// can customize your rules
minChunks
:
3
,
// minimum common number
priority
:
5
,
reuseExistingChunk
:
true
}
}
})
config
.
optimization
.
runtimeChunk
(
'single'
)
})
}
}
config
.
optimization
.
splitChunks
({
chunks
:
"all"
,
cacheGroups
:
{
libs
:
{
name
:
"chunk-libs"
,
test
:
/
[\\/]
node_modules
[\\/]
/
,
priority
:
10
,
chunks
:
"initial"
,
// only package third parties that are initially dependent
},
elementUI
:
{
name
:
"chunk-elementUI"
,
// split elementUI into a single package
test
:
/
[\\/]
node_modules
[\\/]
_
?
element-ui
(
.*
)
/
,
// in order to adapt to cnpm
priority
:
20
,
// the weight needs to be larger than libs and app or it will be packaged into libs or app
},
commons
:
{
name
:
"chunk-commons"
,
test
:
resolve
(
"src/components"
),
// can customize your rules
minChunks
:
3
,
// minimum common number
priority
:
5
,
reuseExistingChunk
:
true
,
},
},
});
config
.
optimization
.
runtimeChunk
(
"single"
);
})
;
}
,
}
;
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment