历史监控

1.0.0
黄崇栋 6 years ago
parent b6de85a511
commit edb28f7cac

@ -0,0 +1,10 @@
{
"description": "昆船随行垛机检测系统",
"type": -1,
"rights": "duojiSystem",
"children": [{
"description": "历史监控",
"type": 2,
"rights": "history"
}]
}

@ -6,12 +6,12 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>垛机监控系统</title> <title>昆船随行式垛机监测系统</title>
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but 垛机监控系统 doesn't work properly without JavaScript enabled. Please enable it to <strong>We're sorry but 昆船随行式垛机监测系统 doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong> continue.</strong>
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>

@ -4,6 +4,39 @@
</div> </div>
</template> </template>
<script>
export default {
mounted() {
window.onmessage = e => {
if (!e.data.id) return;
sessionStorage.setItem("postMessage", e.data.id);
if (e.data.userInfo) {
if (
e.data.userInfo.permissionList.some(
item => item.rights === "duojiSystem"
)
) {
let authList = this.translateDataToTree(
e.data.userInfo.permissionList
);
e.data.userInfo.permissionList = this.$utils.treeToArray(
authList
);
} else {
e.data.userInfo.permissionList = [];
}
localStorage.setItem(
"userInfo",
JSON.stringify(e.data.userInfo)
);
} else {
localStorage.clear();
}
};
}
};
</script>
<style lang="scss"> <style lang="scss">
@import "style/common/reset.css"; @import "style/common/reset.css";
@import "style/common/layout"; @import "style/common/layout";

@ -40,8 +40,15 @@ export default {
...mapMutations(["setState"]), ...mapMutations(["setState"]),
logout() { logout() {
this.visible = false; this.visible = false;
localStorage.clear();
sessionStorage.clear(); sessionStorage.clear();
this.$router.push({ name: "login" }); this.$axios({
url: "/app/userCenter",
method: "GET"
}).then(res => {
// res.url = "http://localhost:8081";
window.open(res.url + "?action=logout", "_self");
});
} }
} }
}; };

@ -18,7 +18,8 @@ import {
Col, Col,
Select, Select,
Popconfirm, Popconfirm,
Tooltip Tooltip,
Drawer
} from "ant-design-vue"; } from "ant-design-vue";
Vue.use(Input); Vue.use(Input);
@ -39,6 +40,7 @@ Vue.use(Col);
Vue.use(Select); Vue.use(Select);
Vue.use(Popconfirm) Vue.use(Popconfirm)
Vue.use(Tooltip) Vue.use(Tooltip)
Vue.use(Drawer)
Vue.prototype.$message = message; Vue.prototype.$message = message;
Vue.prototype.$info = Modal.info; Vue.prototype.$info = Modal.info;
Vue.prototype.$success = Modal.success; Vue.prototype.$success = Modal.success;

@ -9,7 +9,7 @@ const instance = axios.create({
}, },
withCredentials: true, withCredentials: true,
}); });
window.once = 0
instance.interceptors.request.use((config) => { instance.interceptors.request.use((config) => {
const reqObj = config; const reqObj = config;
// 在发送请求之前做些什么 -- 路径参数拼接 // 在发送请求之前做些什么 -- 路径参数拼接
@ -35,11 +35,18 @@ instance.interceptors.response.use((response) => {
Vue.prototype.$message.error(res.message); Vue.prototype.$message.error(res.message);
// 未认证 // 未认证
if (res.code === 401) { if (res.code === 401) {
sessionStorage.clear() // 未登录
this.$router.push({ if (window.once == 0 && !location.search) {
name: 'login' Vue.prototype.$message.error(res.message)
Vue.prototype.$axios({
url: '/app/userCenter',
method: 'GET'
}).then(res => {
window.open(res.url + '?redirect=' + location.origin, '_self')
}) })
} }
++window.once
}
return Promise.reject(res.message); return Promise.reject(res.message);
} }
return res; return res;

@ -1,17 +1,17 @@
import Vue from 'vue' import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
const files = require.context('@/views', true, /-router\.js$/) // const files = require.context('@/views', true, /-router\.js$/)
let allRouter = []; // let allRouter = [];
// 匹配成功的名字数组 // // 匹配成功的名字数组
files.keys().map(key => { // files.keys().map(key => {
allRouter = allRouter.concat(files(key).default) // allRouter = allRouter.concat(files(key).default)
}) // })
allRouter.sort((a, b) => { // allRouter.sort((a, b) => {
return a.meta.sort - b.meta.sort // return a.meta.sort - b.meta.sort
}) // })
console.log(allRouter) // console.log(allRouter)
Vue.use(VueRouter) Vue.use(VueRouter)
@ -28,15 +28,17 @@ const routes = [{
name: 'guide' name: 'guide'
}, },
component: () => import('@/views/main'), component: () => import('@/views/main'),
children: [{ children: [
path: 'realTime', // {
name: 'realTime', // path: 'realTime',
meta: { // name: 'realTime',
icon: 'global', // meta: {
name: '实时监控' // icon: 'global',
}, // name: '实时监控'
component: () => import('@/views/realTime/index') // },
}, { // component: () => import('@/views/realTime/index')
// },
{
path: 'history', path: 'history',
name: 'history', name: 'history',
meta: { meta: {
@ -51,7 +53,8 @@ const routes = [{
name: '个人中心' name: '个人中心'
}, },
component: () => import('@/views/center') component: () => import('@/views/center')
}] }
]
}, },
{ {
path: '/guide', path: '/guide',

@ -224,4 +224,21 @@ export default {
}) })
return res; return res;
}, },
treeToArray(list, newArr = []) {
list.forEach((item) => {
const {
children
} = item;
if (children) {
delete item.children;
if (children.length) {
newArr.push(item);
return this.treeToArray(children, newArr);
}
}
newArr.push(item);
});
return newArr;
}
} }

@ -1 +1,7 @@
export default {} export default {
queryList: {
url: '/order/list',
name: '查询',
method: 'POST'
}
}

@ -8,7 +8,31 @@
enter-button="搜索" enter-button="搜索"
@search="handleSearch" @search="handleSearch"
></a-input-search>' ></a-input-search>'
<a-table :columns="columns" :dataSource="dataSource"></a-table> <a-table :rowKey="record => record.id" :columns="columns" :dataSource="dataSource">
<div slot="filePath" slot-scope="text, record">
<img
v-if="imglist.some(item => record.mediaType === item)"
:src="record.filePath"
alt="内容图片"
style="width: 140px"
@click="handlePopup('image', record.filePath)"
/>
<span
v-else
style="color: #40a9ff; cursor:pointer;"
@click="handlePopup('video', record.filePath)"
>{{record.filePath}}</span>
</div>
</a-table>
<a-drawer placement="bottom" :visible="drawer" @close="onClose">
<img
v-if="showDrawer.type === 'image'"
:src="showDrawer.url"
alt="内容图片"
style="height: 500px"
/>
<video v-else style="height: 500px" :src="showDrawer.url" controls></video>
</a-drawer>
</div> </div>
</template> </template>
@ -20,41 +44,67 @@ export default {
search: "", search: "",
columns: [ columns: [
{ {
title: "货位号", title: "工单号",
dataIndex: "" dataIndex: "orderNum"
}, },
{ {
title: "视频录制时间", title: "仓位号",
dataIndex: "" dataIndex: "positionNum"
}, },
{ {
title: "历史视频播放地址", title: "创建时间",
dataIndex: "", dataIndex: "createTime"
scopedSlot: {
customRender: ""
}
}, },
{ {
title: "取货前照片", title: "内容",
dataIndex: "", dataIndex: "filePath",
scopedSlot: { scopedSlots: {
customRender: "" customRender: "filePath"
}
},
{
title: "取货后照片",
dataIndex: "",
scopedSlot: {
customRender: ""
} }
} }
], ],
dataSource: [] dataSource: [],
imglist: ["png", "jpg", "jpeg", "bmp", "gif"],
videolist: [
"mp4",
"m2v",
"mkv",
"rmvb",
"wmv",
"avi",
"flv",
"mov",
"m4v"
],
drawer: false,
showDrawer: {}
}; };
}, },
methods: { methods: {
handleSearch() {} handleSearch() {
this.query();
},
query() {
this.$api.historyApi
.queryList({
data: {
orderNum: this.search
} }
})
.then(res => {
this.dataSource = res.data;
});
},
handlePopup(type, url) {
this.drawer = true;
this.showDrawer.type = type;
this.showDrawer.url = url;
},
onClose() {
this.drawer = false;
}
},
mounted() {}
}; };
</script> </script>
@ -62,4 +112,10 @@ export default {
.history { .history {
padding: 24px; padding: 24px;
} }
.ant-drawer-content-wrapper {
height: auto !important;
}
.ant-drawer-body {
text-align: center;
}
</style> </style>

@ -19,7 +19,7 @@
<div class="login-cover-logo"> <div class="login-cover-logo">
<img src="@/assets/logo.png" alt="logo" /> <img src="@/assets/logo.png" alt="logo" />
</div> </div>
<div class="login-cover-title">垛机监控系统</div> <div class="login-cover-title">昆船随行式垛机监测系统</div>
</div> </div>
<!-- <div class="login-footer">Copyright © 2020 ZheHe technology CO., LTD.</div> --> <!-- <div class="login-footer">Copyright © 2020 ZheHe technology CO., LTD.</div> -->
</div> </div>
@ -76,7 +76,69 @@ export default {
} }
} }
}, },
mounted() {} beforeRouteEnter(to, from, next) {
if (location.search) {
let action = window.location.search.substring(
window.location.search.indexOf("=") + 1
);
if (action === "logout") {
localStorage.clear();
sessionStorage.clear();
}
next();
} else {
if (localStorage.getItem("userInfo")) {
next(vm => {
let permissionList = JSON.parse(
localStorage.getItem("userInfo")
).permissionList;
let router = vm.$router.options.routes[0].children;
if (
!location.search &&
!permissionList.some(item => item.type === 2)
) {
vm.$message.info("没权限", 1, () => {
vm.$api({
url: "/app/userCenter",
method: "GET"
}).then(res => {
window.open(
res.url + "?redirect=" + location.origin,
"_self"
);
});
});
return;
}
for (let item of router) {
if (
permissionList.some(a => {
if (a.rights === item.name && a.type === 2)
return true;
})
) {
vm.$router.push({ name: item.name });
return;
}
}
});
} else {
if (!location.search) {
next(vm => {
vm.$api({
url: "/app/userCenter",
method: "GET"
}).then(res => {
window.open(
res.url + "?redirect=" + location.origin,
"_self"
);
});
});
}
}
}
}
}; };
</script> </script>
<style lang="scss"> <style lang="scss">

@ -3,7 +3,7 @@ module.exports = {
devServer: { devServer: {
proxy: { proxy: {
'/api': { '/api': {
target: 'http://115.236.65.98:8004', target: 'http://47.99.104.87:8632',
}, },
}, },
port: 8008 port: 8008

Loading…
Cancel
Save