|
@@ -1,6 +1,7 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
<div class="user">
|
|
|
+ <span class="title1 fl">投 诉 管 理 系 统</span>
|
|
|
<div class="content">
|
|
|
<div class="userImg">
|
|
|
<i class="el-icon-s-custom"></i>
|
|
@@ -8,22 +9,33 @@
|
|
|
<span class="name">{{ userInfo.userName }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="title">投 诉 管 理 系 统</div>
|
|
|
+
|
|
|
<div class="list">
|
|
|
- <el-row>
|
|
|
- <el-col
|
|
|
- :span="6"
|
|
|
- v-for="(item, index) in userInfo.list"
|
|
|
- :key="index"
|
|
|
- class="content pointer"
|
|
|
- >
|
|
|
- <div class="img" @click="jump(item)">
|
|
|
- <!-- <i class="el-icon-s-tools"></i> -->
|
|
|
- <img :src="item.webIcon" alt="" style="width: 30px; height: 30px" />
|
|
|
- </div>
|
|
|
- <span class="name" @click="jump(item)">{{ item.name }}</span>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <div class="fl qxContent">
|
|
|
+ <el-row v-for="(item, index) in userInfo.functions" :key="index">
|
|
|
+ <el-col :span="24" class="qxTitle" :style="index == 0? 'margin-top: 0px;':''">{{ item.systemName }}</el-col>
|
|
|
+ <el-col :span="6" v-for="(it,ind) in item.list" :key="ind">
|
|
|
+ <div class="content pointer">
|
|
|
+ <div class="img" @click="jump(it)">
|
|
|
+ <!-- <i class="el-icon-s-tools"></i> -->
|
|
|
+ <!-- <img :src="item.webIcon" alt="" style="width: 30px; height: 30px" /> -->
|
|
|
+ <div :class="'icon icon' + it.id"></div>
|
|
|
+ </div>
|
|
|
+ <span class="name" @click="jump(it)">{{ it.name }}</span>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="fl noticesContent">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="noticestitle">公告</el-col>
|
|
|
+ <el-col :span="24" v-for="(item,index) in userInfo.notices" :key="index" class="noticesList pointer">
|
|
|
+ <span class="yuan fl"></span>
|
|
|
+ <span class="fl font">{{ item.content }}</span>
|
|
|
+ <span class="fr time">{{ item.createTime }}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -69,15 +81,14 @@ export default {
|
|
|
path: val.url,
|
|
|
});
|
|
|
window.open(routeUrl.href, "_blank");
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.$message({
|
|
|
- type: "error",
|
|
|
- message: res.message,
|
|
|
- });
|
|
|
-
|
|
|
+ type: "error",
|
|
|
+ message: res.message,
|
|
|
+ });
|
|
|
}
|
|
|
});
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
// let routeUrl = this.$router.resolve({
|
|
|
// path: val.url,
|
|
|
// });
|
|
@@ -95,6 +106,11 @@ export default {
|
|
|
height: 50px;
|
|
|
line-height: 50px;
|
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
|
|
|
+ .title1 {
|
|
|
+ font-size: 20px;
|
|
|
+ margin-left: 30px;
|
|
|
+ color: #409eff;
|
|
|
+ }
|
|
|
.content {
|
|
|
float: right;
|
|
|
margin-right: 30px;
|
|
@@ -119,10 +135,31 @@ export default {
|
|
|
}
|
|
|
.list {
|
|
|
width: 1000px;
|
|
|
- margin: 0 auto;
|
|
|
+ margin: 40px auto;
|
|
|
+ height: auto;
|
|
|
+ .qxContent{
|
|
|
+ width: 790px;
|
|
|
+ // padding:10px;
|
|
|
+ // box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
|
|
|
+ .qxTitle{
|
|
|
+ height: 16px;
|
|
|
+ line-height: 16px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ border-left: 5px solid #606266;
|
|
|
+ padding-left: 10px;
|
|
|
+ margin-top: 20px;
|
|
|
+ color: #606266;
|
|
|
+ }
|
|
|
+ }
|
|
|
.content {
|
|
|
- height: 80px;
|
|
|
- line-height: 80px;
|
|
|
+ width: 85%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ margin-top: 20px;
|
|
|
+ padding-left: 10px;
|
|
|
+ border-radius: 10px;
|
|
|
+ border: 1px solid #ebeef5;
|
|
|
.img {
|
|
|
font-size: 30px;
|
|
|
float: left;
|
|
@@ -133,6 +170,83 @@ export default {
|
|
|
margin-left: 10px;
|
|
|
}
|
|
|
}
|
|
|
+ .content:hover {
|
|
|
+ border: 1px solid #fff;
|
|
|
+ box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
|
|
|
+ }
|
|
|
+ .noticesContent{
|
|
|
+ width: 200px;
|
|
|
+ margin-left: 10px;
|
|
|
+ box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
|
|
|
+ .noticestitle {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ background-color: #409eff;
|
|
|
+ color: #fff;
|
|
|
+ padding-left: 10px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ .noticesList{
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ padding: 0 10px;
|
|
|
+ .yuan{
|
|
|
+ width: 4px;
|
|
|
+ height: 4px;
|
|
|
+ display: inline-block;
|
|
|
+ border-radius: 2px;
|
|
|
+ background-color: #409eff;
|
|
|
+ margin-top: 14px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ .time {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .noticesList:hover .font{
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.icon-1 {
|
|
|
+ background: url(../../common/images/icon8.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon1 {
|
|
|
+ background: url(../../common/images/icon1.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon2 {
|
|
|
+ background: url(../../common/images/icon2.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon3 {
|
|
|
+ background: url(../../common/images/icon3.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon4 {
|
|
|
+ background: url(../../common/images/icon4.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon5 {
|
|
|
+ background: url(../../common/images/icon5.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon6 {
|
|
|
+ background: url(../../common/images/icon6.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon7 {
|
|
|
+ background: url(../../common/images/icon7.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon8 {
|
|
|
+ background: url(../../common/images/icon8.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon9 {
|
|
|
+ background: url(../../common/images/icon9.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon10 {
|
|
|
+ background: url(../../common/images/icon10.png) 0 0 no-repeat;
|
|
|
+}
|
|
|
+.icon {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ margin-top: 11px;
|
|
|
}
|
|
|
</style>
|
|
|
|