mirror of
https://gitee.com/technical-laohu/mpay.git
synced 2025-09-19 02:06:38 +08:00
306 lines
9.8 KiB
HTML
306 lines
9.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>控制台</title>
|
|
<meta name="renderer" content="webkit">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
<link rel="stylesheet" href="/component/pear/css/pear.css" />
|
|
<link rel="stylesheet" href="/admin/css/other/console1.css" />
|
|
<style>
|
|
.rounded {
|
|
border-radius: 0.375rem;
|
|
width: 45px;
|
|
height: 45px;
|
|
margin-top: 7px;
|
|
}
|
|
|
|
.index-card {
|
|
display: flex;
|
|
}
|
|
|
|
.index-card>div {
|
|
text-align: center;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="pear-container">
|
|
<div style="padding: 8px;">
|
|
<div class="layui-row layui-col-space16">
|
|
<div class="layui-col-xs12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-body">请在您网站后台配置支付接口对接时请您选择走易支付接口方式来对接本平台哦！请添加收藏我们网站,备用或者防止丢失哦！</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-row layui-col-space16">
|
|
<div class="layui-col-md8">
|
|
<div class="layui-row layui-col-space16">
|
|
<div class="layui-col-xs6 layui-col-sm3">
|
|
<div class="layui-card top-panel">
|
|
<div class="layui-card-header">今日流水</div>
|
|
<div class="layui-card-body">
|
|
<div class="layui-row layui-col-space5 index-card">
|
|
<div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;"
|
|
id="today_income">
|
|
0
|
|
</div>
|
|
<div class="layui-col-xs4 layui-col-md4">
|
|
<img src="/static/img/chart-success.png" class="rounded">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs6 layui-col-sm3">
|
|
<div class="layui-card top-panel">
|
|
<div class="layui-card-header">昨日流水</div>
|
|
<div class="layui-card-body">
|
|
<div class="layui-row layui-col-space5 index-card">
|
|
<div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;"
|
|
id="yesterday_income">
|
|
0
|
|
</div>
|
|
<div class="layui-col-xs4 layui-col-md4">
|
|
<img src="/static/img/wallet-info.png" class="rounded">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs6 layui-col-sm3">
|
|
<div class="layui-card top-panel">
|
|
<div class="layui-card-header">本周流水</div>
|
|
<div class="layui-card-body">
|
|
<div class="layui-row layui-col-space5 index-card">
|
|
<div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;"
|
|
id="week_income">
|
|
0
|
|
</div>
|
|
<div class="layui-col-xs4 layui-col-md4">
|
|
<img src="/static/img/paypal.png" class="rounded">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs6 layui-col-sm3">
|
|
<div class="layui-card top-panel">
|
|
<div class="layui-card-header">本月流水</div>
|
|
<div class="layui-card-body">
|
|
<div class="layui-row layui-col-space5 index-card">
|
|
<div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;"
|
|
id="month_income">
|
|
0
|
|
</div>
|
|
<div class="layui-col-xs4 layui-col-md4">
|
|
<img src="/static/img/cc-primary.png" class="rounded">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs12 layui-col-sm12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-body">
|
|
<div class="layui-tab custom-tab layui-tab-brief" lay-filter="docDemoTabBrief">
|
|
<div id="echarts-records"
|
|
style="background-color:#ffffff;min-height:400px;padding: 10px">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs12 layui-col-sm6">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">订单统计</div>
|
|
<div class="layui-card-body">
|
|
订单内容
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-xs12 layui-col-sm6">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">最新订单</div>
|
|
<div class="layui-card-body">
|
|
订单明细
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="layui-col-md4">
|
|
<div class="layui-row layui-col-space16">
|
|
<div class="layui-col-md12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">
|
|
寄语
|
|
</div>
|
|
<div class="layui-card-body" style="line-height:40px;">
|
|
原想将澎湃的爱平平稳稳放置你手心，奈何我徒有一股蛮劲，只顾向你跑去，一个不稳跌的满身脏兮兮。试图爬起的我，
|
|
心想你会不会笑我 " 献爱献的这样笨拙, 怎么不知避开爱里的埋伏 "
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-md12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">
|
|
链接
|
|
</div>
|
|
<div class="layui-card-body">
|
|
<a target="_blank" href="http://www.pearadmin.com"
|
|
class="pear-btn pear-btn-primary layui-btn-fluid"
|
|
style="margin-top: 8px;height: 50px;line-height: 50px;">官
|
|
网</a>
|
|
<br />
|
|
<a target="_blank" href="https://gitee.com/pear-admin/Pear-Admin-Layui"
|
|
class="pear-btn pear-btn-warming layui-btn-fluid"
|
|
style="margin-top: 8px;height: 50px;line-height: 50px;">下 载</a>
|
|
<br />
|
|
<a target="_blank" href="https://gitee.com/pear-admin/Pear-Admin-Boot"
|
|
class="pear-btn pear-btn-danger layui-btn-fluid"
|
|
style="margin-top: 8px;height: 50px;line-height: 50px;">后 端</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-col-md12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">更 新</div>
|
|
<div class="layui-card-body">
|
|
<ul class="list">
|
|
<li class="list-item"><span class="title">优化代码格式</span><span
|
|
class="footer">2021-09-06
|
|
11:28</span></li>
|
|
<li class="list-item"><span class="title">新增消息组件</span><span
|
|
class="footer">2021-09-06
|
|
11:28</span></li>
|
|
<li class="list-item"><span class="title">移动端兼容</span><span
|
|
class="footer">2021-09-06
|
|
11:28</span></li>
|
|
<li class="list-item"><span class="title">系统布局优化</span><span
|
|
class="footer">2021-09-06
|
|
11:28</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="/component/layui/layui.js"></script>
|
|
<script src="/component/pear/pear.js"></script>
|
|
<script>
|
|
layui.use(['layer', 'echarts', 'element', 'count'], function () {
|
|
var $ = layui.jquery,
|
|
layer = layui.layer,
|
|
element = layui.element,
|
|
count = layui.count,
|
|
echarts = layui.echarts;
|
|
|
|
count.up("today_income", { time: 3000, num: parseFloat('<?php echo $today_income ?>'), bit: 2, regulator: 100 })
|
|
count.up("yesterday_income", { time: 3000, num: parseFloat('<?php echo $yesterday_income ?>'), bit: 2, regulator: 100 })
|
|
count.up("week_income", { time: 3000, num: parseFloat('<?php echo $week_income ?>'), bit: 2, regulator: 100 })
|
|
count.up("month_income", { time: 3000, num: parseFloat('<?php echo $month_income ?>'), bit: 2, regulator: 100 })
|
|
|
|
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
|
|
|
|
const colorList = ["#9E87FF", '#73DDFF', '#fe9a8b', '#F56948', '#9E87FF']
|
|
var option = {
|
|
backgroundColor: '#fff',
|
|
tooltip: {
|
|
show: false
|
|
},
|
|
grid: { top: '10%', bottom: '6%', left: '6%', right: '6%', containLabel: true },
|
|
xAxis: [{
|
|
type: 'category', boundaryGap: false,
|
|
axisLine: { show: false },
|
|
axisTick: { show: false },
|
|
axisLabel: { margin: 10, fontSize: 14, color: 'rgba(#999)' },
|
|
splitLine: { show: true, lineStyle: { color: '#939ab6', opacity: .15 } },
|
|
data: ['10:00', '10:10', '10:10', '10:30', '10:40', '10:50']
|
|
},],
|
|
yAxis: [{
|
|
type: 'value', offset: 15, max: 100, min: 0,
|
|
axisTick: { show: false }, axisLine: { show: false },
|
|
axisLabel: { margin: 10, fontSize: 14, color: '#999' },
|
|
splitLine: { show: false }
|
|
}],
|
|
series: [{
|
|
name: '2', type: 'line', z: 3, showSymbol: false, smoothMonotone: 'x',
|
|
lineStyle: {
|
|
width: 3, color: {
|
|
type: 'linear', x: 0, y: 0, x2: 0, y2: 1,
|
|
colorStops: [{
|
|
offset: 0, color: 'rgba(59,102,246)' // 0% 处的颜色
|
|
}, {
|
|
offset: 1, color: 'rgba(118,237,252)' // 100% 处的颜色
|
|
}]
|
|
},
|
|
shadowBlur: 4,
|
|
shadowColor: 'rgba(69,126,247,.2)',
|
|
shadowOffsetY: 4
|
|
},
|
|
areaStyle: {
|
|
color: {
|
|
type: 'linear', x: 0, y: 0, x2: 0, y2: 1,
|
|
colorStops: [{
|
|
offset: 0,
|
|
color: 'rgba(227,233,250,.9)' // 0% 处的颜色
|
|
}, {
|
|
offset: 1,
|
|
color: 'rgba(248,251,252,.3)' // 100% 处的颜色
|
|
}]
|
|
}
|
|
},
|
|
smooth: true,
|
|
data: [20, 56, 17, 40, 68, 42]
|
|
}, {
|
|
name: '1',
|
|
type: 'line',
|
|
showSymbol: false,
|
|
smoothMonotone: 'x',
|
|
|
|
lineStyle: {
|
|
width: 3,
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
offset: 0,
|
|
color: 'rgba(255,84,108)'
|
|
}, {
|
|
offset: 1,
|
|
color: 'rgba(252,140,118)'
|
|
}], false),
|
|
shadowBlur: 4,
|
|
shadowColor: 'rgba(253,121,128,.2)',
|
|
shadowOffsetY: 4
|
|
},
|
|
areaStyle: {
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
offset: 0,
|
|
color: 'rgba(255,84,108,.15)'
|
|
}, {
|
|
offset: 1,
|
|
color: 'rgba(252,140,118,0)'
|
|
}], false),
|
|
},
|
|
smooth: true,
|
|
data: [20, 71, 8, 50, 57, 32]
|
|
},]
|
|
|
|
};
|
|
echartsRecords.setOption(option);
|
|
|
|
window.onresize = function () {
|
|
echartsRecords.resize();
|
|
}
|
|
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html> |