Skip to content

platform / fanxing_new

Go to a project
Commit 42273f29 by 夏新然
Options

2 11暂替换auth前

1 parent e415fc83
Inline Side-by-side
Showing 23 changed files with 3013 additions and 408 deletions
dist.zip deleted 100644 → 0
No preview for this file type
src/api/apiList.js
......@@ -4,6 +4,8 @@ import task from "./task";
import show from "./show";
import search from "./search";
import device from "./device"
import resource from "./resource"
import ops from "./ops"
let wsIP = "192.168.9.133:20080";
switch (process.env.NODE_ENV) {
case "development":
......@@ -24,5 +26,7 @@ export default {
show,
search,
device,
resource,
ops,
wsIP
};
src/api/axios.js
......@@ -7,9 +7,7 @@ let service = axios.create({
timeout: 60000
})
// 设置 post、put 默认 Content-Type
service.defaults.headers.post['Content-Type'] = 'application/json'
service.defaults.headers.put['Content-Type'] = 'application/json'
// 添加请求拦截器
service.interceptors.request.use(
......@@ -17,12 +15,7 @@ service.interceptors.request.use(
if (store.state.users.atoken) { // 判断是否存在token，如果存在的话，则每个http header都加上token
config.headers.authorization = store.state.users.atoken;
}
if (config.method == 'post') {
config.data = {
...config.data,
_t: Date.parse(new Date()) / 1000
}
} else if (config.method == 'get') {
if (config.method == 'get') {
config.params = {
_t: Date.parse(new Date()) / 1000,
...config.params
......
src/api/login/index.js
......@@ -6,6 +6,9 @@ export default {
login(params,id) {
return api.post(urls.login,params)
},
getMenus(params,id){
return api.get(urls.menus,params)
},
algocombs(params,id){
return api.get(urls.algocombs,params)
},
......@@ -17,5 +20,8 @@ export default {
},
codes(params,id){
return api.get(urls.codes+id+'/codes',params)
}
},
customCode(params,id){
return api.get(urls.customCode,params)
},
}
src/api/login/urls.js
import baseUrl from "../baseUrl";
export default {
login: baseUrl + "/api/v1/devconf_fx/users/login",
login: baseUrl + "/api/v1/auth/users/login",
algocombs: baseUrl + "/api/v1/devconf_fx/algo_combs",
storeconfs: baseUrl + "/api/v1/devconf_fx/store_confs",
cates: baseUrl + "/api/v1/codes/traffic/cates",
codes: baseUrl + "/api/v1/codes/traffic/cates/"
codes: baseUrl + "/api/v1/codes/traffic/cates/",
customCode:baseUrl + "/api/v1/codes/custom/cates",
menus:baseUrl + "/api/v1/auth/menu_tree"
};
src/api/ops/index.js 0 → 100644
import api from '../index'
import baseUrl from '../baseUrl'
export default {
getUserList(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/users`, params)
},
getRoleList(params,id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/roles`, params)
},
addUser(params){
return api.post(`${baseUrl}/api/v1/devconf_fx/users`, params)
},
editUser(params,id) {
return api.post(`${baseUrl}/api/v1/devconf_fx/users/${id}`, params)
},
resetPwd(params,id) {
return api.post(`${baseUrl}/api/v1/devconf_fx/users/${id}/reset`, params)
},
delUser(params,id){
return api.delete(`${baseUrl}/api/v1/devconf_fx/users/${id}`, params)
},
getMenuList(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/menu/list`, params)
},
addRole(params){
return api.post(`${baseUrl}/api/v1/devconf_fx/roles`, params)
},
logList(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/logs`, params)
},
}
\ No newline at end of file
src/api/resource/index.js 0 → 100644
import api from '../index'
import baseUrl from '../baseUrl'
export default {
devs(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs`, params)
},
treeList(params,id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchan_struct`, params)
},
getVideoList(params,id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params)
},
addCode(params,id) {
return api.post(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params)
},
addNode(params,id){
return api.post(`${baseUrl}/api/v1/org`, params)
},
getCode(params,id){
return api.get(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params)
},
editCamera(params,id,unid){
return api.post(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`, params)
},
delCode(params,id,unid){
return api.delete(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`, params)
},
delOrg(params,id){
return api.delete(`${baseUrl}/api/v1/org/${id}`, params)
},
delCamera(params,id,id2){
return api.delete(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params)
},
getCameraTable(params,id,id2){
console.log(id2)
if(id2){
console.log('aa')
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params)
}else{
console.log('bb')
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params)
}
},
editCamera(params,id,id2){
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params)
},
uploadFile(params,id){
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vfile_vchans`, params,{'Content-Type': 'multipart/form-data'})
},
getResource(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/status`, params)
},
getDevsName(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/fx_devs`, params)
},
getStoreConList(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/store_confs`, params)
},
getSubTask(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtasks`, params)
},
delStore(params,id){
return api.delete(`${baseUrl}/api/v1/devconf_fx/store_confs/${id}`, params)
},
}
\ No newline at end of file
src/assets/resetElementCss/index.css
......@@ -15,6 +15,9 @@
.el-input.is-active .el-input__inner, .el-input__inner:focus{
border-color: #3BB7FF;
}
.el-tooltip__popper{
max-width: 300px;
}
/* 下拉框重置 */
.el-select .el-input.is-focus .el-input__inner{
border-color: #3BB7FF;
......
src/assets/scss/common.scss
......@@ -36,6 +36,10 @@ a:active{
display: inline-block;
width: 150px;
}
.maxHeight{
max-height: 400px;
overflow-y: auto;
}
.innnerBox{
padding: 10px;background: #FFFFFF;margin: 10px;
}
......
src/main.js
import Vue from "vue";
import App from "./App.vue";
import ElementUI from "element-ui";
import axios from "axios";
import "element-ui/lib/theme-chalk/index.css";
import router from "./router";
import store from "./store";
......@@ -17,6 +18,7 @@ Vue.prototype.$echarts = echarts;
Vue.prototype.$moment = moment;
Vue.prototype.$buildCode = buildCode;
Vue.prototype.oParse = new XML.ObjTree();
Vue.prototype.axios=axios;
Vue.use(api);
Vue.use(ElementUI, { size: "small", zIndex: 3000 });
Vue.use(resetCss);
......
src/router/index.js
......@@ -121,14 +121,14 @@ export const asyncRouterMap = [
meta: {
icon: "el-icon-location"
},
component: resolve => require(['../views/search/traficflow.vue'], resolve),
component: resolve => require(["../views/search/traficflow.vue"], resolve),
},{
path: "/search/publicFlow",
path: "/search/flow",
name: "公共客流",
meta: {
icon: "el-icon-location"
},
component: resolve => require(['../views/search/publicFlow.vue'], resolve),
component: resolve => require(["../views/search/publicFlow.vue"], resolve),
}
]
},{
......@@ -139,8 +139,70 @@ export const asyncRouterMap = [
icon: "el-icon-location"
},
children: [
{
path: "/resource/video",
name: "视频设备",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/resource/videoEquipment.vue"], resolve),
},
{
path: "/resource/equipment",
name: "分析设备",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/resource/analysis.vue"], resolve),
},
{
path: "/resource/store_confs",
name: "存储配置",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/resource/store_confs.vue"], resolve),
},
]
},{
path: "/ops",
name: "系统运维",
component: resolve => require(["../views/Layout/index.vue"], resolve),
meta: {
icon: "el-icon-location"
},
children: [
{
path: "/ops/equipment_manage",
name: "设备管理",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/ops/equipment_manage"], resolve),
},{
path: "/ops/user_manage",
name: "用户管理",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/ops/user_manage.vue"], resolve),
},{
path: "/ops/role_manage",
name: "角色管理",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/ops/role_manage.vue"], resolve),
},{
path: "/ops/log_manage",
name: "日志管理",
meta: {
icon: "el-icon-location"
},
component: resolve => require(["../views/ops/log_manage.vue"], resolve),
}
]
}
];
const router = new VueRouter({
......
src/views/Login.vue
......@@ -45,20 +45,16 @@ import types from '../store/types.js'
},
login(){
this.$api.login.login({
user_name: this.username,
// user_password: this.password
user_password: sha1(this.password),
"username":this.username,
"password":this.password
}).then(res => {
if(!res.ecode){
this.$store.commit(types.ATOKEN,res.token);
this.$store.commit(types.ATOKEN,res.atoken);
// localStorage.setItem('rtoken',m.data.rtoken)
// localStorage.setItem('user_unid',m.data.role_unid)
// localStorage.setItem('uid',m.data.unid)
localStorage.setItem('menu', JSON.stringify(res.menu_list))
sessionStorage.setItem('user_unid',res.user_unid)
//本系统可以直接用本地缓存做
this.$store.dispatch('GetMenuRole',res.menu_list).then(res => {
this.$router.push('/')
}) //获
this.getMenu(res.user_unid)
// localStorage.setItem('user_name',this.username)
// localStorage.setItem('client_unid',new Date().getTime() + Math.round(Math.random() * 10000000000000))
// localStorage.setItem('past_timer',new Date().getTime() + 24*60*60*10000)
......@@ -69,12 +65,25 @@ import types from '../store/types.js'
this.storeConfList();
//code列表
this.getCodeList();
this.getCustomCode();
this.getEventList();
this.getDev();
}
}).catch((err) => {
})
},
getMenu(id){
//获取菜单
this.$api.login.getMenus({
"app_unid":id
}).then(res=>{
localStorage.setItem('menu', JSON.stringify(res.menu_tree))
this.$store.dispatch('GetMenuRole',res.menu_tree).then(res => {
this.$router.push('/')
})
})
},
algoList() {
this.$api.login.algocombs({
limit: '',
......@@ -114,6 +123,22 @@ import types from '../store/types.js'
}).catch((err) => {
})
},
getCustomCode(){
this.$api.login.customCode().then(res => {
if(res.list_data.length > 0) {
res.list_data.forEach((item) => {
window.localStorage.setItem(item.name + '-' + item.cate, item.unid);
})
} else {
this.$message({
type: 'warning',
message: '获取自定义编码失败!'
})
}
}).catch((err) => {
})
},
getEventList(){
this.$api.search.eventTypes({}).then(res=>{
// 存储code列表
......@@ -124,6 +149,11 @@ import types from '../store/types.js'
})
})
},
getDev() {
this.$api.resource.devs().then(res => {
sessionStorage.setItem('dev_unid',res[0].dev_unid)
})
},
},
watch: {},
mounted() {
......
src/views/ops/equipmentComponents/info.vue 0 → 100644
<template>
</template>
<script>
</script>
<style>
</style>
src/views/ops/equipment_manage.vue 0 → 100644
<template>
<div>
<!-- 外层内容 -->
<div class="leftBox">
<div class="titles">分析设备列表</div>
<div class="treeBox">
<el-tree
:data="treeData"
:props="defaultProps"
accordion
highlight-current
:expand-on-click-node=false
@node-click="handleNodeClick">
</el-tree>
</div>
</div>
<div class="rightBox">
</div>
<div style="clear: both;"></div>
</div>
</template>
<script>
export default{
data(){
return{
treeData: [],
defaultProps: {
children: 'childs',
label: 'device_name'
},
dev_unid:sessionStorage.getItem('dev_unid')
}
},
mounted(){
console.log(this.setvisible)
},
methods:{
getTree(){
this.$api.resource.getDevsName({
is_leaf: 0
},this.dev_unid).then(res=>{
this.treeData=res.list_data;
this.treeData.forEach(item=>{
this.getChild(item.device_id)
})
})
},
getChild(id){
this.$api.resource.getDevsName({
limit: 9999,
offset: 0,
parent_id: id,
},this.dev_unid).then((res)=>{
this.treeData.forEach(item=>{
if(item.device_id==id){
this.treeData.childs=res.list_data
}
})
}).catch((error)=>{
})
},
handleNodeClick(data) {
console.log(data);
},
}
}
</script>
<style scoped="scoped" lang="scss">
.bofangIcon{
cursor: pointer;
color:#cccccc;
font-size:16px;
margin-left: 26px;
}
.moveIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
.leftBox{
width: 233px;
height: 630px;
border:1px solid rgba(229,229,229,1);
float: left;
}
.titles{
height: 30px;
line-height: 30px;
padding-left: 13px;
background: $title-backgroud;
font-size: 14px;
color: $title-color;
}
.treeBox{
padding: 6px;
}
.rightBox{
float: left;
margin-left: 14px;
}
.imgBox{
width: 587px;
height: 330px;
border:1px solid #444444;
margin-bottom: 14px;
}
</style>
src/views/ops/log_manage.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="用户名" >
<span class="inputBox">
<el-input placeholder="请输入用户名" v-model="conditions.username_like"></el-input>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
</el-col>
<div style="">
<el-table
:data="tableData"
height="574"
stripe
border>
<el-table-column
align="center"
prop="num"
:formatter="numFormatter"
label="序号">
</el-table-column>
<el-table-column
prop="log_type"
align="center"
:formatter="typeFormatter"
label="日志类型">
</el-table-column>
<el-table-column
prop="log_time"
align="center"
label="操作时间">
</el-table-column>
<el-table-column
prop="user_name"
align="center"
label="操作用户名">
</el-table-column>
<el-table-column
prop="client_ip"
align="center"
label="操作用户IP地址">
</el-table-column>
<el-table-column
prop="log_content"
align="center"
label="操作内容">
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
let start_dt = this.$moment().format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
username_like:''
},
tableData:[],
total:0,
page:1,
pageSize:30,
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
},
methods:{
numFormatter(row, column, cellValue, index) {
return (index+1)*this.page;
},
typeFormatter(row, column, cellValue, index){
if(cellValue==1){
return '系统日志'
}else if(cellValue==0){
return '操作日志'
}else{
return '无'
}
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
start_time: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
end_time:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
username_like: this.conditions.username_like ? this.conditions.username_like.replace(/\s\s*/g, '') : this.conditions.username_like
}
this.$api.ops.logList(search_params
).then((res)=>{
this.total=res.total_num;
this.tableData = res.list_data;
}).catch((err)=>{
})
},
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/ops/role_manage.vue 0 → 100644
<template>
<div class="contentBox">
<div class="content">
<div style="padding: 20px 15px 20px 23px;">
<span style="float: right;">
<el-button type="info" @click="addRole">添加新用户</el-button>
</span>
<div style="clear: both;"></div>
</div>
<div style="padding: 0 15px 20px 23px;">
<el-table
height="574"
:data="tableData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="num"
:formatter="numFormatter"
label="序号">
</el-table-column>
<el-table-column
align="center"
prop="role_name"
label="角色名">
</el-table-column>
<el-table-column
align="center"
prop="create_dt"
width="300"
label="创建时间">
</el-table-column>
<el-table-column
align="center"
width="300"
prop="operation"
label="操作">
<template slot-scope="scope">
<el-tooltip content="编辑角色" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="editUser(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除角色" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
<!-- 新增 -->
<el-dialog
title="新增用户"
:visible.sync="addVisible"
@open="openAddDialog"
width="30%">
<div class="maxHeight">
<el-form label-position="left" label-width="80px" :model="addForm" :rules="rules" ref="addForm" inline-message hide-required-asterisk>
<el-form-item label="角色名" prop="role_name">
<el-input v-model="addForm.role_name"></el-input>
</el-form-item>
<el-form-item label="权限菜单" prop="menu_unids">
<el-tree
:data="treeData"
@current-change="treeChange"
show-checkbox
ref="addTree"
node-key="menu_unid"
:props="defaultProps">
</el-tree>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addVisible = false">取 消</el-button>
<el-button type="primary" @click="addFun('addForm')">确 定</el-button>
</span>
</el-dialog>
<!-- 编辑 -->
<el-dialog
title="编辑用户"
:visible.sync="editVisible"
width="30%">
<div class="maxHeight">
<el-form label-position="left" label-width="80px" :model="editForm" :rules="rules" ref="editForm" inline-message hide-required-asterisk>
<el-form-item label="角色选项" prop="role_unid">
<el-select v-model="editForm.role_unid" placeholder="请选择" :popper-append-to-body=false>
<el-option
v-for="item in roleList"
:key="item.role_unid"
:label="item.role_name"
:value="item.role_unid">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名" prop="user_name">
<el-input v-model="editForm.user_name"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="editVisible = false">取 消</el-button>
<el-button type="primary" @click="editFun('editForm')">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
var checkRole = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入角色名'));
} else {
callback();
}
};
var checkMenu_unids = (rule, value, callback) => {
if (value.length==0) {
callback(new Error('请至少选择一个权限'));
} else {
callback();
}
};
return{
treeData:[],
defaultProps: {
children: 'childs',
label: 'menu_name'
},
total:0,
page:1,
pageSize:30,
addForm:{
role_name:'',
menu_unids:[]
},
editForm:{
role_name:'',
menu_unids:[]
},
editUnid:'',
tableData: [],
addVisible:false,
editVisible:false,
roleList:[],
userId:sessionStorage.getItem('user_unid'),
rules: {
role_name: [
{ validator: checkRole, trigger: 'change' }
],
menu_unids: [
{ validator: checkMenu_unids, trigger: 'change' }
],
}
}
},
components:{
},
mounted(){
this.getTableList();
this.getMenuList();
},
methods:{
treeChange(data,node){
console.log(data,node)
},
numFormatter(row, column, cellValue, index) {
return (index+1)*this.page;
},
handleSizeChange(val) {
this.pageSize=val;
this.getTableList();
},
handleCurrentChange(val) {
this.page=val;
this.getTableList();
},
getMenuList(){
this.treeData=[];
this.$api.ops.getMenuList({
limit: 9999,
offset: 0,
}).then((res)=>{
this.treeData = res;
}).catch((error)=>{
})
},
getTableList(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
this.$api.ops.getRoleList({
limit: this.pageSize,
offset: offset,
}).then((res)=>{
this.total=res.total_num;
if(res.list_data==null){
this.tableData=[]
}else{
this.tableData=res.list_data;
}
}).catch((error)=>{
})
},
delFun(index,row){
this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.ops.delUser({},row.unid).then(res=>{
if(res.ecode==200){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getTableList();
}else{
this.$message({
type: 'error',
message: '删除失败!'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
editUser(index,row){
this.editForm.role_unid=row.role_unid;
this.editForm.user_name=row.user_name;
this.editUnid=row.unid;
this.editVisible=true;
},
openAddDialog(){
this.$refs['addForm'].resetFields();
},
addRole(){
this.addVisible=true;
},
addFun(formName){
this.addForm.menu_unids=this.$refs.addTree.getCheckedKeys().sort((a, b) => { return a - b; });
this.$refs[formName].validate((valid) => {
if (valid) {
this.$api.ops.addRole(this.addForm).then(res=>{
if(!res.ecode){
this.$message({
type: 'success',
message: '添加成功!'
});
this.addVisible=false;
this.getTableList();
}else{
this.$message({
type: 'error',
message: res.enote
});
}
})
} else {
return false;
}
});
},
editFun(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
this.$api.ops.editUser(this.editForm,this.editUnid).then(res=>{
if(!res.ecode){
this.$message({
type: 'success',
message: '修改成功!'
});
this.editVisible=false;
this.getTableList();
}else{
this.$message({
type: 'error',
message: '修改失败!'
});
}
})
} else {
return false;
}
});
}
},
}
</script>
<style lang="scss" scoped>
.topCon{
background: $white-back-color;
margin-bottom: 12px;
height: 100px;
.left{
display: inline-block;
margin: {
top: 22px;
left: 30px;
};
img{
width:65px ;
height: 55px;
margin-right: 11px;
}
.topText{
font-size:24px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
margin-bottom: 4px;
}
.bottomText{
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.right{
float: right;
.topText{
font-size:28px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
}
.bottomText{
position: relative;
top: -1px;
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.textCon{
display: inline-block;
vertical-align: top;
}
.border{
display: inline-block;
height: 40px;
border: {
left: 2px solid $border-color;
};
}
.rightBox{
margin-top: 14px;
display: inline-block;
img{
margin:{
top:15px;
right: 22px;
}
}
}
.rightBox:nth-of-type(1){
img{
width: 34px;
height: 34px;
}
.textCon{
margin-right:114px ;
}
}
.rightBox:nth-of-type(2){
position: relative;
top: 4px;
img{
width: 40px;
height: 40px;
margin-left: 102px;
}
.textCon{
margin-right:101px ;
}
}
.rightBox:nth-of-type(3){
img{
width: 34px;
height: 35px;
margin-left: 104px;
}
.textCon{
margin-right:184px ;
}
}
}
.content{
background: #FFFFFF;
}
.inputBox{
margin-right: 20px;
}
.selectBox{
margin-right: 20px;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.editIcon2{
cursor: pointer;
color:#87d14b;
font-size:16px;
}
.playIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.pauseIcon{
cursor: pointer;
color:#ffc62e;
font-size:14px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
</style>
\ No newline at end of file
src/views/ops/user_manage.vue 0 → 100644
<template>
<div class="contentBox">
<div class="content">
<div style="padding: 20px 15px 20px 23px;">
<span style="float: right;">
<el-button type="info" @click="addUser">添加新用户</el-button>
</span>
<div style="clear: both;"></div>
</div>
<div style="padding: 0 15px 20px 23px;">
<el-table
height="574"
:data="tableData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="num"
:formatter="numFormatter"
label="序号">
</el-table-column>
<el-table-column
prop="user_name"
align="center"
label="用户名">
</el-table-column>
<el-table-column
align="center"
prop="role_name"
label="角色名">
</el-table-column>
<el-table-column
align="center"
prop="create_dt"
width="300"
label="创建时间">
</el-table-column>
<el-table-column
align="center"
width="300"
prop="operation"
label="操作">
<template slot-scope="scope">
<el-tooltip content="编辑用户" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="editUser(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="重置密码" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon2" @click="reset(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
<!-- 新增 -->
<el-dialog
title="新增用户"
:visible.sync="addVisible"
@open="openAddDialog"
width="30%">
<div>
<el-form label-position="left" label-width="80px" :model="addForm" :rules="rules" ref="addForm" inline-message hide-required-asterisk>
<el-form-item label="角色选项" prop="role_unid">
<el-select v-model="addForm.role_unid" placeholder="请选择" :popper-append-to-body=false>
<el-option
v-for="item in roleList"
:key="item.role_unid"
:label="item.role_name"
:value="item.role_unid">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名" prop="user_name">
<el-input v-model="addForm.user_name"></el-input>
</el-form-item>
<el-form-item label="密码" prop="user_password">
<el-input v-model="addForm.user_password" type="password"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addVisible = false">取 消</el-button>
<el-button type="primary" @click="addFun('addForm')">确 定</el-button>
</span>
</el-dialog>
<!-- 编辑 -->
<el-dialog
title="编辑用户"
:visible.sync="editVisible"
width="30%">
<div>
<el-form label-position="left" label-width="80px" :model="editForm" :rules="rules" ref="editForm" inline-message hide-required-asterisk>
<el-form-item label="角色选项" prop="role_unid">
<el-select v-model="editForm.role_unid" placeholder="请选择" :popper-append-to-body=false>
<el-option
v-for="item in roleList"
:key="item.role_unid"
:label="item.role_name"
:value="item.role_unid">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名" prop="user_name">
<el-input v-model="editForm.user_name"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="editVisible = false">取 消</el-button>
<el-button type="primary" @click="editFun('editForm')">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
var checkRole = (rule, value, callback) => {
if (value === '') {
callback(new Error('请选择角色'));
} else {
callback();
}
};
var checkUser = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入用户名'));
} else {
callback();
}
};
var checkPass = (rule, value, callback) => {
var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
if(!reg.test(value)){
callback(new Error('密码必须包含数字字母大于6位'));
}else{
callback();
}
};
return{
total:0,
page:1,
pageSize:30,
addForm:{
role_unid:'',
user_name:'',
user_password:''
},
editForm:{
role_unid:'',
user_name:'',
},
editUnid:'',
tableData: [],
addVisible:false,
editVisible:false,
roleList:[],
userId:sessionStorage.getItem('user_unid'),
rules: {
role_unid: [
{ validator: checkRole, trigger: 'change' }
],
user_name: [
{ validator: checkUser, trigger: 'change' }
],
user_password: [
{ validator: checkPass, trigger: 'change' }
],
}
}
},
components:{
},
mounted(){
this.getTableList();
this.getRoleList();
},
methods:{
numFormatter(row, column, cellValue, index) {
return (index+1)*this.page;
},
handleSizeChange(val) {
this.pageSize=val;
this.getTableList();
},
handleCurrentChange(val) {
this.page=val;
this.getTableList();
},
getTableList(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
this.$api.ops.getUserList({
limit: this.pageSize,
offset: offset,
}).then((res)=>{
this.total=res.total_num;
if(res.list_data==null){
this.tableData=[]
}else{
this.tableData=res.list_data;
}
}).catch((error)=>{
})
},
getRoleList(){
this.roleList=[];
this.$api.ops.getRoleList({
limit: 9999,
offset: 0,
}).then((res)=>{
if(res.list_data==null){
this.roleList=[]
}else{
this.roleList=res.list_data;
}
}).catch((error)=>{
})
},
delFun(index,row){
this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.ops.delUser({},row.unid).then(res=>{
if(res.ecode==200){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getTableList();
}else{
this.$message({
type: 'error',
message: '删除失败!'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
reset(index,row){
this.$confirm('此操作将重置密码, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.ops.resetPwd({
reset_unid:row.unid
},this.userId).then(res=>{
if(res.ecode==200){
this.$message({
type: 'success',
message: '重置密码成功!'
});
}else{
this.$message({
type: 'error',
message: '重置密码失败!'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消'
});
});
},
editUser(index,row){
this.editForm.role_unid=row.role_unid;
this.editForm.user_name=row.user_name;
this.editUnid=row.unid;
this.editVisible=true;
},
openAddDialog(){
this.$refs['addForm'].resetFields();
},
addUser(){
this.addVisible=true;
},
addFun(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
this.$api.ops.addUser(this.addForm).then(res=>{
if(!res.ecode){
this.$message({
type: 'success',
message: '添加成功!'
});
this.addVisible=false;
this.getTableList();
}else{
this.$message({
type: 'error',
message: '添加失败!'
});
}
})
} else {
return false;
}
});
},
editFun(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
this.$api.ops.editUser(this.editForm,this.editUnid).then(res=>{
if(!res.ecode){
this.$message({
type: 'success',
message: '修改成功!'
});
this.editVisible=false;
this.getTableList();
}else{
this.$message({
type: 'error',
message: '修改失败!'
});
}
})
} else {
return false;
}
});
}
},
}
</script>
<style lang="scss" scoped>
.topCon{
background: $white-back-color;
margin-bottom: 12px;
height: 100px;
.left{
display: inline-block;
margin: {
top: 22px;
left: 30px;
};
img{
width:65px ;
height: 55px;
margin-right: 11px;
}
.topText{
font-size:24px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
margin-bottom: 4px;
}
.bottomText{
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.right{
float: right;
.topText{
font-size:28px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
}
.bottomText{
position: relative;
top: -1px;
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.textCon{
display: inline-block;
vertical-align: top;
}
.border{
display: inline-block;
height: 40px;
border: {
left: 2px solid $border-color;
};
}
.rightBox{
margin-top: 14px;
display: inline-block;
img{
margin:{
top:15px;
right: 22px;
}
}
}
.rightBox:nth-of-type(1){
img{
width: 34px;
height: 34px;
}
.textCon{
margin-right:114px ;
}
}
.rightBox:nth-of-type(2){
position: relative;
top: 4px;
img{
width: 40px;
height: 40px;
margin-left: 102px;
}
.textCon{
margin-right:101px ;
}
}
.rightBox:nth-of-type(3){
img{
width: 34px;
height: 35px;
margin-left: 104px;
}
.textCon{
margin-right:184px ;
}
}
}
.content{
background: #FFFFFF;
}
.inputBox{
margin-right: 20px;
}
.selectBox{
margin-right: 20px;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.editIcon2{
cursor: pointer;
color:#87d14b;
font-size:16px;
}
.playIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.pauseIcon{
cursor: pointer;
color:#ffc62e;
font-size:14px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
</style>
\ No newline at end of file
src/views/resource/analysis.vue 0 → 100644
<template>
<div class="contentBox">
<div class="content">
<div style="padding: 20px 15px 20px 23px;">
<span class="selectBox">
<el-select v-model="selectDevs" placeholder="请选择" @change="devsChange" :popper-append-to-body=false>
<el-option v-for="item in devsList" :value="item.device_id" :label='item.device_name'></el-option>
</el-select>
</span>
<div class="resourceDiv">
<span>图片可用分析资源：{{resource.picture_free}}</span>
<span>图片在用分析资源：{{resource.picture_busy}}</span>
<span>视频可用分析资源：{{resource.video_free}}</span>
<span>视频在用分析资源：{{resource.video_busy}}</span>
</div>
</div>
<div style="padding: 0 15px 20px 23px;">
<el-table
height="574"
:data="tableData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="device_name"
label="设备名称">
</el-table-column>
<el-table-column
prop="in_ip"
align="center"
label="ip地址">
</el-table-column>
<el-table-column
align="center"
prop="online"
:formatter="statusFormatter"
label="在线状态">
</el-table-column>
<el-table-column
align="center"
prop="video_total"
label="分析资源数">
</el-table-column>
<el-table-column
align="center"
prop="video_free"
label="可用分析资源数">
</el-table-column>
<el-table-column
align="center"
prop="working_status"
label="工作状态">
</el-table-column>
<el-table-column
align="center"
width="300"
prop="operation"
label="操作">
<template slot-scope="scope">
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detail(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
<el-dialog title="详情" :visible.sync="detailVisible">
<el-table height="574"
:data="detailData"
stripe
border>
<li>{{detail.online == 1 ? (detail.status.hardWareInfo.temperature[0]?detail.status.hardWareInfo.temperature[0].curTemperature : ''):''}}</li>
<el-table-column prop="device_name" align="center" label="核心板名称"></el-table-column>
<el-table-column prop="in_ip" align="center" label="核心板IP"></el-table-column>
<el-table-column
align="center"
prop="online"
:formatter="statusFormatter"
label="在线状态">
</el-table-column>
<el-table-column prop="cpuUse" align="center" label="CPU使用率" :formatter="cpuUseFormatter"></el-table-column>
<el-table-column prop="cpuTem" align="center" label="CPU温度(℃)" :formatter="cpuTemFormatter"></el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
return{
detailData:[],
dev_unid: sessionStorage.getItem('dev_unid'),
resource:{
picture_busy: 0,
picture_free: 0,
video_busy: 0,
video_free: 0,
},
total:0,
page:1,
pageSize:30,
tableData: [],
devsList:[],
selectDevs:'',
detailVisible:false
}
},
components:{
},
mounted(){
this.getResource();
this.getDevsName();
},
methods:{
devsChange(){
this.getTableList();
},
getResource(){
this.$api.resource.getResource({},this.dev_unid).then(res=>{
this.resource=res.works;
})
},
getDevsName(){
this.$api.resource.getDevsName({
is_leaf: 0
},this.dev_unid).then(res=>{
this.devsList=res.list_data;
if(res.list_data.length>0){
this.selectDevs=res.list_data[0].device_id;
}
this.getTableList();
})
},
statusFormatter(row, column, cellValue, index){
if(cellValue == 1){
return '在线'
}else if(cellValue == 0){
return '离线'
}else {
return '未知'
}
},
cpuUseFormatter(row, column, cellValue, index){
if(row.online == 1){
return parseInt(row.status.hardWareInfo.usedResourceInfo.cpuRatio*60)+'%'
}else{
return ''
}
},
cpuTemFormatter(row, column, cellValue, index){
if(row.online == 1){
if(row.status.hardWareInfo.temperature[0]){
return row.status.hardWareInfo.temperature[0].curTemperature
}else{
return ''
}
}else{
return ''
}
},
handleSizeChange(val) {
this.pageSize=val;
this.getTableList();
},
handleCurrentChange(val) {
this.page=val;
this.getTableList();
},
getTableList(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
this.$api.resource.getDevsName({
limit: this.pageSize,
offset: offset,
parent_id: this.selectDevs,
},this.dev_unid).then((res)=>{
this.total=res.total_num;
if(res.list_data==null){
this.tableData=[]
}else{
this.tableData=res.list_data;
}
}).catch((error)=>{
})
},
detail(index,row){
this.detailData=[];
this.detailVisible=true;
this.$api.resource.getDevsName({
parent_id:row.device_id,
offset: 0,
limit: 10000,
},this.dev_unid).then(res=>{
this.detailData=res.list_data;
this.detailData.unshift(row)
})
},
},
}
</script>
<style lang="scss" scoped>
.topCon{
background: $white-back-color;
margin-bottom: 12px;
height: 100px;
.left{
display: inline-block;
margin: {
top: 22px;
left: 30px;
};
img{
width:65px ;
height: 55px;
margin-right: 11px;
}
.topText{
font-size:24px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
margin-bottom: 4px;
}
.bottomText{
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.right{
float: right;
.topText{
font-size:28px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
}
.bottomText{
position: relative;
top: -1px;
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.textCon{
display: inline-block;
vertical-align: top;
}
.border{
display: inline-block;
height: 40px;
border: {
left: 2px solid $border-color;
};
}
.rightBox{
margin-top: 14px;
display: inline-block;
img{
margin:{
top:15px;
right: 22px;
}
}
}
.rightBox:nth-of-type(1){
img{
width: 34px;
height: 34px;
}
.textCon{
margin-right:114px ;
}
}
.rightBox:nth-of-type(2){
position: relative;
top: 4px;
img{
width: 40px;
height: 40px;
margin-left: 102px;
}
.textCon{
margin-right:101px ;
}
}
.rightBox:nth-of-type(3){
img{
width: 34px;
height: 35px;
margin-left: 104px;
}
.textCon{
margin-right:184px ;
}
}
}
.resourceDiv{
display: inline-block;
margin-left: 10%;
span{
margin-right: 5%;
}
}
.content{
background: #FFFFFF;
}
.inputBox{
margin-right: 20px;
}
.selectBox{
margin-right: 20px;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.editIcon2{
cursor: pointer;
color:#87d14b;
font-size:16px;
}
.playIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.pauseIcon{
cursor: pointer;
color:#ffc62e;
font-size:14px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
</style>
\ No newline at end of file
src/views/resource/store_confs.vue 0 → 100644
<template>
<div class="contentBox">
<div class="content">
<div style="padding: 20px 15px 20px 23px;">
<span class="inputBox">
<el-input v-model="storename" placeholder="请输入存储配置名称"></el-input>
</span>
<el-button type="primary" style="position: relative;top: -2px;" @click="query">查询</el-button>
<span style="float: right;">
<el-button type="info" icon="el-icon-search" @click="add">添加</el-button>
</span>
</div>
<div style="padding: 0 15px 20px 23px;">
<el-table
height="574"
:data="tableData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="create_dt"
align="center"
label="上传时间">
</el-table-column>
<el-table-column
align="center"
prop="task_list"
label="应用任务">
<template slot-scope="scope">
<el-tooltip :content="scope.row.ellipsis" placement="bottom" effect="light" :visible-arrow=false>
<span class="ellipsis">{{scope.row.ellipsis}}</span>
</el-tooltip>
</template>
</el-table-column>
<el-table-column
align="center"
width="300"
prop="operation"
label="操作">
<template slot-scope="scope">
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detail(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
<el-dialog title="详情" :visible.sync="detailVisible" width="30%">
<div class="title">任务列表</div>
<div class="maxHeight">
<el-tree
:props="props"
:load="loadNode"
lazy>
</el-tree>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
return{
props: {
label: 'name',
children: 'child',
isLeaf: 'leaf'
},
detailData:[],
dev_unid: sessionStorage.getItem('dev_unid'),
resource:{
picture_busy: 0,
picture_free: 0,
video_busy: 0,
video_free: 0,
},
total:0,
page:1,
pageSize:30,
tableData: [],
devsList:[],
selectDevs:'',
detailVisible:false,
storename:'',
curentSubList:[]
}
},
components:{
},
mounted(){
this.query();
},
methods:{
loadNode(node, resolve) {
if (node.level === 0) {
return resolve(this.curentSubList);
}
if (node.level > 1) return resolve([]);
this.$api.resource.getSubTask({},node.data.unid).then(res=>{
if(res.list_data==null){
res.list_data=[];
}
res.list_data.forEach(item=>{
item.name=item.subtask_name;
item['leaf']=true;
})
resolve(res.list_data)
})
},
query(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
this.$api.resource.getStoreConList({
limit: this.pageSize,
offset: offset,
name__like: this.storename,
},this.dev_unid).then((res)=>{
this.total=res.total_num;
if(res.list_data==null){
this.tableData=[]
}else{
this.tableData=res.list_data;
}
this.tableData.forEach(list=>{
let ellipsisText='';
list.task_list.forEach(item=>{
ellipsisText+=item.name+','
})
ellipsisText=ellipsisText.substring(0,ellipsisText.length-1);
list['ellipsis']=ellipsisText;
//树状图有子节点
list['leaf']=false;
})
console.log(this.tableData)
}).catch((error)=>{
})
},
add(){
},
taskFormatter(row, column, cellValue, index){
let columnText='';
row.task_list.forEach(item=>{
columnText+=item.name+','
})
columnText=columnText.substring(0,columnText.length-1);
return columnText
},
handleSizeChange(val) {
this.pageSize=val;
this.query();
},
handleCurrentChange(val) {
this.page=val;
this.query();
},
detail(index,row){
this.detailVisible=true;
this.curentSubList=[];
this.curentSubList=row.task_list;
},
delFun(index,row){
this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.resource.delStore({},row.unid).then(res=>{
if(res.ecode==200){
this.$message({
type: 'success',
message: '删除成功!'
});
this.query();
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
},
}
</script>
<style lang="scss" scoped>
.topCon{
background: $white-back-color;
margin-bottom: 12px;
height: 100px;
.left{
display: inline-block;
margin: {
top: 22px;
left: 30px;
};
img{
width:65px ;
height: 55px;
margin-right: 11px;
}
.topText{
font-size:24px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
margin-bottom: 4px;
}
.bottomText{
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.right{
float: right;
.topText{
font-size:28px;
font-family:MicrosoftYaHeiUI-Bold,MicrosoftYaHeiUI;
font-weight:bold;
}
.bottomText{
position: relative;
top: -1px;
font-size:14px;
font-family:MicrosoftYaHeiUI;
}
}
.textCon{
display: inline-block;
vertical-align: top;
}
.border{
display: inline-block;
height: 40px;
border: {
left: 2px solid $border-color;
};
}
.rightBox{
margin-top: 14px;
display: inline-block;
img{
margin:{
top:15px;
right: 22px;
}
}
}
.rightBox:nth-of-type(1){
img{
width: 34px;
height: 34px;
}
.textCon{
margin-right:114px ;
}
}
.rightBox:nth-of-type(2){
position: relative;
top: 4px;
img{
width: 40px;
height: 40px;
margin-left: 102px;
}
.textCon{
margin-right:101px ;
}
}
.rightBox:nth-of-type(3){
img{
width: 34px;
height: 35px;
margin-left: 104px;
}
.textCon{
margin-right:184px ;
}
}
}
.title{
font-size: 18px;
margin-bottom: 6px;
}
.maxHeight{
max-height: 400px;
overflow-y: auto;
}
.ellipsis{
display: inline-block;
width: 200px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
.resourceDiv{
display: inline-block;
margin-left: 10%;
span{
margin-right: 5%;
}
}
.content{
background: #FFFFFF;
}
.inputBox{
margin-right: 20px;
}
.selectBox{
margin-right: 20px;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.editIcon2{
cursor: pointer;
color:#87d14b;
font-size:16px;
}
.playIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.pauseIcon{
cursor: pointer;
color:#ffc62e;
font-size:14px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
</style>
\ No newline at end of file
src/views/resource/treeComponents/cameraDialog.vue 0 → 100644
<template>
<div>
<!-- 添加相机 -->
<el-dialog
title="添加相机"
:visible.sync="cameraAddVisible"
width="450px">
<div>
<el-form label-position="left" label-width="120px" :model="addVideoParam" :rules="rules" ref="cameraDialog" inline-message hide-required-asterisk>
<el-form-item label="组织编号">
<el-input v-model="initParam.orgId" disabled></el-input>
</el-form-item>
<el-form-item label="组织名称">
<el-input v-model="initParam.orgName" disabled></el-input>
</el-form-item>
<el-form-item label="地点编号">
<el-input v-model="initParam.addr_code" disabled></el-input>
</el-form-item>
<el-form-item label="地点名称">
<el-input v-model="initParam.addr_name" disabled></el-input>
</el-form-item>
<el-form-item label="设备编号" prop="vchan_refid">
<el-input v-model="addVideoParam.vchan_refid" :disabled="type=='edit'"></el-input>
</el-form-item>
<el-form-item label="设备名称" prop="name">
<el-input v-model="addVideoParam.name"></el-input>
</el-form-item>
<el-form-item label="方向">
<el-select v-model="addVideoParam.dir_code" placeholder="请选择方向" :popper-append-to-body=false>
<el-option :key="item.code" :label="item.name" :value="item.code" v-for="item in dirCodeList"></el-option>
</el-select>
</el-form-item>
<el-form-item label="IP地址">
<el-input v-model="addVideoParam.ip"></el-input>
</el-form-item>
<el-form-item label="端口" prop="port">
<el-input v-model="addVideoParam.port"></el-input>
</el-form-item>
<el-form-item label="协议">
<el-select v-model="addVideoParam.video_protocol_id" placeholder="请选择协议" :popper-append-to-body=false>
<el-option label="rtsp" value="rtsp"></el-option>
<el-option label="onvif" value="onvif"></el-option>
</el-select>
</el-form-item>
<el-form-item label="取流地址" prop="video_source_url">
<el-input v-model="addVideoParam.video_source_url"></el-input>
</el-form-item>
<el-form-item label="用户名">
<el-input v-model="addVideoParam.user_name"></el-input>
</el-form-item>
<el-form-item label="密码">
<el-input v-model="addVideoParam.password"></el-input>
</el-form-item>
<el-form-item label="扩展字段1">
<el-input v-model="addVideoParam.extend_1"></el-input>
</el-form-item>
<el-form-item label="扩展字段2">
<el-input v-model="addVideoParam.extend_2"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="cameraAddVisible=false">取 消</el-button>
<el-button type="primary" @click="save" v-if="type!='detail'">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default{
data(){
return{
addVideoParam:{
vchan_refid:'',
name:'',
port:'',
video_source_url:'',
addr_unid:'',
dir_code:'',
ip:'',
video_protocol_id:'',
user_name:'',
password:'',
extend_1:'',
extend_2:'',
is_dome:false,
vchan_type:'camera'
},
initParam:{
},
cameraAddVisible:false,
dirCodeList:JSON.parse(localStorage.getItem('卡口方向')),
type:'',
devsId:'',
rules: {
vchan_refid: [
{ required: true, message: '设备编号不能为空', trigger: 'change' }
],
name:[
{ required: true, message: '设备名称不能为空', trigger: 'change' }
],
port:[
{ required: true, message: '端口不能为空', trigger: 'change' }
],
video_source_url:[
{ required: true, message: '取流地址不能为空', trigger: 'change' }
]
}
}
},
methods:{
initDialog(node,type,devsId){
this.cameraAddVisible=true;
this.devsId=devsId;
if(type == 'add'){
this.type='add'
this.addVideoParam.addr_unid=node.data.unid;
this.initParam.addr_name = node.data.org_name;
this.initParam.addr_code = node.data.org_code;
this.initParam.orgName = node.parent.data.org_name;
this.initParam.orgId = node.parent.data.org_code;
}else if(type == 'edit'){
this.type = 'edit';
this.addVideoParam.addr_unid = node.addrNode.unid;
this.initParam.addr_name = node.addrNode.org_name;
this.initParam.addr_code = node.addrNode.org_code;
this.initParam.orgName = node.orgNode.org_name;
this.initParam.orgId = node.orgNode.org_code;
this.addVideoParam.vchan_refid = node.id;
this.addVideoParam.name = node.label;
this.addVideoParam.dir_code=node.dir_code;
this.addVideoParam.ip=node.ip;
this.addVideoParam.port=node.port;
this.addVideoParam.video_protocol_id=node.video_proto;
this.addVideoParam.video_source_url=node.url;
this.addVideoParam.user_name=node.username;
this.addVideoParam.password=node.password;
this.addVideoParam.extend_1=node.extend_1;
this.addVideoParam.extend_2=node.extend_2;
}else if(type == 'detail'){
this.type = 'detail';
this.addVideoParam.addr_unid = node.addrNode.unid;
this.initParam.addr_name = node.addrNode.org_name;
this.initParam.addr_code = node.addrNode.org_code;
this.initParam.orgName = node.orgNode.org_name;
this.initParam.orgId = node.orgNode.org_code;
this.addVideoParam.vchan_refid = node.id;
this.addVideoParam.name = node.label;
this.addVideoParam.dir_code=node.dir_code;
this.addVideoParam.ip=node.ip;
this.addVideoParam.port=node.port;
this.addVideoParam.video_protocol_id=node.video_proto;
this.addVideoParam.video_source_url=node.url;
this.addVideoParam.user_name=node.username;
this.addVideoParam.password=node.password;
this.addVideoParam.extend_1=node.extend_1;
this.addVideoParam.extend_2=node.extend_2;
}
},
save(){
if(this.type == 'add'){
this.$refs['cameraDialog'].validate((valid) => {
if (valid) {
this.$api.resource.addCamera(this.addVideoParam,this.devsId).then(res=>{
if(res.ecode==200){
this.$message({
message: res.enote,
type: 'success'
});
let data={
org_type:"address",
unid:this.addVideoParam.addr_unid
}
this.$parent.submitLaterGet(data)
this.cameraAddVisible=false;
}else{
this.$message.error(res.enote);
}
})
} else {
console.log('error submit!!');
return false;
}
});
}else if(this.type == 'edit'){
this.addVideoParam.is_dome=false;
this.$refs['cameraDialog'].validate((valid) => {
if (valid) {
this.$api.resource.editCamera(this.addVideoParam,this.devsId,this.addVideoParam.vchan_refid).then(res=>{
if(res.ecode==200){
this.$message({
message: res.enote,
type: 'success'
});
let data={
org_type:"address",
unid:this.addVideoParam.addr_unid
}
this.$parent.submitLaterGet(data)
this.cameraAddVisible=false;
}else{
this.$message.error(res.enote);
}
})
} else {
console.log('error submit!!');
return false;
}
});
}
}
}
}
</script>
<style>
</style>
src/views/resource/treeComponents/cameraTree.vue
......@@ -2,88 +2,300 @@
<div>
<el-tree
class="filter-tree"
:data="data"
:props="defaultProps"
:data="treeData"
:props='defaultProps'
default-expand-all
@node-click="handleNodeClick"
:expand-on-click-node="false"
:filter-node-method="filterNode"
ref="tree">
<span class="custom-tree-node" slot-scope="{ node, data }">
<span>
<span class="tree-label">{{ data.label }}</span>
<span class="tree-label" v-if="data.org_name||data.org_name==''">{{ data.org_name=="" ? '未命名' : data.org_name}}</span>
<span class="tree-label" v-else-if="!data.org_name">{{ data.vchan_name=="" ? '未命名' : data.vchan_name}}</span>
</span>
<span class="tree-btn">
<i class="el-icon-plus" @click.stop="nodeAdd(node,data)"></i>
<i class="el-icon-edit" @click.stop="nodeEdit(node,data)"></i>
<i class="el-icon-delete" @click.stop="nodeDel(node,data)"></i>
<span class="tree-btn" v-if="data.org_name||data.org_name==''">
<i class="el-icon-plus" @click.stop="nodeAddClick(node,data)"></i>
<i class="el-icon-edit" @click.stop="nodeEditClick(node,data)" v-if="data.org_type!='root'"></i>
<i class="el-icon-delete" @click.stop="nodeDelClick(node,data)" v-if="data.org_type!='root'"></i>
</span>
</span>
</el-tree>
<el-dialog
title="添加"
:visible.sync="addVisible"
width="450px">
<div>
<el-form label-position="left" label-width="120px" :model="formData">
<el-form-item label="添加目标类型">
<el-select v-model="formData.targetType" placeholder="请选择" :popper-append-to-body=false>
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in targetOpt"> </el-option>
</el-select>
</el-form-item>
<div v-if="formData.targetType=='org'">
<el-form-item label="组织编号">
<el-input v-model="formData.code"></el-input>
</el-form-item>
<el-form-item label="组织名称">
<el-input v-model="formData.name"></el-input>
</el-form-item>
</div>
<div v-else-if="formData.targetType=='address'">
<el-form-item label="地点编号">
<el-input v-model="formData.code"></el-input>
</el-form-item>
<el-form-item label="地点名称">
<el-input v-model="formData.name"></el-input>
</el-form-item>
</div>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addVisible=false">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</span>
</el-dialog>
<!-- 编辑dialog -->
<el-dialog
title="修改"
:visible.sync="editVisible"
width="450px">
<div>
<el-form label-position="left" label-width="120px" :model="editForm">
<div v-if="editForm.targetType=='org'">
<el-form-item label="组织编号">
<el-input v-model="editForm.code" disabled></el-input>
</el-form-item>
<el-form-item label="组织名称">
<el-input v-model="editForm.name"></el-input>
</el-form-item>
</div>
<div v-else-if="editForm.targetType=='address'">
<el-form-item label="地点编号">
<el-input v-model="editForm.code" disabled></el-input>
</el-form-item>
<el-form-item label="地点名称">
<el-input v-model="editForm.name"></el-input>
</el-form-item>
</div>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="editVisible=false">取 消</el-button>
<el-button type="primary" @click="editFinish">确 定</el-button>
</span>
</el-dialog>
<addCamera ref="addCamera"></addCamera>
</div>
</template>
<script>
import addCamera from './cameraDialog'
export default{
data(){
return{
data: [{
id: 1,
label: '一级 1',
children: [{
id: 4,
label: '二级 1-1',
children: [{
id: 9,
label: '三级 1-1-1'
}, {
id: 10,
label: '三级 1-1-2'
}]
}]
}, {
id: 2,
label: '一级 2',
children: [{
id: 5,
label: '二级 2-1'
}, {
id: 6,
label: '二级 2-2'
}]
}, {
id: 3,
label: '一级 3',
children: [{
id: 7,
label: '二级 3-1'
}, {
id: 8,
label: '二级 3-2'
}]
}],
defaultProps: {
children: 'children',
label: 'label'
formData:{
targetType:'org'
},
editForm:{
targetType:'',
name:'',
code:''
},
addVideoParam:{
},
treeData: [
{
unid: '0',
org_pid: '0',
org_name: '手动添加相机资源',
org_type: 'root',
childs: []
}
],
currentNodeId:'',
defaultProps:{
children: "childs",
disabled: "disabled",
label: "org_name"
},
addVisible:false,
editVisible:false,
targetOpt:[],
}
},
components:{
addCamera
},
props:{
filterText:{
type:String,
default:false
default:''
},
treeDatas:{
type:Array,
defalut:[]
},
},
watch:{
filterText(val) {
this.$refs.tree.filter(val);
},
treeDatas(val){
this.treeData[0].childs=val;
}
},
methods:{
nodeAdd(node,data){
console.log(node,data)
handleNodeClick(data){
this.$parent.$parent.getTable(data,'camera')
},
nodeDelClick(node,data){
this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let cate_unid = this.getCustomCate('组织', 'residence');
this.$api.resource.getCode({
limit:9999
},cate_unid).then(res=>{
let editObj=[];
editObj=res.list_data.filter(item => item.code==data.org_code);
this.$api.resource.delCode({},cate_unid,editObj[0].unid).then(res=>{
})
this.$api.resource.delOrg({},data.unid).then(res=>{
if(!res.enote){
this.$message({
type: 'success',
message: '删除成功!'
});
this.$parent.$parent.getCameraTree();
}
})
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
nodeEditClick(node,data){
this.editForm.targetType=data.org_type;
this.editForm.code=data.org_code;
this.editForm.name=data.org_name;
this.editVisible=true;
},
editFinish(){
let cate_unid = this.getCustomCate('组织', 'residence');
this.$api.resource.getCode({
limit:9999
},cate_unid).then(res=>{
let editObj=[];
editObj=res.list_data.filter(item => item.code==this.editForm.code);
this.$api.resource.editCamera({
name:this.editForm.name,
code:this.editForm.code
},cate_unid,editObj[0].unid).then(data=>{
if(res.ecode) {
this.$message({
type: 'error',
message: res.enote
})
} else {
this.editVisible=false;
this.$parent.$parent.getCameraTree();
}
})
})
},
nodeAddClick(node,data){
if(data.org_type == 'address'){
//添加视频
this.$refs.addCamera.initDialog(node,'add',this.devsId)
}else{
//添加组织关系
this.currentNodeId=data.unid;
this.formData={
targetType:'org',
name:'',
code:''
}
if(data.org_type === "root") {
this.targetOpt = [{
label: '组织',
value: 'org'
}];
} else if(data.org_type === "org") {
this.targetOpt = [{
label: '组织',
value: 'org'
},{
label: '地点',
value: 'address'
}];
} else {
this.targetOpt = [{
label: '地点',
value: 'address'
}];
}
this.addVisible=true;
}
},
getCustomCate(name, cate) {
let localKey = name + '-' + cate;
return window.localStorage.getItem(localKey);
},
save(){
let cate_unid = this.getCustomCate('组织', 'residence');
// console.log('添加节点分类unid:', cate_unid);
if(cate_unid) {
this.$api.resource.addCode({
code: this.formData.code,
name: this.formData.name
},cate_unid).then(res=>{
if(res.ecode) {
this.$message({
type: 'error',
message: res.enote
})
} else {
this.orgServ(); // org service
}
})
}
},
orgServ() {
this.$api.resource.addNode({
org_pid: this.currentNodeId,
org_type: this.formData.targetType,
org_code: this.formData.code,
is_leaf: false
}).then(res=>{
if(res.ecode) {
this.$message({
type: 'error',
message: res.enote
})
} else {
this.$message({
type: 'success',
message: '添加成功!'
})
this.addVisible = false;
this.$parent.$parent.getCameraTree();
}
})
},
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
return data.org_name.indexOf(value) !== -1;
},
}
}
......
src/views/resource/treeComponents/videoTree.vue 0 → 100644
<template>
<div>
<el-tree
class="filter-tree"
:data="treeData"
:props='defaultProps'
default-expand-all
@node-click="handleNodeClick"
:expand-on-click-node="false"
:filter-node-method="filterNode"
ref="tree">
<span class="custom-tree-node" slot-scope="{ node, data }">
<span>
<span class="tree-label">{{ data.vchan_name=="" ? '未命名' : data.vchan_name}}</span>
</span>
<span class="tree-btn" v-if="data.org_type">
<i class="el-icon-plus" @click.stop="nodeAddClick(node,data)"></i>
</span>
</span>
</el-tree>
<el-dialog
title="添加"
:visible.sync="addVisible"
width="450px">
<div>
<el-form label-position="left" label-width="120px">
<el-form-item label="添加录像">
<el-upload
ref="upload"
action="uploadUrl"
:http-request="httpRequest"
multiple
:data="uploadData"
name="file"
:auto-upload="false">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<!-- <div slot="tip" class="el-upload__tip">只能上传视频文件</div> -->
</el-upload>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addVisible=false">取 消</el-button>
<el-button type="primary" @click="save">上 传</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import baseUrl from '../../../api/baseUrl'
export default{
data(){
return{
uploadUrl: '',
file:[],
treeData: [
{
unid: '0',
org_pid: '0',
vchan_name: '手动添加录像资源',
org_type: 'root',
childs: []
}
],
uploadData:{
vchan_type:'vfile',
vchan_refid:new Date().getTime()
},
defaultProps:{
children: "childs",
disabled: "disabled",
label: "vchan_name"
},
addVisible:false,
}
},
components:{
},
props:{
filterText:{
type:String,
default:''
},
treeDatas:{
type:Array,
defalut:[]
},
devsId:{
type:String,
default:''
}
},
watch:{
filterText(val) {
this.$refs.tree.filter(val);
},
treeDatas(val){
this.treeData[0].childs=val;
},
devsId(val){
this.devsId=val;
}
},
methods:{
// 自定义的上传函数
httpRequest(param) {
this.file=[];
// 一般情况下是在这里创建FormData对象，但我们需要上传多个文件，为避免发送多次请求，因此在这里只进行文件的获取，param可以拿到文件上传的所有信息
this.file.push(param.file)
},
handleNodeClick(data){
this.$parent.$parent.getVideoTable(data,'video')
},
nodeAddClick(node,data){
this.addVisible=true;
},
save(){
this.$refs.upload.submit(); // 这里是执行文件上传的函数，其实也就是获取我们要上传的文件
// 最重要的就是这段代码
var upData = new FormData() // 首先创建FormData对象
this.file.forEach(function (file) {
upData.append('file', file); // 因为要上传多个文件，所以需要遍历一下才行
upData.append('name', file.name);
upData.append('vchan_type', 'vfile');
upData.append('vchan_refid', '11111111');
})
console.log(upData.getAll('file'))
// this.axios.post('http://192.168.9.133:20080/api/v1/devconf_fx/devs/'+this.devsId+'/vfile_vchans', upData, {
// headers: {
// 'Content-Type': 'multipart/form-data',
// },
// }).then(res => {
// console.log(res);
// }).catch(err => {
// console.log(err);
// });
this.$api.resource.uploadFile(upData,this.devsId).then(res=>{
console.log(res)
})
},
filterNode(value, data) {
if (!value) return true;
return data.org_name.indexOf(value) !== -1;
},
}
}
</script>
<style>
</style>
src/views/resource/videoEquipment.vue
<template>
<div class="innnerBox">
<el-col :span="4">
<el-input class="search-input"
prefix-icon="el-icon-search"
placeholder="请输入内容"
v-model="searchText"
>
<el-input class="search-input" prefix-icon="el-icon-search" placeholder="请输入内容" v-model="searchText">
</el-input>
<cameraTree :filterText="searchText"></cameraTree>
<cameraTree :filterText="searchText" :treeDatas="cameraTree"></cameraTree>
<videoTree :filterText="searchText" :treeDatas="videoTree" :devsId="dev_unid"></videoTree>
</el-col>
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="资源类型" >
<span class="inputBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.source_type">
<el-option value="pull_video_stream" label='拉取视频'></el-option>
<el-option value="pull_pic_files" label='拉取图片'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="事件类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.type">
<el-option value="" label="全部"></el-option>
<el-option v-for='item in eventList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="任务名称">
<span class="inputBox">
<el-input placeholder="请输入任务名称" v-model="conditions.task_name"></el-input>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
prop="event_type"
align="center"
label="事件类型">
</el-table-column>
<el-table-column
prop="task_name"
align="center"
label="任务名称">
</el-table-column>
<el-table-column
align="center"
label="地点">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data">{{scope.row.event_data.locate_name}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="面积(㎡)">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].area}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="人数(个)">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].count}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="进入阈值">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].max_len}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="离开阈值">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].normal_len}}</span>
</div>
</template>
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="抓拍时间">
<template slot-scope="scope">
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
align="center"
label="车道号">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.event_data.lane.number}}</span>
</div>
</template>
<el-col :span="20">
<el-table :data="formattterData" height="574" stripe border v-if="tableType=='camera'">
<el-table-column prop="label" align="center" label="名称">
</el-table-column>
<el-table-column
align="center"
label="方向类型">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data &&scope.row.event_type !=='jinggaidiushi'&&scope.row.event_type !=='daobantingche'">{{scope.row.direction_text}}</span>
</div>
</template>
<el-table-column prop="url" align="center" label="取流地址">
</el-table-column>
<el-table-column
align="center"
label="车道类型">
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.lane_text}}</span>
</div>
<el-tooltip content="修改" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="editFun(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false >
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
<el-table-column
align="center"
label="事件发生时间">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{$moment($moment.utc(scope.row.event_data.start_dt).format()).local().format('YYYY-MM-DD HH:mm:ss')}}</span>
</div>
</template>
</el-table>
<el-table :data="formattterData" height="574" stripe border v-else-if="tableType=='video'">
<el-table-column prop="vchan_name" align="center" label="名称">
</el-table-column>
<el-table-column
align="center"
label="事件结束时间">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{$moment($moment.utc(scope.row.event_data.end_dt).format()).local().format('YYYY-MM-DD HH:mm:ss')}}</span>
</div>
</template>
<el-table-column prop="video_url" align="center" label="取流地址">
</el-table-column>
<el-table-column
align="center"
label="操作">
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-tooltip content="播放" placement="bottom" effect="light" :visible-arrow=false>
<span :class="{'iconfont icon-bofang playIcon':true,'no-btn':scope.row.video&&scope.row.video[0].src_url!=''?false:true}" @click="playFun(scope.$index, scope.row)"></span>
<el-tooltip content="修改" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="editVideo(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delVideo(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="经过日期:">
<span>{{ detailObj.shoot_date ? detailObj.shoot_date : '' }}</span>
</el-form-item>
<el-form-item label="经过时间:">
<span>{{ detailObj.shoot_time ? detailObj.shoot_time : '' }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="事件类型:">
<span>{{ detailObj.event_type }}</span>
</el-form-item>
</div>
</el-form>
</div>
<div class="rightArrow" @click="rightFun"><i class="el-icon-d-arrow-right"></i></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
<curVideo ref="visableDialog" :playersrc="playurl"></curVideo>
</el-col>
<cameraDialog ref="editCamera"></cameraDialog>
</div>
</template>
<script>
import videoDialog from '@/components/video'
import cameraTree from './treeComponents/cameraTree'
import videoTree from './treeComponents/videoTree'
import cameraDialog from './treeComponents/cameraDialog'
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
data() {
return {
searchText: '',
detailObj:{},
carImg:require("@/assets/img/home/defaultImg.png"),
detailImg:'',
detailVisible:false,
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
type: '',
source_type:'',
task_name:''
},
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0,
eventList:JSON.parse(window.localStorage.getItem('安防事件')),
playurl:''
detailObj: {},
detailImg: '',
detailVisible: false,
tableType:'camera',
tableData: [],
formattterData: [],
selectcheck: [],
currentIndex: 0,
eventList: JSON.parse(window.localStorage.getItem('安防事件')),
playurl: '',
dev_unid: sessionStorage.getItem('dev_unid'),
cameraArr:[],
cameraTree:[],
videoTree:[]
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
watch: {
},
components:{
videoDialog,cameraTree
components: {
cameraTree,cameraDialog,videoTree
},
mounted(){
this.getData()
mounted() {
this.getCameraTree();
this.getVideoTree();
},
methods:{
exportFun(){
window.open(
encodeURI(
process.env.VUE_APP_URL+
"/api/v1/behavior/events/export?s=" + Math.random()+
'&event_dt__gte='+ this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&task_name='+this.conditions.task_name+
'&event_type='+this.conditions.type
)
);
methods: {
getCameraTree(){
this.tableType='camera'
this.$api.resource.treeList({
vchan_type: "camera"
},this.dev_unid).then(res=>{
this.cameraTree=res.vchan_struct;
this.cameraArr=[];
this.cameraBuildTree(res.vchan_struct)
})
},
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
getVideoTree(){
this.tableType='video'
this.$api.resource.getVideoList({
vchan_type: "vfile"
},this.dev_unid).then(res=>{
this.videoTree=res.list_data;
})
},
submitLaterGet(data){
this.tableType='camera'
this.$api.resource.treeList({
vchan_type: "camera"
},this.dev_unid).then(res=>{
this.cameraTree=res.vchan_struct;
this.cameraArr=[];
this.cameraBuildTree(res.vchan_struct);
this.getTable(data)
})
},
//处理树状图数据
cameraBuildTree(data, orgObject, addrObject) { // 获取相机资源
let newData = [];
for (var i = 0; i < data.length; i++) {
let obj = {};
if(data[i].org_type === 'org' || data[i].org_type === 'address') {
obj['id'] = data[i].org_code;
obj['unid'] = data[i].unid;
obj['label'] = data[i].org_name === '' ? '未命名' : data[i].org_name;
obj['url'] = '暂无';
obj['root'] = '手动添加相机资源';
obj['pid'] = data[i].org_pid;
obj['type'] = data[i].org_type;
if(data[i].childs) {
if(data[i].org_type === 'org') {
obj['children'] = this.cameraBuildTree(data[i].childs, data[i], addrObject);
} else {
obj['children'] = this.cameraBuildTree(data[i].childs, orgObject, data[i]);
}
} else {
obj['children'] = [];
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
} else if(data[i].vchan_type === 'camera') {
obj['id'] = data[i].vchan_refid;
obj['label'] = data[i].vchan_name === '' ? '未命名' : data[i].vchan_name;
obj['type'] = data[i].vchan_type;
obj['root'] = '手动添加相机资源';
obj['orgNode'] = orgObject;
obj['addrNode'] = addrObject;
obj['dir_code'] = data[i].dir_code;
obj['dir_name'] = data[i].dir_name;
obj['ip'] = data[i].ip;
obj['port'] = data[i].port;
obj['video_proto'] = data[i].video_proto;
obj['url'] = data[i].video_url; // 取流地址
obj['username'] = data[i].username;
obj['password'] = data[i].password;
obj['extend_1'] = data[i].extend_1;
obj['extend_2'] = data[i].extend_2;
this.cameraArr.push(obj)
}
newData.push(obj);
}
return newData;
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
editFun(index,row){
this.$refs.editCamera.initDialog(row,'edit',this.dev_unid)
},
delFun(index,row){
this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.resource.delCamera({},this.dev_unid,row.id).then(res=>{
if(res.ecode==200){
this.$message({
type: 'success',
message: '删除成功!'
});
return false;
let data={
org_type:"address",
unid:row.addrNode.unid
}
this.detailObj=this.formattterData[this.currentIndex+1];
this.currentIndex+=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
handleSelectionChange(obj){
this.selectcheck = [];
obj.forEach(item => {
this.selectcheck.push(item.id)
this.submitLaterGet(data);
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
detailFun(index,row){
this.$refs.editCamera.initDialog(row,'detail',this.dev_unid)
},
getTable(data,type) {
if(data.org_type!="root"){
this.tableType=type;
if(data.org_type){
this.tableType=type;
this.formattterData = [];
let filterData=[];
let search_params = {
limit: this.pageSize,
offset: offset,
task_name: this.conditions.task_name ? this.conditions.task_name.replace(/\s\s*/g, '') : this.conditions.task_name,
event_type: this.conditions.type,
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss')
vchan_type: "camera",
org_unid:data.unid
}
this.$api.search.eventTableList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
this.$api.resource.getCameraTable(search_params,this.dev_unid).then((res) => {
if(res.list_data.length > 0) {
for(var i = 0; i < res.list_data.length; i++) {
filterData = this.cameraArr.filter(list => {
return list.id === res.list_data[i].vchan_refid;
})
}).catch((err)=>{
if(filterData.length > 0) {
this.formattterData.push(filterData[0]);
}
}
}
}).catch((err) => {
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
}else{
this.formattterData = [];
let filterData=[];
this.$api.resource.getCameraTable({},this.dev_unid,data.vchan_refid).then((res) => {
filterData = this.cameraArr.filter(list => {
return list.id === res.refid;
})
if(filterData.length > 0) {
this.formattterData.push(filterData[0]);
}
}).catch((err) => {
})
},
playFun(index,row){
if(!row.video) {
return
}
var play_url = '';
if(row.video) {
play_url = row.video[0].src_url
}
this.$refs.visableDialog.playvideos(play_url);
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
getVideoTable(data,type){
this.tableType=type;
this.formattterData=[];
if(data.childs){
this.formattterData=data.childs;
}else{
this.formattterData.push(data)
}
this.detailVisible=true;
},
editVideo(){
},
delVideo(){
}
},
}
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!