mirror of
https://gitee.com/technical-laohu/mpay.git
synced 2025-09-21 11:16:39 +08:00
控制台更新
This commit is contained in:
技术老胡
parent
9309dfb881
commit
440b5530d8
BIN
mpay01.zip
BIN
mpay01.zip
Binary file not shown.
@ -26,10 +26,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.order-container>div>div {
|
.order-container>div>div {
|
||||||
min-height: 350px;
|
min-height: 485px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.order-tite {
|
.header-tite {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -61,10 +61,12 @@
|
|||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
padding-right: 15px;
|
padding-right: 15px;
|
||||||
}
|
}
|
||||||
.order-channel:hover{
|
|
||||||
|
.order-channel:hover {
|
||||||
background-color: whitesmoke;
|
background-color: whitesmoke;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.order-channel>div:nth-child(2) {
|
.order-channel>div:nth-child(2) {
|
||||||
min-width: 80px;
|
min-width: 80px;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
@ -109,43 +111,9 @@
|
|||||||
color: #a1acb8;
|
color: #a1acb8;
|
||||||
}
|
}
|
||||||
|
|
||||||
.neworder-item {
|
.neworder table tr {
|
||||||
display: flex;
|
height: 24px;
|
||||||
justify-content: space-between;
|
line-height: 24px;
|
||||||
align-items: center;
|
|
||||||
padding: 5px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-item~.neworder-item:hover {
|
|
||||||
background-color: whitesmoke;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-colname {
|
|
||||||
min-height: 2.2em;
|
|
||||||
color: #566a7f;
|
|
||||||
font-weight: 700;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-colname>div {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-colname>div:nth-child(1) {
|
|
||||||
min-width: 135px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-colname>div:nth-child(2) {
|
|
||||||
min-width: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-colname>div:nth-child(3) {
|
|
||||||
min-width: 36px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.neworder-item>span:nth-child(2) {
|
|
||||||
min-width: 100px;
|
|
||||||
text-align: right;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
@ -228,8 +196,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
|
<div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
|
||||||
<div class="layui-card">
|
<div class="layui-card">
|
||||||
<div class="layui-card-header">
|
<div class="layui-card-header header-tite">
|
||||||
<spqn>近7天收益</spqn>
|
<div>收益趋势</div>
|
||||||
|
<div class="layui-btn-group">
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">7天</button>
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">15天</button>
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">30天</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="layui-card-body">
|
<div class="layui-card-body">
|
||||||
<div class="layui-tab custom-tab layui-tab-brief" lay-filter="docDemoTabBrief">
|
<div class="layui-tab custom-tab layui-tab-brief" lay-filter="docDemoTabBrief">
|
||||||
@ -240,11 +213,29 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header header-tite">
|
||||||
|
<div>订单趋势</div>
|
||||||
|
<div class="layui-btn-group">
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">7天</button>
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">15天</button>
|
||||||
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs">30天</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-tab custom-tab layui-tab-brief">
|
||||||
|
<div style="background-color:#ffffff;min-height:220px;padding: 10px">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="layui-col-xs12">
|
<div class="layui-col-xs12">
|
||||||
<div class="layui-row layui-col-space16 order-container">
|
<div class="layui-row layui-col-space16 order-container">
|
||||||
<div class="layui-col-xs12 layui-col-sm6">
|
<div class="layui-col-xs12 layui-col-sm6">
|
||||||
<div class="layui-card">
|
<div class="layui-card">
|
||||||
<div class="layui-card-header order-tite">
|
<div class="layui-card-header header-tite">
|
||||||
<spqn>订单统计</spqn><button type="button"
|
<spqn>订单统计</spqn><button type="button"
|
||||||
class="layui-btn layui-btn-primary layui-btn-xs"
|
class="layui-btn layui-btn-primary layui-btn-xs"
|
||||||
id="order-data"><span>今年</span><i
|
id="order-data"><span>今年</span><i
|
||||||
@ -332,61 +323,13 @@
|
|||||||
<div class="layui-col-xs12 layui-col-sm6">
|
<div class="layui-col-xs12 layui-col-sm6">
|
||||||
<div class="layui-card">
|
<div class="layui-card">
|
||||||
|
|
||||||
<div class="layui-card-header order-tite">
|
<div class="layui-card-header header-tite">
|
||||||
<spqn>最新订单</spqn><button type="button"
|
<spqn>最新订单</spqn><button type="button"
|
||||||
class="layui-btn layui-btn-primary layui-btn-xs"
|
class="layui-btn layui-btn-primary layui-btn-xs"
|
||||||
id="order-new">全部订单</button>
|
id="order-new">全部订单</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="layui-card-body">
|
<div class="layui-card-body neworder">
|
||||||
<div class="neworder-list">
|
<table id="orders-table" lay-filter="orders-table"></table>
|
||||||
<div class="neworder-item neworder-colname">
|
|
||||||
<div>订单号</div>
|
|
||||||
<div>金额</div>
|
|
||||||
<div>状态</div>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>168</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>68</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>268</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>68</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>5668</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>5668</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
<div class="neworder-item">
|
|
||||||
<span><a href="javascript:;" class="layui-font-blue"
|
|
||||||
lay-event="showOrder">H2024090710110110</a></span>
|
|
||||||
<span><strong>5668</strong> 元</span>
|
|
||||||
<span class="layui-badge layui-bg-green">成功</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -458,9 +401,10 @@
|
|||||||
<script src="/component/layui/layui.js"></script>
|
<script src="/component/layui/layui.js"></script>
|
||||||
<script src="/component/pear/pear.js"></script>
|
<script src="/component/pear/pear.js"></script>
|
||||||
<script>
|
<script>
|
||||||
layui.use(['layer', 'echarts', 'element', 'count', 'dropdown'], function () {
|
layui.use(['layer', 'echarts', 'element', 'count', 'dropdown', 'table'], function () {
|
||||||
var $ = layui.jquery,
|
var $ = layui.jquery,
|
||||||
layer = layui.layer,
|
layer = layui.layer,
|
||||||
|
table = layui.table,
|
||||||
element = layui.element,
|
element = layui.element,
|
||||||
count = layui.count,
|
count = layui.count,
|
||||||
dropdown = layui.dropdown,
|
dropdown = layui.dropdown,
|
||||||
@ -491,8 +435,23 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
|
// 表格列参数
|
||||||
|
let cols = [[
|
||||||
|
{ title: '订单号', field: 'order_id', align: 'center', minWidth: 165 },
|
||||||
|
{ title: '金额', field: 'money', align: 'center' },
|
||||||
|
{ title: '状态', field: 'state', align: 'center' },
|
||||||
|
]]
|
||||||
|
// 表格渲染
|
||||||
|
table.render({
|
||||||
|
id: 'orders-table',
|
||||||
|
elem: '#orders-table',
|
||||||
|
url: '/api/Order/getOrders?page=1&limit=8',
|
||||||
|
cols: cols,
|
||||||
|
skin: 'line',
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
|
||||||
const colorList = ["#9E87FF", '#73DDFF', '#fe9a8b', '#F56948', '#9E87FF']
|
const colorList = ["#9E87FF", '#73DDFF', '#fe9a8b', '#F56948', '#9E87FF']
|
||||||
var option = {
|
var option = {
|
||||||
backgroundColor: '#fff',
|
backgroundColor: '#fff',
|
||||||
@ -577,7 +536,6 @@
|
|||||||
|
|
||||||
};
|
};
|
||||||
echartsRecords.setOption(option);
|
echartsRecords.setOption(option);
|
||||||
|
|
||||||
window.onresize = function () {
|
window.onresize = function () {
|
||||||
echartsRecords.resize();
|
echartsRecords.resize();
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user