Skip to content

F
founder_vue
Commit 4eddd7b7 by 张超军
Options

Merge branch 'dev_zwpt' of http://47.92.108.28/changchao/founder_vue into dev_zwpt

parents c7d74e6d c97040bf
Showing with 1113 additions and 938 deletions
src/App.vue
......@@ -41,12 +41,22 @@ export default {
@font-face {
font-family: "HarmonyOS_Sans_SC-Bold";
src: url("../src/assets/font/MSYHBD.ttf") format("truetype");
src: url("../src/assets/font/HarmonyOS_Sans_SC_Bold.ttf") format("truetype");
}
@font-face {
font-family: "HarmonyOS_Sans_SC";
src: url("../src/assets/font/MSYH.ttf") format("truetype");
src: url("../src/assets/font/HarmonyOS_Sans_SC_Regular.ttf") format("truetype");
}
@font-face {
font-family: "HarmonyOS_Sans_SC_Light";
src: url("../src/assets/font/HarmonyOS_Sans_SC_Light.ttf") format("truetype");
}
@font-face {
font-family: "HarmonyOS_Sans_SC_Medium";
src: url("../src/assets/font/HarmonyOS_Sans_SC_Medium.ttf") format("truetype");
}
.boxShadow {
......
src/views/Home.vue
<template>
<div id="home-div">
<div id="home" :class="{ zhanshi: isCropper || loading_sd }">
<div
id="home"
:class="{ zhanshi: isCropper || loading_sd }"
>
<el-container class="layout-container">
<transition name="slide">
<el-aside :width="isCollapse ? '4rem' : '17.5rem'" class="aside">
<div class="logo" :class="{ minLogo: isCollapse }" @click="$router.push('/index')">
<img class="jh" src="../assets/img/Home/jh.png" alt="" />
<img v-show="!isCollapse" class="title" src="../assets/img/Home/title.png" alt="" />
<el-aside
:width="isCollapse ? '4rem' : '17.5rem'"
class="aside"
>
<div
class="logo"
:class="{ minLogo: isCollapse }"
@click="$router.push('/index')"
v-if="this.$store.state.tm.tmType==false"
>
<img
class="jh"
src="../assets/img/Home/jh.png"
alt=""
/>
<img
v-show="!isCollapse"
class="title"
src="../assets/img/Home/title.png"
alt=""
/>
</div>
<div
class="logo"
:class="{ minLogo: isCollapse }"
@click="$router.push('/index')"
v-if="this.$store.state.tm.tmType==true"
>
<img
v-show="isCollapse"
class="jh"
src="../assets/img/Home/tmLogoMini.svg"
alt=""
/>
<img
v-show="!isCollapse"
class="title"
src="../assets/img/Home/tmLogo.svg"
alt=""
/>
</div>
<!-- <div class="search">
<el-input v-if="!isCollapse" @keyup.enter.native="goSearch()" class="searchTxt" prefix-icon="el-icon-search" v-model="searchTxt" placeholder="搜索"></el-input>
<i class="search-icon el-icon-search" v-else></i>
</div> -->
<el-menu :collapse-transition="false" ref="menu" :default-active="menuActive" text-color="#CCCCCC"
active-text-color="#ffffff" background-color="#1F2D45" class="el-menu-vertical-demo" @open="handleOpen"
@close="handleClose" :collapse="isCollapse" @select="selectPath" :unique-opened="true">
<div v-for="(menu, i) in routes" :key="i">
<el-submenu :index="menu.name" v-if="menu.children && !menu.hidden">
<el-menu
:collapse-transition="false"
ref="menu"
:default-active="menuActive"
text-color="#CCCCCC"
active-text-color="#ffffff"
background-color="#1F2D45"
class="el-menu-vertical-demo"
@open="handleOpen"
@close="handleClose"
:collapse="isCollapse"
@select="selectPath"
:unique-opened="true"
>
<div
v-for="(menu, i) in routes"
:key="i"
>
<el-submenu
:index="menu.name"
v-if="menu.children && !menu.hidden"
>
<template slot="title">
<img v-if="$route.path != menu.path" :src="menu.icon_d" alt="" />
<img v-else :src="menu.icon_a" alt="" />
<img
v-if="$route.path != menu.path"
:src="menu.icon_d"
alt=""
/>
<img
v-else
:src="menu.icon_a"
alt=""
/>
<span v-show="!isCollapse">{{ menu.meta.title }}</span>
</template>
<div v-for="(item, index) in menu.children" :key="index">
<el-menu-item v-if="!item.hidden" :index="item.name">{{
<div
v-for="(item, index) in menu.children"
:key="index"
>
<el-menu-item
v-if="!item.hidden"
:index="item.name"
>{{
item.meta.title
}}
</el-menu-item>
</div>
</el-submenu>
<el-menu-item :index="menu.name" v-else-if="!menu.children && !menu.hidden">
<img v-if="$route.path != menu.path" :src="menu.icon_d" alt="" />
<img v-else :src="menu.icon_a" alt="" />
<el-menu-item
:index="menu.name"
v-else-if="!menu.children && !menu.hidden"
>
<img
v-if="$route.path != menu.path"
:src="menu.icon_d"
alt=""
/>
<img
v-else
:src="menu.icon_a"
alt=""
/>
<span slot="title">{{ menu.meta.title }}</span>
</el-menu-item>
</div>
</el-menu>
<div class="fz">
<img v-if="!isCollapse" src="../assets/img/Home/logo.png" alt="" />
<img v-else src="../assets/img/Home/fang.png" alt="" />
<img
v-if="!isCollapse"
src="../assets/img/Home/logo.png"
alt=""
/>
<img
v-else
src="../assets/img/Home/fang.png"
alt=""
/>
</div>
</el-aside>
</transition>
<el-container class="container-dom">
<el-header class="header">
<div class="collapse" @click="switchCollapse">
<img v-if="isCollapse" :src="rightImg" alt="" />
<img v-else :src="leftImg" alt="" />
<div
class="collapse"
@click="switchCollapse"
>
<img
v-if="isCollapse"
:src="rightImg"
alt=""
/>
<img
v-else
:src="leftImg"
alt=""
/>
</div>
<div class="options">
<!-- <div class="sendFind">发查询</div> -->
......@@ -55,19 +155,43 @@
<div class="message">
<div class="circle"></div>
</div>
<div class="quit" @click="$router.push('/index')"></div>
<div class="logout" @click="logout">
<svg-icon v-show="!isHoverLogout" icon-class="logout_d" class="icon" @mouseover="isHoverLogout = true"
@mouseleave="isHoverLogout = false" />
<svg-icon v-show="isHoverLogout" icon-class="logout_a" class="icon" />
<div
class="quit"
@click="$router.push('/index')"
></div>
<div
class="logout"
@click="logout"
>
<svg-icon
v-show="!isHoverLogout"
icon-class="logout_d"
class="icon"
@mouseover="isHoverLogout = true"
@mouseleave="isHoverLogout = false"
/>
<svg-icon
v-show="isHoverLogout"
icon-class="logout_a"
class="icon"
/>
</div>
</div>
</el-header>
<el-main class="main">
<div class="contain">
<el-tabs :closable="paths.length > 1" v-model="routePath" @tab-click="handleClick"
@tab-remove="tabRemove">
<el-tab-pane :label="item.name" :name="item.routeName" v-for="item in paths" :key="item.routeName">
<el-tabs
:closable="paths.length > 1"
v-model="routePath"
@tab-click="handleClick"
@tab-remove="tabRemove"
>
<el-tab-pane
:label="item.name"
:name="item.routeName"
v-for="item in paths"
:key="item.routeName"
>
</el-tab-pane>
</el-tabs>
<div class="breadcrumb"></div>
......@@ -87,260 +211,341 @@
<button @click="toAllPersonnelBase">全部人员库</button> -->
</div>
<el-dialog class="jump-route" append-to-body :modal="false" @close="cancelJumpRoute"
:visible.sync="jumpRouteDialogVisible" width="27.625rem" :before-close="handleClose">
<el-dialog
class="jump-route"
append-to-body
:modal="false"
@close="cancelJumpRoute"
:visible.sync="jumpRouteDialogVisible"
width="27.625rem"
:before-close="handleClose"
>
<span>当前页面有未保存的指位特征，是否退出？</span>
<div class="dialog-footer">
<button class="confirm-btn" @click="confirmJumpRoute">是</button>
<button class="cancel-btn" @click="cancelJumpRoute">否</button>
<button
class="confirm-btn"
@click="confirmJumpRoute"
>是</button>
<button
class="cancel-btn"
@click="cancelJumpRoute"
>否</button>
</div>
</el-dialog>
<div class="shadow" v-show="isCropper"></div>
<div class="loading" v-show="loading_sd">
<div
class="shadow"
v-show="isCropper"
></div>
<div
class="loading"
v-show="loading_sd"
>
<div class="loading-finger">
<img src="../assets/img/loadingfinger.gif" alt="" />
<img
src="../assets/img/loadingfinger.gif"
alt=""
/>
</div>
<div class="loading-name">
<img src="../assets/img/loadingtxt.gif" alt="" />
<img
src="../assets/img/loadingtxt.gif"
alt=""
/>
</div>
</div>
<div class="smallLoading" v-show="smallLoading">
<div
class="smallLoading"
v-show="smallLoading"
>
<div class="loading-finger">
<img src="../assets/img/loadingfinger.gif" alt="" />
<img
src="../assets/img/loadingfinger.gif"
alt=""
/>
</div>
<div class="loading-name">
<img src="../assets/img/loadingtxt.gif" alt="" />
<img
src="../assets/img/loadingtxt.gif"
alt=""
/>
</div>
</div>
<!-- 人像 -->
<transition name="el-fade-in-linear">
<div class="face-big" v-show="enLargeFace">
<div
class="face-big"
v-show="enLargeFace"
>
<div class="face-name">{{ rxInfoEnlarge.name }}</div>
<img class="face-img" :src="'data:image/jpeg;base64,' + rxInfoEnlarge.image" alt="" />
<img
class="face-img"
:src="'data:image/jpeg;base64,' + rxInfoEnlarge.image"
alt=""
/>
</div>
</transition>
</div>
</template>
<script>
import html2canvas from 'html2canvas'
import '@/icons/logout_d.svg'
import '@/icons/logout_a.svg'
import indexRoutes from '@/router/modules/index'
import { mapGetters, mapState } from 'vuex'
import utils from '@/utils/util.js'
export default {
name: 'Home',
data() {
return {
searchTxt: '',
routes: this.$store.getters['layout/leftMenuData'],
isCollapse: false,
leftImg: require('../assets/img/Home/left.png'),
rightImg: require('../assets/img/Home/right.png'),
paths: [],
menuActive: '',
isHoverLogout: false,
routePath: '',
// 截屏出来的img url
cropperImage: '',
// 是否展示毛玻璃
isCropper: false,
// 是否跳转路由
jumpRouteDialogVisible: false,
// 路由跳转的方式----- 1.面包屑切换。2.面包屑删除当前。3.左侧菜单跳转
routeChangeType: 'change',
// 人像信息
rxInfoEnlarge: {},
// isStRole: false,
import html2canvas from 'html2canvas'
import '@/icons/logout_d.svg'
import '@/icons/logout_a.svg'
import indexRoutes from '@/router/modules/index'
import { mapGetters, mapState } from 'vuex'
import utils from '@/utils/util.js'
export default {
name: 'Home',
data () {
return {
searchTxt: '',
routes: this.$store.getters['layout/leftMenuData'],
isCollapse: false,
leftImg: require('../assets/img/Home/left.png'),
rightImg: require('../assets/img/Home/right.png'),
paths: [],
menuActive: '',
isHoverLogout: false,
routePath: '',
// 截屏出来的img url
cropperImage: '',
// 是否展示毛玻璃
isCropper: false,
// 是否跳转路由
jumpRouteDialogVisible: false,
// 路由跳转的方式----- 1.面包屑切换。2.面包屑删除当前。3.左侧菜单跳转
routeChangeType: 'change',
// 人像信息
rxInfoEnlarge: {},
// isStRole: false,
}
},
mounted () {
console.log(this.loading_sd)
this.$store.commit('loading/setLoadingSd', false)
let self = this
this.menuActive = this.$route.name
// 是否模糊
this.$bus.on('isBlur', (isBlur) => {
if (isBlur) {
self.isCropper = true
self.$store.commit('loading/setGlass', true)
} else {
self.isCropper = false
self.$store.commit('loading/setGlass', false)
}
})
// 初始化人像是否放大
self.$store.commit('ryzwbj/setEnlargeFace', false)
document.querySelector('.shadow').addEventListener('click', function (e) {
// 如果图像是处于放大状态
if (self.enLargeFace) {
self.isCropper = false
self.$store.commit('ryzwbj/setEnlargeFace', false)
}
})
// 获取放大的人像信息
this.$bus.on('setRxInfoEnlarge', (rxInfoEnlarge) => {
console.log(11111111111)
self.rxInfoEnlarge = rxInfoEnlarge
})
// this.isStRole = user.isStRole()
},
updated () {
this.menuActive = this.$route.name
},
computed: {
...mapGetters(['defaultGoodsImage', 'userAuth']),
...mapState({
loading: (state) => state.loading.loading,
preRoute: (state) => state.loading.preRoute,
willRoute: (state) => state.loading.willRoute,
jumproute: (state) => state.loading.jumproute,
smallLoading: (state) => state.loading.smallLoading,
enLargeFace: (state) => state.ryzwbj.enLargeFace,
loading_sd: (state) => state.loading.loading_sd,
}),
cachePageName () {
return this.$store.state.layout.cachePageName
},
},
methods: {
// getMetaTitle(meta) { //用于选择标题
// let _that = this
// if (_that.isStRole && meta.sTtitle) {
// return meta.sTtitle
// } else {
// return meta.title
// }
// },
/**
* @description: 退出登录
* @param {*}
* @return {*}
*/
logout () {
this.$axios
.get('/security/logout')
.then((res) => {
if (res.data.code == 200) {
localStorage.removeItem('token') //删除名称为“token”的信息。
localStorage.removeItem('userInfo') //删除名称为“userInfor”的信息。
this.$router.replace('/Login')
this.$message.info('退出成功！')
}
})
.catch((err) => {
})
},
mounted() {
console.log(this.loading_sd)
this.$store.commit('loading/setLoadingSd', false)
let self = this
this.menuActive = this.$route.name
// 是否模糊
this.$bus.on('isBlur', (isBlur) => {
if (isBlur) {
self.isCropper = true
self.$store.commit('loading/setGlass', true)
/**
* @description: 开始搜索
* @param {*}
* @return {*}
*/
goSearch () {
this.searchTxt = ''
//console.log(this.searchTxt);
},
handleClick ({ name }) {
/*
if (
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') && !this.jumproute
) {
this.jumpRouteDialogVisible = true
this.isCropper = true
this.$store.commit('loading/setWillRoute', name)
this.routePath = name
this.routeChangeType = 'change'
} else {
if (name == '/Home/htzwcj') {
this.$router.push(name)
this.menuActive = ''
} else {
self.isCropper = false
self.$store.commit('loading/setGlass', false)
}
})
// 初始化人像是否放大
self.$store.commit('ryzwbj/setEnlargeFace', false)
document.querySelector('.shadow').addEventListener('click', function (e) {
// 如果图像是处于放大状态
if (self.enLargeFace) {
self.isCropper = false
self.$store.commit('ryzwbj/setEnlargeFace', false)
let routerObj = this.paths.find((i) => i.routeName == name)
this.$router.push(routerObj.path)
this.menuActive = routerObj.routeName
}
})
// 获取放大的人像信息
this.$bus.on('setRxInfoEnlarge', (rxInfoEnlarge) => {
console.log(11111111111)
self.rxInfoEnlarge = rxInfoEnlarge
})
// this.isStRole = user.isStRole()
}
*/
if (name == "/Home/htzwcj") {
this.$router.push(name);
this.menuActive = "";
} else {
let routerObj = this.paths.find((i) => i.routeName == name);
this.$router.push(routerObj.path);
this.menuActive = routerObj.routeName;
}
},
updated() {
this.menuActive = this.$route.name
/**
* 确认需要跳转路由
*/
confirmJumpRoute () {
// 清除sessionStorage值
sessionStorage.clear()
this.isCropper = false
this.jumpRouteDialogVisible = false
if (this.routeChangeType === 'change') {
if (this.willRoute == '/Home/htzwcj') {
this.$router.push(this.willRoute)
this.menuActive = ''
} else {
let routerObj = this.paths.find((i) => i.routeName == this.willRoute)
this.$router.push(routerObj.path)
this.menuActive = routerObj.routeName
}
} else if (this.routeChangeType === 'del') {
let routerObj = this.paths.find((i) => i.routeName == this.$route.name)
if (routerObj) {
let pathName = routerObj.name
let res = this.paths.filter((item) => {
return item.name != pathName
})
if (pathName == this.$route.meta.title) {
if (this.paths.length > 0) {
// debugger;
let routerIndex = this.paths.findIndex(
(i) => i.routeName == this.$route.name
)
if (routerIndex == 0) {
this.$router.push(this.paths[1].path)
this.routePath = this.paths[1].routeName
} else {
this.$router.push(this.paths[routerIndex - 1].path)
this.routePath = this.paths[routerIndex - 1].routeName
}
}
}
this.paths = res
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
} else {
this.$router.push({ name: this.willRoute })
}
},
computed: {
...mapGetters(['defaultGoodsImage', 'userAuth']),
...mapState({
loading: (state) => state.loading.loading,
preRoute: (state) => state.loading.preRoute,
willRoute: (state) => state.loading.willRoute,
jumproute: (state) => state.loading.jumproute,
smallLoading: (state) => state.loading.smallLoading,
enLargeFace: (state) => state.ryzwbj.enLargeFace,
loading_sd: (state) => state.loading.loading_sd,
}),
cachePageName() {
return this.$store.state.layout.cachePageName
},
/**
* 取消跳转路由
*/
cancelJumpRoute () {
this.jumpRouteDialogVisible = false
this.isCropper = false
this.routePath = this.$route.name
this.menuActive = ''
},
methods: {
// getMetaTitle(meta) { //用于选择标题
// let _that = this
// if (_that.isStRole && meta.sTtitle) {
// return meta.sTtitle
// } else {
// return meta.title
// }
// },
/**
* @description: 退出登录
* @param {*}
* @return {*}
*/
logout() {
this.$axios
.get('/security/logout')
.then((res) => {
if (res.data.code == 200) {
localStorage.removeItem('token') //删除名称为“token”的信息。
localStorage.removeItem('userInfo') //删除名称为“userInfor”的信息。
this.$router.replace('/Login')
this.$message.info('退出成功！')
}
tabRemove (name) {
if (name != 'ryzwbj' && name != 'ajzwbj') {
let routerObj = this.paths.find((i) => i.routeName == name)
if (routerObj) {
let pathName = routerObj.name
let res = this.paths.filter((item) => {
return item.name != pathName
})
.catch((err) => {
})
},
/**
* @description: 开始搜索
* @param {*}
* @return {*}
*/
goSearch() {
this.searchTxt = ''
//console.log(this.searchTxt);
},
handleClick({ name }) {
/*
if (pathName == this.$route.meta.title) {
if (this.paths.length > 0) {
// debugger;
let routerIndex = this.paths.findIndex(
(i) => i.routeName == name
)
if (routerIndex == 0) {
this.$router.push(this.paths[1].path)
this.routePath = this.paths[1].routeName
} else {
this.$router.push(this.paths[routerIndex - 1].path)
this.routePath = this.paths[routerIndex - 1].routeName
}
}
}
this.paths = res
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
return
} else {
if (
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') && !this.jumproute
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') &&
!this.jumproute
) {
this.jumpRouteDialogVisible = true
this.isCropper = true
this.$store.commit('loading/setWillRoute', name)
this.routePath = name
this.routeChangeType = 'change'
this.routeChangeType = 'del'
} else {
if (name == '/Home/htzwcj') {
this.$router.push(name)
this.menuActive = ''
} else {
let routerObj = this.paths.find((i) => i.routeName == name)
this.$router.push(routerObj.path)
this.menuActive = routerObj.routeName
}
}
*/
if (name == "/Home/htzwcj") {
this.$router.push(name);
this.menuActive = "";
} else {
let routerObj = this.paths.find((i) => i.routeName == name);
this.$router.push(routerObj.path);
this.menuActive = routerObj.routeName;
}
},
/**
* 确认需要跳转路由
*/
confirmJumpRoute() {
// 清除sessionStorage值
sessionStorage.clear()
this.isCropper = false
this.jumpRouteDialogVisible = false
if (this.routeChangeType === 'change') {
if (this.willRoute == '/Home/htzwcj') {
this.$router.push(this.willRoute)
this.menuActive = ''
} else {
let routerObj = this.paths.find((i) => i.routeName == this.willRoute)
this.$router.push(routerObj.path)
this.menuActive = routerObj.routeName
}
} else if (this.routeChangeType === 'del') {
let routerObj = this.paths.find((i) => i.routeName == this.$route.name)
if (routerObj) {
let pathName = routerObj.name
let res = this.paths.filter((item) => {
return item.name != pathName
})
if (pathName == this.$route.meta.title) {
if (this.paths.length > 0) {
// debugger;
let routerIndex = this.paths.findIndex(
(i) => i.routeName == this.$route.name
)
if (routerIndex == 0) {
this.$router.push(this.paths[1].path)
this.routePath = this.paths[1].routeName
} else {
this.$router.push(this.paths[routerIndex - 1].path)
this.routePath = this.paths[routerIndex - 1].routeName
}
}
}
this.paths = res
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
} else {
this.$router.push({ name: this.willRoute })
}
},
/**
* 取消跳转路由
*/
cancelJumpRoute() {
this.jumpRouteDialogVisible = false
this.isCropper = false
this.routePath = this.$route.name
this.menuActive = ''
},
tabRemove(name) {
if (name != 'ryzwbj' && name != 'ajzwbj') {
let routerObj = this.paths.find((i) => i.routeName == name)
if (routerObj) {
let pathName = routerObj.name
......@@ -369,840 +574,799 @@
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
return
} else {
if (
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') &&
!this.jumproute
) {
this.jumpRouteDialogVisible = true
this.isCropper = true
this.$store.commit('loading/setWillRoute', name)
this.routePath = name
this.routeChangeType = 'del'
} else {
let routerObj = this.paths.find((i) => i.routeName == name)
if (routerObj) {
let pathName = routerObj.name
let res = this.paths.filter((item) => {
return item.name != pathName
})
if (pathName == this.$route.meta.title) {
if (this.paths.length > 0) {
// debugger;
let routerIndex = this.paths.findIndex(
(i) => i.routeName == name
)
if (routerIndex == 0) {
this.$router.push(this.paths[1].path)
this.routePath = this.paths[1].routeName
} else {
this.$router.push(this.paths[routerIndex - 1].path)
this.routePath = this.paths[routerIndex - 1].routeName
}
}
}
this.paths = res
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
}
}
},
setKeepAlive() {
let cachePageName
if (
JSON.parse(utils.Decrypt(sessionStorage.getItem('crumbs'))).length > 0
}
},
setKeepAlive () {
let cachePageName
if (
JSON.parse(utils.Decrypt(sessionStorage.getItem('crumbs'))).length > 0
) {
cachePageName = JSON.parse(
utils.Decrypt(sessionStorage.getItem('crumbs'))
)
.map((i) => i.routeName)
.join()
} else {
cachePageName = ''
}
this.$store.commit('layout/resetcachePageName', cachePageName)
// TODO
// this.$store.commit('layout/delcachePageName', 'ryzwbj')
// this.$store.commit('layout/delcachePageName', 'ajzwbj')
//console.log(1111222222211111, this.$store.state.layout.cachePageName);
},
/**
* @description: 调回任务管理
* @param {*}
* @return {*}
*/
goManager () {
this.$router.push('/Home/htzwcj')
this.menuActive = ''
},
/**
* @description: 菜单跳转路由
* @param {*} index
* @param {*} path
* @return {*}
*/
selectPath (index, path) {
console.log(index)
console.log(path)
if (path == 'zzwcj') {
this.$router.pushToTab({
path: "/AllPersonnelBaseIndex",
query: {
xzry: true,
},
});
return;
}
this.$router.push({ name: index })
/*
if (
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') && !this.jumproute
) {
cachePageName = JSON.parse(
utils.Decrypt(sessionStorage.getItem('crumbs'))
)
.map((i) => i.routeName)
.join()
} else {
cachePageName = ''
}
this.$store.commit('layout/resetcachePageName', cachePageName)
// TODO
// this.$store.commit('layout/delcachePageName', 'ryzwbj')
// this.$store.commit('layout/delcachePageName', 'ajzwbj')
//console.log(1111222222211111, this.$store.state.layout.cachePageName);
},
/**
* @description: 调回任务管理
* @param {*}
* @return {*}
*/
goManager() {
this.jumpRouteDialogVisible = true
this.isCropper = true
this.$store.commit('loading/setWillRoute', index)
this.routeChangeType = 'leftMenu'
} else {
this.$router.push({name: index})
}
*/
},
/**
* @description: 关闭标签
* @param {*}
* @return {*}
*/
closePaths (pathName) {
let res = this.paths.filter((item) => {
return item.name != pathName
})
this.paths = res
//console.log(pathName == this.$route.meta.title);
if (pathName == this.$route.meta.title) {
this.$router.push('/Home/htzwcj')
this.menuActive = ''
},
/**
* @description: 菜单跳转路由
* @param {*} index
* @param {*} path
* @return {*}
*/
selectPath(index, path) {
console.log(index)
console.log(path)
if (path == 'zzwcj') {
this.$router.pushToTab({
path: "/AllPersonnelBaseIndex",
query: {
xzry: true,
},
});
return;
}
this.$router.push({ name: index })
/*
if (
(this.$route.name === 'ryzwbj' || this.$route.name === 'ajzwbj') && !this.jumproute
) {
this.jumpRouteDialogVisible = true
this.isCropper = true
this.$store.commit('loading/setWillRoute', index)
this.routeChangeType = 'leftMenu'
} else {
this.$router.push({name: index})
}
*/
},
/**
* @description: 关闭标签
* @param {*}
* @return {*}
*/
closePaths(pathName) {
let res = this.paths.filter((item) => {
return item.name != pathName
})
this.paths = res
//console.log(pathName == this.$route.meta.title);
if (pathName == this.$route.meta.title) {
this.$router.push('/Home/htzwcj')
this.$refs.menu.activeIndex = ''
}
},
/**
* @description: 跳转路由
* @param {*}
* @return {*}
*/
changeRouter(route) {
this.$router.push(route.path)
this.menuActive = route.routeName
},
/**
* @description: 展开收缩
* @param {*}
* @return {*}
*/
switchCollapse() {
this.isCollapse = !this.isCollapse
},
handleOpen(key, keyPath) {
//console.log(key, keyPath);
},
handleClose(key, keyPath) {
//console.log(key, keyPath);
},
this.$refs.menu.activeIndex = ''
}
},
beforeDestroy() {
//组件销毁前需要解绑事件。否则会出现重复触发事件的问题
/**
* @description: 跳转路由
* @param {*}
* @return {*}
*/
changeRouter (route) {
this.$router.push(route.path)
this.menuActive = route.routeName
},
watch: {
enLargeFace(newValue, oldValue) {
},
menuActive(newValue, oldValue) {
},
loading(newValue, oldValue) {
},
$route: {
handler(newValue, oldValue) {
// console.log(oldValue);
// 如果是人员指纹编辑界面或者是案件指纹编辑界面，进行判断是否跳转
// if(oldValue.name === 'ryzwbj' || oldValue.name === 'ajzwbj') {
// return;
// }
//console.log(this.routePath, 11111111111);
//console.log(newValue, 11111111111);
this.routePath = newValue.name
setTimeout(() => {
//console.log(1);
if (newValue.path != '/Home/htzwcj') {
if (this.paths.length == 0) {
this.paths.push({
name: newValue.meta.title,
path: newValue.path,
routeName: newValue.name,
})
} else {
let obj = {
name: newValue.meta.title,
path: newValue.path,
routeName: newValue.name,
}
if (
this.paths.findIndex((i) => i.routeName == newValue.name) === -1
) {
this.paths.push(obj)
}
/**
* @description: 展开收缩
* @param {*}
* @return {*}
*/
switchCollapse () {
this.isCollapse = !this.isCollapse
},
handleOpen (key, keyPath) {
//console.log(key, keyPath);
},
handleClose (key, keyPath) {
//console.log(key, keyPath);
},
},
beforeDestroy () {
//组件销毁前需要解绑事件。否则会出现重复触发事件的问题
},
watch: {
enLargeFace (newValue, oldValue) {
},
menuActive (newValue, oldValue) {
},
loading (newValue, oldValue) {
},
$route: {
handler (newValue, oldValue) {
// console.log(oldValue);
// 如果是人员指纹编辑界面或者是案件指纹编辑界面，进行判断是否跳转
// if(oldValue.name === 'ryzwbj' || oldValue.name === 'ajzwbj') {
// return;
// }
//console.log(this.routePath, 11111111111);
//console.log(newValue, 11111111111);
this.routePath = newValue.name
setTimeout(() => {
//console.log(1);
if (newValue.path != '/Home/htzwcj') {
if (this.paths.length == 0) {
this.paths.push({
name: newValue.meta.title,
path: newValue.path,
routeName: newValue.name,
})
} else {
let obj = {
name: newValue.meta.title,
path: newValue.path,
routeName: newValue.name,
}
if (
this.paths.findIndex((i) => i.routeName == newValue.name) === -1
) {
this.paths.push(obj)
}
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
}, 0)
},
immediate: true,
}
sessionStorage.setItem(
'crumbs',
utils.Encrypt(JSON.stringify(this.paths))
)
this.setKeepAlive()
}, 0)
},
immediate: true,
},
created() {
this.paths = sessionStorage.getItem('crumbs')
? JSON.parse(utils.Decrypt(sessionStorage.getItem('crumbs')))
: []
},
}
},
created () {
this.paths = sessionStorage.getItem('crumbs')
? JSON.parse(utils.Decrypt(sessionStorage.getItem('crumbs')))
: []
},
}
</script>
<style scoped lang="scss">
// 人像
.face-big {
z-index: 999;
position: fixed;
top: calc(50% - 361px);
left: calc(50% - 271.5px);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.face-name {
font-size: 16px;
font-family:HarmonyOS_Sans_SC-Bold,HarmonyOS_Sans_SC;
font-weight: bold;
color: #333333;
margin-bottom: 6px;
}
.face-img {
width: 543px;
height: 722px;
box-shadow: 0px 14px 30px 2px rgba(0, 21, 51, 0.16);
border-radius: 8px;
border: 1px solid #cccccc;
background: #ffffff;
}
// 人像
.face-big {
z-index: 999;
position: fixed;
top: calc(50% - 361px);
left: calc(50% - 271.5px);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.face-name {
font-size: 16px;
font-family: HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC;
font-weight: bold;
color: #333333;
margin-bottom: 6px;
}
/deep/ .dialog-footer {
margin-top: 26px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
button {
margin-right: 24px;
}
.face-img {
width: 543px;
height: 722px;
box-shadow: 0px 14px 30px 2px rgba(0, 21, 51, 0.16);
border-radius: 8px;
border: 1px solid #cccccc;
background: #ffffff;
}
}
/deep/ .el-dialog__body {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
/deep/ .dialog-footer {
margin-top: 26px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
span {
width: 370px;
height: 22px;
font-size: 16px;
font-family: PingFang-SC-Medium, PingFang-SC;
font-weight: 500;
color: #333333;
line-height: 24px;
}
button {
margin-right: 24px;
}
.el-dialog {
height: 169px;
}
/deep/ .el-dialog__body {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
span {
width: 370px;
height: 22px;
font-size: 16px;
font-family: PingFang-SC-Medium, PingFang-SC;
font-weight: 500;
color: #333333;
line-height: 24px;
}
}
.el-dialog {
height: 169px;
background: #ffffff;
box-shadow: 0px 18px 28px 10px rgba(0, 21, 51, 0.08) !important;
border-radius: 6px;
.confirm-btn {
cursor: pointer;
outline: none;
width: 72px;
height: 40px;
background: #ffffff;
box-shadow: 0px 18px 28px 10px rgba(0, 21, 51, 0.08) !important;
border-radius: 6px;
.confirm-btn {
cursor: pointer;
outline: none;
width: 72px;
height: 40px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #aeb5c2;
font-size: 14px;
font-family:HarmonyOS_Sans_SC;
color: #2e3846;
&:hover {
border: 1px solid #377fec;
color: #377fec;
}
&:active {
border: 1px solid #044cb9;
color: #044cb9;
}
border-radius: 4px;
border: 1px solid #aeb5c2;
font-size: 14px;
font-family: HarmonyOS_Sans_SC;
color: #2e3846;
&:hover {
border: 1px solid #377fec;
color: #377fec;
}
.cancel-btn {
cursor: pointer;
outline: none;
width: 72px;
height: 40px;
background: #055fe7;
border: 1px solid #055fe7;
border-radius: 4px;
font-size: 14px;
font-family:HarmonyOS_Sans_SC;
color: #ffffff;
&:hover {
background: #377fec;
border: 1px solid #377fec;
}
&:active {
background: #044cb9;
border: 1px solid #044cb9;
}
&:active {
border: 1px solid #044cb9;
color: #044cb9;
}
}
.v-modal {
background: none;
}
// 模糊的背景
.cropper {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
filter: blur(1.5px);
.cancel-btn {
cursor: pointer;
outline: none;
width: 72px;
height: 40px;
background: #055fe7;
border: 1px solid #055fe7;
border-radius: 4px;
font-size: 14px;
font-family: HarmonyOS_Sans_SC;
color: #ffffff;
&:hover {
background: #377fec;
border: 1px solid #377fec;
}
}
.shadow {
z-index: 999;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba($color: #fff, $alpha: 0.65);
&:active {
background: #044cb9;
border: 1px solid #044cb9;
}
}
}
#home {
height: 100vh;
//height: 100%;
// filter: blur(5px);
}
.v-modal {
background: none;
}
.zhanshi {
filter: blur(2px);
//display: none;
}
// 模糊的背景
.cropper {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
.layout-container {
img {
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
filter: blur(1.5px);
}
}
.shadow {
z-index: 999;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba($color: #fff, $alpha: 0.65);
}
#home {
height: 100vh;
//height: 100%;
// filter: blur(5px);
}
.zhanshi {
filter: blur(2px);
//display: none;
}
.layout-container {
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
}
.container-dom {
background: #f5f5f5;
height: 100%;
}
/deep/ .el-menu.el-menu--inline {
.el-menu-item {
padding-left: 50px !important;
font-family: HarmonyOS_Sans_SC;
}
.container-dom {
background: #f5f5f5;
height: 100%;
.el-menu-item.is-active {
padding-left: 46px !important;
}
}
/deep/ .el-menu.el-menu--inline {
.el-menu-item {
padding-left: 50px !important;
font-family:HarmonyOS_Sans_SC;
.el-menu-vertical-demo:not(.el-menu--collapse) {
.el-submenu,
.el-menu-item {
img {
// width: 16px;
height: 16px;
}
.el-menu-item.is-active {
padding-left: 46px !important;
span {
margin-left: 16px;
font-family: HarmonyOS_Sans_SC;
}
}
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
.el-menu-item:hover {
background-color: #15243c !important;
}
.el-submenu,
.el-menu-item {
img {
// width: 16px;
height: 16px;
}
span {
margin-left: 16px;
font-family:HarmonyOS_Sans_SC;
}
.el-menu--collapse {
.el-submenu,
.el-menu-item {
img {
// width: 16px;
height: 16px;
}
}
.el-menu-item:hover {
background-color: #15243c !important;
/deep/ .el-submenu__title {
display: flex;
justify-content: center;
align-items: center;
}
.el-menu--collapse {
.el-submenu,
.el-menu-item {
img {
// width: 16px;
height: 16px;
}
}
/deep/ .el-submenu__title {
display: flex;
justify-content: center;
align-items: center;
}
/deep/ .el-tooltip {
text-align: center;
}
.el-submenu {
/deep/ .el-submenu__icon-arrow.el-icon-arrow-right {
display: none;
}
}
/deep/ .el-tooltip {
text-align: center;
}
.aside {
background-color: #1f2d45;
.el-submenu {
/deep/ .el-submenu__icon-arrow.el-icon-arrow-right {
display: none;
}
}
}
.aside {
background-color: #1f2d45;
}
.aside .el-menu {
border-right: none;
}
.aside .logo {
background: #001e33;
width: 100%;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
}
.aside .logo .jh {
width: 30px;
height: 31px;
}
.aside {
/deep/ .el-menu-item.is-active {
box-sizing: border-box;
background-color: #15243c !important;
border-left: 4px solid #148be0;
.aside .el-menu {
border-right: none;
img {
margin-left: -4px;
}
}
.aside .logo {
background: #001e33;
.search {
width: 100%;
height: 64px;
height: 104px;
display: flex;
align-items: center;
justify-content: center;
}
.aside .logo .jh {
width: 30px;
height: 31px;
}
.aside {
/deep/ .el-menu-item.is-active {
box-sizing: border-box;
background-color: #15243c !important;
border-left: 4px solid #148be0;
img {
margin-left: -4px;
}
.searchTxt {
width: 232px;
height: 40px;
border-radius: 4px;
}
.search {
width: 100%;
height: 104px;
display: flex;
align-items: center;
justify-content: center;
/deep/ .el-input__inner {
background: #1f2d45;
border: 1px solid #cccccc;
color: #cccccc;
}
.searchTxt {
width: 232px;
height: 40px;
border-radius: 4px;
}
.search-icon {
width: 14px;
height: 14px;
color: #cccccc;
cursor: pointer;
}
}
}
.aside .logo .title {
width: 191px;
height: 24px;
margin-left: 11px;
}
.fz {
position: fixed;
bottom: 32px;
left: 26px;
width: 137px;
height: 17px;
display: flex;
}
.fz img {
object-fit: contain;
}
.aside .minLogo {
background-size: 36px auto;
}
.el-tabs /deep/ {
font-family: HarmonyOS_Sans_SC;
.el-tabs__header {
margin: 0;
margin-top: 8px;
}
/deep/ .el-input__inner {
background: #1f2d45;
border: 1px solid #cccccc;
color: #cccccc;
}
.el-tabs__nav-prev {
font-size: 20px !important;
cursor: pointer;
.search-icon {
width: 14px;
height: 14px;
color: #cccccc;
cursor: pointer;
}
&:hover {
color: #055fe7;
}
}
.aside .logo .title {
width: 191px;
height: 24px;
margin-left: 11px;
.el-tabs__nav-next {
font-size: 20px !important;
cursor: pointer;
&:hover {
color: #055fe7;
}
}
.fz {
position: fixed;
bottom: 32px;
left: 26px;
width: 137px;
height: 17px;
display: flex;
.is-active {
color: #0077ff;
border-bottom: 2px solid #006aff;
}
.fz img {
object-fit: contain;
.el-tabs__active-bar {
background-color: #006aff;
display: none;
}
.aside .minLogo {
background-size: 36px auto;
.el-tabs__nav-wrap::after {
height: 1px !important;
}
.el-tabs /deep/ {
.el-tabs__header {
margin: 0;
margin-top: 8px;
}
.el-tabs__item {
position: relative;
padding-right: 35px !important;
padding-left: 35px !important;
.el-tabs__nav-prev {
font-size: 20px !important;
cursor: pointer;
&:hover {
color: #055fe7;
&:hover {
.el-icon-close {
display: inline-block;
}
}
.el-tabs__nav-next {
font-size: 20px !important;
cursor: pointer;
&:hover {
color: #055fe7;
.el-icon-close {
&::before {
transform: scale(1.1);
}
}
.is-active {
color: #0077ff;
border-bottom: 2px solid #006aff;
}
.el-tabs__active-bar {
background-color: #006aff;
display: none;
position: absolute;
top: 0;
right: 0;
}
.el-tabs__nav-wrap::after {
height: 1px !important;
&:hover {
color: #0077ff;
}
}
}
.header {
height: 64px;
background: #ffffff;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 25px;
.collapse {
width: 13.14px;
height: 12.99px;
cursor: pointer;
display: flex;
.el-tabs__item {
position: relative;
padding-right: 35px !important;
padding-left: 35px !important;
&:hover {
.el-icon-close {
display: inline-block;
}
}
.el-icon-close {
&::before {
transform: scale(1.1);
}
display: none;
position: absolute;
top: 0;
right: 0;
}
&:hover {
color: #0077ff;
}
img {
cursor: pointer;
object-fit: contain;
}
}
.header {
height: 64px;
background: #ffffff;
.options {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 25px;
.collapse {
width: 13.14px;
height: 12.99px;
.sendFind {
cursor: pointer;
display: flex;
width: 96px;
height: 32px;
background: #ddebff;
border-radius: 4px;
font-size: 14px;
font-family: HarmonyOS_Sans_SC;
color: #055fe7;
line-height: 32px;
text-align: center;
}
img {
cursor: pointer;
object-fit: contain;
}
.set,
.role {
font-size: 14px;
font-family: HarmonyOS_Sans_SC;
color: #333333;
}
.options {
display: flex;
align-items: center;
.set {
margin-left: 56px;
}
.sendFind {
cursor: pointer;
width: 96px;
height: 32px;
background: #ddebff;
border-radius: 4px;
font-size: 14px;
font-family:HarmonyOS_Sans_SC;
color: #055fe7;
line-height: 32px;
text-align: center;
}
.role {
margin-left: 24px;
}
.set,
.role {
font-size: 14px;
font-family:HarmonyOS_Sans_SC;
color: #333333;
}
.message {
cursor: pointer;
width: 16px;
height: 16px;
display: flex;
position: relative;
margin-left: 40px;
background-image: url("../assets/img/Home/info_d.png");
background-size: 16px 16px;
background-position: center;
background-repeat: no-repeat;
.set {
margin-left: 56px;
&:hover {
background-image: url("../assets/img/Home/info_a.png");
}
.role {
margin-left: 24px;
.circle {
position: absolute;
right: -1px;
top: -2px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #fa6400;
border: 1px solid #ffffff;
}
}
.message {
cursor: pointer;
width: 16px;
height: 16px;
display: flex;
position: relative;
margin-left: 40px;
background-image: url("../assets/img/Home/info_d.png");
background-size: 16px 16px;
background-position: center;
background-repeat: no-repeat;
&:hover {
background-image: url("../assets/img/Home/info_a.png");
}
.back {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
background-image: url("../assets/img/Home/back_d.png");
background-size: 14px 12px;
background-position: center;
background-repeat: no-repeat;
.circle {
position: absolute;
right: -1px;
top: -2px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #fa6400;
border: 1px solid #ffffff;
}
&:hover {
background-image: url("../assets/img/Home/back_a.png");
}
.back {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
background-image: url("../assets/img/Home/back_d.png");
background-size: 14px 12px;
background-position: center;
background-repeat: no-repeat;
margin-left: 25px;
}
&:hover {
background-image: url("../assets/img/Home/back_a.png");
}
.quit {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
background-image: url("../assets/img/Home/back_d.png");
background-size: 14px 12px;
background-position: center;
background-repeat: no-repeat;
margin-left: 25px;
&:hover {
background-image: url("../assets/img/Home/back_a.png");
}
.quit {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
background-image: url("../assets/img/Home/back_d.png");
background-size: 14px 12px;
background-position: center;
background-repeat: no-repeat;
&:hover {
background-image: url("../assets/img/Home/back_a.png");
}
margin-left: 25px;
}
margin-left: 25px;
}
.logout {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
justify-content: center;
align-items: center;
margin-left: 25px;
.logout {
.icon {
cursor: pointer;
width: 14px;
height: 12px;
display: flex;
justify-content: center;
align-items: center;
margin-left: 25px;
.icon {
cursor: pointer;
width: 100%;
height: 100%;
}
width: 100%;
height: 100%;
}
}
}
}
.main {
padding: 24px;
width: 100%;
height: calc(100% - 60px);
.main {
padding: 24px;
.contain {
position: relative;
width: 100%;
height: calc(100% - 60px);
height: 100%;
background: #ffffff;
border-radius: 8px;
overflow: hidden;
.contain {
position: relative;
.scrollbar {
width: 100%;
height: 100%;
background: #ffffff;
border-radius: 8px;
position: relative;
height: 47px;
overflow: hidden;
}
.scrollbar {
width: 100%;
position: relative;
height: 47px;
overflow: hidden;
}
.breadcrumb {
position: absolute;
left: 0;
top: 0;
display: flex;
height: 47px;
border-bottom: 1px solid #eeeeee;
.breadcrumb {
position: absolute;
left: 0;
top: 0;
display: flex;
.path {
position: relative;
cursor: pointer;
box-sizing: border-box;
height: 47px;
border-bottom: 1px solid #eeeeee;
.path {
position: relative;
cursor: pointer;
box-sizing: border-box;
height: 47px;
padding: 11px 24px;
font-size: 14px;
font-family:HarmonyOS_Sans_SC;
flex-shrink: 0;
color: #666666;
&:hover {
.closeIcon {
display: block;
}
}
padding: 11px 24px;
font-size: 14px;
font-family: HarmonyOS_Sans_SC;
flex-shrink: 0;
color: #666666;
&:hover {
.closeIcon {
position: absolute;
top: 0;
right: 0;
display: none;
display: block;
}
}
.active {
border-bottom: 2px solid #006aff;
color: #0077ff;
.closeIcon {
position: absolute;
top: 0;
right: 0;
display: none;
}
}
}
}
.loading {
z-index: 999998;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba($color: #fff, $alpha: 0.65);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.loading-finger {
width: 100px;
height: 100px;
img {
width: 100%;
height: 100%;
.active {
border-bottom: 2px solid #006aff;
color: #0077ff;
}
}
}
}
.loading {
z-index: 999998;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba($color: #fff, $alpha: 0.65);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.loading-finger {
width: 100px;
height: 100px;
.loading-name {
width: 100px;
height: auto;
margin-top: 20px;
img {
width: 100%;
height: 100%;
}
img {
width: 100%;
height: 100%;
}
}
.smallLoading {
z-index: 999999;
position: fixed;
right: 24px;
bottom: 24px;
width: 1592px;
height: 828px;
background: rgba($color: #fff, $alpha: 0.65);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.loading-name {
width: 100px;
height: auto;
margin-top: 20px;
.loading-finger {
width: 100px;
height: 100px;
img {
width: 100%;
height: 100%;
}
}
}
.smallLoading {
z-index: 999999;
position: fixed;
right: 24px;
bottom: 24px;
width: 1592px;
height: 828px;
background: rgba($color: #fff, $alpha: 0.65);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.loading-finger {
width: 100px;
height: 100px;
img {
width: 100%;
height: 100%;
}
img {
width: 100%;
height: 100%;
}
}
.loading-name {
width: 100px;
height: auto;
margin-top: 20px;
.loading-name {
width: 100px;
height: auto;
margin-top: 20px;
img {
width: 100%;
height: 100%;
}
img {
width: 100%;
height: 100%;
}
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment