|
@@ -2,18 +2,27 @@
|
|
|
<div class="app-container home">
|
|
|
|
|
|
<div class="stat-warp">
|
|
|
- <ul class="stat-warp" >
|
|
|
- <li class="theme6">
|
|
|
- <div class="label">我的待审批</div>
|
|
|
+ <ul>
|
|
|
+ <li class="theme1">
|
|
|
<div class="num">{{toBeProcessedData.total}}</div>
|
|
|
+ <div class="label">我的待审批</div>
|
|
|
+ <div class="icon-box">
|
|
|
+ <i class="icon iconfont icon-iconm_waixht"></i>
|
|
|
+ </div>
|
|
|
</li>
|
|
|
- <li class="theme5">
|
|
|
- <div class="label">我的发起(未结束)</div>
|
|
|
+ <li class="theme2">
|
|
|
<div class="num">{{haveInitiatedData.total}}</div>
|
|
|
+ <div class="label">我的发起(未结束)</div>
|
|
|
+ <div class="icon-box">
|
|
|
+ <i class="icon iconfont icon-iconm_wofqd"></i>
|
|
|
+ </div>
|
|
|
</li>
|
|
|
<li class="theme3">
|
|
|
- <div class="label">未读消息</div>
|
|
|
<div class="num">3</div>
|
|
|
+ <div class="label">未读消息</div>
|
|
|
+ <div class="icon-box">
|
|
|
+ <i class="icon iconfont icon-iconm_unread"></i>
|
|
|
+ </div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
@@ -73,6 +82,12 @@
|
|
|
<div class="commons-title">
|
|
|
系统公告
|
|
|
</div>
|
|
|
+ <ul class="announcement">
|
|
|
+ <li v-for="i in sendMegData.rows" :key="i.id">
|
|
|
+ <div class="time">{{i.createTime}} <span>系统公告</span></div>
|
|
|
+ <div class="content">{{i.content}}</div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- <byTableDemo></byTableDemo> -->
|
|
@@ -99,13 +114,17 @@ let haveInitiatedData = ref({
|
|
|
total:0,
|
|
|
rows:[]
|
|
|
})
|
|
|
+const sendMegData = ref({
|
|
|
+ total:0,
|
|
|
+ rows:[]
|
|
|
+})
|
|
|
const pushProcessApproval = (row) => {
|
|
|
proxy.$router.replace({
|
|
|
path: "/platform_manage/process/processApproval",
|
|
|
query: {
|
|
|
flowKey: row.flowKey,
|
|
|
id: row.id,
|
|
|
- processType:10,
|
|
|
+ processType:20,
|
|
|
version:row.version
|
|
|
},
|
|
|
});
|
|
@@ -126,7 +145,12 @@ const getData = (() => {
|
|
|
}).then(res=>{
|
|
|
haveInitiatedData.value = res
|
|
|
})
|
|
|
-
|
|
|
+ proxy.post('sendMeg/page',{
|
|
|
+ pageNum:1,
|
|
|
+ pageSize:3,
|
|
|
+ }).then(res=>{
|
|
|
+ sendMegData.value = res
|
|
|
+ })
|
|
|
|
|
|
})
|
|
|
getData()
|
|
@@ -142,6 +166,29 @@ onMounted(() => {})
|
|
|
|
|
|
.app-container {
|
|
|
height: 100%;
|
|
|
+ .announcement{
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ li{
|
|
|
+ list-style: none;
|
|
|
+ border-radius: 2px;
|
|
|
+ padding: 14px 20px;
|
|
|
+ background: #EEEEEE;
|
|
|
+ margin-bottom:10px;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ .time{
|
|
|
+ color:#999;
|
|
|
+ }
|
|
|
+ .content{
|
|
|
+ margin-top:10px;
|
|
|
+ color:#333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ li:hover{
|
|
|
+ background: #EFF6FF;
|
|
|
+ }
|
|
|
+ }
|
|
|
.table-warp{
|
|
|
//页面全屏,占据剩下的位置
|
|
|
height: calc(100% - 157px);
|
|
@@ -204,35 +251,56 @@ onMounted(() => {})
|
|
|
min-width: 285px;
|
|
|
box-sizing: border-box;
|
|
|
margin-right: 20px;
|
|
|
- background: #eff6ff;
|
|
|
+ background: linear-gradient(360deg, #C7E3FE 0%, #DFECFF 100%);
|
|
|
float: left;
|
|
|
overflow: hidden;
|
|
|
padding: 20px;
|
|
|
color: #333333;
|
|
|
+ position: relative;
|
|
|
border-radius: 10px;
|
|
|
.label {
|
|
|
font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
}
|
|
|
.label::before {
|
|
|
- width: 10px;
|
|
|
- height: 10px;
|
|
|
- content: '';
|
|
|
- border-radius: 50%;
|
|
|
- background: #0084ff;
|
|
|
- display: inline-block;
|
|
|
- margin-right: 10px;
|
|
|
+ // width: 10px;
|
|
|
+ // height: 10px;
|
|
|
+ // content: '';
|
|
|
+ // border-radius: 50%;
|
|
|
+ // background: #0084ff;
|
|
|
+ // display: inline-block;
|
|
|
+ // margin-right: 10px;
|
|
|
+
|
|
|
}
|
|
|
.num {
|
|
|
- margin-top: 10px;
|
|
|
+
|
|
|
font-size: 24px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
+ .icon-box{
|
|
|
+ position: absolute;
|
|
|
+ height: 40px;
|
|
|
+ width: 40px;
|
|
|
+ right: 20px;
|
|
|
+ top: 20px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 10px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ i{
|
|
|
+ font-size: 20px;
|
|
|
+ color:#0084FF;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
//#F5F3FF #9E64ED
|
|
|
.theme2 {
|
|
|
- background: #f5f3ff;
|
|
|
+ background: linear-gradient(180deg, #EAE8FB 0%, #DED9FF 100%);
|
|
|
.label::before {
|
|
|
- background: #9e64ed;
|
|
|
+ background: #7566F0;
|
|
|
+ }
|
|
|
+ .icon-box i {
|
|
|
+ color: #7566F0;
|
|
|
}
|
|
|
}
|
|
|
//#FFF1E1 #FF9315
|
|
@@ -241,6 +309,9 @@ onMounted(() => {})
|
|
|
.label::before {
|
|
|
background: #ff9315;
|
|
|
}
|
|
|
+ .icon-box i {
|
|
|
+ color: #FF9315;
|
|
|
+ }
|
|
|
}
|
|
|
//#E2FBE8 #39C55A
|
|
|
.theme4 {
|