meswork/JY1.0
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
liushuai
2019-09-19 19:53:32 +08:00
parent aef7132f40 a53f72a4dc
commit b252637ead
10 changed files with 67 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
src/views/dashboard/index.vue
View File

@@ -1,25 +1,27 @@
<template>
<el-card style="min-height:calc(100vh - 84px);background: url('../../../static/bg.jpg') no-repeat;background-size:100% 100%">
<el-card style="min-height:calc(100vh - 84px);background: rgb(236,243,250);background-size:100% 100%">
<div class="dashboard-container">
<div class="sudoku_row" >
<div class="dashboard-text" style="color:white">用户名：{{ name }}</div>
<el-divider content-position="right" style="margin:24px">消息通知</el-divider>
<el-card v-for="(sudoku,index) in sudokus" :class="curSelect === sudoku.id?'opacity':''" :key="index+9999" shadow="hover" class="sudoku_item ">
<div>
<el-badge :value="sudoku.value">
<svg-icon :icon-class="sudoku.icon" style="" />
<router-link :to="sudoku.router">{{ sudoku.name }}</router-link>
</el-badge>
</div>
</el-card>
<div class="dashboard-text" style="color:black">用户名：{{ name }}</div>
<el-divider content-position="right" style="margin:24px"/>
<div v-for="(sudoku,index) in sudokus" :class="curSelect === sudoku.id?'opacity':''" :key="index+9999" shadow="hover" class="sudoku_item" style="background: white;border: 2px solid rgb(208,222,234)">
<router-link :to="sudoku.router" style="width: 100%">
<el-badge :value="sudoku.value" class="dashbadge" style="width: 100%;text-align:center">
<svg-icon :icon-class="sudoku.icon" :style="{color:colors[index]}" style="width: 25px;height: 25px"/>
<h2 :style="{color:colors[index]}" style="margin: 0px;height: 30px;display: inline-block;line-height: 30px">{{ sudoku.name }}</h2>
</el-badge>
</router-link>
</div>
<div v-for="(value1,index1) in fathers" :key="index1" style="width:100%">
<el-divider content-position="left" style="margin:24px">{{ value1.title }}</el-divider>
<div v-for="(value1,index1) in fathers" :key="index1" style="width:100%;background: white;margin-bottom: 15px">
<div style="width: 100%;height: 40px;line-height: 40px;background: rgb(127,172,237);color:white">
<svg-icon :icon-class="value1.icon" style="color: white;margin: 5px 5px 0px 10px;border: 0 solid black;width:20px;height:20px"/>
{{ value1.title }}
</div>
<router-link v-for="(value2,index2) in sons" v-if="value2.pid === value1.id" :key="index2" :to="value2.path">
<el-card shadow="hover" class="sudoku_item" style="height:150px;width:170px;margin: 5px;display: inline-block;background: rgba(255,255,255,0.4)">
<svg-icon :icon-class="value2.icon" :style="{color:Color(index2)}" class="bgc" style="display:block;margin: auto;border: 0 solid black;width:70px;height:70px"/><br>
<div style="color:black;text-align:center">{{ value2.title }}</div>
<el-card shadow="hover" class="sudoku_item1" style="height:130px;width:175px;margin: 5px;display: inline-block;background: rgba(255,255,255,0.4);border: 2px solid rgb(208,222,234)">
<svg-icon :icon-class="value2.icon" class="bgc" style="color: rgb(37,89,164);display:block;margin: auto;border: 0px solid black;width:40px;height:40px"/>
<h4 style="margin-top: 10px;color:rgb(37,89,164);text-align:center">{{ value2.title }}</h4>
</el-card>
</router-link>
</div>
@@ -36,6 +38,7 @@ export default {
name: 'Dashboard',
data() {
return {
colors: ['rgb(162,126,253)', 'rgb(254,178,0)', 'rgb(66,222,144)', 'rgb(68,176,254)', 'rgb(255,87,116)'],
sudokus: [],
curSelect: null,
number: '',
@@ -73,7 +76,8 @@ export default {
data.data.map(v => {
this.fathers.push({
id: v.id,
title: v.title
title: v.title,
icon: v.icon
})
})
})
@@ -91,7 +95,6 @@ export default {
name: `select * from 基础表_角色模块信息 inner join 基础表_模块信息 on 基础表_角色模块信息.id = 基础表_模块信息.id where 角色编号= ${this.token} and [path] <> '/'`
}
}).then(data => {
console.log(data)
this.sons = []
data.data.map(v => {
this.sons.push({
@@ -117,7 +120,6 @@ export default {
for (let i = 0; i < data.data.length; i++) {
this.getMessageNum(data.data[i].消息通知来源, data.data[i].通知条件, data, i)
}
console.log(this.sudokus)
})
},
async getMessageNum(tableName, condition, rawData, i) {
@@ -149,15 +151,6 @@ export default {
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
/*.text {*/
/*font-size: 14px;*/
/*}*/
/*.item {*/
/*margin-bottom: 18px;*/
/*}*/
.clearfix:before,
.clearfix:after {
display: table;
@@ -181,6 +174,28 @@ export default {
flex-wrap: wrap;
}
.sudoku_item{
margin-top: 24ps;
margin-bottom: 20px;
margin-right: 20px;
border: 0 solid red;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width:240px;
height: 80px;
/*padding-top: 20px;*/
/*padding-bottom: 10px;*/
}
.sudoku_item:hover {
border: 2px solid white;
}
.sudoku_item img{
margin-bottom: 3px;
display: block;
}
.sudoku_item1{
margin-top: 24ps;
margin-bottom: 20px;
margin-left: 20px;
border: 0 solid red;
@@ -190,20 +205,20 @@ export default {
flex-direction: column;
width:15%;
height: 80px;
/*padding-top: 10px;*/
padding-top: 30px;
/*padding-bottom: 10px;*/
}
.sudoku_item:hover {
border: 2px solid white;
.sudoku_item1:hover {
border: 2px solid rgb(135,187,224);
}
.sudoku_item1 img{
margin-bottom: 3px;
display: block;
}
.opacity{
opacity: 0.4;
background: #e5e5e5;
}
.sudoku_item img{
margin-bottom: 3px;
display: block;
}
.dashboard {
&-container {
margin: 30px;
@@ -214,3 +229,11 @@ export default {
}
}
</style>
<style>
.el-badge__content {
background-color: rgb(255,151,91);
}
/*#dashbadge {*/
/*background-color: rgb(255,151,91);*/
/*}*/
</style>