<!DOCTYPE HTML>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="renderer" content="webkit">
|
<meta http-equiv="Cache-Control" content="no-siteapp"/>
|
|
<title>主页</title>
|
<!-- 本框架基本脚本和样式 -->
|
<script type="text/javascript"
|
th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript"
|
th:src="@{/js/systools/MBase.js}"></script>
|
<style type="text/css">
|
.el-row {
|
margin: 10px;
|
}
|
|
.head {
|
width: 50px;
|
height: 50px;
|
display: inline-block;
|
border-radius: 25px;
|
float: left;
|
margin-right: 20px;
|
}
|
|
|
.l-info {
|
float: left;
|
margin: 20px 20px;
|
width: 100%;
|
}
|
|
.hellow {
|
font-size: 16px;
|
color: #333;
|
}
|
|
.bg {
|
width: 100%;
|
background: #0f9aef;
|
color: #ffffff;
|
border-radius: 5px;
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
padding: 0 20px;
|
margin-right: 20px;
|
cursor: pointer;
|
float: right;
|
|
}
|
|
.title {
|
font-weight: 400;
|
}
|
|
.Lint-title {
|
border-bottom: 1px #dbdbdb solid;
|
height: 30px;
|
font-size: 19px;
|
font-weight: 400;
|
color: #0f9aef;
|
margin-bottom: 27px;
|
}
|
|
.functionList .el-col {
|
text-align: center;
|
}
|
|
.ficon {
|
font-size: 40px;
|
}
|
|
.msg {
|
font-size: 16px;
|
line-height: 39px;
|
}
|
|
.fun-box {
|
cursor: pointer;
|
}
|
|
.fun-box:hover {
|
color: #0f9aef;
|
}
|
|
</style>
|
<script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script>
|
<link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}">
|
<link rel="stylesheet" th:href="@{/plugin/bootstrap-3.3.5/css/bootstrap.min.css}">
|
<link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/>
|
</head>
|
|
<body>
|
<div id="app">
|
|
<el-row class="">
|
<el-col :span="6">
|
<div class="l-info">
|
<img alt="image" class="head"
|
th:src="@{/images/jxl.jpg}"/>
|
<p class="hellow">您好! [[${session.userInfo.suName}]]，祝你开心每一天！</p>
|
<p th:text="${#dates.format(new java.util.Date().getTime(), 'yyyy年MM月dd日')}"></p>
|
</div>
|
</el-col>
|
<el-col :span="18">
|
<el-row>
|
<el-col matrix:fn="orderClub" :offset="3" :span="5" class="bg">
|
<div @click="openTab('/admin/redirect/hive/beautySalon/underlineOrder','订单收银')">
|
<h1 class="title">{{orderNum}}</h1>
|
<p>待处理订单</p>
|
</div>
|
|
</el-col>
|
<el-col matrix:fn="serviceClub" :span="5" class="bg" style="background: #67C23A;">
|
<div @click="openTab('/admin/redirect/hive/beautySalon/service_all_list','服务单')">
|
<h1 class="title">{{seviceNum}}</h1>
|
<p>待处理服务单</p>
|
</div>
|
</el-col>
|
<el-col matrix:fn="serviceClub" :span="5" class="bg" style="background: rgb(121, 187, 255);margin-right: 0px;">
|
<div @click="openTab('/admin/redirect/hive/beautySalon/onlineBooking','小程序订单')">
|
<h1 class="title">{{onlineNum}}</h1>
|
<p>小程序订单</p>
|
</div>
|
</el-col>
|
|
|
</el-row>
|
</el-col>
|
|
</el-row>
|
|
<div>
|
<el-row>
|
|
<el-col :span="18" class="l-info">
|
<el-row>
|
<el-col :span="24"><h2 class="Lint-title">常用功能</h2></el-col>
|
<el-row class="functionList">
|
<el-col :span="4" matrix:fn="vipinfoClub">
|
<div class="fun-box J_menuItem"
|
@click="openTab('/admin/redirect/hive/beautySalon/vip','会员中心')">
|
<div class=" fa fa-user icon ficon"></div>
|
<div class="msg">会员中心</div>
|
</div>
|
</el-col>
|
|
<el-col :span="4" matrix:fn="orderClub">
|
<div class="fun-box J_menuItem"
|
@click="openTab('/admin/redirect/hive/beautySalon/underlineOrder','订单收银')">
|
<div class=" fa fa-shopping-cart ficon"></div>
|
<div class="msg">订单收银</div>
|
</div>
|
</el-col>
|
|
<el-col :span="4" matrix:fn="serviceClub">
|
<div class="fun-box J_menuItem"
|
@click="openTab('/admin/redirect/hive/beautySalon/service_all_list','服务单')">
|
<div class=" fa fa-bars ficon"></div>
|
<div class="msg">服务单</div>
|
</div>
|
</el-col>
|
|
<el-col :span="4" matrix:fn="beaPaiBanCode">
|
<div class="fun-box J_menuItem"
|
@click="openTab('/admin/redirect/hive/beautySalon/paiBan','排班')">
|
<div class=" fa fa-calendar ficon"></div>
|
<div class="msg">排班</div>
|
</div>
|
</el-col>
|
|
<el-col :span="4">
|
|
</el-col>
|
</el-row>
|
</el-row>
|
|
</el-col>
|
|
<el-col :span="6"></el-col>
|
|
</el-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
</body>
|
|
<script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/bootstrap-3.3.5/js/bootstrap.min.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/MUI.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/push.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script>
|
|
<script type="text/javascript">
|
console.log(1);
|
Push.Permission.request();
|
var vm = new Vue({
|
el: '#app',
|
data: {
|
seviceNum: 0,
|
orderNum: 0,
|
onlineNum:0,
|
autoFlash:false,//是否开启自动刷新
|
|
},
|
created: function () {
|
|
this.getOrderNum();
|
if(this.autoFlash){
|
timename = setInterval("vm.getOrderNum()", 5000);
|
}
|
|
},
|
methods: {
|
openTab: function (url, name) {
|
MUI.openTab(url, name)
|
},
|
getOrderNum: function () {
|
console.log("getOrderNum");
|
let _this = this;
|
AjaxProxy
|
.requst({
|
app: _this,
|
showLoad: false,
|
url: basePath + '/admin/pcIndex/selectOrderCount',
|
callback: function (data) {
|
if(_this.orderNum!=data.rows[0]){
|
Push.create("您有一个新的订单等待收款!", {
|
body: "目前共有"+data.rows[0]+"个订单待处理",
|
icon: basePath+'/images/jxl.jpg',
|
timeout: 20000,
|
onClick: function () {
|
window.focus();
|
_this.openTab('/admin/redirect/hive/beautySalon/underlineOrder','订单收银')
|
this.close();
|
}
|
});
|
}
|
if(_this.seviceNum!=data.rows[1]){
|
Push.create("您有一个新的服务订单等待排班!", {
|
body: "目前共有"+data.rows[1]+"个服务订单待处理",
|
icon: basePath+'/images/jxl.jpg',
|
timeout: 20000,
|
onClick: function () {
|
window.focus();
|
_this.openTab('/admin/redirect/hive/beautySalon/service_all_list','服务单')
|
this.close();
|
}
|
|
});
|
}
|
if(_this.seviceNum!=data.rows[2]){
|
Push.create("您有一个新的小程序预约订单待确认", {
|
body: "目前共有"+data.rows[2]+"个小程序预约订单待处理",
|
icon: basePath+'/images/jxl.jpg',
|
timeout: 20000,
|
onClick: function () {
|
window.focus();
|
_this.openTab('/admin/redirect/hive/beautySalon/onlineBooking','小程序订单');
|
this.close();
|
}
|
|
});
|
}
|
_this.orderNum = data.rows[0];
|
_this.seviceNum = data.rows[1];
|
_this.onlineNum=data.rows[2];
|
|
}
|
})
|
},
|
}
|
|
});
|
|
|
</script>
|
</html>
|
