|
|
|
@ -1,110 +1,155 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="8"> |
|
|
|
<el-card shadow="hover" class="mgb20" style="height:252px;"> |
|
|
|
<div class="user-info"> |
|
|
|
<img src="../../assets/img/img.jpg" class="user-avator" alt /> |
|
|
|
<div class="user-info-cont"> |
|
|
|
<div class="user-info-name">{{name}}</div> |
|
|
|
<div>{{role}}</div> |
|
|
|
<el-col :span="18"> |
|
|
|
<el-card shadow="hover" class="mgb20" style="height:215px;"> |
|
|
|
<p class="work_title">日常工作事项</p> |
|
|
|
<div class="work_content"> |
|
|
|
<div class="work_item" @click="goPage('/buyerReview')"> |
|
|
|
<img src="../../assets/img/index_banner.png" alt=""> |
|
|
|
<p>开户信息审核(36)</p> |
|
|
|
</div> |
|
|
|
<div class="work_item" @click="goPage('/businessAudit')"> |
|
|
|
<img src="../../assets/img/index_banner1.png" alt=""> |
|
|
|
<p>商家入驻审核(13)</p> |
|
|
|
</div> |
|
|
|
<div class="work_item" @click="goPage('/thirdAudit')"> |
|
|
|
<img src="../../assets/img/index_banner2.png" alt=""> |
|
|
|
<p>第三方机构审核(36)</p> |
|
|
|
</div> |
|
|
|
<div class="work_item" @click="goPage('/groundingAudit')"> |
|
|
|
<img src="../../assets/img/index_banner3.png" alt=""> |
|
|
|
<p>资产审核(36)</p> |
|
|
|
</div> |
|
|
|
<!-- <div class="work_item" @click="goPage('/businessAudit')"> |
|
|
|
<img src="../../assets/img/index_banner4.png" alt=""> |
|
|
|
<p>资产发布审核(36)</p> |
|
|
|
</div> --> |
|
|
|
<div class="work_item" @click="goPage('/businessAudit')"> |
|
|
|
<img src="../../assets/img/index_banner5.png" alt=""> |
|
|
|
<p>待公示订单(36)</p> |
|
|
|
</div> |
|
|
|
<div class="work_item" @click="goPage('/businessAudit')"> |
|
|
|
<img src="../../assets/img/index_banner6.png" alt=""> |
|
|
|
<p>待结算订单(36)</p> |
|
|
|
</div> |
|
|
|
<div class="work_item" @click="goPage('/businessAudit')"> |
|
|
|
<img src="../../assets/img/index_banner7.png" alt=""> |
|
|
|
<p>退款订单审核(36)</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="user-info-list"> |
|
|
|
上次登录时间： |
|
|
|
<span>2019-11-01</span> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
<el-col :span="6"> |
|
|
|
<el-card shadow="hover" style="height:215px;"> |
|
|
|
<div slot="header" class="sanjiao_title"> |
|
|
|
<span>运营平台通知</span> |
|
|
|
<div class="sanjiao"> |
|
|
|
<div class="sanjiao_left"></div> |
|
|
|
<div class="sanjiao_right"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="user-info-list"> |
|
|
|
上次登录地点： |
|
|
|
<span>东莞</span> |
|
|
|
<div> |
|
|
|
<div class="notice_item"> |
|
|
|
<span class="notice_item_time">[2021-06-16]</span> |
|
|
|
<span>个人绩效评分规则更新5</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
<!-- <el-card shadow="hover" style="height:252px;"> |
|
|
|
<div slot="header" class="clearfix"> |
|
|
|
<span>语言详情</span> |
|
|
|
</div>Vue |
|
|
|
<el-progress :percentage="71.3" color="#42b983"></el-progress>JavaScript |
|
|
|
<el-progress :percentage="24.1" color="#f1e05a"></el-progress>CSS |
|
|
|
<el-progress :percentage="13.7"></el-progress>HTML |
|
|
|
<el-progress :percentage="5.9" color="#f56c6c"></el-progress> |
|
|
|
</el-card> --> |
|
|
|
</el-col> |
|
|
|
<!-- <el-col :span="16"> |
|
|
|
<el-row :gutter="20" class="mgb20"> |
|
|
|
<el-col :span="8"> |
|
|
|
<el-card shadow="hover" :body-style="{padding: '0px'}"> |
|
|
|
<div class="grid-content grid-con-1"> |
|
|
|
<i class="el-icon-lx-people grid-con-icon"></i> |
|
|
|
<div class="grid-cont-right"> |
|
|
|
<div class="grid-num">1234</div> |
|
|
|
<div>用户访问量</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
<el-col :span="8"> |
|
|
|
<el-card shadow="hover" :body-style="{padding: '0px'}"> |
|
|
|
<div class="grid-content grid-con-2"> |
|
|
|
<i class="el-icon-lx-notice grid-con-icon"></i> |
|
|
|
<div class="grid-cont-right"> |
|
|
|
<div class="grid-num">321</div> |
|
|
|
<div>系统消息</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
<el-col :span="8"> |
|
|
|
<el-card shadow="hover" :body-style="{padding: '0px'}"> |
|
|
|
<div class="grid-content grid-con-3"> |
|
|
|
<i class="el-icon-lx-goods grid-con-icon"></i> |
|
|
|
<div class="grid-cont-right"> |
|
|
|
<div class="grid-num">5000</div> |
|
|
|
<div>数量</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-card shadow="hover" style="height:403px;"> |
|
|
|
<div slot="header" class="clearfix"> |
|
|
|
<span>待办事项</span> |
|
|
|
<el-button style="float: right; padding: 3px 0" type="text">添加</el-button> |
|
|
|
</el-row> |
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="24"> |
|
|
|
<el-card shadow="hover" class="mgb20" style="height:200px;"> |
|
|
|
<p class="work_title">昨日工作汇总</p> |
|
|
|
<div class="summary"> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日成交金额</div> |
|
|
|
<div>¥845,256,996.30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日结算金额</div> |
|
|
|
<div>¥845,256,996.30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日开户审核</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日入驻审核</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日机构审核</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日挂牌审核</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日发布审核</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日公示处理</div> |
|
|
|
<div>0</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日结算处理</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
<div class="summary_item" > |
|
|
|
<div class="summary_item_left">昨日退款处理</div> |
|
|
|
<div>30</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<el-table :show-header="false" :data="todoList" style="width:100%;"> |
|
|
|
<el-table-column width="40"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-checkbox v-model="scope.row.status"></el-checkbox> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div |
|
|
|
class="todo-item" |
|
|
|
:class="{'todo-item-del': scope.row.status}" |
|
|
|
>{{scope.row.title}}</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column width="60"> |
|
|
|
<template> |
|
|
|
<i class="el-icon-edit"></i> |
|
|
|
<i class="el-icon-delete"></i> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-card shadow="hover"> |
|
|
|
<schart ref="bar" class="schart" canvasId="bar" :options="options"></schart> |
|
|
|
<el-col :span="18"> |
|
|
|
<el-card shadow="hover" style="height:460px;"> |
|
|
|
<schart ref="line" class="schart" canvasId="line" :options="options2"></schart> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-card shadow="hover"> |
|
|
|
<schart ref="line" class="schart" canvasId="line" :options="options2"></schart> |
|
|
|
<el-col :span="6"> |
|
|
|
<el-card shadow="hover" style="height:460px;"> |
|
|
|
<p class="work_title">本月绩效达标情况</p> |
|
|
|
<div class="achievements"> |
|
|
|
<span>开户信息审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#FACD91"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>商家入驻审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#CAF982"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>第三方机构审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#02A7F0"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>资产挂牌审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#EC808D"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>资产发布审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#C280FF"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>待公示订单</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#4E73E4"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>待结算订单</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#849AE8"></el-progress> |
|
|
|
</div> |
|
|
|
<div class="achievements"> |
|
|
|
<span>退款订单审核</span> |
|
|
|
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" color="#F7AB08"></el-progress> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> --> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
@ -173,47 +218,22 @@ export default { |
|
|
|
value: 1065 |
|
|
|
} |
|
|
|
], |
|
|
|
options: { |
|
|
|
type: 'bar', |
|
|
|
title: { |
|
|
|
text: '最近一周各品类销售图' |
|
|
|
}, |
|
|
|
xRorate: 25, |
|
|
|
labels: ['周一', '周二', '周三', '周四', '周五'], |
|
|
|
datasets: [ |
|
|
|
{ |
|
|
|
label: '家电', |
|
|
|
data: [234, 278, 270, 190, 230] |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '百货', |
|
|
|
data: [164, 178, 190, 135, 160] |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '食品', |
|
|
|
data: [144, 198, 150, 235, 120] |
|
|
|
} |
|
|
|
] |
|
|
|
}, |
|
|
|
options2: { |
|
|
|
type: 'line', |
|
|
|
title: { |
|
|
|
text: '最近几个月各品类销售趋势图' |
|
|
|
text: '本月金额汇总' |
|
|
|
}, |
|
|
|
labels: ['6月', '7月', '8月', '9月', '10月'], |
|
|
|
labels: [2,4,6,8,10,12,14,16,18,20,22,24,26,28,30], |
|
|
|
datasets: [ |
|
|
|
{ |
|
|
|
label: '家电', |
|
|
|
data: [234, 278, 270, 190, 230] |
|
|
|
label: '成交金额', |
|
|
|
data: [234, 278, 270, 590, 950] |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '百货', |
|
|
|
label: '结算金额', |
|
|
|
fillColor: "rgba(132, 154, 232, 1)", |
|
|
|
data: [164, 178, 150, 135, 160] |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '食品', |
|
|
|
data: [74, 118, 200, 235, 90] |
|
|
|
} |
|
|
|
] |
|
|
|
} |
|
|
|
}; |
|
|
|
@ -265,6 +285,117 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.achievements{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
font-size: 16px; |
|
|
|
margin-top: 15px; |
|
|
|
} |
|
|
|
.achievements>>>.el-progress{ |
|
|
|
width: 340px; |
|
|
|
} |
|
|
|
.achievements>span{ |
|
|
|
display: inline-block; |
|
|
|
width: 175px; |
|
|
|
margin-right: 20px; |
|
|
|
} |
|
|
|
.summary{ |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
} |
|
|
|
.summary_item{ |
|
|
|
width:300px ; |
|
|
|
height: 50px; |
|
|
|
display: flex; |
|
|
|
border: 1px solid #D7D7D7; |
|
|
|
font-size: 16px; |
|
|
|
color: #849AE8; |
|
|
|
align-items: center; |
|
|
|
margin-top: 15px; |
|
|
|
margin-right: 20px; |
|
|
|
} |
|
|
|
.summary_item:nth-child(5n+5){ |
|
|
|
margin-right: 0px; |
|
|
|
} |
|
|
|
.summary_item >div{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
height: 100%; |
|
|
|
width: 50%; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
.summary_item_left{ |
|
|
|
background-color: #4E73E4; |
|
|
|
color: white; |
|
|
|
text-align: center; |
|
|
|
font-size: 16px; |
|
|
|
} |
|
|
|
.notice{ |
|
|
|
margin-top: 10px; |
|
|
|
} |
|
|
|
.notice_item{ |
|
|
|
font-weight: 400; |
|
|
|
font-size: 16px; |
|
|
|
} |
|
|
|
.notice_item:hover{ |
|
|
|
color: rgb(41, 76, 198); |
|
|
|
} |
|
|
|
.notice_item_time{ |
|
|
|
display: inline-block; |
|
|
|
color: rgb(170, 170, 170); |
|
|
|
margin-right: 10px; |
|
|
|
} |
|
|
|
.sanjiao{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
.sanjiao>div{ |
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
} |
|
|
|
.sanjiao_left{ |
|
|
|
width:0; |
|
|
|
height:0; |
|
|
|
border-top:10px solid transparent; |
|
|
|
border-bottom:10px solid transparent; |
|
|
|
border-right:10px solid #D7D7D7; |
|
|
|
margin-right: 15px; |
|
|
|
} |
|
|
|
.sanjiao_right{ |
|
|
|
width:0; |
|
|
|
height:0; |
|
|
|
border-top:10px solid transparent; |
|
|
|
border-bottom:10px solid transparent; |
|
|
|
border-left:10px solid #D7D7D7; |
|
|
|
} |
|
|
|
.sanjiao_title{ |
|
|
|
font-weight: 500; |
|
|
|
font-size: 18px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.work_title{ |
|
|
|
font-weight: 500; |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
.work_content{ |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.work_item{ |
|
|
|
font-weight: 400; |
|
|
|
font-size: 16px; |
|
|
|
text-align: center; |
|
|
|
margin-top: 40px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.work_item img{ |
|
|
|
width: 60px; |
|
|
|
height: 60px; |
|
|
|
margin-bottom: 5px; |
|
|
|
} |
|
|
|
.el-row { |
|
|
|
margin-bottom: 20px; |
|
|
|
} |
|
|
|
@ -371,6 +502,6 @@ export default { |
|
|
|
|
|
|
|
.schart { |
|
|
|
width: 100%; |
|
|
|
height: 300px; |
|
|
|
height: 400px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
