Commit 4c917f85 by 夏新然

初次提交

1 parent 326b5ae0
Showing 77 changed files with 4742 additions and 0 deletions
NODE_ENV = '"development"'
\ No newline at end of file \ No newline at end of file
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# fanxing
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Run your unit tests
```
npm run test:unit
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
module.exports = {
presets: ["@vue/cli-plugin-babel/preset"]
};
This diff could not be displayed because it is too large.
{
"name": "fanxing",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"test:unit": "vue-cli-service test:unit",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.19.0",
"core-js": "^3.3.2",
"echarts": "^4.5.0",
"element-ui": "^2.12.0",
"js-sha1": "^0.6.0",
"moment": "^2.24.0",
"ol": "^6.1.1",
"vue": "^2.6.10",
"vue-router": "^3.1.3",
"vuex": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.0.0",
"@vue/cli-plugin-eslint": "^4.0.0",
"@vue/cli-plugin-router": "^4.0.0",
"@vue/cli-plugin-unit-mocha": "^4.0.0",
"@vue/cli-plugin-vuex": "^4.0.0",
"@vue/cli-service": "^4.0.0",
"@vue/eslint-config-prettier": "^5.0.0",
"@vue/test-utils": "1.0.0-beta.29",
"babel-eslint": "^10.0.3",
"chai": "^4.1.2",
"eslint": "^5.16.0",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-vue": "^5.0.0",
"node-sass": "^4.12.0",
"prettier": "^1.18.2",
"sass-loader": "^8.0.0",
"vue-template-compiler": "^2.6.10"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"@vue/prettier"
],
"rules": {
"indent": "off",
"no-console": "off",
"no-unused-vars": "off",
"no-use-before-define": "off",
"no-undef": "off",
"no-irregular-whitespace": "off",
"no-debugger": "off"
},
"parserOptions": {
"parser": "babel-eslint"
},
"overrides": [
{
"files": [
"**/__tests__/*.{j,t}s?(x)"
],
"env": {
"mocha": true
}
}
]
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}
No preview for this file type
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>fanxing</title>
</head>
<body>
<noscript>
<strong>We're sorry but fanxing doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
<template>
<div id="app" class="blue">
<router-view />
</div>
</template>
<style lang="scss">
#app {
font-family:MicrosoftYaHeiUI;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</style>
import map from './map'
import login from './login'
import task from './taskManage'
import search from './search'
export default {
map,
login,
task,
search
}
\ No newline at end of file \ No newline at end of file
import axios from 'axios'
import store from '../store/index.js'
// 创建 axios 实例
let service = axios.create({
// headers: {'Content-Type': 'application/json'},
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(
(config) => {
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') {
config.params = {
_t: Date.parse(new Date()) / 1000,
...config.params
}
}
return config
},
(error) => {
// 请求错误处理
return Promise.reject(error)
}
)
// 添加响应拦截器
service.interceptors.response.use(
(response) => {
let { data } = response
return data
},
(error) => {
console.log(error)
let info = {}
if (!error.response) {
info = {
code: 5000,
msg: 'Network Error'
}
} else {
let { status, statusText, data } = error.response
// 此处整理错误信息格式
info = {
code: status,
data: data,
msg: statusText
}
}
return Promise.reject(error)
}
)
/**
* 创建统一封装过的 axios 实例
* @return {AxiosInstance}
*/
export default function() {
return service
}
\ No newline at end of file \ No newline at end of file
let baseUrl = '/api' // 本地代理
console.log(process.env.NODE_ENV)
switch (process.env.NODE_ENV) {
case 'development':
baseUrl = 'http://192.168.9.133:20080' // 测试环境url
// baseUrl="http://192.168.9.162:20080"
break
case 'pre':
baseUrl = 'https://pre-server.feleti.cn' // 预上线环境url
break
case 'production':
baseUrl = 'https://api.feleti.cn' // 生产环境url
break
}
export default baseUrl
\ No newline at end of file \ No newline at end of file
import axios from './axios'
let instance = axios()
export default {
get(url, params, headers) {
let options = {}
if (params) {
options.params = params
}
if (headers) {
options.headers = headers
}
return instance.get(url, options)
},
post(url,data,headers,params) {
let options = {}
if (params) {
options.params = params
}
if (headers) {
options.headers = headers
}
return instance.post(url, data, options)
},
put(url, params, headers) {
let options = {}
if (headers) {
options.headers = headers
}
return instance.put(url, params, options)
},
delete(url, params, headers) {
let options = {}
if (params) {
options.params = params
}
if (headers) {
options.headers = headers
}
return instance.delete(url, options)
}
}
\ No newline at end of file \ No newline at end of file
import apiList from './apiList'
const install = function(Vue) {
if (install.installed) {
return
}
install.installed = true
Object.defineProperties(Vue.prototype, {
$api: {
get() {
return apiList
}
}
})
}
export default {
install
}
\ No newline at end of file \ No newline at end of file
import api from '../index'
import urls from './urls'
export default {
//登陆
login(params,id) {
return api.post(urls.login,params)
},
algocombs(params,id){
return api.get(urls.algocombs,params)
},
storeconfs(params,id){
return api.get(urls.storeconfs,params)
},
cates(params,id){
return api.get(urls.cates,params)
},
codes(params,id){
return api.get(urls.codes+id+'/codes',params)
}
}
\ No newline at end of file \ No newline at end of file
import baseUrl from '../baseUrl'
export default {
login: baseUrl + '/api/v1/devconf_fx/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/',
}
\ No newline at end of file \ No newline at end of file
import api from '../index'
import urls from './urls'
const header = {}
export default {
archive(params) {
// return出去了一个promise
return api.get(urls.archive, params)
},
detail(params,id) {
// return出去了一个promise
return api.get(urls.detail+id,params)
},
pass(params,id) {
// return出去了一个promise
return api.post(urls.pass+id,params)
},
delResult(params,id) {
// return出去了一个promise
return api.delete(urls.delResult+id,params)
},
delEvent(params,id) {
// return出去了一个promise
return api.delete(urls.delEvent+id,params)
},
eventTypeData(params) {
// return出去了一个promise
return api.get(urls.eventTypeData,params)
},
homeNum(params) {
// return出去了一个promise
return api.get(urls.homeNum,params)
},
homeLine(params) {
// return出去了一个promise
return api.get(urls.homeLine,params)
},
homeCatch(params) {
// return出去了一个promise
return api.get(urls.homeCatch,params)
},
setClose(params) {
// return出去了一个promise
return api.post(urls.pass,params)
},
}
\ No newline at end of file \ No newline at end of file
import baseUrl from '../baseUrl'
export default {
archive: baseUrl + '/api/v1/datahandle/behavior/archive',
detail:baseUrl+'/api/v1/datahandle/behavior/archive/',
pass:baseUrl+'/api/v1/datahandle/behavior/audit/',
delResult:baseUrl+'/api/v1/datahandle/behavior/events/',
delEvent:baseUrl+'/api/v1/datahandle/behavior/archive/',
eventTypeData:'http://192.168.9.133:20080'+'/api/v1/codes/event_types',
homeNum:baseUrl+'/api/v1/datahandle/statistics/type',
homeLine:baseUrl+'/api/v1/datahandle/statistics/hour',
homeCatch:baseUrl+'/api/v1/datahandle/statistics/handle',
}
\ No newline at end of file \ No newline at end of file
import api from '../index'
import urls from './urls'
export default {
vehicleList(params) {
return api.get(urls.vehicleList, params)
},
detailImg(params,id) {
return api.get(urls.detailImg+id, params)
},
delVehicle(params,id) {
// return出去了一个promise
return api.delete(urls.delVehicle+id,params)
},
}
\ No newline at end of file \ No newline at end of file
import baseUrl from '../baseUrl'
export default {
vehicleList: baseUrl + '/api/v1/traffic/events',
detailImg: baseUrl + '/api/v1/web/pics/',
delVehicle: baseUrl + '/api/v1/traffic/events/',
}
\ No newline at end of file \ No newline at end of file
import api from '../index'
import urls from './urls'
export default {
tasks(params,id){
return api.get(urls.tasks,params)
},
subtasks(params,id){
return api.get(urls.subtasks+id+'/subtasks',params)
},
}
\ No newline at end of file \ No newline at end of file
import baseUrl from '../baseUrl'
export default {
tasks: baseUrl + '/api/v1/devconf_fx/tasks',
subtasks:baseUrl+'/api/v1/devconf_fx/tasks/',
}
\ No newline at end of file \ No newline at end of file
@font-face {font-family: "iconfont";
src: url('iconfont.eot?t=1576476926424'); /* IE9 */
src: url('iconfont.eot?t=1576476926424#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAeoAAsAAAAADmAAAAdaAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCEWgqNTIsRATYCJAM0CxwABCAFhG0HgSQbQQwRFazBIPsiwXYbjYex0EY0EOX0NolDuGdNRuHU9nSSQXIUhxzEErAsB6HA7mPaifzPdoFCVCDyEyQpGR4o36kLAA6AGviHMQeC2l2271x/n1DoCDOUZz8pYN91aZsrZC/NPl3t96vqDZou0iwkanvit18WP0wtMTRIGhIhich0fkKskSElSs1YxK5mkw7sQd4NBACPKHQGGT12sgQNWDCLoNv8OSV50Axkgp0RTqCxqyacyYKsBQcN8yXTAmCN/X1yCz2JBmDAUbB7TS8eU4jhHlz/kCpeBZlUgWVzHECyHUABdAbAJrZTEwuOgPqGzqDgq7/K4gsAIdCDQuOBR+0xeCI8UZ6entGefE+h59PrH3pD6UZNzJYShHDvsH/yAAo1GKhAoIMADThowYMFiApgunBW00CWB5JAK1TDgkUDCAwwAgQVMAoEAuwJeRM4CgQBOBoEDTAfBA5YCIIW+Ck4eDxeCtQHm/lQ3zAAyQAjUNZZsKBCFDDgbi9jeIEarL0CjU7W6UJ4f0OMTkt0OhIaoZLpKc/q9Sybpw4k7muIIqdlM5xGt9sEZW9iuWBLLqistdQY8rfx1sAtewCH4wPrDsDpkHQul4m63CZh+27LLp4nvMMhMU6n0XfJU4llV4GPrdJSYdBt3KiUm9pwXmc1SxZikC44ciaCqT/bx+e4PZo2nMuqOpOg23YujPqGi6TWnixAIEGbrWdDSysr1m5aVKR1I/CIQXnltuAFcsU2njfykk6WTbx1S6C0sSrIWF4u+Nkqg02VNfMcjpjm0zgmusElbTtnsdvOKmcS6D4y58nluVyZwpSd2C+O4QVWGdxlMeXcbTMSdypSXudIh1K+sXxZqDyCKp5UVBzASqU8qHRDfdKkjdsMtHJ7dSulVDxyIYKtv9jH9/jlaK7h0myaN5wHP9LnStmoM5l0W3aESFU7BR/b7jC5ZleauOVMaFb12USf7fbwnNpzs/l0IY2nst0HvPVcGHc5xMsQwVadKW4tEKMkC+jN4Sc/HDxKv3fGsk2O0T+44jjLYfuvou3nswcxUrTZXXpISjQ3f+DbmOVCyTRPMprslqHnrO/7QX8oElOCR3exXGpcSSYEjQi9pg/uEvrHL3fi7/4c+mdUiP5a6MigCYfpnac9pm81tBiGcjNHzl9DajaSIWZOhnpZ+qyxhE5v6dRqoKSXTMxmIrcSoymQSRGOM9YYWjD+xkL1F+IXuQtzdaYqt2BqlK7L6tiJmW/l4I7dvS5Tb/cd9pp+SYw+dkesnpECRUMuExvTsW+nvm/xKTrGxDLofvFxbDK7/Zm6RrNZvUv9bBubHEvujRJHMWLziiJZO/xYjWPqkn6TFl/CmZqJ2rHvNK0ompEy7LuUl9pS7csQt1XICHi75bCfmpOSkCyHzec+Wt65c0P+s/stw3my+7f3sTdusPsELapRvdbLzeyWNczUUAh7mVkzt6WcjoOAo80cvGTq2MjREbPnRIyKGlsnBkeMnj17dOTYyLoJZmTPrMvDRs2eI5hts2e3anf57dKgpU2Jr65tbVPv9tutaWvTnPI7tRgx8eIOtv0/uoNTe7uqpf+1szuw9X//0aYXa9yrfWN8V7ncOT9Fopc5auGBamGhUH0guuqbeQ1z2tCTYrhi1MQgRmO8MFwsFMVRz4ah+43e/p8GzA0aHjg3gK6Y8HvN0NwmGtZrWEfz2v8OFHTsPSyM/jJcGm1X7FT7ldJoz1UuQp/c3kPD4/hb2rimoWvjtLf4uDXLTi0/teL5qecnnw85/YKPCzsdNst/7WnjxcgW6DlLuThjRuRfkZR5sd0NkKrHdI4aUy2N2tunbI8uAbHDe9G1tNfw4fGmMP4HxDh8wlPC++rAntIPRzy8PzLvXE72od0ZGX0K+kgFnQ7PmG2ejbLnAOCtZkGLAYB2ZBzeK1+y4VSdxv6vgUZtV8Z44b1P11ExqGvXSKOJFMpF8F+Vb0dAQZnjg9H/6kRjmxroCZr/X7EXll49ti/Hd/ATjfB5rv4jcsTbUNyde9lgBYAGDLCw8s9ALGa4XdVrjWX5sKUqF/FeGZwE5A3E+mAy1HUMAJ4vAP4RSvzxz25sQQsrf0S2oB4wUCMSKDRIcGe9OwMHAb1BBQ2GAY9OGHe+gAAsBQVhtQA64tMACPTYDwxE2IFCj1Z31vtv4GDAHVBBTyjwkEnAFQUk0aXzG0GjOMP0B2S5OJGj5677G/o1GenXbNQXSqVqGNp+uPkBC8omjqnfflR14IQz3Af3w5QYFuEdWm2D6rLtOjfp2NZy3pzjRtCoTjoD019aslzc8no+8vNv6NdkZMa4VdovlEqbBwZa+gXcH1hZaNxD6Vu//YgSdyCHCmfgnjgm3sDAMnm3HVptCSvULVs6ms8tytrd2/J9vgG4YDdoEqblcLrcHn9pr/RsP8eFhm1YD4USHSX2VE7+gyk10KWZ58aS2IRNPZnYmeKHY7vd8YxqKJ09kr95RLxEV1OUir8mSe74H+j4l1ZvaLMBAA==') format('woff2'),
url('iconfont.woff?t=1576476926424') format('woff'),
url('iconfont.ttf?t=1576476926424') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('iconfont.svg?t=1576476926424#iconfont') format('svg'); /* iOS 4.1- */
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-daochu:before {
content: "\e61e";
}
.icon-rili:before {
content: "\e616";
}
.icon-login:before {
content: "\e600";
}
.icon-zhanshi:before {
content: "\e87a";
}
.icon-add-circle-s:before {
content: "\e662";
}
.icon-bofang1:before {
content: "\e61c";
}
.icon-bofang:before {
content: "\e607";
}
.icon-detail:before {
content: "\e644";
}
.icon-Migration:before {
content: "\e664";
}
.icon-zanting:before {
content: "\e685";
}
.icon-zantingtingzhi:before {
content: "\e643";
}
.icon-xiugai:before {
content: "\e632";
}
No preview for this file type
!function(a){var t,n='<svg><symbol id="icon-daochu" viewBox="0 0 1024 1024"><path d="M179.2 610.4c0 51.2 8.8 100.8 24.8 146.4 58.4-170.4 213.6-292 397.6-292l0 72.8c0 28 15.2 52.8 39.2 65.6 9.6 4.8 20.8 8 31.2 8 15.2 0 29.6-4.8 42.4-14.4l281.6-219.2c17.6-13.6 28-35.2 28-58.4 0-23.2-10.4-44.8-28-58.4L714.4 40.8c-12-9.6-27.2-14.4-42.4-14.4-10.4 0-21.6 2.4-31.2 8-24 12-39.2 37.6-39.2 65.6l0 72.8C368.8 172 179.2 368.8 179.2 610.4z" ></path><path d="M972.8 588.8c-28 0-51.2 23.2-51.2 51.2l0 51.2 0 10.4c0 108-4 194.4-204.8 194.4L307.2 896c-207.2 0-204.8-92-204.8-204.8l0-256C88 274.4 164 239.2 256 232l0 0 3.2 0c28 0 51.2-23.2 51.2-51.2 0-28-23.2-52-51.2-52l-3.2 0L256 128l-51.2 0C92 128 0 220 0 332.8l0 460.8c0 112.8 92 204.8 204.8 204.8l613.6 0c112.8 0 204.8-92 204.8-204.8L1023.2 640C1024 612 1000.8 588.8 972.8 588.8z" ></path></symbol><symbol id="icon-rili" viewBox="0 0 1024 1024"><path d="M329.197037 662.186667l365.605926 0c9.102222 0 16.402963-7.395556 16.402963-16.402963s-7.395556-16.402963-16.402963-16.402963L329.197037 629.380741c-9.102222 0-16.402963 7.395556-16.402963 16.402963S320.094815 662.186667 329.197037 662.186667z" ></path><path d="M329.197037 565.380741l365.605926 0c9.102222 0 16.402963-7.395556 16.402963-16.402963 0-9.102222-7.395556-16.402963-16.402963-16.402963L329.197037 532.574815c-9.102222 0-16.402963 7.395556-16.402963 16.402963C312.794074 557.985185 320.094815 565.380741 329.197037 565.380741z" ></path><path d="M724.385185 214.755556l-42.477037 0 0-42.477037-42.477037 0 0 42.477037L384.568889 214.755556l0-42.477037-42.477037 0 0 42.477037L299.614815 214.755556c-46.648889 0-84.859259 38.21037-84.859259 84.859259l0 467.247407c0 46.648889 38.21037 84.859259 84.859259 84.859259l424.77037 0c46.648889 0 84.859259-38.21037 84.859259-84.859259L809.244444 299.614815C809.244444 252.965926 771.034074 214.755556 724.385185 214.755556zM778.145185 766.862222c0 23.419259-30.435556 53.76-53.76 53.76L299.614815 820.622222c-23.419259 0-53.76-30.435556-53.76-53.76L245.854815 427.045926l532.385185 0L778.24 766.862222zM779.093333 395.946667 244.906667 395.946667 244.906667 299.614815c0-23.419259 31.383704-53.76 54.708148-53.76l42.477037 0L342.091852 299.614815l42.477037 0 0-53.854815 254.767407 0L639.336296 299.614815l42.477037 0 0-53.854815L724.385185 245.76c23.419259 0 54.708148 30.435556 54.708148 53.76L779.093333 395.946667z" ></path></symbol><symbol id="icon-login" viewBox="0 0 1024 1024"><path d="M780.875 396.388c1.754-1.622 2.427-4.217 1.501-6.574-0.924-2.365-3.182-3.804-5.574-3.804h-166.755l0.359-246.761c0.005-4.603-1.742-9.209-5.254-12.72-3.508-3.514-8.111-5.274-12.715-5.274h-163.328c-4.597 0-9.201 1.76-12.715 5.274-3.506 3.513-5.255 8.117-5.25 12.72l0.332 246.761h-166.764c-2.387 0-4.643 1.438-5.575 3.804-0.925 2.359-0.252 4.951 1.504 6.574l257.895 239.15c3.209 2.971 7.502 4.794 12.218 4.794 4.72 0 9.013-1.824 12.219-4.794l257.902-239.15zM1037.742 650.941l-161.68-126.155c-9.159-7.147-26.16-12.993-37.775-12.993h-64.199l182.757 155.557-211.754 0.103-79.019 113.225h-311.316l-75.815-113.121-210.615-0.103 188.985-155.756-74.142 0.097c-11.617 0-28.618 5.847-37.776 12.993l-161.68 126.154c-9.159 7.148-13.701 22.029-10.091 33.073l64.499 197.362c3.609 11.043 16.067 20.078 27.684 20.078h891.089c11.617 0 24.032-9.049 27.591-20.108l63.447-197.302c3.554-11.061-1.029-25.956-10.19-33.103z" ></path></symbol><symbol id="icon-zhanshi" viewBox="0 0 1024 1024"><path d="M512 336.1c-124.1 0-232.7 108.6-232.7 175.9 0 67.2 108.6 175.9 232.7 175.9 129.3 0 232.7-124.1 232.7-175.9 0-51.7-103.4-175.9-232.7-175.9z m0 253.5c-41.4 0-77.6-36.2-77.6-77.6 0-41.4 36.2-77.6 77.6-77.6 41.4 0 77.6 36.2 77.6 77.6 0 41.4-36.2 77.6-77.6 77.6z m0 0" ></path><path d="M512 98.2C284.4 98.2 98.2 284.4 98.2 512S284.4 925.8 512 925.8 925.8 739.6 925.8 512 739.6 98.2 512 98.2z m0 641.4c-150 0-284.5-129.3-284.5-227.6 0-98.3 134.5-227.6 284.5-227.6S796.5 424.1 796.5 512 662 739.6 512 739.6z m0 0" ></path></symbol><symbol id="icon-add-circle-s" viewBox="0 0 1024 1024"><path d="M512 894.5c-51.6 0-101.7-10.1-148.9-30.1-45.6-19.3-86.5-46.8-121.6-82-35.1-35.1-62.7-76-82-121.6-20-47.2-30.1-97.3-30.1-148.9s10.1-101.7 30.1-148.9c19.3-45.6 46.8-86.5 82-121.6 35.1-35.1 76-62.7 121.6-82 47.2-20 97.3-30.1 148.9-30.1s101.7 10.1 148.9 30.1c45.6 19.3 86.5 46.8 121.6 82 35.1 35.1 62.7 76 82 121.6 20 47.2 30.1 97.3 30.1 148.9s-10.1 101.7-30.1 148.9c-19.3 45.6-46.8 86.5-82 121.6-35.1 35.1-76 62.7-121.6 82-47.2 20-97.3 30.1-148.9 30.1z m-17.3-361.9v205.8c0 11 9 20 20 20s20-9 20-20l-1-205.7h206.7c11 0 20-9 20-20s-9-20-20-20H534.7V287c0-11-9-20-20-20s-20 9-20 20v205.7H289c-11 0-20 9-20 20s9 20 20 20l205.7-0.1z" ></path></symbol><symbol id="icon-bofang1" viewBox="0 0 1024 1024"><path d="M514 114.3c-219.9 0-398.9 178.9-398.9 398.9 0.1 219.9 179 398.8 398.9 398.8 219.9 0 398.8-178.9 398.8-398.8S733.9 114.3 514 114.3z m173 421.9L437.1 680.5c-17.7 10.2-39.8-2.6-39.8-23V368.9c0-20.4 22.1-33.2 39.8-23L687 490.2c17.7 10.2 17.7 35.8 0 46z" ></path></symbol><symbol id="icon-bofang" viewBox="0 0 1024 1024"><path d="M822.824 97.58H201.176c-57.196 0-103.595 46.398-103.595 103.595v621.647c0 57.197 46.4 103.597 103.595 103.597h621.649c57.196 0 103.595-46.4 103.595-103.597V201.176c0-57.198-46.4-103.596-103.596-103.596zM356.607 719.147V304.851l362.54 207.108-362.54 207.188z" ></path></symbol><symbol id="icon-detail" viewBox="0 0 1024 1024"><path d="M800.111944 127.936032H223.888056C171.178411 127.936032 128.191904 170.922539 128.191904 224.143928V255.872064h767.616192v-32.23988c0-52.709645-42.986507-95.696152-95.696152-95.696152m-167.852074-63.968016l14.328836 100.813593H377.411294l14.328836-100.813593h240.51974M639.936032 0H384.063968c-26.610695 0-51.174413 21.493253-54.756622 47.592204l-18.934532 134.076961c-3.582209 26.098951 14.84058 47.592204 41.451274 47.592204h319.84008c26.610695 0 45.033483-21.493253 41.451274-47.592204l-18.934532-134.076961C691.110445 21.493253 666.546727 0 639.936032 0m176.03998 319.84008H208.023988c-35.310345 0-61.409295 28.657671-58.338831 63.968016l52.197901 576.223888c3.070465 34.798601 34.798601 63.968016 69.597202 63.968016h480.015992c35.310345 0 66.526737-28.657671 69.597201-63.968016L873.803098 383.808096c3.582209-35.310345-22.516742-63.968016-57.827086-63.968016M384.063968 895.552224H287.856072L256.127936 447.776112h127.936032V895.552224z m191.904048 0h-127.936032V447.776112h127.936032V895.552224z m160.175912 0H639.936032V447.776112h127.936032l-31.728136 447.776112z" fill="" ></path></symbol><symbol id="icon-Migration" viewBox="0 0 1024 1024"><path d="M853.840124 948.467989h-62.27438c-34.42119 0-62.274379-27.853189-62.274379-62.274379v-746.806034c0-34.42119 27.853189-62.274379 62.274379-62.27438h62.27438c34.42119 0 62.274379 27.853189 62.274379 62.27438v746.806034c-0.12163 34.42119-27.974819 62.274379-62.274379 62.274379z m-373.403017-373.403017H293.735598V450.516213h186.701509V326.089084l248.975887 186.701509-248.975887 186.701508V575.064972zM231.461219 637.217722h186.701508v248.975888c0 34.42119-27.853189 62.274379-62.274379 62.274379H169.186839c-34.42119 0-62.274379-27.853189-62.274379-62.274379v-746.806034c0-34.42119 27.853189-62.274379 62.274379-62.27438h186.701509c34.42119 0 62.274379 27.853189 62.274379 62.27438v248.975888H231.461219v248.854258z m0 0" fill="" ></path></symbol><symbol id="icon-zanting" viewBox="0 0 1024 1024"><path d="M804.571429 0a146.285714 146.285714 0 0 1 146.285714 146.285714v731.428572a146.285714 146.285714 0 1 1-292.571429 0V146.285714a146.285714 146.285714 0 0 1 146.285715-146.285714zM219.428571 0a146.285714 146.285714 0 0 1 146.285715 146.285714v731.428572a146.285714 146.285714 0 1 1-292.571429 0V146.285714a146.285714 146.285714 0 0 1 146.285714-146.285714z" ></path></symbol><symbol id="icon-zantingtingzhi" viewBox="0 0 1024 1024"><path d="M720.896 95.232c-47.616 0-89.6 41.472-89.6 89.088v655.36c0 47.616 41.984 89.088 89.6 89.088s89.6-41.472 89.6-89.088V184.32c-0.512-47.616-41.984-89.088-89.6-89.088z m-417.792 0c-47.616 0-89.6 41.472-89.6 89.088v655.36c0 47.616 41.984 89.088 89.6 89.088s89.6-41.472 89.6-89.088V184.32c0-47.616-41.984-89.088-89.6-89.088z" ></path></symbol><symbol id="icon-xiugai" viewBox="0 0 1024 1024"><path d="M768.487 388.361L590.76 215.067 210.93 594.492l-66.201 242.161v0.4L386.483 769.8zM739.523 66.62l-95.197 95.04 178.296 172.65 92.375-92.296c48.487-48.406 48.487-126.985 0-175.392-48.405-48.407-127.069-48.407-175.474-0.002zM79.029 878.71h872.333v114.976H79.029z" ></path></symbol></svg>',c=(t=document.getElementsByTagName("script"))[t.length-1].getAttribute("data-injectcss");if(c&&!a.__iconfont__svg__cssinject__){a.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}!function(t){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(t,0);else{var c=function(){document.removeEventListener("DOMContentLoaded",c,!1),t()};document.addEventListener("DOMContentLoaded",c,!1)}else document.attachEvent&&(l=t,o=a.document,i=!1,(n=function(){try{o.documentElement.doScroll("left")}catch(t){return void setTimeout(n,50)}e()})(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,e())});function e(){i||(i=!0,l())}var l,o,i,n}(function(){var t,c,e,l,o,i;(t=document.createElement("div")).innerHTML=n,n=null,(c=t.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",e=c,(l=document.body).firstChild?(o=e,(i=l.firstChild).parentNode.insertBefore(o,i)):l.appendChild(e))})}(window);
\ No newline at end of file \ No newline at end of file
{
"id": "1565499",
"name": "繁星2.0",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "831114",
"name": "导出",
"font_class": "daochu",
"unicode": "e61e",
"unicode_decimal": 58910
},
{
"icon_id": "1010109",
"name": "日历",
"font_class": "rili",
"unicode": "e616",
"unicode_decimal": 58902
},
{
"icon_id": "1355658",
"name": "导入",
"font_class": "login",
"unicode": "e600",
"unicode_decimal": 58880
},
{
"icon_id": "6237827",
"name": "展示",
"font_class": "zhanshi",
"unicode": "e87a",
"unicode_decimal": 59514
},
{
"icon_id": "6367958",
"name": "添加",
"font_class": "add-circle-s",
"unicode": "e662",
"unicode_decimal": 58978
},
{
"icon_id": "7588088",
"name": "播放",
"font_class": "bofang1",
"unicode": "e61c",
"unicode_decimal": 58908
},
{
"icon_id": "7815001",
"name": "播放",
"font_class": "bofang",
"unicode": "e607",
"unicode_decimal": 58887
},
{
"icon_id": "7978614",
"name": "删 除",
"font_class": "detail",
"unicode": "e644",
"unicode_decimal": 58948
},
{
"icon_id": "8147570",
"name": "迁移",
"font_class": "Migration",
"unicode": "e664",
"unicode_decimal": 58980
},
{
"icon_id": "8386986",
"name": "暂停",
"font_class": "zanting",
"unicode": "e685",
"unicode_decimal": 59013
},
{
"icon_id": "9356268",
"name": "暂停 停止",
"font_class": "zantingtingzhi",
"unicode": "e643",
"unicode_decimal": 58947
},
{
"icon_id": "10905634",
"name": "修 改",
"font_class": "xiugai",
"unicode": "e632",
"unicode_decimal": 58930
}
]
}
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<!--
2013-9-30: Created.
-->
<svg>
<metadata>
Created by iconfont
</metadata>
<defs>
<font id="iconfont" horiz-adv-x="1024" >
<font-face
font-family="iconfont"
font-weight="500"
font-stretch="normal"
units-per-em="1024"
ascent="896"
descent="-128"
/>
<missing-glyph />
<glyph glyph-name="daochu" unicode="&#58910;" d="M179.2 285.6c0-51.2 8.8-100.8 24.8-146.4 58.4 170.4 213.6 292 397.6 292l0-72.8c0-28 15.2-52.8 39.2-65.6 9.6-4.8 20.8-8 31.2-8 15.2 0 29.6 4.8 42.4 14.4l281.6 219.2c17.6 13.6 28 35.2 28 58.4 0 23.2-10.4 44.8-28 58.4L714.4 855.2c-12 9.6-27.2 14.4-42.4 14.4-10.4 0-21.6-2.4-31.2-8-24-12-39.2-37.6-39.2-65.6l0-72.8C368.8 724 179.2 527.2 179.2 285.6zM972.8 307.2c-28 0-51.2-23.2-51.2-51.2l0-51.2 0-10.4c0-108-4-194.4-204.8-194.4L307.2 0c-207.2 0-204.8 92-204.8 204.8l0 256C88 621.6 164 656.8 256 664l0 0 3.2 0c28 0 51.2 23.2 51.2 51.2 0 28-23.2 52-51.2 52l-3.2 0L256 768l-51.2 0C92 768 0 676 0 563.2l0-460.8c0-112.8 92-204.8 204.8-204.8l613.6 0c112.8 0 204.8 92 204.8 204.8L1023.2 256C1024 284 1000.8 307.2 972.8 307.2z" horiz-adv-x="1024" />
<glyph glyph-name="rili" unicode="&#58902;" d="M329.197037 233.813333l365.605926 0c9.102222 0 16.402963 7.395556 16.402963 16.402963s-7.395556 16.402963-16.402963 16.402963L329.197037 266.619259c-9.102222 0-16.402963-7.395556-16.402963-16.402963S320.094815 233.813333 329.197037 233.813333zM329.197037 330.619259l365.605926 0c9.102222 0 16.402963 7.395556 16.402963 16.402963 0 9.102222-7.395556 16.402963-16.402963 16.402963L329.197037 363.425185c-9.102222 0-16.402963-7.395556-16.402963-16.402963C312.794074 338.014815 320.094815 330.619259 329.197037 330.619259zM724.385185 681.244444l-42.477037 0 0 42.477037-42.477037 0 0-42.477037L384.568889 681.244444l0 42.477037-42.477037 0 0-42.477037L299.614815 681.244444c-46.648889 0-84.859259-38.21037-84.859259-84.859259l0-467.247407c0-46.648889 38.21037-84.859259 84.859259-84.859259l424.77037 0c46.648889 0 84.859259 38.21037 84.859259 84.859259L809.244444 596.385185C809.244444 643.034074 771.034074 681.244444 724.385185 681.244444zM778.145185 129.137778c0-23.419259-30.435556-53.76-53.76-53.76L299.614815 75.377778c-23.419259 0-53.76 30.435556-53.76 53.76L245.854815 468.954074l532.385185 0L778.24 129.137778zM779.093333 500.053333 244.906667 500.053333 244.906667 596.385185c0 23.419259 31.383704 53.76 54.708148 53.76l42.477037 0L342.091852 596.385185l42.477037 0 0 53.854815 254.767407 0L639.336296 596.385185l42.477037 0 0 53.854815L724.385185 650.24c23.419259 0 54.708148-30.435556 54.708148-53.76L779.093333 500.053333z" horiz-adv-x="1024" />
<glyph glyph-name="login" unicode="&#58880;" d="M780.875 499.612c1.754 1.622 2.427 4.217 1.501 6.574-0.924 2.365-3.182 3.804-5.574 3.804h-166.755l0.359 246.761c0.005 4.603-1.742 9.209-5.254 12.72-3.508 3.514-8.111 5.274-12.715 5.274h-163.328c-4.597 0-9.201-1.76-12.715-5.274-3.506-3.513-5.255-8.117-5.25-12.72l0.332-246.761h-166.764c-2.387 0-4.643-1.438-5.575-3.804-0.925-2.359-0.252-4.951 1.504-6.574l257.895-239.15c3.209-2.971 7.502-4.794 12.218-4.794 4.72 0 9.013 1.824 12.219 4.794l257.902 239.15zM1037.742 245.059l-161.68 126.155c-9.159 7.147-26.16 12.993-37.775 12.993h-64.199l182.757-155.557-211.754-0.103-79.019-113.225h-311.316l-75.815 113.121-210.615 0.103 188.985 155.756-74.142-0.097c-11.617 0-28.618-5.847-37.776-12.993l-161.68-126.154c-9.159-7.148-13.701-22.029-10.091-33.073l64.499-197.362c3.609-11.043 16.067-20.078 27.684-20.078h891.089c11.617 0 24.032 9.049 27.591 20.108l63.447 197.302c3.554 11.061-1.029 25.956-10.19 33.103z" horiz-adv-x="1024" />
<glyph glyph-name="zhanshi" unicode="&#59514;" d="M512 559.9c-124.1 0-232.7-108.6-232.7-175.9 0-67.2 108.6-175.9 232.7-175.9 129.3 0 232.7 124.1 232.7 175.9 0 51.7-103.4 175.9-232.7 175.9z m0-253.5c-41.4 0-77.6 36.2-77.6 77.6 0 41.4 36.2 77.6 77.6 77.6 41.4 0 77.6-36.2 77.6-77.6 0-41.4-36.2-77.6-77.6-77.6z m0 0M512 797.8C284.4 797.8 98.2 611.6 98.2 384S284.4-29.8 512-29.8 925.8 156.4 925.8 384 739.6 797.8 512 797.8z m0-641.4c-150 0-284.5 129.3-284.5 227.6 0 98.3 134.5 227.6 284.5 227.6S796.5 471.9 796.5 384 662 156.4 512 156.4z m0 0" horiz-adv-x="1024" />
<glyph glyph-name="add-circle-s" unicode="&#58978;" d="M512 1.5c-51.6 0-101.7 10.1-148.9 30.1-45.6 19.3-86.5 46.8-121.6 82-35.1 35.1-62.7 76-82 121.6-20 47.2-30.1 97.3-30.1 148.9s10.1 101.7 30.1 148.9c19.3 45.6 46.8 86.5 82 121.6 35.1 35.1 76 62.7 121.6 82 47.2 20 97.3 30.1 148.9 30.1s101.7-10.1 148.9-30.1c45.6-19.3 86.5-46.8 121.6-82 35.1-35.1 62.7-76 82-121.6 20-47.2 30.1-97.3 30.1-148.9s-10.1-101.7-30.1-148.9c-19.3-45.6-46.8-86.5-82-121.6-35.1-35.1-76-62.7-121.6-82-47.2-20-97.3-30.1-148.9-30.1z m-17.3 361.9v-205.8c0-11 9-20 20-20s20 9 20 20l-1 205.7h206.7c11 0 20 9 20 20s-9 20-20 20H534.7V609c0 11-9 20-20 20s-20-9-20-20v-205.7H289c-11 0-20-9-20-20s9-20 20-20l205.7 0.1z" horiz-adv-x="1024" />
<glyph glyph-name="bofang1" unicode="&#58908;" d="M514 781.7c-219.9 0-398.9-178.9-398.9-398.9 0.1-219.9 179-398.8 398.9-398.8 219.9 0 398.8 178.9 398.8 398.8S733.9 781.7 514 781.7z m173-421.9L437.1 215.5c-17.7-10.2-39.8 2.6-39.8 23V527.1c0 20.4 22.1 33.2 39.8 23L687 405.8c17.7-10.2 17.7-35.8 0-46z" horiz-adv-x="1024" />
<glyph glyph-name="bofang" unicode="&#58887;" d="M822.824 798.42H201.176c-57.196 0-103.595-46.398-103.595-103.595v-621.647c0-57.197 46.4-103.597 103.595-103.597h621.649c57.196 0 103.595 46.4 103.595 103.597V694.824c0 57.198-46.4 103.596-103.596 103.596zM356.607 176.853V591.149l362.54-207.108-362.54-207.188z" horiz-adv-x="1024" />
<glyph glyph-name="detail" unicode="&#58948;" d="M800.111944 768.063968H223.888056C171.178411 768.063968 128.191904 725.077461 128.191904 671.856072V640.127936h767.616192v32.23988c0 52.709645-42.986507 95.696152-95.696152 95.696152m-167.852074 63.968016l14.328836-100.813593H377.411294l14.328836 100.813593h240.51974M639.936032 896H384.063968c-26.610695 0-51.174413-21.493253-54.756622-47.592204l-18.934532-134.076961c-3.582209-26.098951 14.84058-47.592204 41.451274-47.592204h319.84008c26.610695 0 45.033483 21.493253 41.451274 47.592204l-18.934532 134.076961C691.110445 874.506747 666.546727 896 639.936032 896m176.03998-319.84008H208.023988c-35.310345 0-61.409295-28.657671-58.338831-63.968016l52.197901-576.223888c3.070465-34.798601 34.798601-63.968016 69.597202-63.968016h480.015992c35.310345 0 66.526737 28.657671 69.597201 63.968016L873.803098 512.191904c3.582209 35.310345-22.516742 63.968016-57.827086 63.968016M384.063968 0.4477759999999762H287.856072L256.127936 448.223888h127.936032V0.4477759999999762z m191.904048 0h-127.936032V448.223888h127.936032V0.4477759999999762z m160.175912 0H639.936032V448.223888h127.936032l-31.728136-447.776112z" horiz-adv-x="1024" />
<glyph glyph-name="Migration" unicode="&#58980;" d="M853.840124-52.46798899999999h-62.27438c-34.42119 0-62.274379 27.853189-62.274379 62.274379v746.806034c0 34.42119 27.853189 62.274379 62.274379 62.27438h62.27438c34.42119 0 62.274379-27.853189 62.274379-62.27438v-746.806034c-0.12163-34.42119-27.974819-62.274379-62.274379-62.274379z m-373.403017 373.403017H293.735598V445.483787h186.701509V569.910916l248.975887-186.701509-248.975887-186.701508V320.935028zM231.461219 258.782278h186.701508v-248.975888c0-34.42119-27.853189-62.274379-62.274379-62.274379H169.186839c-34.42119 0-62.274379 27.853189-62.274379 62.274379v746.806034c0 34.42119 27.853189 62.274379 62.274379 62.27438h186.701509c34.42119 0 62.274379-27.853189 62.274379-62.27438v-248.975888H231.461219v-248.854258z m0 0" horiz-adv-x="1024" />
<glyph glyph-name="zanting" unicode="&#59013;" d="M804.571429 896a146.285714 146.285714 0 0 0 146.285714-146.285714v-731.428572a146.285714 146.285714 0 1 0-292.571429 0V749.714286a146.285714 146.285714 0 0 0 146.285715 146.285714zM219.428571 896a146.285714 146.285714 0 0 0 146.285715-146.285714v-731.428572a146.285714 146.285714 0 1 0-292.571429 0V749.714286a146.285714 146.285714 0 0 0 146.285714 146.285714z" horiz-adv-x="1024" />
<glyph glyph-name="zantingtingzhi" unicode="&#58947;" d="M720.896 800.768c-47.616 0-89.6-41.472-89.6-89.088v-655.36c0-47.616 41.984-89.088 89.6-89.088s89.6 41.472 89.6 89.088V711.68c-0.512 47.616-41.984 89.088-89.6 89.088z m-417.792 0c-47.616 0-89.6-41.472-89.6-89.088v-655.36c0-47.616 41.984-89.088 89.6-89.088s89.6 41.472 89.6 89.088V711.68c0 47.616-41.984 89.088-89.6 89.088z" horiz-adv-x="1024" />
<glyph glyph-name="xiugai" unicode="&#58930;" d="M768.487 507.639L590.76 680.933 210.93 301.508l-66.201-242.161v-0.4L386.483 126.2zM739.523 829.38l-95.197-95.04 178.296-172.65 92.375 92.296c48.487 48.406 48.487 126.985 0 175.392-48.405 48.407-127.069 48.407-175.474 0.002zM79.029 17.29h872.333v-114.976H79.029z" horiz-adv-x="1024" />
</font>
</defs></svg>
No preview for this file type
No preview for this file type
No preview for this file type
import Vue from 'vue'
class Codes {
constructor () {
this.allTypes = ['vehicle', 'xcycle', 'pflow', 'pedestrian']
}
/**
* INIT
* 初始化所需参数
* 返回得到的结果
*/
getCodeList(name){
console.log(JSON.parse(window.localStorage.getItem(name)))
return JSON.parse(window.localStorage.getItem(name))
}
init (allData) {
this.cate = allData.event_cate
this.event_type = allData.event_type
this.allData = allData
this.result = {}
this.result = allData
this.classify();
return this.result
}
// 分类
classify () {
if (!this.allData) {
return ''
}
if (this.cate === 'traffic') {
this.trafficCode()
}
if (this.cate === 'behavior') {
this.beheiverCode()
}
}
// 安防事件处理
beheiverCode () {
this.publicCode()
console.log('安防事件')
}
// 交通事件处理
trafficCode () {
this.publicCode()
if (this.event_type === 'vehicle') {
this.vehicle()
}
if (this.event_type === 'xcycle' || this.event_type === 'pedestrian') {
this.xcycle()
}
if (this.event_type === 'pflow') {
this.pflow()
}
}
// *根据不同event_type做不同处理*
// 公共字段提取
publicCode () {
try {
// eslint-disable-next-line camelcase
let shoot_dt = this.timeForm(this.result.pics[0].shoot_dt, 'local').split(' ')
this.result.shoot_date = shoot_dt[0]
this.result.shoot_time = shoot_dt[1]
} catch (error) {
if (this.curType === 1) {
// eslint-disable-next-line camelcase
let shoot_dt = this.timeForm(this.result.event_dt, 'local').split(' ')
this.result.shoot_date = shoot_dt[0]
this.result.shoot_time = shoot_dt[1]
} else {
this.result.shoot_dt = '未识别'
}
}
// 时间
try {
this.result.event_dt = this.allData.event_dt
} catch (err) {
this.result.event_dt = ''
}
try {
this.result.location_speed = this.allData.event_data.speed
} catch (err) {
this.result.location_speed = ''
}
}
// 交通
vehicle () {
try {
if((this.allData.event_data.vehicle.body && this.allData.event_data.vehicle.body.type.special_type) || this.allData.event_data.vehicle.body.type.special_type == 0){
if(this.allData.event_data.vehicle.body.type.special_type == 0){
this.result.special_text = '正常车辆'
}else if(this.allData.event_data.vehicle.body.type.special_type == 1){
this.result.special_text = '车辆运输车'
}else if(this.allData.event_data.vehicle.body.type.special_type ==2 ){
this.result.special_text = '危险品运输车'
}else if(this.allData.event_data.vehicle.body.type.special_type == 3){
this.result.special_text = '救护车'
}
}else{
this.result.special_text = '未知'
}
} catch (error) {
this.result.special_text = '未知'
}
try {
this.result.vehicle_plate_text = this.allData.event_data.vehicle.plate.text || '未识别'
} catch (err) {
this.result.vehicle_plate_text = '未识别'
}
// 违法类型
try {
this.result.illegalType = parseInt(this.allData.event_data.illegal.state) === 1 ? this.getCode('违法类型', this.allData.event_data.illegal.code) : '正常'
} catch (err) {
this.result.illegalType = '未识别'
}
try {
this.result.location_name = this.allData.event_data.location.name === '' ? '无' : this.allData.event_data.location.name
} catch (e) {
this.result.location_name = '未识别'
}
try {
this.result.vehicle_body_type_text = this.getCode('车辆类型', this.allData.event_data.vehicle.body.type.code)
} catch (err) {
this.result.vehicle_body_type_text = '未识别'
}
try {
this.result.vehicle_body_logo_text = this.getCode('车辆品牌', this.allData.event_data.vehicle.body.logo.code)
} catch (err) {
this.result.vehicle_body_logo_text = '未识别'
}
try {
this.result.plate_type_text = this.getCode('号牌类型', this.allData.event_data.vehicle.plate.type_code)
} catch (err) {
this.result.plate_type_text = '未识别'
}
try {
this.result.vehicle_body_color_text = this.getCode('车身颜色', this.allData.event_data.vehicle.body.color.code)
} catch (err) {
this.result.vehicle_body_color_text = '未识别'
}
let ary = []
try {
if(this.allData.event_data.RefinedFeature.rAnnualInspection) {
ary.push('年检标志')
}
} catch(e) {
console.log('年检标志无')
}
try {
if(this.allData.event_data.RefinedFeature.rDecoration) {
ary.push('摆件')
}
} catch(e) {
console.log('摆件无')
}
try {
if(this.allData.event_data.RefinedFeature.rPendant) {
ary.push('吊坠')
}
} catch(e) {
console.log('吊坠无')
}
try {
if(this.allData.event_data.RefinedFeature.rSunshading) {
ary.push('遮阳板')
}
} catch(e) {
console.log('遮阳板无')
}
if(ary.length) {
this.result.RefinedFeature_text = ary.join('')
} else {
this.result.RefinedFeature_text = '未识别'
}
}
// 非机动车
xcycle () {
// 性别
try {
switch (this.allData.event_data.driver.face[0].sex) {
case '1':
this.result.driver_face_sex = '男'
break
case '2':
this.result.driver_face_sex = '女'
break
case '0':
this.result.driver_face_sex = '不确定'
break
default:
break
}
} catch (err) {
this.result.driver_face_sex = '未识别'
}
// 身高
try {
this.result.pedestrian_height = this.allData.event_data.pedestrian.height.toFixed(2)
} catch (err) {
this.result.pedestrian_height = '未识别'
}
// 是否戴帽子
try {
switch (this.allData.event_data.driver.face[0].with_hats) {
case 0:
this.result.driver_face_with_hats = '不确定'
break
case 1:
this.result.driver_face_with_hats = '戴帽子'
break
case 2:
this.result.driver_face_with_hats = '未戴帽'
break
default:
break
}
} catch (err) {
this.result.driver_face_with_hats = '未识别'
}
// 车辆颜色
try {
this.result.xcycle_color_type = this.allData.event_data.xcycle.color.name || '未识别'
} catch (error) {
this.result.xcycle_color_type = '未识别'
}
// 行人上身颜色
try {
this.result.driver_face_upbody_text = this.getCode('车身颜色', this.allData.event_data.driver.face[0].upbody.code)
} catch (err) {
this.result.driver_face_upbody_text = '未识别'
}
// 行人下身颜色
try {
this.result.driver_face_lobody_text = this.getCode('车身颜色', this.allData.event_data.driver.face[0].lobody.code)
} catch (err) {
this.result.driver_face_lobody_text = '未识别'
}
// 车辆品牌
try {
this.result.vehicle_body_logo_text = this.getCode('车辆品牌', this.result.event_data.vehicle.body.logo.code)
} catch (err) {
this.result.vehicle_body_logo_text = '未识别'
}
// 地点名称
try {
this.allData.location_name = this.allData.event_this.allData.location.name === '' ? '无' : this.allData.event_this.allData.location.name
} catch (e) {
this.allData.location_name = '未识别'
}
// 骑车类型
try {
switch (this.allData.event_this.allData.xcycle_type) {
case 'motorcycle':
this.allData.xcycle_type_text = '摩托车'
break
case 'bicycle':
this.allData.xcycle_type_text = '自行车'
break
case 'tricycle':
this.allData.xcycle_type_text = '三轮车'
break
default:
break
}
} catch (err) {
this.allData.xcycle_type_text = '未识别'
}
try {
if (this.allData.xcycle_type_text === '自行车') {
this.allData.company = this.allData.event_this.allData.xcycle.company.name
} else if (this.allData.xcycle_type_text === '摩托车') {
if (typeof (this.allData.event_this.allData.xcycle.company.code) !== 'number') {
this.allData.company = '未识别'
} else {
this.allData.company = this.getCode('外卖公司', this.allData.event_this.allData.xcycle.company.code)
}
} else if (this.allData.xcycle_type_text === '三轮车') {
if (typeof (this.allData.event_this.allData.xcycle.company.code) !== 'number') {
this.allData.company = '未识别'
} else {
this.allData.company = this.getCode('快递公司', this.allData.event_this.allData.xcycle.company.code)
}
} else {
this.allData.company = '无'
}
} catch (error) {
this.allData.company = '未识别'
}
}
// 客流
pflow () {
}
/**
* buildError
*/
buildError () {
throw new Error('检测字段是否存在')
}
getCode (codeName, code) {
var name = window.localStorage.getItem(codeName + '-' + code)
name = name || ''
return name
}
/**
* timerfrom
*/
timeForm (time, str, boo) {
var bjTime
if (time === undefined || time === '') {
bjTime = new Date()
} else if (str === 'local') {
try {
// 兼容
var _dayTime = time.split(' ')
var d = _dayTime[0].split('-')
var mi = _dayTime[_dayTime.length - 1].split(':')
bjTime = new Date()
// 给date赋值年月日
bjTime.setUTCFullYear(d[0], d[1] - 1, d[2])
// 给date赋值时分秒
bjTime.setUTCHours(mi[0] - 8, mi[1], mi[2])
} catch (err) {
// console.log('转化本地时间异常:', err.message);
bjTime = new Date(time)
}
if (boo) {
bjTime = new Date(bjTime.getTime() + 28800000 - 86400000)
} else {
bjTime = new Date(bjTime.getTime() + 28800000)
}
} else if (str === 'utc') {
if (typeof time === 'object') {
if (boo) {
bjTime = new Date(time.getTime() - 28800000 + 1000)
} else {
bjTime = new Date(time.getTime() - 28800000)
}
} else {
if (boo) {
bjTime = new Date(new Date(time).getTime() - 28800000 + 1000)
} else {
bjTime = new Date(new Date(time).getTime() - 28800000)
}
}
} else {
bjTime = new Date(time)
}
var standardTime = [
[bjTime.getFullYear(), bjTime.getMonth() + 1, bjTime.getDate()].join('-'), [bjTime.getHours(), bjTime.getMinutes(), bjTime.getSeconds()].join(':')
].join(' ').replace(/(?=\b\d\b)/g, '0')
return standardTime
}
}
export let buildCode = new Codes()
.el-main{
padding: 0;
}
.el-menu{
height: 100%;
}
/* 输入框重置 */
.el-input--small .el-input__inner {
height: 30px;
line-height: 30px;
}
.el-input__inner{
border: 1px solid #E5E5E5;
}
.el-input.is-active .el-input__inner, .el-input__inner:focus{
border-color: #3BB7FF;
}
/* 下拉框重置 */
.el-select .el-input.is-focus .el-input__inner{
border-color: #3BB7FF;
}
.el-popper[x-placement^=bottom] .popper__arrow{
display: none;
}
.el-popper[x-placement^=bottom]{
margin-top: 0;
left:0!important;
}
.el-select-dropdown__list{
padding: 4px 0;
}
.el-select-dropdown{
border-radius: 2px;
}
.el-select-dropdown__item.selected{
color: #555555;
font-weight: 400;
}
.el-select-dropdown__item.hover{
color: #ffffff;
}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
background: #3BB7FF;
}
.el-select-dropdown__item{
height: 26px;
line-height: 26px;
padding: 0 10px;
}
.el-input__inner{
border-radius: 2px;
padding: 0 10px;
}
/* button重置 */
.el-button--mini, .el-button--small{
border-radius:2px ;
}
.el-button--small, .el-button--small.is-round {
padding: 7px 16px;
}
/* 主要按钮 */
.el-button--primary{
background-color: #0069FF;
border-color: #0069FF;
}
/* 信息按钮 */
.el-button--info {
color: #FFF;
background-color: #3BB7FF;
border-color: #3BB7FF;
}
.el-button--info:focus, .el-button--info:hover {
background: red;
border-color: red;
color: #FFF;
}
.el-button--info.is-active, .el-button--info:active{
background: green;
border-color: green;
color: #FFF;
}
/* 分页 */
.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li{
margin: 0 ;
background-color: #fff;
color: #606266;
border: 1px solid #e5e5e5;
min-width: 30px;
border-radius: 1px;
border-right: none;
padding: 0 16px;
height: 35px;
line-height: 35px;
}
.el-pagination.is-background .btn-next{
border-right: 1px solid #e5e5e5;
}
.el-pagination button, .el-pagination span:not([class*=suffix]){
height: 35px;
line-height: 35px;
}
.el-pagination.is-background .el-pager li:not(.disabled).active{
background-color:#0069FF
}
.el-input--mini .el-input__inner {
height: 35px;
line-height: 35px;
}
.el-pagination .el-select .el-input .el-input__inner{
border-radius: 2px;
}
/* 表格 */
.el-table--small td, .el-table--small th{
padding: 8px 0;
}
.el-table--mini, .el-table--small, .el-table__expand-icon{
font-size: 14px;
}
.el-table__body tr{
background: #E5E5E5;
}
.el-table--striped .el-table__body tr.el-table__row--striped td{
background: #FFFFFF;
}
/* 提示 */
.el-tooltip__popper{
padding: 6px 12px;
border-radius:2px;
}
.el-tooltip__popper.is-light{
background:rgba(255,255,255,1);
box-shadow:0px 2px 4px 0px rgba(0,0,0,0.13);
border: none;
color: #666666;
}
/* dialog */
.el-dialog__title{
font-size: 15px;
color: #FFFFFF;
}
.el-dialog__header{
padding:8px 20px 6px;
background: #3BB7FF;
}
.el-dialog__headerbtn{
top: 12px;
}
.el-dialog__headerbtn .el-dialog__close{
color: #FFFFFF;
}
.el-dialog__footer{
background:#F6F6F6 ;
}
.dialog-footer .el-button--small {
padding: 9px 17px;
font-size: 14px;
}
.el-dialog__footer {
padding: 8px 27px 8px;
}
/* dialog元素 */
.el-dialog .el-input--small .el-input__inner{
height: 26px;
line-height: 26px;
}
.el-dialog__body{
padding: 30px 34px;
}
.el-dialog .el-select--small{
width: 100%;
}
/* .el-dialog .el-form-item--small .el-form-item__content,.el-dialog .el-form-item--small .el-form-item__label{
line-height: 26px;
} */
.el-switch__core{
height: 13px;
}
.el-switch__core:after{
width: 9px;
height: 9px;
}
.el-switch.is-checked .el-switch__core::after {
left: 100%;
margin-left: -10px;
}
.el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
margin-bottom: 4px;
}
\ No newline at end of file \ No newline at end of file
$main-color:#0069FF;
$font-color:#555555;
$white-font-color:#ffffff;
$white-back-color:#ffffff;
$bodyback-color:#f5f7f9;
$border-color:#e5e5e5;
$title-color:#f4f4f4;
$title-backgroud:#f3f3f3;
$dialog-title:#3BB7FF;
body{
margin: 0;
color: $font-color;
font-family: "微软雅黑";
font-size: 14px;
background: $bodyback-color;
}
input{
font-family: "微软雅黑";
}
a:link{
text-decoration:none;
/* 指正常的未被访问过的链接*/
}
a:visited{
text-decoration:none;
/*指已经访问过的链接*/
}a:hover{
text-decoration:none;
/*指鼠标在链接*/
}
a:active{
text-decoration:none;
/* 指正在点的链接*/
}
.inputBox{
display: inline-block;
width: 150px;
}
.innnerBox{
padding: 10px;background: #FFFFFF;margin: 10px;
}
.selectBox{
width:150px;
display: inline-block;
}
.blue{
.tableSpanBorder{
display: inline-block;
height: 18px;
border-left:2px solid #E5E5E5;
margin: 0 17px;
position: relative;
top:3px;
}
.headers{
background: $main-color;
line-height: 65px;
height: 65px;
}
.logoImg{
width: 136px;
margin-top: 14px;
}
.headRight{
float: right;
span{
color:$white-font-color
}
img{
position: relative;
top: 10px;
width: 32px;
margin-left: 72px;
}
.exit{
margin:{
right: 90px;
left: 12px;
}
cursor: pointer;
}
}
.nav{
height:40px;
background: $white-back-color;
}
.contentBox{
padding: 12px;
}
}
.detaiCon span{
display: inline-block;
width: 120px;
}
.arrow{
position: absolute;
font-size: 38px;
top: 43%;
cursor: pointer;
color:$dialog-title;
}
.leftArrow{
@extend .arrow;
left: -27px;
}
.rightArrow{
@extend .arrow;
right: -27px;
}
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br />
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
>vue-cli documentation</a
>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
target="_blank"
rel="noopener"
>babel</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
target="_blank"
rel="noopener"
>router</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
target="_blank"
rel="noopener"
>vuex</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
target="_blank"
rel="noopener"
>eslint</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-unit-mocha"
target="_blank"
rel="noopener"
>unit-mocha</a
>
</li>
</ul>
<h3>Essential Links</h3>
<ul>
<li>
<a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
</li>
<li>
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
>Forum</a
>
</li>
<li>
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
>Community Chat</a
>
</li>
<li>
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
>Twitter</a
>
</li>
<li>
<a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
</li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li>
<a href="https://router.vuejs.org" target="_blank" rel="noopener"
>vue-router</a
>
</li>
<li>
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
</li>
<li>
<a
href="https://github.com/vuejs/vue-devtools#vue-devtools"
target="_blank"
rel="noopener"
>vue-devtools</a
>
</li>
<li>
<a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
>vue-loader</a
>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
rel="noopener"
>awesome-vue</a
>
</li>
</ul>
</div>
</template>
<script>
export default {
name: "HelloWorld",
props: {
msg: String
}
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
<template>
<div style="width: 100%;height: 100%;position: relative;">
<p style="position: absolute;top: 113px;z-index: 99;text-align: center;width: 100%;" v-if="noIE">请选择IE9以上版本查看视频!</p>
<object v-show="videoShow" id="nvrTotalOcx" name="nvrTotalOcx"
classid="CLSID:96DFBBAF-4220-4978-9681-4ABA534A7718"
codebase="./static/OcxInstall/VionNvrVideoInstall.exe#version=1,0,24"
style="width: 100%; height:100%;">
<param name="BorderStyle" value="1" />
<param name="MousePointer" value="0" />
<param name="Enabled" value="1" />
<param name="Min" value="0" />
<param name="Max" value="10" />
<embed wmode="opaque"/>
<param name="wmode" value="transparent"/>
</object>
<!--安装弹框-->
<el-dialog title="提示" :visible.sync="stepDialogVisible" width='252px' :close-on-click-modal='false' @close="stepClose">
<span>本网站需要安装视频插件才可正常使用,请安装完成后请手动重启浏览器</span>
<div slot="footer" class="dialog-footer">
<el-button @click="stepDialogVisible = false">关闭</el-button>
</div>
</el-dialog>
<!--更新弹框-->
<el-dialog title="提示" :visible.sync="updateDialogVisible" width='252px' :close-on-click-modal='false' @close="stepClose">
<span>该网站当前视频插件版本为{{currentVersion}},可能导致部分功能不完善,请更新到最新版本1.0.33</span>
<div slot="footer" class="dialog-footer">
<el-button @click="updateDialogVisible = false">关闭</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default{
data(){
return{
videoShow:true,
noIE:false,
currentVersion:0,
updateDialogVisible:false,
stepDialogVisible:false
}
},
mounted(){
setTimeout(()=>{
this.initVideo();
},300)
},
methods:{
stepClose(){
this.videoShow=true;
},
initVideo(){
var ieVer=this.IEVersion();
if(ieVer==7||ieVer==8||ieVer==6||ieVer=='-1'){
this.noIE=true
}else{
this.noIE=false
try{
this.currentVersion=document.getElementById('nvrTotalOcx').GetOcxVersion();
var versionArr=this.currentVersion.split('.');
var versionNum=0;
versionArr.forEach((item,index,arr)=>{
versionNum=versionNum+Number(item);
})
if(versionNum<34){
this.videoShow=false;
this.updateDialogVisible=true;
window.open('./OcxInstall/NvrVideoInstall_1.0.33.exe')
}
}catch(e){
this.videoShow=false;
this.stepDialogVisible=true;
window.open('./OcxInstall/NvrVideoInstall_1.0.33.exe')
return false
}
}
if(typeof nvrTotalOcx != 'undefined'){
var testStr = 'Null';
nvrTotalOcx.Init(0, testStr, 1);
nvrTotalOcx.SetSingleWindow(true);
nvrTotalOcx.SetParam("VideoSize", 0);
var medianame = '视频0';
// var hostname = window.location.hostname;
var hostname = '192.168.9.120';
var port=8554;
var url = "rtsp://"+hostname+":"+port+"/ch0";
nvrTotalOcx.PlayRealVideo(url,1,'video',hostname,0);
window.onbeforeunload=function(){
nvrTotalOcx.CloseVideoByChannelnum(1)
}
}
},
IEVersion() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
if(isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if(fIEVersion == 7) {
return 7;
} else if(fIEVersion == 8) {
return 8;
} else if(fIEVersion == 9) {
return 9;
} else if(fIEVersion == 10) {
return 10;
} else {
return 6;//IE版本<=7
}
} else if(isEdge) {
return 'edge';//edge
} else if(isIE11) {
return 11; //IE11
}else{
return -1;//不是ie浏览器
}
},
hideHanlde(){
this.videoShow=false;
},
showHanlde(){
this.videoShow=true;
}
}
}
</script>
<style>
</style>
import Vue from "vue";
import App from "./App.vue";
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import router from "./router";
import store from "./store";
import resetCss from './assets/resetElementCss/index.css'
import api from './api/install'
import echarts from 'echarts'
import './assets/icon/iconfont.css'
import moment from 'moment'
import {buildCode} from './assets/js/buildcodes.js'
Vue.prototype.$echarts = echarts;
Vue.prototype.$moment = moment;
Vue.prototype.$buildCode = buildCode;
Vue.use(api)
Vue.use(ElementUI, { size: 'small', zIndex: 3000 });
Vue.use(resetCss);
Vue.config.productionTip = false;
new Vue({
router,
store,
render: h => h(App)
}).$mount("#app");
import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
const routes = [
{
path: "/",
name: "home",
component: resolve => require(['../views/Home.vue'], resolve),
children:[
{
path: "/map",
name: "mapShow",
component: resolve => require(['../views/mapShow/index.vue'], resolve),
},
{
path: "/task/sceneSet",
name: "sceneSet",
component: resolve => require(['../views/sceneManage/index.vue'], resolve),
},
{
path: "/task/taskSet",
name: "taskSet",
component: resolve => require(['../views/taskManage/index.vue'], resolve),
},
{
path: "/search/vehicleSearch",
name: "taskSet",
component: resolve => require(['../views/search/vehicleSearch.vue'], resolve),
}
]
},
{
path: "/login",
name: "login",
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: resolve => require(['../views/Login.vue'], resolve)
}
];
const router = new VueRouter({
mode: "history",
base: process.env.BASE_URL,
routes
});
export default router;
// 异步操作中需要用到 increment 方法,所以需要导入 types.js 文件
import types from './types'
const actions= {
incrementAsync({ commit, state }) {
// 异步操作
var p = new Promise((resolve, reject) => {
setTimeout(() => {
resolve()
}, 3000);
});
p.then(() => {
commit(types.INCREMENT);
}).catch(() => {
console.log('异步操作');
})
}
}
// 最后导出
export default actions;
\ No newline at end of file \ No newline at end of file
// 因为数据从 user.js 中获取,所以需要引入该文件
import user from './modules/login'
const getters = {
isEvenOrOdd(state){
// 注意数据是从 user.js 中获取的,所以写成 user.state.count
return user.state.count % 2 == 0 ? "偶数" : "奇数"
}
}
// 并导出
export default getters;
\ No newline at end of file \ No newline at end of file
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
import getters from './getters'
import actions from './actions'
import users from './modules/login'
// 导出 store 对象
export default new Vuex.Store({
getters,
actions,
modules:{
users
}
})
\ No newline at end of file \ No newline at end of file
// 导入 types.js 文件
import types from "./../types";
const state ={
atoken:'',
algolist:[],
storeconfslist:[],
count:5
}
// 定义 getters
var getters ={
count(state){
return state.count
}
}
const actions ={
increment({ commit, state }){
// 此处提交的事件与下方 mutations 中的 types.INCREMENT 对应
//与原来 commit('increment') 的原理相同,只是把类型名换成了常量
commit(types.INCREMENT)
},
decrement({commit,state}){
if (state.count>10) {
// 此处提交的事件与下方 mutations 中的 types.DECREMENT 对应
commit(types.DECREMENT)
}
}
}
const mutations ={
// 此处的事件为上方 actions 中的 commit(types.INCREMENT)
[types.INCREMENT](state){
state.count++
},
// 此处的事件为上方 actions 中的 commit(types.DECREMENT)
[types.DECREMENT](state){
state.count--
},
[types.ATOKEN](state,atoken){
state.atoken=atoken;
},
[types.ALGO](state,list){
state.algolist=list;
},
[types.STORECONF](state,list){
state.storeconfslist=list;
}
}
// 最后统一导出
export default {
state,
getters,
actions,
mutations
}
\ No newline at end of file \ No newline at end of file
//定义常量,使用常量替代 mutation 事件类型
const INCREMENT = 'INCREMENT'
const DECREMENT = 'DECREMENT'
const ATOKEN = 'ATOKEN'
const ALGO = 'ALGO'
const STORECONF = 'STORECONF'
export default {
INCREMENT,
DECREMENT,
ATOKEN,
ALGO,
STORECONF
}
\ No newline at end of file \ No newline at end of file
<template>
<div class="about">
<h1>This is an about page</h1>
</div>
</template>
<template>
<div class="home">
<el-container>
<el-header class="headers">
<img class="logoImg" src="../assets/img/home/logo.png" alt="">
<div class="headRight">
<span>2019-11-15 16:50 星期一</span>
<img src="../assets/img/home/user.png" alt="">
<span class="exit">退出<i class="el-icon-arrow-down"></i></span>
</div>
</el-header>
<el-container style="min-height:calc(100vh - 64px);">
<el-aside width="254px">
<el-menu default-active="/map" class="el-menu-vertical-demo" :collapse="isCollapse" @select="handleSelect">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">首页</span>
</template>
<el-menu-item index="/map"> <i class="el-icon-location"></i>地图展示</el-menu-item>
</el-submenu>
<el-submenu index="2">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">任务管理</span>
</template>
<el-menu-item index="/task/sceneSet"> <i class="el-icon-location"></i>场景配置</el-menu-item>
<el-menu-item index="/task/taskSet"> <i class="el-icon-location"></i>任务配置</el-menu-item>
</el-submenu>
<el-submenu index="3">
<template slot="title">
<i class="el-icon-document"></i>
<span slot="title">智能检索</span>
</template>
<el-menu-item index="/search/vehicleSearch"> <i class="el-icon-location"></i>过车记录检索</el-menu-item>
</el-submenu>
<el-submenu index="4">
<template slot="title">
<i class="el-icon-document"></i>
<span slot="title">资源管理</span>
</template>
</el-submenu>
</el-menu>
</el-aside>
<el-main>
<div class="nav"></div>
<router-view></router-view>
</el-main>
</el-container>
</el-container>
</div>
</template>
<script>
// import HelloWorld from "@/components/HelloWorld.vue";
export default {
name: "home",
data(){
return{
isCollapse: false,
conHeight:0
};
},
created(){
this.$router.push('/map')
},
mounted(){
this.conHeight=window.innerHeight-65;
console.log(this.conHeight)
},
components: {
// HelloWorld
},
methods:{
handleSelect(key, keyPath) {
this.$router.push(key)
console.log(key, keyPath);
}
}
};
</script>
\ No newline at end of file \ No newline at end of file
<template>
<div id="login" :style="{height:innerHeight+'px'}">
<h1>视频分析综合管理平台</h1>
<div class="form-horizontal">
<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<input type="text" class="form-control" v-model="username" id="username" placeholder="请输入用户名">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<input type="password" class="form-control" v-model="password" id="password" placeholder="请输入密码">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<button class="btn" @click.stop="login">登录</button>
</div>
</div>
<!--<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<p>北京文安智能技术股份有限公司</p>
<p>v2.0.0.1</p>
</div>
</div>-->
</div>
</div>
</template>
<script>
let sha1 = require('js-sha1');
import types from '../store/types.js'
export default {
name: 'Login',
data() {
return {
username: '',
password: '',
innerHeight:0
}
},
methods: {
initHeight(){
this.innerHeight=window.innerHeight;
},
login(){
this.$api.login.login({
user_name: this.username,
// user_password: this.password
user_password: sha1(this.password),
}).then(res => {
if(!res.ecode){
this.$store.commit(types.ATOKEN,res.token);
// 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(m.data.menu_list))
// 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)
// 处理登录用户权限菜单显示问题;
//算法配置列表
this.algoList();
//存储配置列表
this.storeConfList();
//code列表
this.getCodeList();
this.$router.push('/map')
}
}).catch((err) => {
})
},
algoList() {
this.$api.login.algocombs({
limit: '',
algo_set: 'video'
}).then(res => {
if(!res.ecode){
this.$store.commit(types.ALGO,res.list_data);
}
}).catch((err) => {
})
},
storeConfList(){
this.$api.login.storeconfs({
offset: 0,
limit: ''
}).then(res => {
if(!res.ecode){
this.$store.commit(types.STORECONF,res.list_data);
}
}).catch((err) => {
})
},
getCodeList(){
this.$api.login.cates().then(res => {
res.list_data.forEach(item=>{
this.$api.login.codes({
},item.cate_unid).then(res => {
// 存储code列表
window.localStorage.setItem(item.name,JSON.stringify(res.list_data))
// 存储单独code
res.list_data.forEach(chilItem=>{
window.localStorage.setItem(item.name+'-'+chilItem.code,chilItem.name)
})
}).catch((err) => {
})
})
}).catch((err) => {
})
}
},
watch: {},
mounted() {
},
created() {
this.initHeight();
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.loginTitle{
height:60px;
background: #dcdcdc;
position: relative;
}
.loginTitle>div{
position: absolute;
text-align: left;
/*left: 5%;*/
height: 60px;
/*margin-top: 15px;*/
/*background: url(../assets/daer.jpg) no-repeat;*/
padding-left: 50px;
background-size: 100% 60px;
width:150px
}
.loginTitle>div span:first-child{
position: absolute;
left:50px;
top: -5px;
font-weight: bold;
font-size: 18px;
font-family: "隶书";
}
.loginTitle>div span:last-child{
font-weight: 500;
font-size: 12px;
font-family: Aparajita;
position: absolute;
left:50px;
top: 16px;
}
.form-horizontal {
width: 450px;
height: 350px;
background: url(../assets/img/login/233.png) no-repeat;
background-size: 500px 430px;
position: absolute;
left: 58%;
top: 200px;
padding-top:50px;
border-radius: 10px;
}
h1 {
color: #F5F5F5;
height: 40px;
line-height: 40px;
padding: 60px 0px;
position: absolute;
left:10%;
top:220px;
font-size:50px;
letter-spacing: 8px;
text-shadow: 5px 5px 5px #000
}
#login {
text-align: center;
position: relative;
background: url(../assets/img/login/2333.png) no-repeat 0 0;
background-size:cover
}
#login input {
color: #fff;
background: rgba(255,255,255,.5);
border-radius: 0;
border: none;
border: 1px solid #86B1DB;
box-shadow: none;
margin-top: 20px;
height: 40px;
/* line-height: 40px; */
border-radius: 5px;
font-size: 16px;
}
#login input:focus {
outline: none;
box-shadow: none;
}
button {
width: 60%;
margin-top: 40px;
background: #09cef7;
color: #fff!important;
height: 40px;
font-size: 20px;
}
button:hover {
color: #D6D9DF
}
p {
color: #fff;
margin: 0;
}
p:nth-child(1) {
padding-top: 15px
}
</style>
<template>
<div style="padding: 12px;">
<div style="float: left;">
<div class="infoBox">
<div class="infoChild">
<img src="../../assets/img/map/syn.png" alt="">
<span class="textCon">
<div>分析资源</div>
<div class="colorText"><span>64</span></div>
</span>
</div>
<div class="infoChild">
<img src="../../assets/img/map/car.png" alt="">
<span class="textCon">
<div>运行路数</div>
<div class="colorText"><span>47</span></div>
</span>
</div>
<div class="infoChild">
<img src="../../assets/img/map/warn.png" alt="">
<span class="textCon">
<div>运行异常资源</div>
<div class="colorText"><span>7</span></div>
</span>
</div>
<div class="infoChild">
<img src="../../assets/img/map/total.png" alt="">
<span class="textCon">
<div>数量总数</div>
<div class="colorText"><span>23548</span></div>
</span>
</div>
</div>
<div id="map" class="maps">
<div class="inMapBox">
<div class="lDiv" :key="index" v-for="(item,index) in typeList">
<span class="ltext">{{item.event_name}}</span>
<span class="lnum">{{item.total_num}}</span>
<div style="clear: both;"></div>
</div>
</div>
</div>
<div>
<div style="float: left; margin-right: 8px;">
<div class="numBox">
<div class="title">今日抓拍量</div>
<span class="num">{{snap_num}}</span>
<img src="../../assets/img/map/catch.png" alt="" class="catch">
</div>
<div class="numBox">
<div class="title">今日审核量</div>
<span class="num">{{audit_num}}</span>
<img src="../../assets/img/map/back.png" alt="" class="backSea">
</div>
</div>
<div style="float: left;background: #FFFFFF;">
<div class="title">今日事件趋势</div>
<div id="myChart" style="width: 523px; height: 224px;"></div>
</div>
</div>
<div style="clear: both;"></div>
</div>
<div style="float: left;">
<div style="width: 789px;height: 446px;position: relative;margin-bottom: 11px;">
<ocxplay ref="ocx"></ocxplay>
</div>
<div style="background: #FFFFFF;width: 789px">
<div class="title">实时事件</div>
<el-table
height="349"
:data="tableData"
style="width: 100%;padding: 11px;">
<el-table-column
type="index"
align="center"
label="序号">
</el-table-column>
<el-table-column
align="center"
prop="eventType"
label="事件类型"
:formatter="eventFormatter">
</el-table-column>
<el-table-column
align="center"
prop="locationName"
label="地点名称">
</el-table-column>
<el-table-column
align="center"
prop="startDt"
width="180"
label="首次抓拍时间">
</el-table-column>
<el-table-column
align="center"
prop="endDt"
width="180"
label="最后抓拍时间">
</el-table-column>
<el-table-column
align="center"
prop="operation"
label="操作">
<template slot-scope="scope">
<el-tooltip content="详情及审核" placement="bottom" effect="light" :visible-arrow=false>
<img src="../../assets/img/home/look.png" alt="" class="edit" @click="editVideo(scope.$index, scope.row)">
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<img src="../../assets/img/home/del.png" alt="" class="del" @click="delFun(scope.$index, scope.row)">
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<div style="clear: both;"></div>
</div>
<editset :setvisible.sync="setShow" :archiveunid="archiveUnid"></editset>
</div>
</template>
<script>
import {inherits} from 'ol/util.js';
import Map from 'ol/Map';
import View from 'ol/View';
import Feature from 'ol/Feature'; //元素
import Overlay from 'ol/Overlay'; //弹出框
import {toStringHDMS} from 'ol/coordinate';
import {fromLonLat, toLonLat} from 'ol/proj';
import {Tile as TileLayer, Vector as VectorLayer, VectorTile,Heatmap as HeatmapLayer} from 'ol/layer'; //瓦片图层 , 矢量图层等基础图层
import {Cluster, OSM, Vector as VectorSource, XYZ, TileJSON} from 'ol/source';
import KML from 'ol/format/KML.js';
import {
defaults,
Select,
DragBox,
Pointer,
DragAndDrop,
Draw,
defaults as defaultInteractions,
Pointer as PointerInteraction
} from 'ol/interaction'; //交互,选择,画框等
import {Circle as CircleStyle, Fill, Stroke, Style, Text, Icon} from 'ol/style'; //添加图层,点,圆等的样式调节
import {Point, Geometry, LineString} from 'ol/geom'
import GeoJSON from 'ol/format/GeoJSON.js';
import 'ol/ol.css' //地图默认样式
import editset from '../taskManage/editSet'
import ocxplay from '../../components/ocxplay.vue'
import moment from 'moment'
var map = '';
var Views = '';
export default{
data(){
return{
typeList:[],
tableData:[],
eventTypeList:[],
setShow:false,
archiveUnid:0,
startDt:moment(moment().format('YYYY-MM-DD')+' 00:00:00').utc().format('YYYY-MM-DD HH:mm:ss'),
endDt:moment(moment().format('YYYY-MM-DD')+' 23:59:59').utc().format('YYYY-MM-DD HH:mm:ss'),
snap_num:0,
audit_num:0
}
},
components:{
editset,ocxplay
},
mounted(){
this.getNum();
setTimeout(()=>{
this.drawLine();
this.getEventTypeList();
this.InitMap();
},300)
},
methods:{
getNum(){
this.$api.map.homeNum({
startDt:this.startDt,
endDt:this.endDt,
_t: Date.parse(new Date())/1000
}).then((res)=>{
this.typeList=res.list_data
}).catch((error)=>{
})
this.$api.map.homeCatch({
startDt:this.startDt,
endDt:this.endDt,
_t: Date.parse(new Date())/1000
}).then((res)=>{
this.snap_num=res.snap_num;
this.audit_num=res.audit_num;
}).catch((error)=>{
})
},
getEventTypeList(){
this.$api.map.eventTypeData({
_t: Date.parse(new Date())/1000
}).then((res)=>{
this.eventTypeList=res.list_data;
this.getData()
})
},
getData(){
this.$api.map.archive({
startDt:this.startDt,
endDt:this.endDt,
_t: Date.parse(new Date())/1000
}).then((res)=>{
this.tableData=res.content;
})
},
editVideo(index,row){
this.setShow=true;
this.archiveUnid=row.archive_unid;
},
delFun(index,row){
this.$api.map.delEvent({},row.archive_unid).then((res)=>{
console.log(res)
})
console.log(row)
},
eventFormatter(row, column, cellValue, index){
let value=''
this.eventTypeList.forEach(item=>{
if(item.code==cellValue){
value=item.name;
}
})
return value;
},
drawLine(){
this.$api.map.homeLine({
startDt:this.startDt,
endDt:this.endDt,
_t: Date.parse(new Date())/1000
}).then((res)=>{
let xData=[];
let seriesData=[];
let legendData=[];
res.list_data.forEach(item=>{
if(!xData.includes(item.hour)){
xData.push(item.hour);
}
if(!legendData.includes(item.event_name)){
legendData.push(item.event_name);
seriesData.push({
name: item.event_name,
type: 'line',
data: [item.total_num]
})
}else{
seriesData.forEach(serItem=>{
if(serItem.name==item.event_name){
serItem.data.push(item.total_num)
}
})
}
})
console.log(seriesData)
// 基于准备好的dom,初始化echarts实例
let myChart = this.$echarts.init(document.getElementById('myChart'))
// 绘制图表
myChart.setOption({
tooltip: {},
color:['#0069FF'],
xAxis: {
data: xData,
axisTick:false,
axisLine:{
lineStyle:{
color:'#d9d9d9'
}
},
axisLabel:{
color:'#666666',
fontSize:'10px'
}
},
grid:{
left:38,
bottom:30,
top:13,
right:21
},
yAxis: {
axisTick:false,
axisLine:{
lineStyle:{
color:'#d9d9d9'
}
},
axisLabel:{
color:'#666666',
fontSize:'10px'
}
},
series: seriesData
});
}).catch((error)=>{
console.log('e2',error)
})
},
InitMap(){
let _this = this;
//坐标
//
var heatData = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [116.357068,39.954021, 0]
},
"properties": {
"name": "M 5 - 2012 Dec 25, PAKISTAN"
}
}]
}
for(var i =0; i< 300; i++){
let c = Math.random(1)*1000
let e = Math.random(1)*100
let b = (116.357068 * 1000000 + i*c)/1000000;
let d = (39.954021 * 1000000 + i*e)/1000000
let a = {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [b,d, 0]
},
"properties": {
"name": "M 5 - 2012 Dec 25, PAKISTAN" +i
}
}
heatData.features.push(a)
}
var vectorSources = new VectorSource({
features: (new GeoJSON()).readFeatures(heatData,{
                                                    dataProjection : 'EPSG:4326'
                                                  })
});
var path = "http://192.168.9.62:20080/static/pics/qingdaoMap/roadmap/{z}/{x}/{y}.png"
var offlineMapLayer = new TileLayer({
source: new XYZ({
// 设置本地离线瓦片所在路径,由于例子里面只有一张瓦片,页面显示时就只看得到一张瓦片。
url: path
})
});
Views = new View({
projection: 'EPSG:4326',
zoom: 2,// 并且定义地图显示层级为2
minZoom:13,
maxZoom:18,
center:[120.324447,36.064594]
})
map = new Map({
// 设置地图图层
layers: [
// 创建一个使用Open Street Map地图源的瓦片图层
offlineMapLayer,
],
Interactions: [
defaults,
Select,
DragBox
],
loadTilesWhileAnimating:true,
// 设置显示地图的视图
view:Views ,
// 让id为map的div作为地图的容器
target: 'map',
});
var heatmapvector = new HeatmapLayer({
source: vectorSources,
blur: parseInt(20, 6),
radius:parseInt(3, 5),
});
map.addLayer(heatmapvector);
// 添加一个使用离线瓦片地图的层
var CameraVertorlayer = new VectorLayer({
source: _this.addCameraLayer([120.324447,36.064594],"相机A")
});
map.addLayer(CameraVertorlayer);
this.addLayer();
map.on('click',(e)=>{
var pixel = map.getEventPixel(e.originalEvent);
console.log(pixel);
//点击相机标注点
map.forEachFeatureAtPixel(pixel,function(feature){
var coodinate = e.coordinate;
_this.unid = feature.getProperties().unid;
Overlay.setPosition(coodinate);
map.addOverlay(Overlay);
});
});
},
addLayer(data){
var pos = data;
var marker = new Overlay({
position: pos,
positioning: 'center-center',
element: document.getElementById('canvasDiv')
});
map.addOverlay(marker);
},
addCameraLayer(coordinate,phonetext) {
let vectorSource = new VectorSource({id:1});
let icon = new Feature({
geometry: new Point(coordinate),
unid:'1'
});
let color = '#156BB1'; //设置气泡颜色
//添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致
let svg = '<svg t="1540524238971" class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"><defs><style type="text/css"></style></defs>'+
'<path fill="' + color + '" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>'
let cameraIcon = new Image();
cameraIcon.src = 'data:image/svg+xml,' + escape(svg);
icon.setStyle(new Style({ //设置样式和大小
image: new Icon({
img: cameraIcon,
crossOrigin: 'anonymous',
// src:'http://192.168.9.233:20080/static/pics/cache/biaozhu.svg',
imgSize: [28, 28],
zIndex:20,
marginTop:100
}),
text:new Text({
text:phonetext,
textBaseline: 'top',
font: 'normal 12px 微软雅黑',
lineHeight:'0px',
fill: new Fill({
color: 'red',
}),
}),
stroke: new Stroke({
color: 'red',
width: 21,
marginTop:100,
})
}));
vectorSource.addFeature(icon);
return vectorSource;
},
addFeature(){
function createStyle(src, img) {
return new Style({
image: new Icon(/** @type {module:ol/style/Icon~Options} */ ({
anchor: [0.5, 0.96],
crossOrigin: 'anonymous',
src: src,
img: img,
imgSize: img ? [img.width, img.height] : undefined
}))
});
}
var iconFeature = new Feature(new Point([113.338591,34.506910]));
iconFeature.set('style', createStyle('../../../assets/img/dianli.png', undefined));
var CameraVertorlayer = new VectorLayer({
source: iconFeature,
id:1
});
map.addLayer(this.CameraVertorlayer);
},
}
}
</script>
<style scoped="scoped">
.infoBox{
margin-bottom: 8px;
}
.infoChild{
width: 204px;
height: 70px;
display: inline-block;
background: #FFFFFF;
margin-right: 8px;
}
.infoChild:nth-child(1) img{
width: 27px;
height: 27px;
margin: 22px 20px 21px 40px;
}
.infoChild:nth-child(2) img{
width: 30px;
height: 27px;
margin: 22px 22px 21px 37px;
}
.infoChild:nth-child(3) img{
width: 28px;
height: 28px;
margin: 22px 22px 20px 34px;
}
.infoChild:nth-child(4) img{
width: 27px;
height: 28px;
margin: 22px 22px 20px 34px;
}
.textCon{
display: inline-block;
vertical-align: top;
font-size: 12px;
color: #666666;
margin-top: 14px;
}
.textCon span{
font-size: 20px;
margin-right: 2px;
}
.colorText{
margin-top: 6px;
color: #444444;
}
.ol-control button{
display:none!important;
background:red!important
}
.ol-popup {
position: absolute;
background-color: #eeeeee;
-webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
padding: 15px;
border-radius: 10px;
border: 1px solid #cccccc;
bottom: 12px;
left: -50px;
min-width: 280px;
}
.ol-popup:after,
.ol-popup:before {
top: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.ol-popup:after {
border-top-color: #eeeeee;
border-width: 10px;
left: 48px;
margin-left: -10px;
}
.ol-popup:before {
border-top-color: #cccccc;
border-width: 11px;
left: 48px;
margin-left: -11px;
}
.ol-popup-closer {
text-decoration: none;
position: absolute;
top: 2px;
right: 8px;
}
.ol-popup-closer:after {
content: "✖";
}
.popup-content{
height:300px;
overflow:auto
}
.pop-info-box{
overflow: hidden;
border-bottom :2px solid #fff
}
.pop-img-box {
float: left;
height: 100px;
width :120px;
img{
height: 100%;
width: 100%;
}
}
.pop-info{
float: left;
padding-left: 20px;
width :100px
}
.map-box {
position: relative;
background :#f8f8f8;
border-radius: 10px;
.content-info{
position :absolute;
z-index :1000;
color: red
}
}
.numBox{
width: 307px;
height: 125px;
background: #FFFFFF;
color: #444444;
position: relative;
}
.numBox:nth-child(1){
margin-bottom: 6px;
}
.num{
font-size: 30px;
margin: 27px 0 0 13px;
display: inline-block;
font-weight:bold;
}
.catch{
width: 57px;
position: absolute;
top:59px;
right: 16px;
}
.backSea{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
.title{
padding: 12px 0 0 11px;
color: #444444;
font-size: 16px;
}
.inMapBox{
background: #f8f8f8;
display: inline-block;
position: absolute;
z-index: 99;
border: 1px solid #E5E5E5;
border-bottom: none;
top: 5px;
left: 5px;
box-shadow:0px 2px 4px 0px rgba(0,0,0,0.18);
}
.lDiv{
width: 110px;
height: 36px;
line-height:36px;
border-bottom: 1px solid #E5E5E5;
}
.lDiv span{
display: inline-block;
text-align: center;
font-size: 12px;
float: left;
}
.ltext{
width: 71px;
height: 100%;
border-right:1px solid #E5E5E5;
}
.lnum{
width: 37px;
}
.maps{
height: 491px;
width:840px;
margin-bottom: 8px;
position: relative;
}
.canvasDiv{
height :30px;
width :30px;
background :red;
border-radius :30px;
color: #ffffff;
font-size :12px;
text-align :center;
line-height :30px;
z-index :10;
opacity :0.5;
}
.pl3{
padding-left: 3px
}
.rotate-north {
top: 65px;
left: .5em;
}
.ol-touch .rotate-north {
top: 80px;
}
.canvasDiv{
height:30px;
width:30px;
border-radius: 25px;
background: rgba(255, 0, 0, 1);
transform: scale(0);
animation: myfirst 3s;
animation-iteration-count: infinite;
}
@keyframes myfirst{
to{
transform: scale(2);
background: rgba(0, 0, 0, 0);
}
}
.el-table th, .el-table tr{
background:rgba(248,249,250,1)!important;
}
.ol-overlaycontainer-stopevent{
display:none!important;
}
.alarm-active{
display :none
}
.alarm-makerbox{
display:block;
height :200px;
width: 200px;
border-radius :5px;
background: rgba(39, 41, 48, .9);
color: #ffffff;
font-family :'微软雅黑';
font-size :14px;
animation: op 1s;
-moz-animation: op 1s; /* Firefox */
-webkit-animation: op 1s; /* Safari 和 Chrome */
-o-animation: op 1s;
}
@keyframes op {
from {opacity: 0;}
to {opacity: 1;}
}
@-moz-keyframes op /* Firefox */
{
from {opacity: 0;}
to {opacity: 1;}
}
@-webkit-keyframes op /* Safari 和 Chrome */
{
from {opacity: 0;}
to {opacity: 1;}
}
@-o-keyframes op /* Opera */
{
from {opacity: 0;}
to {opacity: 1;}
}
.exit-alarm::after{
float :right;
height: 20px;
width :20px;
margin :5px;
content: "✖";
cursor: pointer;
}
.img-box{
width: 200px;
height :100px;
overflow :hidden;
img{
height :100%;
width :100%;
text-align: center
}
}
.info-list {
padding :1px 10px
}
.edit{
cursor: pointer;
width: 18px;
}
.play{
cursor: pointer;
width:17px;
}
.pause,.del{
cursor: pointer;
width: 12px;
}
.tableSpanBorder{
display: inline-block;
height: 18px;
border-left:2px solid #E5E5E5;
margin: 0 17px;
}
.lines{
display: inline-block;
width: 10px;
border-top:1px solid #cccccc ;
margin: 3px;
}
.el-table__body tr{
background: #FFFFFF!important;
}
</style>
<template>
<div>
<div class="contentBox">
<div class="leftCon">
<div class="titles">视频设备</div>
<div class="searchBox">
<el-input
placeholder="输入关键字进行过滤"
v-model="filterText">
</el-input>
</div>
<div class="treeBox">
<el-tree
:data="data"
:props="defaultProps"
default-expand-all
:filter-node-method="filterNode"
ref="tree">
</el-tree>
</div>
</div>
<div class="middleCon">
<div class="objectCon">
<ocxplay ref="ocx"></ocxplay>
</div>
<div>
<div style="float: left;" class="">
<el-table
height="284"
:data="sceneData"
stripe
border
style="width: 775px;margin-right: 12px;">
<el-table-column
type="index"
align="center"
width="100">
</el-table-column>
<el-table-column
align="center"
prop="num"
label="预设位编号">
</el-table-column>
<el-table-column
align="center"
prop="set"
label="预设位配置">
<template slot-scope="scope">
<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>
</template>
</el-table-column>
<el-table-column
align="center"
prop="type"
width="400"
label="参数设置">
<template slot-scope="scope">
<span class="tableBtn" @click="paramsSet(scope.$index, scope.row)">参数设置</span>
<span class="tableSpanBorder"></span>
<span class="tableBtn" @click="areaSet(scope.$index, scope.row)">区域设置</span>
<span class="tableSpanBorder"></span>
<span class="tableBtn" @click="markSet(scope.$index, scope.row)">标定设置</span>
<span class="tableSpanBorder"></span>
<span class="tableBtn" @click="timeSet(scope.$index, scope.row)">时间设置</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="handleBox">
<div class="handleTitle">基础操作</div>
<div class="operaBox">
<p>场景添加 <span class="iconfont icon-add-circle-s lefts"></span></p>
<p>轮循播放 <el-switch class="lefts" :width="22" v-model="loopStart" active-color="#0069FF" inactive-color="#cccccc"></el-switch></p>
<p>配置导入 <span class="iconfont icon-login lefts"></span></p>
<p>配置导出 <span class="iconfont icon-daochu lefts"></span></p>
<p>效果展示 <span class="iconfont icon-zhanshi lefts"></span></p>
</div>
</div>
</div>
</div>
<div class="rightCon">
<el-tabs v-model="activeName" @tab-click="handleClick" :stretch=true>
<el-tab-pane label="全部数据" name="first">
<div class="tabCon">
<div class="cardCon">
<img src="../../assets/img/map/back.png" alt="">
<div class="imginfo">
<span>车牌号码:无牌</span>
<span>车辆类型:小型轿车</span>
<span>车身颜色:黑</span>
<span>车辆品牌:丰田</span>
<span>违法类型:正常</span>
</div>
<div style="clear: both;"></div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="违法" name="second">违法</el-tab-pane>
<el-tab-pane label="事件" name="third">事件</el-tab-pane>
</el-tabs>
</div>
<div style="clear: both;"></div>
</div>
<paramset :visible.sync="paramshow"></paramset>
</div>
</template>
<script>
import ocxplay from '../../components/ocxplay.vue'
import paramset from './paramSet.vue'
export default {
data(){
return{
paramshow:false,
activeName:'first',
loopStart:true,
sceneData:[
{
num:1
},
{
num:1
},{
num:1
}
],
filterText: '',
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'
}
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
components:{
ocxplay,paramset
},
methods:{
handleClick(tab, event) {
console.log(tab, event);
},
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
editFun(index,row){
},
delFun(index,row){
console.log(row)
},
paramsSet(index,row){
this.paramshow=true;
console.log(row)
},
areaSet(index,row){
console.log(row)
},
markSet(index,row){
console.log(row)
},
timeSet(index,row){
console.log(row)
}
},
}
</script>
<style lang="scss" scoped>
.tabCon{
padding: 8px;
height: 770px;
}
.cardCon{
background: #F1F1F1;
padding: 7px;
}
.cardCon img{
width: 237px;
height: 133px;
float: left;
}
.imginfo{
float: left;
margin-left: 10px;
}
.imginfo span{
display: block;
margin-bottom: 6px;
}
.imginfo span:first-of-type{
margin-top: 7px;
}
.leftCon{
width: 210px;
background: #FFFFFF;
float: left;
}
.middleCon{
display: inline-block;
margin-left: 12px;
float: left;
}
.objectCon{
width: 980px;
height: 543px;
margin-bottom: 12px;
background: #FFFFFF;
}
.handleBox{
float: left;
width: 193px;
border:1px solid #F0F3F9;
}
.handleTitle{
height:40px;
background:#ACC1FF;
color: $white-font-color;
font-size:14px;
text-align: center;
line-height: 40px;
}
.operaBox{
padding: 1px 19px;
background: #FFFFFF;
}
.operaBox .lefts{
color: #CCCCCC;
font-size: 16px;
margin-left: 70px;
}
.operaBox .iconfont{
margin-left: 72px;
cursor: pointer;
}
.operaBox .iconfont:hover{
color: #3BB7FF;
}
.operaBox p{
margin:0;
margin-bottom: 24px;
}
.operaBox p:first-of-type{
margin-top: 24px;
}
.titles{
height:30px;
background:rgba(59,183,255,1);
color: $white-font-color;
font-size:14px;
padding-left: 13px;
line-height: 30px;
}
.searchBox{
padding: 10px;
}
.treeBox{
padding: 10px;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
.rightCon{
float: left;
background: #FFFFFF;
margin-left: 12px;
width: 409px;
}
</style>
\ No newline at end of file \ No newline at end of file
<template>
<div>
<el-dialog
ref="dialog"
title="提示"
:visible.sync="visible"
width="50%"
:before-close="handleClose">
<div>
<div class="leftCon">
<div class="searchBox">
<el-input
placeholder="输入关键字进行过滤"
v-model="filterText">
</el-input>
</div>
<el-tree
:data="data"
:props="defaultProps"
default-expand-all
:filter-node-method="filterNode"
ref="tree">
</el-tree>
</div>
<div class="rightCon">
<el-table
height="522"
:data="tableData"
stripe
border>
<el-table-column
align="center"
prop="num"
label="参数名">
</el-table-column>
<el-table-column
align="center"
prop="set"
label="预设位配置">
<template slot-scope="scope">
<span>{{scope.row.num}}</span>
</template>
</el-table-column>
<el-table-column
align="center"
prop="type"
label="说明">
<template slot-scope="scope">
<span>{{scope.row.num}}</span>
</template>
</el-table-column>
</el-table>
</div>
<div style="clear: both;"></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="visiblehide">取 消</el-button>
<el-button type="primary" @click="visiblehide">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default{
data(){
return{
tableData:[
{
num:1
},
{
num:1
},{
num:1
}
],
filterText: '',
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'
}
}
},
props:{
visible:{
type:Boolean,
default:false
},
},
methods:{
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
handleClose(done){
this.$emit('update:visible',false);
},
visiblehide(){
this.$emit('update:visible',false)
}
}
}
</script>
<style scoped="scoped" lang="scss">
.rightCon{
width: 608px;
margin-left: 12px;
float: left;
}
.leftCon{
float: left;
width: 250px;
border: 1px solid #CCCCCC;
border-radius: 4px;
padding: 10px;
min-height: 500px;
}
.titles{
height:30px;
background:rgba(59,183,255,1);
color: $white-font-color;
font-size:14px;
padding-left: 13px;
line-height: 30px;
}
.searchBox{
padding: 10px;
}
</style>
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="资源类型">
<span class="selectBox">
<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="inputBox">
<el-input placeholder="请输入相机名称" v-model="conditions.vchan_name"></el-input>
</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="inputBox">
<el-input placeholder="请输入车牌号码" v-model="conditions.plate"></el-input>
</span>
</el-form-item>
<el-form-item label="车辆类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.car_type" >
<el-option value="" label='全部'></el-option>
<el-option v-for='item in vehicleTypeList' :value="item.code" :key="item.code" :label='item.name'></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.car_color">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in vehicleColorList' :value="item.code" :key="item.code" :label='item.name'></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.logo_type">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in brandList' :value="item.code" :key="item.code" :label='item.name'></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.marker">
<el-option value="" label='全部'></el-option>
<el-option value="0" label='年检标志'></el-option>
<el-option value="1" label='摆件'></el-option>
<el-option value="2" label='吊坠'></el-option>
<el-option value="3" 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.special_type">
<el-option value="" label='全部'></el-option>
<el-option value="0" label='普通车辆'></el-option>
<el-option value="1" label='车辆运输车'></el-option>
<el-option value="2" label='危险品运输车'></el-option>
<el-option value="3" label='救护车'></el-option>
</el-select>
</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">导出</el-button>
</div>
<div>
<el-button type="success" class="block">批量删除</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
align="center"
width="55">
</el-table-column>
<el-table-column
prop="vehicle_plate_text"
align="center"
label="车牌号码">
</el-table-column>
<el-table-column
prop="vehicle_body_type_text"
align="center"
label="车辆类型">
</el-table-column>
<el-table-column
prop="vehicle_body_logo_text"
align="center"
label="车辆品牌">
</el-table-column>
<el-table-column
prop="vehicle_body_color_text"
align="center"
label="车身颜色">
</el-table-column>
<el-table-column
prop="RefinedFeature_text"
align="center"
label="标识物">
</el-table-column>
<el-table-column
prop="special_text"
align="center"
label="特殊车辆">
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="抓拍时间">
<template slot-scope="scope">
<span>{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
prop="location_name"
align="center"
label="抓拍地点">
</el-table-column>
<el-table-column
align="center"
label="操作">
<template slot-scope="scope">
<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>
<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>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="1000px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<img :src="detailImg" alt="" style="width: 100%;">
<el-form label-width="80px" inline>
<div>
<el-form-item label="车牌号码:">
<span>{{ detailObj.vehicle_plate_text }}</span>
</el-form-item>
<el-form-item label="车牌类型:">
<span>{{ detailObj.plate_type_text }}</span>
</el-form-item>
</div>
<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.location_name }}</span>
</el-form-item>
<el-form-item label="车辆品牌:">
<span>{{ detailObj.vehicle_body_logo_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="车辆类型:">
<span>{{ detailObj.vehicle_body_type_text }}</span>
</el-form-item>
<el-form-item label="车牌颜色:">
<span>{{ detailObj.plate_color_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="车身颜色:">
<span>{{ detailObj.vehicle_body_color_text }}</span>
</el-form-item>
<el-form-item label="标志物:">
<span>{{ detailObj.RefinedFeature_text }}</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 @click="detailDel">删 除</el-button>
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
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{
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,
source_type: 'pull_video_stream',
marker: '',
car_type: '',
car_color: '',
logo_type: '',
plate:'',
task_name:'',
curdelid:'',
vchan_name:'',
special_type:''
},
brandList:this.$buildCode.getCodeList('车辆品牌'),
vehicleTypeList:this.$buildCode.getCodeList('车辆类型'),
vehicleColorList:this.$buildCode.getCodeList('车身颜色'),
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
},
methods:{
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
type: 'warning'
});
return false;
}
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)
});
},
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;
let search_params = {
limit: this.pageSize,
offset: offset,
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'),
source_type: this.conditions.source_type,
vchan_name__like: this.conditions.vchan_name,
vehicle_type: this.conditions.car_type,
body_color: this.conditions.car_color,
logo_type: this.conditions.logo_type,
plate_number__like: this.conditions.plate,
marker: this.conditions.marker,
event_type: '',
special_type:this.conditions.special_type,
task_name: this.conditions.task_name ? this.conditions.task_name.replace(/\s\s*/g, '') : this.conditions.task_name
}
this.$api.search.vehicleList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
})
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
}
this.detailVisible=true;
},
delFun(index,row){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({
},row.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(index);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
},
detailDel(){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({},this.detailObj.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(this.currentIndex,1);
this.detailObj = Object.assign({},this.formattterData[this.currentIndex]);
this.getImg(this.formattterData[this.currentIndex].pics[0].pic_unid);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
}
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file \ No newline at end of file
<template>
<div>
<el-dialog
title="任务配置修改"
:visible.sync="setvisible"
width="450px"
:before-close="handleClose">
<div>
<el-form label-position="left" label-width="80px" :model="formData">
<el-form-item label="任务名称">
<el-input v-model="formData.task_name" placeholder="请输入任务名称"></el-input>
</el-form-item>
<el-form-item label="算法类型">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false>
<el-option
key="1"
label="全部"
value="">
</el-option>
<el-option
key="2"
label="222"
value="2">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="场景占用">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false>
<el-option
key="1"
label="全部"
value="">
</el-option>
<el-option
key="2"
label="222"
value="2">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间计划">
<el-input v-model="formData.type"></el-input>
</el-form-item>
<el-form-item label="时间">
<el-input v-model="formData.type"></el-input>
</el-form-item>
<el-form-item label="存储配置">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false>
<el-option
key="1"
label="全部"
value="">
</el-option>
<el-option
key="2"
label="222"
value="2">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="优先级">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false>
<el-option
key="1"
label="全部"
value="">
</el-option>
<el-option
key="2"
label="222"
value="2">
</el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="closeVisible">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default{
data(){
return{
formData:{},
sessionData:{}
}
},
props:{
setvisible:{
type:Boolean,
default:false
},
parentData:{
type:Object,
default: function () {
return {}
}
}
},
watch:{
parentData(nval, oval){
console.log(nval, oval)
this.sessionData=JSON.parse(JSON.stringify(nval));
this.formData=nval;
console.log(this.formData)
}
},
mounted(){
console.log('mounted',this.formData)
},
methods:{
handleClose(){
this.$emit('update:setvisible',false)
},
closeVisible(){
for(var key in this.sessionData){
this.formData[key]=this.sessionData[key]
}
this.$emit('update:setvisible',false)
},
save(){
this.sessionData=JSON.parse(JSON.stringify(this.formData));
this.$emit('update:parentData',this.formData);
this.$emit('update:setvisible',false)
},
}
}
</script>
<style>
</style>
<template>
<div>
<el-dialog
title="视频源配置修改"
top="12vh"
:visible.sync="setvisible"
width="906px"
:before-close="handleClose">
<!-- 内层dialog -->
<el-dialog
width="630px"
title="视频迁移"
:visible.sync="innerVisible"
append-to-body>
<el-table
height="286"
:data="taskData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="name"
label="任务名称">
</el-table-column>
<el-table-column
align="center"
prop="status"
label="状态">
<template slot-scope="scope">
<el-tag
:key="scope.$index"
type="warning"
effect="dark">
{{ scope.row.status}}
</el-tag>
</template>
</el-table-column>
<el-table-column
align="center"
prop="type"
label="算法类型">
</el-table-column>
<el-table-column
align="center"
prop="set"
label="储存配置">
</el-table-column>
<el-table-column
align="center"
prop="per"
label="场景占用">
</el-table-column>
</el-table>
</el-dialog>
<div>
<!-- 外层内容 -->
<div class="leftBox">
<div class="titles">视频设备</div>
<div class="treeBox">
<el-tree
:data="data"
:props="defaultProps"
accordion
highlight-current
:expand-on-click-node=false
@node-click="handleNodeClick">
<span class="custom-tree-node" slot-scope="{ node, data }">
<span @click.stop="() => selectVideo(data)">{{ node.label }}</span>
<span v-if="!node.children" class="iconfont icon-bofang1 bofangIcon" @click.stop="() =>playVideo(data)"></span>
</span>
</el-tree>
</div>
</div>
<div class="rightBox">
<div class="imgBox">
<img src="../../assets/img/taskmanage/weather.png" alt="">
</div>
<div class="tableBox">
<el-table
height="286"
:data="tableData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="name"
label="视频源名称">
</el-table-column>
<el-table-column
align="center"
prop="status"
label="视频状态">
</el-table-column>
<el-table-column
align="center"
width="136"
prop="operation"
label="视频操作">
<template slot-scope="scope">
<el-tooltip content="迁移" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-Migration moveIcon" @click="moveFun(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>
</div>
<div style="clear: both;"></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="closeVisible">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default{
data(){
return{
innerVisible:false,
tableData:[{
"name":111,
"status":22
},
{
"name":111,
"status":22
}],
taskData:[
{
"name":111,
"status":22,
"type":33,
"set":44,
"per":55
},
],
formData:{},
sessionData:{},
data: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
}
}
},
props:{
setvisible:{
type:Boolean,
default:false
},
parentData:{
type:Object,
default: function () {
return {}
}
}
},
watch:{
parentData(val){
this.sessionData=JSON.parse(JSON.stringify(val));
this.formData=val;
}
},
mounted(){
console.log(this.setvisible)
},
methods:{
selectVideo(data){
console.log('a',data)
},
playVideo(data){
console.log('b',data)
},
append(data) {
const newChild = { id: id++, label: 'testtest', children: [] };
if (!data.children) {
this.$set(data, 'children', []);
}
data.children.push(newChild);
},
remove(node, data) {
const parent = node.parent;
const children = parent.data.children || parent.data;
const index = children.findIndex(d => d.id === data.id);
children.splice(index, 1);
},
handleNodeClick(data) {
console.log(data);
},
handleClose(){},
closeVisible(){
for(var key in this.sessionData){
this.formData[key]=this.sessionData[key]
}
this.$emit('update:setvisible',false)
},
save(){
this.sessionData=JSON.parse(JSON.stringify(this.formData));
this.$emit('update:parentData',this.formData);
this.$emit('update:setvisible',false)
},
delFun(index,row){
},
moveFun(index,row){
this.innerVisible=true;
}
}
}
</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>
<template>
<div class="contentBox">
<div class="topCon">
<div class="left">
<img src="../../assets/img/taskmanage/weather.png" alt="">
<span class="textCon">
<div class="topText">21°/31°</div>
<div class="bottomText">西北风1级 空气优</div>
</span>
</div>
<div class="right">
<div class="rightBox">
<img src="../../assets/img/taskmanage/pic1.png" alt="">
<span class="textCon">
<div class="topText">80</div>
<div class="bottomText">可用分析资源</div>
</span>
</div>
<span class="border"></span>
<div class="rightBox">
<img src="../../assets/img/taskmanage/pic2.png" alt="">
<span class="textCon">
<div class="topText">80</div>
<div class="bottomText">在用分析资源</div>
</span>
</div>
<span class="border"></span>
<div class="rightBox">
<img src="../../assets/img/taskmanage/pic3.png" alt="">
<span class="textCon">
<div class="topText">80</div>
<div class="bottomText">任务数量</div>
</span>
</div>
</div>
</div>
<div class="content">
<div style="padding: 20px 15px 20px 23px;">
<span class="inputBox">
<el-input v-model="task_name" placeholder="请输入任务名称"></el-input>
</span>
<span class="selectBox">
<el-select v-model="task_algo_type" placeholder="请选择" :popper-append-to-body=false>
<el-option value="" label='全部'></el-option>
<el-option value="0" label='交通'></el-option>
<el-option value="1" label='客流'></el-option>
<el-option value="2" label='行为分析'></el-option>
<el-option value="7" label='综合流量'></el-option>
<!-- <el-option value="4" label='人脸'></el-option> -->
</el-select>
</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">新建任务</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="num"
:formatter="numFormatter"
label="序号">
</el-table-column>
<el-table-column
prop="task_name"
align="center"
label="任务名称">
</el-table-column>
<el-table-column
align="center"
prop="status"
:formatter="statusFormatter"
label="状态">
</el-table-column>
<el-table-column
align="center"
prop="task_algo_type"
:formatter="typeFormatter"
label="算法类型">
</el-table-column>
<el-table-column
align="center"
prop="store_conf.name"
label="存储配置">
</el-table-column>
<el-table-column
align="center"
prop="workers_count"
label="场景占用">
</el-table-column>
<el-table-column
align="center"
prop="workers_count"
label="资源用量">
</el-table-column>
<el-table-column
align="center"
prop="priority"
:formatter="priorityFormatter"
label="优先级">
</el-table-column>
<el-table-column
align="center"
prop="start_dt"
width="200"
:formatter="dateFormatter"
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="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 editIcon2" @click="editTask(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-bofang playIcon" @click="playFun(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-zanting pauseIcon" @click="pauseFun(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>
<editset :setvisible.sync="setShow" :parentData="editForm"></editset>
<editvideo :setvisible.sync="videoShow"></editvideo>
</div>
</div>
</template>
<script>
import editset from './editSet'
import editvideo from './editVideo'
export default {
data(){
return{
task_name:'',
task_algo_type:'',
total:0,
page:1,
pageSize:30,
setShow:false,
videoShow:false,
editForm:{},
tableData: []
}
},
components:{
editset,editvideo
},
mounted(){
this.getTaskList();
},
methods:{
statusFormatter(row, column, cellValue, index){
if(cellValue == 'Running'){
return '工作中'
}else if(cellValue == 'Finished'){
return '已完成'
}else if(cellValue == 'Pause'){
return '暂停'
}else if(cellValue == 'Error'){
return '异常'
}else if(cellValue == 'Deleted'){
return '已删除'
}else {
return '未部署'
}
},
priorityFormatter(row, column, cellValue, index) {
if(cellValue == 'high'){
return '高'
}else if(cellValue == 'normal'){
return '中'
}else if(cellValue == 'low'){
return '低'
}else {
return '未知'
}
},
dateFormatter(row, column, cellValue, index){
let startDate=cellValue ? cellValue.split(' ')[0]:'';
let endDate=row.end_dt ? row.end_dt.split(' ')[0]:'';
return startDate+' ~ '+endDate;
},
typeFormatter(row, column, cellValue, index) {
if(cellValue == 0){
return '交通'
}else if(cellValue == 1){
return '客流'
}else if(cellValue == 2){
return '行为分析'
}else if(cellValue == 3){
return '违停'
}else if(cellValue == 5){
return '交通行人'
}else if(cellValue == 7){
return '综合流量'
}else {
return '未知'
}
},
numFormatter(row, column, cellValue, index) {
return (index+1)*this.page;
},
handleSizeChange(val) {
this.pageSize=val;
this.getTaskList();
},
handleCurrentChange(val) {
this.page=val;
this.getTaskList();
},
query(){
this.getTaskList();
},
getTaskList(){
this.tableData=[];
let offset = (this.page - 1) * this.pageSize;
this.$api.task.tasks({
limit: this.pageSize,
offset: offset,
task_algo_type: this.task_algo_type,
source_type: "pull_video_stream",
task_type: "normal",
task_name: this.task_name
}).then((res)=>{
this.total=res.total_num;
if(res.list_data==null){
this.tableData=[]
}else{
res.list_data.forEach(item=>{
if(item.start_dt){
//先转utc格式
let date=this.$moment.utc(item.start_dt).format();
//再utc时间转本地时间
item.start_dt=this.$moment(date).local().format('YYYY-MM-DD HH:mm:ss')
}
if(item.end_dt){
//先转utc格式
let date=this.$moment.utc(item.end_dt).format();
//再utc时间转本地时间
item.end_dt=this.$moment(date).local().format('YYYY-MM-DD HH:mm:ss')
}
})
this.tableData=res.list_data;
}
}).catch((error)=>{
})
},
editVideo(index,row){
this.videoShow=true;
console.log(row)
},
editTask(index,row){
this.setShow=true;
this.$nextTick(() => {
this.editForm=row;
})
},
playFun(index,row){
console.log(row)
},
pauseFun(index,row){
console.log(row)
},
delFun(index,row){
console.log(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 ;
}
}
}
.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 \ No newline at end of file
module.exports = {
env: {
mocha: true
}
};
import { expect } from "chai";
import { shallowMount } from "@vue/test-utils";
import HelloWorld from "@/components/HelloWorld.vue";
describe("HelloWorld.vue", () => {
it("renders props.msg when passed", () => {
const msg = "new message";
const wrapper = shallowMount(HelloWorld, {
propsData: { msg }
});
expect(wrapper.text()).to.include(msg);
});
});
module.exports = {
// ...
css: {
loaderOptions: {
sass: {
prependData: '@import "@/assets/scss/common.scss";'
}
}
}
}
\ No newline at end of file \ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!