菜单引导页
parent
bfb8addee3
commit
5680891cbe
|
|
@ -6,28 +6,28 @@ module.exports = {
|
|||
"postcss-url": {},
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
"autoprefixer": {},
|
||||
'postcss-px-to-viewport': {
|
||||
// options
|
||||
unitToConvert: 'px',//(String) 需要转换的单位，默认为"px"
|
||||
viewportWidth: 1920, // (Number) 设计稿的视口宽度，一般是750
|
||||
unitPrecision: 3, // (Number) 单位转换后保留的精度（很多时候无法整除）
|
||||
viewportUnit: 'vw', // (String) 希望使用的视口单位
|
||||
selectorBlackList: ['.ignore', '.hairlines'],
|
||||
/*(Array) 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位
|
||||
如果传入的值为字符串的话，只要选择器中含有传入值就会被匹配
|
||||
例如 selectorBlackList 为 ['body'] 的话， 那么 .body-class 就会被忽略
|
||||
如果传入的值为正则表达式的话，那么就会依据CSS选择器是否匹配该正则
|
||||
例如 selectorBlackList 为 [/^body$/] , 那么 body 会被忽略，而 .body 不会*/
|
||||
minPixelValue: 1, // (Number) 设置最小的转换数值，如果为1的话，只有大于1的值会被转换
|
||||
mediaQuery: false, // (Boolean) 媒体查询里的单位是否需要转换单位
|
||||
exclude: [/^node_modules$/],// (Array or Regexp) 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件
|
||||
include: [/BI/],
|
||||
/*(Array or Regexp) 如果设置了include，那将只有匹配到的文件才会被转换，例如只转换 'src/mobile' 下的文件
|
||||
如果值是一个正则表达式，将包含匹配的文件，否则将排除该文件
|
||||
如果传入的值是一个数组，那么数组里的值必须为正则
|
||||
注意：exclude和include是可以一起设置的，将取两者规则的交集*/
|
||||
landscapeUnit: 'vw', //横屏时使用的单位
|
||||
landscapeWidth: 750,// 横屏时使用的视口宽度
|
||||
}
|
||||
// 'postcss-px-to-viewport': {
|
||||
// // options
|
||||
// unitToConvert: 'px',//(String) 需要转换的单位，默认为"px"
|
||||
// viewportWidth: 1920, // (Number) 设计稿的视口宽度，一般是750
|
||||
// unitPrecision: 3, // (Number) 单位转换后保留的精度（很多时候无法整除）
|
||||
// viewportUnit: 'vw', // (String) 希望使用的视口单位
|
||||
// selectorBlackList: ['.ignore', '.hairlines'],
|
||||
// /*(Array) 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位
|
||||
// 如果传入的值为字符串的话，只要选择器中含有传入值就会被匹配
|
||||
// 例如 selectorBlackList 为 ['body'] 的话， 那么 .body-class 就会被忽略
|
||||
// 如果传入的值为正则表达式的话，那么就会依据CSS选择器是否匹配该正则
|
||||
// 例如 selectorBlackList 为 [/^body$/] , 那么 body 会被忽略，而 .body 不会*/
|
||||
// minPixelValue: 1, // (Number) 设置最小的转换数值，如果为1的话，只有大于1的值会被转换
|
||||
// mediaQuery: false, // (Boolean) 媒体查询里的单位是否需要转换单位
|
||||
// exclude: [/^node_modules$/],// (Array or Regexp) 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件
|
||||
// include: [/BI/],
|
||||
// /*(Array or Regexp) 如果设置了include，那将只有匹配到的文件才会被转换，例如只转换 'src/mobile' 下的文件
|
||||
// 如果值是一个正则表达式，将包含匹配的文件，否则将排除该文件
|
||||
// 如果传入的值是一个数组，那么数组里的值必须为正则
|
||||
// 注意：exclude和include是可以一起设置的，将取两者规则的交集*/
|
||||
// landscapeUnit: 'vw', //横屏时使用的单位
|
||||
// landscapeWidth: 750,// 横屏时使用的视口宽度
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
"author": "",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 192.168.0.29",
|
||||
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --open",
|
||||
"start": "npm run dev",
|
||||
"unit": "jest --config test/unit/jest.conf.js --coverage",
|
||||
"e2e": "node test/e2e/runner.js",
|
||||
|
|
@ -17,6 +17,7 @@
|
|||
"dependencies": {
|
||||
"@jiaminghi/data-view": "^2.10.0",
|
||||
"@riophae/vue-treeselect": "^0.4.0",
|
||||
"autofit.js": "^3.1.1",
|
||||
"axios": "^0.21.1",
|
||||
"dayjs": "^1.11.10",
|
||||
"echarts": "^5.3.1",
|
||||
|
|
@ -26,11 +27,11 @@
|
|||
"jspdf": "^2.5.1",
|
||||
"moment": "^2.29.3",
|
||||
"motion": "^10.16.4",
|
||||
"throttle-debounce": "^5.0.0",
|
||||
"mqtt": "4.2.1",
|
||||
"normalize.css": "^8.0.1",
|
||||
"nprogress": "^0.2.0",
|
||||
"relation-graph": "^1.1.0",
|
||||
"throttle-debounce": "^5.0.0",
|
||||
"video.js": "^7.19.2",
|
||||
"vue": "^2.5.2",
|
||||
"vue-baidu-map": "^0.21.22",
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 1002 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 208 KiB |
|
|
@ -11,38 +11,56 @@
|
|||
<div class="right-menu-item hover-effect">
|
||||
<span style="font-weight: bold">姓名：{{ userForm.NAME }}</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="gotoBI()">
|
||||
<svg-icon icon-class="dashboard" />
|
||||
<span>可视化</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="gotoMap()">
|
||||
<svg-icon icon-class="dashboard" />
|
||||
<span>地图</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('prevention')">
|
||||
<svg-icon icon-class="dashboard" />
|
||||
<span>双重预防</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('relatedParties')">
|
||||
<svg-icon icon-class="dashboard" />
|
||||
<span>相关方</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('educationAndTraining')">
|
||||
<!-- <div class="right-menu-item hover-effect" @click="gotoBI()">-->
|
||||
<!-- <svg-icon icon-class="dashboard" />-->
|
||||
<!-- <span>可视化</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="gotoMap()">-->
|
||||
<!-- <svg-icon icon-class="dashboard" />-->
|
||||
<!-- <span>地图</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('prevention')">-->
|
||||
<!-- <svg-icon icon-class="dashboard" />-->
|
||||
<!-- <span>双重预防</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('relatedParties')">-->
|
||||
<!-- <svg-icon icon-class="dashboard" />-->
|
||||
<!-- <span>相关方</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('educationAndTraining')">-->
|
||||
<!-- <svg-icon icon-class="example" />-->
|
||||
<!-- <span>教育培训</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('highRisk')">-->
|
||||
<!-- <svg-icon icon-class="example" />-->
|
||||
<!-- <span>高危作业管理</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('monitor')">-->
|
||||
<!-- <svg-icon icon-class="example" />-->
|
||||
<!-- <span>监测预警</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right-menu-item hover-effect" @click="setShowModel('comprehensive')">-->
|
||||
<!-- <svg-icon icon-class="example" />-->
|
||||
<!-- <span>综合管理</span>-->
|
||||
<!-- </div>-->
|
||||
<div class="right-menu-item hover-effect" @click="$router.push({path:'/guide'})">
|
||||
<svg-icon icon-class="example" />
|
||||
<span>教育培训</span>
|
||||
<span>首页</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('highRisk')">
|
||||
<svg-icon icon-class="example" />
|
||||
<span>高危作业管理</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('monitor')">
|
||||
<svg-icon icon-class="example" />
|
||||
<span>监测预警</span>
|
||||
</div>
|
||||
<div class="right-menu-item hover-effect" @click="setShowModel('comprehensive')">
|
||||
<svg-icon icon-class="example" />
|
||||
<span>综合管理</span>
|
||||
<el-dropdown class="right-menu-item" trigger="click">
|
||||
<div style="cursor:pointer;">
|
||||
<svg-icon icon-class="guide" />
|
||||
<span>更多</span>
|
||||
<i class="el-icon-arrow-down el-icon--right"/>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item v-for="(item,index) in menuList" :key="index" @click.native="item.click">
|
||||
{{ item.text }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<!-- <template v-if="device!=='mobile'">
|
||||
<screenfull id="screenfull" class="right-menu-item hover-effect" />
|
||||
|
||||
|
|
@ -163,6 +181,7 @@ import Screenfull from '@/components/Screenfull'
|
|||
import SizeSelect from '@/components/SizeSelect'
|
||||
import { requestFN } from '@/utils/request'
|
||||
import { upload } from '@/utils/upload'
|
||||
import { menuList } from '@/views/newBI/menuList'
|
||||
export default {
|
||||
components: {
|
||||
Breadcrumb,
|
||||
|
|
@ -285,7 +304,8 @@ export default {
|
|||
dialogImageUrl: '',
|
||||
dialogVisible: false,
|
||||
DEPARTMENT_NAME: '',
|
||||
FFILE: {}
|
||||
FFILE: {},
|
||||
menuList
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
|
|||
|
|
@ -99,6 +99,18 @@ export const constantRoutes = [
|
|||
name: 'map',
|
||||
hidden: true,
|
||||
component: () => import('@/views/map/index')
|
||||
},
|
||||
{
|
||||
path: '/guide',
|
||||
name: 'guide',
|
||||
hidden: true,
|
||||
component: () => import('@/views/newBI/index'),
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
component: () => import('@/views/newBI/guide')
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
const createRouter = () => new Router({
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
</ul>
|
||||
</menu>
|
||||
<div class="right">
|
||||
<div class="iconfont icon-tuichu" @click="$router.push('/index')"/>
|
||||
<div class="iconfont icon-tuichu" @click="$router.push('/guide')"/>
|
||||
<div
|
||||
:class="['iconfont', !isFullScreen ? 'icon-full-screen' : 'icon-tuichuquanping']"
|
||||
@click="handleFullScreen(undefined)"/>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
@click="handleFullScreen(undefined)">
|
||||
<span>全屏</span>
|
||||
</div>
|
||||
<div class="iconfont icon-tuichu color058" @click="$router.push('/index')">
|
||||
<div class="iconfont icon-tuichu color058" @click="$router.push('/guide')">
|
||||
<span>退出</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
@click="handleFullScreen(undefined)">
|
||||
<span>全屏</span>
|
||||
</div>
|
||||
<div class="iconfont icon-tuichu" @click="$router.push('/index')">
|
||||
<div class="iconfont icon-tuichu" @click="$router.push('/guide')">
|
||||
<span>退出</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -278,7 +278,7 @@ export default {
|
|||
if (data.result === 'success') {
|
||||
sessionStorage.setItem('user', JSON.stringify(data))
|
||||
sessionStorage.setItem('loginCount', '0')
|
||||
this.$router.push({ path: '/index' })
|
||||
this.$router.push({ path: '/guide' })
|
||||
this.loading = false
|
||||
this.flag = false
|
||||
this.getWorkTask(data.USER_ID)
|
||||
|
|
|
|||
|
|
@ -1582,7 +1582,7 @@ export default {
|
|||
|
||||
this.destroyConnection()
|
||||
this.onePerLocArr = []
|
||||
this.$router.push('/index')
|
||||
this.$router.push('/guide')
|
||||
} else if (index === 1) {
|
||||
this.handleFullScreen(undefined)
|
||||
} else if (index === 2) {
|
||||
|
|
@ -2849,7 +2849,7 @@ export default {
|
|||
}
|
||||
|
||||
.title {
|
||||
background-image: linear-gradient(bottom, #5bb4f7, #ffffff);
|
||||
background-image: linear-gradient(to bottom, #5bb4f7, #ffffff);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
font-size: 34px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,159 @@
|
|||
<template>
|
||||
<div id="guide">
|
||||
<div class="header">
|
||||
<div class="title">秦港某公司安全监管平台</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="menu">
|
||||
<template v-for="(item, index) in menuList">
|
||||
<div
|
||||
v-if="index < 7"
|
||||
:key="index"
|
||||
:style="{'--x': position[index].x + 'px', '--y': position[index].y + 'px'}"
|
||||
class="item left"
|
||||
@click="item.click"
|
||||
>
|
||||
<div class="text">{{ item.text }}</div>
|
||||
<img src="../../assets/images/enterprise/jiantou_left.png" alt="">
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
:key="index"
|
||||
:style="{'--x': position[index - 7].x + 'px', '--y': position[index - 7].y + 'px'}"
|
||||
class="item right"
|
||||
@click="item.click"
|
||||
>
|
||||
<img src="../../assets/images/enterprise/jiantou_right.png" alt="">
|
||||
<div class="text">{{ item.text }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import autofit from 'autofit.js'
|
||||
import { menuList } from './menuList'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
position: [
|
||||
{ x: -100, y: 92 },
|
||||
{ x: -160, y: 192 },
|
||||
{ x: -200, y: 292 },
|
||||
{ x: -240, y: 392 },
|
||||
{ x: -220, y: 492 },
|
||||
{ x: -200, y: 592 },
|
||||
{ x: -160, y: 692 }
|
||||
],
|
||||
menuList
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
autofit.init({
|
||||
dh: 1080,
|
||||
dw: 1920,
|
||||
el: '#guide',
|
||||
resize: true
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
autofit.off()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
#guide {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-image: url("../../assets/images/enterprise/bg.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 125px;
|
||||
background-image: url("../../assets/images/enterprise/titbg.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
.title {
|
||||
max-width: 800px;
|
||||
height: 52px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-weight: bold;
|
||||
background-image: linear-gradient(to bottom, #00a2ff, #fff);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
font-size: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 991px;
|
||||
height: 954px;
|
||||
background-image: url("../../assets/images/enterprise/img1.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
.menu {
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: var(--y);
|
||||
width: 177px;
|
||||
height: 53px;
|
||||
cursor: pointer;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
&.left {
|
||||
background-image: url("../../assets/images/enterprise/navbg_left.png");
|
||||
left: var(--x);
|
||||
|
||||
.text {
|
||||
margin-left: 30px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
background-image: url("../../assets/images/enterprise/navbg_right.png");
|
||||
right: var(--x);
|
||||
|
||||
img {
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<script>
|
||||
export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<router-view/>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
import store from '@/store/index'
|
||||
import router from '@/router/index'
|
||||
export const menuList = [
|
||||
{
|
||||
text: '管理员驾驶舱',
|
||||
click: () => {
|
||||
router.push({ path: '/monitoringCenter' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '物联网+地图',
|
||||
click: () => {
|
||||
router.push({ path: '/map' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '企业信息管理',
|
||||
model: 'enterpriseInformation',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'enterpriseInformation')
|
||||
router.push({ path: '/corpInfo/information/info' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '法律法规管理',
|
||||
model: 'regulations',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'regulations')
|
||||
router.push({ path: '/threeSystems/safetyOperationRegulations' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '安全目标管理',
|
||||
model: 'safetyObjectives',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'safetyObjectives')
|
||||
router.push({ path: '/security_commitment/promise_book' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '安全教育管理',
|
||||
model: 'educationTraining',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'educationTraining')
|
||||
router.push({ path: '/archives/user' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '双重预防管理',
|
||||
model: 'doublePrevention',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'doublePrevention')
|
||||
router.push({ path: '/risk/riskunit' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '相关方管理',
|
||||
model: 'relatedParties',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'relatedParties')
|
||||
router.push({ path: '/relevantunits/insert' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '消防安全管理',
|
||||
model: 'fireSafety',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'fireSafety')
|
||||
router.push({ path: '/firefighting/qualifiedphotos' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '危险作业管理',
|
||||
model: 'dangerousOperations',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'dangerousOperations')
|
||||
router.push({ path: '/specialType/InterestedParties' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '作业现场管理',
|
||||
model: 'workSiteManagement',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'workSiteManagement')
|
||||
router.push({ path: '/keyprojects/units' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '绩效考评管理',
|
||||
model: 'performanceAssessment',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'performanceAssessment')
|
||||
router.push({ path: '/statistics/branch' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '应急管理',
|
||||
model: 'emergency',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'emergency')
|
||||
router.push({ path: '/emergency/plan' })
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '科技创新',
|
||||
model: 'innovation',
|
||||
click: () => {
|
||||
store.dispatch('permission/setShowModel', 'innovation')
|
||||
router.push({ path: '/oneCompany/alarmList' })
|
||||
}
|
||||
}
|
||||
]
|
||||
Loading…
Reference in New Issue