<!doctype html>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
|
name="viewport"/>
|
<title th:text="${session.userInfo.shopName }"></title>
|
|
<!-- Set render engine for 360 browser -->
|
<meta name="renderer" content="webkit">
|
|
<!-- No Baidu Siteapp-->
|
<meta http-equiv="Cache-Control" content="no-siteapp"/>
|
|
<!-- Add to homescreen for Chrome on Android -->
|
<meta name="mobile-web-app-capable" content="yes">
|
|
|
<!-- Add to homescreen for Safari on iOS -->
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
<meta name="apple-mobile-web-app-title" content="Amaze UI"/>
|
|
|
<!-- Tile icon for Win8 (144x144 + tile color) -->
|
|
<meta name="msapplication-TileColor" content="#0e90d2">
|
<script type="text/javascript"
|
th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript"
|
th:src="@{/js/systools/DDMBase.js}"></script>
|
<link rel="stylesheet"
|
th:href="@{/plugin/amazingUI/css/amazeui.min.css}">
|
<link rel="stylesheet"
|
th:href="@{/plugin/amazingUI/css/app.css}">
|
<link rel="stylesheet" type="text/css"
|
th:href="@{/css/dingOrderUseNew.css}">
|
<link rel="stylesheet" type="text/css"
|
th:href="@{/plugin/LCalendar/src/css/LCalendar.css}">
|
<style>
|
.am-form .input-num[type=number] {
|
padding: 0;
|
text-align: center;
|
border: 1px solid #eee
|
}
|
</style>
|
</head>
|
<script th:if="${session.CURRENT_CUSTOMER eq null}">
|
|
MTools.redirect(basePath + "/admin/redirect/hive/mobile/order-search");
|
|
</script>
|
|
<body>
|
<!-- 购物车页面 -->
|
<!-- 头部开始 -->
|
<header data-am-widget="header" class="am-header color-w back-m1">
|
<div class="am-header-left am-header-nav">
|
<a onclick="javascript:history.back(-1)" class=""> <i
|
class="am-header-icon am-icon-chevron-left"></i>
|
</a>
|
</div>
|
|
<h1 class="am-header-title">
|
<a href="#title-link" class=""> 新建服务 </a>
|
</h1>
|
|
<!-- <div class="am-header-right am-header-nav">
|
<a href="###" class=""> <i class="am-header-icon am-icon-bars"></i>
|
</a>
|
</div> -->
|
</header>
|
<!-- 头部结束 -->
|
|
<!-- 购物车表单开始 -->
|
<form class="am-form am-form-horizontal" id="dataform"
|
onsubmit="javascripr:return false;">
|
<input type="hidden" th:value="${session.CURRENT_CUSTOMER?.id }" name="vipId" />
|
<div class="main main1">
|
<div data-am-widget="list_news"
|
class="am-list-news am-list-news-default">
|
<h3 style="text-align: center;" id="tite">可消耗的项目</h3>
|
<div class="am-list-news-bd">
|
<ul class="am-list" id="ul_order_use">
|
|
</ul>
|
</div>
|
</div>
|
|
<div class="am-input-group am-form-group am-input-group-primary am-g" id="ps">
|
<div class="am-u-sm-4">
|
<span class="am-input-group-label">备注</span>
|
</div>
|
<div class="am-u-sm-8">
|
<div>
|
<textarea rows="3" name="remark"></textarea>
|
</div>
|
</div>
|
</div>
|
<div id="submitBtn">
|
|
<div
|
class="am-input-group am-form-group am-input-group-primary am-g">
|
<div class="am-u-sm-4">
|
<span class="am-input-group-label">预约时间</span>
|
</div>
|
<div class="am-u-sm-8">
|
<!-- <div>
|
<input id="demo1" style="display: none" type="text" readonly=""
|
placeholder="日期选择特效" />
|
</div> -->
|
<div>
|
<input id="time" name="yyTime" type="text" readonly=""
|
placeholder="请选择时间" dataType="*" nullmsg="请选择时间" data-lcalendar="2016-05-11,2016-05-11"/>
|
</div>
|
</div>
|
</div>
|
<input type="hidden" id="projIds" name="projIds"/>
|
|
<div class="Validform_checktip"></div>
|
<div class="inputBtn">
|
<button class="am-btn btn-m1 am-radius am-btn-block"
|
type="button" onclick="myForm.submit()">新建服务
|
</button>
|
</div>
|
|
</div>
|
</div>
|
|
</form>
|
|
<!-- 购物车表单结束 -->
|
<script type="text/javascript">
|
|
/* $("#time").attr("data-lcalendar",date2+","+date3); */
|
|
</script>
|
|
<script th:src="@{/plugin/amazingUI/js/handlebars.min.js}"></script>
|
<script
|
th:src="@{/plugin/amazingUI/js/amazeui.widgets.helper.js}"></script>
|
<script th:src="@{/plugin/LCalendar/src/js/LCalendar.js}"></script>
|
<!-- index js -->
|
<script type="text/javascript">
|
/* $('.datetimepicker').datetimepicker({
|
format : "yyyy-mm-dd hh:ii",
|
autoclose: true,
|
}); */
|
|
|
$(function () {
|
/* 计算当前时间 */
|
|
|
MTools.autoFullSelect();
|
|
$
|
.AjaxProxy()
|
.invoke(
|
basePath + "/admin/projService/getUserProjInfo",
|
function (loj) {
|
var html = "";
|
var taoCanList = loj.attr("result")["mapInfo"].taoCanList;
|
|
var projList=loj.attr("result")["mapInfo"].projList;
|
|
if (projList.length > 0 || taoCanList.length > 0) {
|
|
var flag = -1; //用来设置不同name的值
|
//循环取出套餐的信息
|
|
for (var i = 0; i < taoCanList.length; i++) {
|
var taocanInfo = taoCanList[i];
|
html += '<li class="lic am-g " >'
|
+ '<div class=" am-u-sm-9 am-list-main"><h3 class="am-list-item-hd">'
|
+ taocanInfo.projName
|
+ '</h3></div><div class=" am-list-main"><h3 class="am-list-item-hd color-r"> <strong>余次'
|
+ taocanInfo.surplusCount
|
+ '</strong></h3></li>';
|
|
//循环取出一个套餐中包含的项目
|
for (var j = 0; j < taocanInfo.taocanProjUse.length; j++) {
|
flag += 1;
|
var projUse = taocanInfo.taocanProjUse[j];
|
|
html += '<li class="lic am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left " >'
|
+ '<div class=" am-u-sm-1 am-list-thumb ">'
|
+ '<label class=" am-checkbox ">'
|
+ '<input id="box' + flag + '" type="checkbox" name="projBox" class="check" value='
|
+ projUse.id
|
+ '></label></div>'
|
+ '<div class=" am-u-sm-5 am-list-main"><h3 class="am-list-item-hd">'
|
+ projUse.projName
|
+ '</h3></div><div class=" am-u-sm-2 am-list-main"><h3 class="am-list-item-hd color-y">'
|
+ projUse.projInfo.timeLength
|
+ ' 分钟</h3></div><div class="am-u-sm-2 am-list-thumb color-num"> <span>'
|
+ projUse.surplusCount
|
+ '</span></div>'
|
+ '<div class="am-u-sm-2 am-list-thumb color-num">'
|
+ '<input class="input-num" id="inputbox' + flag + '" placeholder="次数" value="1" type="number" max="8" min="1"/>'
|
+ '</div>'
|
+ '</li>';
|
}
|
html += '<div class="taocan"></div>'
|
+ '</div>';
|
}
|
|
if (projList.length > 0) {
|
//循环取出项目列表
|
for (var i = 0; i < projList.length; i++) {
|
var projUse=projList[i];
|
flag += 1;
|
html += ' <li class=" lic am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left " >'
|
+ '<div class=" am-u-sm-1 am-list-thumb "><label class=" am-checkbox ">'
|
+ '<input id="box' + flag + '" type="checkbox" name="projBox" class="check " value='
|
+ projUse.id
|
+ '></label></div>'
|
+ '<div class=" am-u-sm-5 am-list-main"><h3 class="am-list-item-hd">'
|
+ projUse.projName
|
+ '</h3></div><div class="am-u-sm-2 am-list-thumb color-num"> <span>余'
|
+ projUse.surplusCount
|
+ '次</span></div>'
|
+ '<div class="am-u-sm-2 am-list-thumb color-num">'
|
+ '<input class="input-num" type="number" id="inputbox' + flag + '" value="1" max="8" min="1"/>'
|
+ '</div></li><div class="taocan"></div>';
|
}
|
}
|
|
|
} else {
|
$("#ps").remove();
|
$("#tite").remove();
|
html = '<p style="text-align:center">没有可消耗的项目！</p>'
|
+ '<p style="text-align:center"><a href="' + basePath + '/admin/redirect/hive/mobile/order-list"> 马上去选购! </a></p>'
|
$("#submitBtn").hide();
|
}
|
//显示数据
|
$("#ul_order_use").html(html);
|
//初始化表单
|
myForm = MForm
|
.initForm({
|
invokeUrl: basePath + "/admin/projService/addServiceForForm",
|
|
beforeSubmit: function () {
|
|
var projIds = "";
|
|
var param = this.extendParam;
|
|
$('input:checkbox[name=projBox]:checked').each(function (i) {
|
var num = $("#input" + $(this).attr("id")).val();
|
var puseId = $(this).val();
|
param["serviceItems[" + i + "].puseId"] = puseId;
|
param["serviceItems[" + i + "].count"] = num;
|
projIds += puseId;
|
});
|
|
if (projIds == "") {
|
layer.alert("请选择要消耗的项目!");
|
return false;
|
}
|
return true;
|
},
|
afterSubmit: function (loj) {
|
var msg = '';
|
if (loj.attr("result").status == '200') {
|
msg = '消耗成功';
|
layer
|
.open({
|
shade: false,
|
content: msg,
|
className: 'showBox',
|
time: 1,
|
end: function (
|
elem) {
|
history.back(-1);
|
}
|
});
|
}
|
}
|
});
|
$(".check").uCheck('enable');
|
|
|
});
|
|
})
|
</script>
|
|
<script type="text/javascript">
|
|
$(function () {
|
var d = new Date();
|
if (d.getMonth() + 1 < 10) {
|
var mon = "0" + d.getMonth();
|
}
|
if (d.getDate() < 10) {
|
var da = "0" + d.getDate();
|
}
|
|
var date1 = d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate();
|
var date2 = d.getFullYear() + "-" + (d.getMonth() + 2) + "-" + d.getDate();
|
|
|
var calendardatetime = new LCalendar();
|
calendardatetime.init({
|
'trigger': '#time',
|
'type': 'datetime',
|
'minDate': date1, //最小日期
|
'maxDate': date2 //最大日期
|
});
|
});
|
|
|
</script>
|
</body>
|
</html>
|
