clunt
/
ghy-all
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity
ghy-all/ghy-admin/src/main/resources/templates/goods/standard/addTemplate.html

632 lines
27 KiB
HTML
Raw Normal View History

模版上架
2023-02-25 14:04:21 +08:00
<!DOCTYPE html>
模板新增 页面
2023-02-25 17:10:23 +08:00
<html lang="en" xmlns:th="http://www.thymeleaf.org">
模版上架
2023-02-25 14:04:21 +08:00
<head>
模板新增 页面
2023-02-25 17:10:23 +08:00
<th:block th:include="include :: header('模板新增')"/>
模版上架页面
2023-02-25 23:41:41 +08:00
<style>
修改服务上架页面
2023-05-21 01:44:51 +08:00
body {
padding: 0 !important;
}
模版上架页面
2023-02-25 23:41:41 +08:00
.pane1 {
padding-bottom: 0;
}
.pane2 {
padding-top: 0;
}
.template-div {
display: inline-block;
}
.template-body {
padding: 10px;
border-radius: 5px 5px 0 0;
border: 1px solid #1c84c6;
}
.template-footer {
background-color: #1c84c6;
color: white;
padding: 5px;
border-radius: 0 0 5px 5px;
border: 1px solid #1c84c6;
}
.floor-text {
display: flex;
align-items: baseline;
flex-wrap: wrap;
position: relative;
top: 2px;
}
.floor-input {
width: 50px;
}
.dropdown-btn {
height: 31px;
}
.oper-banner {
display: flex;
justify-content: space-between;
padding: 15px;
}
.oper-banner-start {
display: flex;
align-items: center;
}
.oper-banner-end {
display: flex;
justify-content: flex-end;
align-items: center;
}
.yuan-symbol {
color: red;
font-size: large;
}
修改服务上架页面
2023-05-21 01:44:51 +08:00
.multiply-symbol {
font-size: large;
text-align: center;
}
.goodsNumList {
padding: 5px 8px 14px 5px;
min-height: 40px;
border: 1px solid #dcdfe6;
box-sizing: border-box;
border-radius: 4px;
}
.oneGoodsNumList {
padding: 5px 8px 5px 5px;
min-height: 40px;
border: 1px solid #dcdfe6;
box-sizing: border-box;
border-radius: 4px;
}
.goodsNum {
margin: 2px 0;
height: 24px;
}
模版上架页面
2023-02-25 23:41:41 +08:00
</style>
<th:block th:include="include :: datetimepicker-css" />
修改服务上架页面
2023-05-21 01:44:51 +08:00
<link rel="stylesheet" href="../../../static/js/plugins/miniCascader/style.css" th:href="@{/js/plugins/miniCascader/style.css}">
模版上架
2023-02-25 14:04:21 +08:00
</head>
模板新增 页面
2023-02-25 17:10:23 +08:00
<body class="gray-bg">
模版上架页面
2023-02-25 23:41:41 +08:00
<form id="addTemplateForm">
<div class="pane1 wrapper wrapper-content animated fadeIn">
模板新增 页面
2023-02-25 17:10:23 +08:00
<div class="ibox float-e-margins">
<div class="ibox-title">
商品信息
</div>
<div class="ibox-content">
模版上架页面
2023-02-25 23:41:41 +08:00
<div class="template-grid" id="template-grid">
模板新增 页面
2023-02-25 17:10:23 +08:00
<div class="template-div">
模版上架页面
2023-02-25 23:41:41 +08:00
<div class="template-body">MR1234</div>
<div class="template-footer">快速发布</div>
模板新增 页面
2023-02-25 17:10:23 +08:00
</div>
</div>
模版上架
2023-02-25 14:04:21 +08:00
模版上架页面
2023-02-25 23:41:41 +08:00
<div class="form-horizontal m">
模板新增 页面
2023-02-25 17:10:23 +08:00
<div class="form-group">
<label class="col-sm-2 control-label is-required">服务类目：</label>
修改服务上架页面
2023-05-21 01:44:51 +08:00
<div class="col-sm-6" style="padding-right: 0">
<div id="categoryCxSelect" class="cascader-wrap">
<!-- <div class="col-sm-3">-->
<!-- <select class="category1 form-control m-b" name="category1" required></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="category2 form-control m-b" name="category2" required></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="category3 form-control m-b" name="category3" required></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="category4 form-control m-b" name="category4" required></select>-->
<!-- </div>-->
模板新增 页面
2023-02-25 17:10:23 +08:00
</div>
</div>
修改服务上架页面
2023-05-21 01:44:51 +08:00
<div class="col-sm-1 multiply-symbol">×</div>
<div id="goodsNumList" class="col-sm-1 oneGoodsNumList">
模板新增 页面
2023-02-25 17:10:23 +08:00
<input type="number" name="goodsNum" class="form-control" required>
</div>
</div>
<div class="form-group">
模版上架页面
2023-02-25 23:41:41 +08:00
<label class="col-sm-2 control-label is-required">服务品牌：</label>
<div class="col-sm-8 row">
<div class="col-sm-3">
<input type="text" name="goodsBrand" class="form-control" placeholder="品牌" required>
</div>
<div class="col-sm-3">
<input type="text" name="goodsSpecification" class="form-control" placeholder="规格（非必填）">
</div>
<div class="col-sm-3">
<select class="form-control">
<option value="后台订单">后台订单</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label is-required">服务时间：</label>
<div class="col-sm-4">
<div class="input-group date">
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input type="text" class="form-control" id="servDate" name="servDate" required>
</div>
</div>
<div class="col-sm-4">
<select class="form-control" name="servTime" required>
<option value="8:00-12:00">8:00-12:00</option>
<option value="8:00-12:00">12:00-16:00</option>
<option value="8:00-12:00">16:00-20:00</option>
<option value="8:00-12:00">8:00-10:00</option>
<option value="8:00-12:00">10:00-12:00</option>
<option value="8:00-12:00">12:00-14:00</option>
<option value="8:00-12:00">14:00-16:00</option>
<option value="8:00-12:00">16:00-18:00</option>
<option value="8:00-12:00">18:00-20:00</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">视频链接：</label>
<div class="col-sm-8">
<input type="text" name="videoUrl" class="form-control">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label is-required">图片上传：</label>
<div class="col-sm-8">
<div class="file-loading">
<input id="multipleFile" name="files" type="file" multiple>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label is-required">服务地址：</label>
修改服务上架页面
2023-05-21 01:44:51 +08:00
<div class="col-sm-6">
<div id="areaCxSelect" class="cascader-wrap">
<!-- <div class="col-sm-3">-->
<!-- <select class="province form-control m-b" name="province" id="province" required onchange="selectRegion('province', 'city')"></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="city form-control m-b" name="city" id="city" required onchange="selectRegion('city', 'district')"></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="district form-control m-b" name="district" id="district" required onchange="selectRegion('district', 'street')"></select>-->
<!-- </div>-->
<!-- <div class="col-sm-3">-->
<!-- <select class="street form-control m-b" name="streetId" id="streetId" required></select>-->
<!-- </div>-->
模版上架页面
2023-02-25 23:41:41 +08:00
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"></label>
<div class="col-sm-8">
<input type="text" name="fullAddress" class="form-control" required placeholder="请输入详细的门牌号">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label is-required">客户姓名：</label>
<div class="col-sm-4">
<input type="text" name="customerName" class="form-control" placeholder="请输入客户姓名" required>
</div>
<div class="col-sm-4">
<input type="text" name="customerPhone" class="form-control" placeholder="请输入客户手机号码" required>
模板新增 页面
2023-02-25 17:10:23 +08:00
</div>
</div>
模版上架页面
2023-02-25 23:41:41 +08:00
<div class="form-group">
<label class="col-sm-2 control-label is-required">下单模式：</label>
<div class="col-sm-8 row">
<div class="col-sm-2">
<label><input type="radio" checked="" value="1" name="orderMode"> 带价发布</label>
</div>
<div class="col-sm-2">
<label><input type="radio" value="2" name="orderMode"> 一票价发布</label>
</div>
<div class="col-sm-2">
<label><input type="radio" value="3" name="orderMode"> 回收模式</label>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label is-required">发布价格：</label>
<div class="col-sm-2">
<input type="text" name="price" class="form-control" required placeholder="发布价格（佣金）">
</div>
<div class="col-sm-2">
<div class="checkbox">
<label>
<input type="checkbox" value="1" name="isOnSiteQuote" checked>上门报价</label>
</div>
</div>
<div class="col-sm-2">
<input type="text" name="agencyFund" class="form-control" placeholder="上门代收款额（非必填）">
</div>
<div class="col-sm-2">
<div class="input-group">
<input type="text" name="informationFee" class="form-control" required placeholder="信息费">
<div class="input-group-btn">
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle dropdown-btn" type="button" id="informationFeeUnit">单位<span class="caret"></span></button>
<ul class="dropdown-menu pull-right">
<li onclick="changeInformationFeeUnit('%')"><a>%</a></li>
<li onclick="changeInformationFeeUnit('元')"><a>元</a></li>
</ul>
<!-- <select class="form-control dropdown-menu pull-right" name="informationFeeUnit">-->
<!-- <option value="%">%</option>-->
<!-- <option value="元">元</option>-->
<!-- </select>-->
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">奖励金：</label>
<div class="col-sm-4">
<input type="text" name="bonus" class="form-control" placeholder="准时服务奖励金">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">备注说明：</label>
<div class="col-sm-8">
<textarea class="form-control" name="remark" placeholder="请输入备注说明（不超过512个字符）"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">物流单号：</label>
<div class="col-sm-4">
<input type="text" name="logisticsCode" class="form-control" placeholder="请输入物流单号">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"></label>
<div class="col-sm-8">
<label class="checkbox-inline">
<input type="checkbox" value="1" name="needWagon">需提供货拉拉或58速运类业务，本次服务需拉货</label>
<div class="row">
<div class="col-sm-2">
<label class="checkbox-inline">
<input type="checkbox" value="1" name="needCarry">需要搬货</label>
</div>
<div class="col-sm-8">
<div class="floor-text">
<div>需提供可搬货人员，楼层</div>
<div class="floor-input"><input type="number" name="floor" class="form-control"></div>
<div>层（费用另行计算）；</div>
</div>
</div>
</div>
</div>
</div>
</div>
模板新增 页面
2023-02-25 17:10:23 +08:00
</div>
</div>
</div>
模版上架页面
2023-02-25 23:41:41 +08:00
<div class="pane2 wrapper wrapper-content animated fadeIn">
<div class="ibox float-e-margins">
<div class="oper-banner">
<div class="oper-banner-start col-sm-5">
<span>合计金额：</span>
<span class="yuan-symbol">¥</span>
<span class="yuan-symbol" id="totalMoney">0</span>
</div>
<div class="oper-banner-end col-sm-5">
<div class="m-r">
<div class="checkbox">
<label>
<input type="checkbox" value="1" name="isPayOffline">线下到付</label>
</div>
</div>
<div class="m-r">
<button type="button" class="btn btn-w-m btn-success" onclick="submitOrder()">提交订单</button>
</div>
<div>
<button type="button" class="btn btn-w-m btn-success" onclick="addTemplate()">保存模版</button>
</div>
</div>
</div>
</div>
</div>
</form>
模板新增 页面
2023-02-25 17:10:23 +08:00
<th:block th:include="include :: footer"/>
<th:block th:include="include :: jquery-cxselect-js" />
模版上架页面
2023-02-25 23:41:41 +08:00
<th:block th:include="include :: datetimepicker-js" />
修改服务上架页面
2023-05-21 01:44:51 +08:00
<script th:src="@{/js/plugins/miniCascader/cascader.js}"></script>
<script th:src="@{/data/four-level-area.js}"></script>
模板新增 页面
2023-02-25 17:10:23 +08:00
<script type="text/javascript">
修改服务上架页面
2023-05-21 01:44:51 +08:00
// 级联下拉
let categoryCascader = new eo_cascader([], {
elementID: 'categoryCxSelect',
multiple: true, // 是否多选
separator: '-', // 分割符 山西-太原-小店区 || 山西/太原/小店区
clearable: true, // 是否可一键删除已选
value: 'goodsCategoryId',
label: 'goodsCategoryName',
children: 'child',
checkedCallback: checkedCategoryCallback
});
let areaCascader = new eo_cascader(fourLevelAreaList, {
elementID: 'areaCxSelect',
multiple: false, // 是否多选
separator: '-', // 分割符 山西-太原-小店区 || 山西/太原/小店区
clearable: false, // 是否可一键删除已选
value: 'areaId',
label: 'areaName',
children: 'child'
});
模板新增 页面
2023-02-25 17:10:23 +08:00
$(function(){
var icon = "<i class='fa fa-times-circle'></i> ";
模版上架页面
2023-02-25 23:41:41 +08:00
// $("#addTemplateForm").validate({
// rules: {
// },
// messages: {
// }
// });
$.ajax({
type: "POST",
dataType:"json",
url: ctx + "goods/deptcategory/app/list",
data: JSON.stringify({deptId: 101, goodsCategoryId: 1}),
contentType: 'application/json',
success: function (result) {
if (result.code == web_status.SUCCESS) {
修改服务上架页面
2023-05-21 01:44:51 +08:00
<!-- $('#categoryCxSelect').cxSelect({-->
<!-- selects: ['category1', 'category2', 'category3', 'category4'],-->
<!-- jsonValue: 'deptGoodsCategoryId',-->
<!-- jsonName: 'goodsCategoryName',-->
<!-- jsonSub: 'child',-->
<!-- data: result.data-->
<!-- });-->
categoryCascader = new eo_cascader(result.data, {
elementID: 'categoryCxSelect',
multiple: true, // 是否多选
checkedValue: null,
separator: '-', // 分割符 山西-太原-小店区 || 山西/太原/小店区
clearable: true, // 是否可一键删除已选
value: 'deptGoodsCategoryId',
label: 'goodsCategoryName',
children: 'child',
checkedCallback: checkedCategoryCallback
})
模版上架页面
2023-02-25 23:41:41 +08:00
} else {
$.modal.msgError("数据加载错误，请重试！")
}
}
})
修改服务上架页面
2023-05-21 01:44:51 +08:00
<!-- $.ajax({-->
<!-- type: "POST",-->
<!-- dataType:"json",-->
<!-- url: ctx + "system/area/list",-->
<!-- success: function (result) {-->
<!-- if (result.code == web_status.SUCCESS) {-->
<!-- $('#areaCxSelect').cxSelect({-->
<!-- selects: ['province', 'city', 'district', 'street'],-->
<!-- jsonValue: 'areaId',-->
<!-- jsonName: 'areaName',-->
<!-- data: result.data-->
<!-- });-->
<!-- } else {-->
<!-- $.modal.msgError("数据加载错误，请重试！")-->
<!-- }-->
<!-- }-->
<!-- })-->
模版上架页面
2023-02-25 23:41:41 +08:00
$("#servDate").datetimepicker({
format: "yyyy-mm-dd",
minView: "month",
autoclose: true
模板新增 页面
2023-02-25 17:10:23 +08:00
});
模版上架页面
2023-02-25 23:41:41 +08:00
$('#template-grid').html('');
$.ajax({
type: "GET",
dataType:"json",
url: ctx + "order/template/selectByUserId",
success: function (result) {
if (result != null) {
result.forEach(function(item) {
$('#template-grid').append('<div class="template-div">' +
模版上架页面
2023-02-25 23:46:55 +08:00
' <div class="template-body">模版' + item.id + '</div>' +
模版上架页面
2023-02-25 23:41:41 +08:00
' <div class="template-footer">快速发布</div>' +
' </div>');
});
模板新增 页面
2023-02-25 17:10:23 +08:00
}
模版上架页面
2023-02-25 23:41:41 +08:00
}
})
// 多图上传
// $("#multipleFile").fileinput({
// uploadUrl: ctx + 'common/uploads',
// uploadAsync: false
// }).on('filebatchuploadsuccess', function (event, data, previewId, index) {
// var rsp = data.response;
// log.info("return urls：" + rsp.urls)
// log.info("reutrn fileNames：" + rsp.fileNames)
// }).on('fileremoved', function (event, id, index) {
// this.$("input[name='" + event.currentTarget.id + "']").val('')
// })
模板新增 页面
2023-02-25 17:10:23 +08:00
});
模版上架页面
2023-02-25 23:41:41 +08:00
修改服务上架页面
2023-05-21 01:44:51 +08:00
function checkedCategoryCallback() {
let checkedIdArr = categoryCascader.getCheckedByID();
if (checkedIdArr && checkedIdArr.length > 0) {
$('#goodsNumList').html(null);
$('#goodsNumList').removeClass('oneGoodsNumList');
$('#goodsNumList').addClass('goodsNumList');
checkedIdArr.forEach(function(id, index) {
$('#goodsNumList').append('<input type="number" name="goodsNum' + id + '" class="form-control goodsNum" required>');
});
} else {
$('#goodsNumList').removeClass('goodsNumList');
$('#goodsNumList').addClass('oneGoodsNumList');
$('#goodsNumList').html('<input type="number" name="goodsNum" class="form-control" required>');
}
}
模版上架页面
2023-02-25 23:41:41 +08:00
function changeInformationFeeUnit(unit) {
this.$('#informationFeeUnit').html(unit + '<span class="caret"></span>');
}
修改服务上架页面
2023-05-21 01:44:51 +08:00
<!-- function selectRegion(regionLevelName, nextRegionLevelName) {-->
<!-- var regionId = $("#" + regionLevelName).val();-->
<!-- if ($.common.isEmpty(regionId)) {-->
<!-- return;-->
<!-- }-->
<!-- //Ajax调用处理-->
<!-- $.ajax({-->
<!-- type: "POST",-->
<!-- dataType:"json",-->
<!-- url: ctx + "system/area/list",-->
<!-- data: {parentCode: regionId},-->
<!-- success: function (result) {-->
<!-- if (result.code == web_status.SUCCESS) {-->
<!-- $('#areaCxSelect').cxSelect({-->
<!-- selects: [nextRegionLevelName],-->
<!-- jsonValue: 'areaId',-->
<!-- jsonName: 'areaName',-->
<!-- data: result.data-->
<!-- });-->
<!-- } else {-->
<!-- $.modal.msgError("数据加载错误，请重试！")-->
<!-- }-->
<!-- }-->
<!-- })-->
<!-- }-->
function validSpecialComponent() {
// 类目
let categoryIds = categoryCascader.getCheckedByID();
if (!categoryIds || categoryIds.length === 0) {
$.modal.msgError("服务类目不能为空")
return false;
模版上架页面
2023-02-25 23:41:41 +08:00
}
修改服务上架页面
2023-05-21 01:44:51 +08:00
// 地区
let checkedAreaPathList = areaCascader.getCheckedPaths();
if (!checkedAreaPathList || checkedAreaPathList.length === 0) {
$.modal.msgError("服务地址不能为空")
return false;
}
return true;
模版上架页面
2023-02-25 23:41:41 +08:00
}
function submitOrder() {
修改服务上架页面
2023-05-21 01:44:51 +08:00
if (!validSpecialComponent()) return;
<!-- if ($.validate.form()) {-->
if (true) {
后台下单，目前传参和保存模版一致
2023-04-16 15:09:08 +08:00
var data = $("#addTemplateForm").serializeArray();
var params= {};
data.forEach(function (item){
params[item.name] = item.value;
});
模版上架页面
2023-02-25 23:41:41 +08:00
修改服务上架页面
2023-05-21 01:44:51 +08:00
let categoryIds = categoryCascader.getCheckedByID();
let orderGoodsStandards = [];
categoryIds.forEach(function (item){
orderGoodsStandards.push({
deptCategoryId: item,
goodsStandardNum: $(".goodsNum[name=goodsNum" + item + "]").val()
});
});
params.orderGoodsStandards = orderGoodsStandards;
params.categoryId1 = categoryCascader.getCheckedPaths()[0][0];
params.categoryId2 = categoryCascader.getCheckedPaths()[0][1];
params.categoryId3 = categoryCascader.getCheckedPaths()[0][2];
params.provinceId = areaCascader.getCheckedPaths()[0][0];
params.cityId = areaCascader.getCheckedPaths()[0][1];
params.districtId = areaCascader.getCheckedPaths()[0][2];
params.streetId = areaCascader.getCheckedPaths()[0][3];
后台下单，目前传参和保存模版一致
2023-04-16 15:09:08 +08:00
$.ajax({
type: "POST",
dataType:"json",
url: ctx + "order/sys/order",
data: JSON.stringify(params),
contentType: 'application/json',
success: function (result) {
if (result.code == web_status.SUCCESS) {
$.modal.msgSuccess("提交成功")
} else {
$.modal.msgError("请求失败")
}
}
})
}
模版上架页面
2023-02-25 23:41:41 +08:00
}
function addTemplate() {
修改服务上架页面
2023-05-21 01:44:51 +08:00
if (!validSpecialComponent()) return;
模版上架页面
2023-02-25 23:41:41 +08:00
if ($.validate.form()) {
var data = $("#addTemplateForm").serializeArray();
var params= {};
data.forEach(function (item){
params[item.name] = item.value;
});
修改服务上架页面
2023-05-21 01:44:51 +08:00
let categoryIds = categoryCascader.getCheckedByID();
let orderGoodsStandards = [];
categoryIds.forEach(function (item){
orderGoodsStandards.push({
deptCategoryId: item,
goodsStandardNum: $(".goodsNum[name=goodsNum" + item + "]").val()
});
});
params.orderGoodsStandards = orderGoodsStandards;
params.categoryId1 = categoryCascader.getCheckedPaths()[0][0];
params.categoryId2 = categoryCascader.getCheckedPaths()[0][1];
params.categoryId3 = categoryCascader.getCheckedPaths()[0][2];
params.provinceId = areaCascader.getCheckedPaths()[0][0];
params.cityId = areaCascader.getCheckedPaths()[0][1];
params.districtId = areaCascader.getCheckedPaths()[0][2];
params.streetId = areaCascader.getCheckedPaths()[0][3];
模版上架页面
2023-02-25 23:41:41 +08:00
$.ajax({
type: "POST",
dataType:"json",
url: ctx + "order/template/insert",
data: JSON.stringify(params),
contentType: 'application/json',
success: function (result) {
if (result.code == web_status.SUCCESS) {
$.modal.msgSuccess("提交成功")
} else {
$.modal.msgError("请求失败")
}
}
})
}
}
模板新增 页面
2023-02-25 17:10:23 +08:00
</script>
模版上架
2023-02-25 14:04:21 +08:00
</body>
模板新增 页面
2023-02-25 17:10:23 +08:00
</html>