记得上下班打卡 | git大法好,push需谨慎

Commit 8b90cfec authored by sangchunxi's avatar sangchunxi

推荐商品

parent 7d4f4e42
......@@ -206,5 +206,10 @@ public class LocalAdminController extends BaseController
{
return candyPrefix + "/coupon/mgt/relevancyShow";
}
@GetMapping("/affiliatedActivity") // 关联活动
public String affiliatedActivity()
{
return activityPrefix + "/affiliatedActivity/list";
}
}
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
<th:block th:include="include :: header('关联活动')" />
<th:block th:include="include :: datetimepicker-css"/>
<style>
body .layui-layer-btn {
display: none !important;
}
#layui-layer1 {
z-index: 1001 !important;
}
#layui-layer-shade1 {
z-index: 1000 !important;
}
#addClassify, #detailPro {
display: none;
width: 650px;
padding-top: 20px;
}
#addClassify .selectClassify {
display: flex;
align-items: center;
padding: 0 60px;
}
.selectClassify .addAvatarItem .selectClassifyOne {
display: flex;
}
.selectClassify .addAvatarItem .selectClassifyOne .span-label {
width: 100px;
}
.picker {
display: flex;
justify-content: flex-start;
}
#addClassify .selectClassify label {
display: flex;
margin-right: 20px;
align-items: center;
}
#addClassify .selectClassify label input {
margin: 0;
margin-right: 2px;
}
#detailPro .detail_inner {
margin-bottom: 20px;
}
#detailPro .detail_title {
margin-top: 50px;
font-weight: bold;
font-size: 16px;
}
.bottomBtn {
text-align: left;
padding: 30px 15px 12px;
}
.layui-layer-shade{
opacity: 30%;
}
.item div {
display: flex;
}
.item div a{
margin-left: 12px;
}
/* 星星 */
.required-group-name {
color: red;
font-size: 20px;
position: relative;
top: 6px;
}
.groupName {
border: 1px solid #dfdfdf;
}
.required-province {
color: red;
display: inline-block;
margin-right: 3px;
position: relative;
top: 6px;
font-size: 20px;
}
/* 必填红色文字 */
.required-group-text {
height: 20px;
color: red;
}
.required-province-text {
color: red;
height: 20px;
}
</style>
</head>
<body class="gray-bg">
<div class="container-div">
<div class="row">
<!-- <div class="col-sm-12 search-collapse">
<form id="coupon-form">
<div class="select-list">
<ul>
<input type="hidden" name="couType" th:value="${couType}"/>
<li>
<input type="text" name="mobile" placeholder="请输入手机号码"/>
</li>
<li>
状态:
<select name="status" id="">
<option value="0">全部</option>
<option value="1">正常</option>
<option value="2">冻结</option>
</select>
</li>
<li>
<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
</li>
</ul>
</div>
</form>
</div> -->
<div class="btn-group-sm" id="toolbar" role="group">
<a class="btn btn-primary" onclick="openAddActivityModal()" shiro:hasPermission="monitor:job:export">
增加活动
</a>
</div>
<div class="col-sm-12 select-table table-striped">
<table id="bootstrap-table"></table>
</div>
<!-- modal -->
<div id="addClassify"></div>
<!-- modal -->
<div id="addClassify2"></div>
</div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: bootstrap-suggest-js"/>
<script th:src="@{/js/remote-search-performance.js}"></script>
<script th:inline="javascript">
var prefix = ctx + "stone/logs";
var prefix2 = ctx + "local";
var couType = [[${couType}]];
var formData = new FormData();
var roadShowId = '[[${roadShowId}]]'.replaceAll("\"", "");
// 下线 modal
let addActivityModalDom = `<div class="selectClassify">
<div class="addAvatarItem">
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>关联类型:</span>
<select name="activeType" id="activeType" class="form-control m-b">
<option value="">所有</option>
<option value="1">NFT</option>
<option value="2">组合购</option>
<option value="3">演出</option>
<option value="4">商品</option>
</select>
</div>
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>关联ID:</span>
<div class="search-wrapper" style="margin-bottom: 15px;">
<input name="roadShowId" th:value="*{roadShowId}" type="hidden">
<div class="remote_wrapper" style="position: relative;">
<input name="recommendId" type="hidden">
<input type="text" class="form-control" id="remoteSearch">
</div>
</div>
</div>
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>状态:</span>
<select name="status" id="status" class="form-control m-b">
<option value="">所有</option>
<option value="0">开启</option>
<option value="1">未开启</option>
</select>
</div>
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>时间范围:</span>
<div class="date-range" style="margin-bottom: 15px;">
<input type="text" style="width: 200px;float: left" class="form-control" id="startTime" placeholder="开始时间选择" name="startTime"/>
<span class="control-label" style="float: left;margin-left: 10px;margin-right: 10px"> - </span>
<input type="text" style="width: 200px;float: left" class="form-control" id="endTime" placeholder="结束时间选择" name="endTime"/>
</div>
</div>
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>推荐:</span>
<div class="search-wrapper">
<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="clickAffiliatedList('NFT', '1')">NFT</a>
<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="clickAffiliatedList('组合购', '2')">组合购</a>
<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="clickAffiliatedList('演出', '3')">演出</a>
<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="clickAffiliatedList('商品', '4')">商品</a>
</div>
</div>
</div>
</div>
<input type="hidden" id="typeValue" value="1">
<div class="bottomBtn">
<a src="javascript:;" class="layui-layer-btn0 paddings" onclick="saveActivity()">确定</a>
<a class="layui-layer-btn1 layui-layer-btn1" onclick="closeModal()">取消</a>
</div>`
let affiliatedChildModal = `<div class="selectClassify" style="width: 450px; height: 260px;">
<div class="addAvatarItem" style="padding: 20px;">
<div class="selectClassifyOne" style="margin-bottom: 20px;">
<span class="span-label"><i style="color: red;">*</i>推荐商品:</span>
<div class="search-wrapper">
<div class="search-item">
<input name="roadShowId" th:value="*{roadShowId}" type="hidden">
<div class="remote_wrapper" style="position: relative;">
<input name="recommendBindId" type="hidden">
<input type="text" class="form-control" id="listRemoteSearch">
</div>
</div>
</div>
</div>
<div class="selectClassifyOne">
<span class="span-label"><i style="color: red;">*</i>推荐类型:</span>
<select name="activeType" id="listActiveType" class="form-control m-b" style="width: 170px;">
<option value="">所有</option>
<option value="1">NFT</option>
<option value="2">组合购</option>
<option value="3">演出</option>
<option value="4">商品</option>
</select>
</div>
</div>
<div class="bottomBtn">
<a class="btn btn-primary btn-xs" href="javascript:void(0)" onclick="saveListAffiliated()">确定</a>
<a class="btn btn-default btn-xs layui-layer-btn2" href="javascript:void(0)" onclick="closeModal2()">取消</a>
</div>
</div>`
function clickAffiliatedList(val, index) {
openAffiliatedModal(val, index)
}
$(function () {
var options = {
url: '/kylin-recommend-active/pageActive',
pagination: true,
modalName: "关联",
columns: [
{
field: 'name',
title: '活动名称'
},
{
field: 'status',
title: '状态',
formatter: function (value, row, index) {
let textArr = ['开启', '未开始'];
return textArr[value]
}
},
{
field: 'activeType',
title: '活动类型',
formatter: function (value, row, index) {
let textArr = ['NFT', '组合购', '演出', '商品'];
return textArr[value]
}
},
{
field: 'name',
title: '活动名称'
},
{
field: 'createdAt',
title: '创建时间',
formatter: function (value, row, index) {
return $.common.dateFormat(new Date(value), 'yyyy-MM-dd HH:mm:ss')
}
},
{
title: '操作',
// align: 'center',
formatter: function (value, row, index) {
let dataArr = [];
dataArr.push(`<span class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="opendTicketList('${row.activeId}')"><i class="fa fa-search"></i>查看券列表</span>`)
return dataArr.join(' ')
}
}]
};
$.table.init(options);
});
// 保存
function saveActivity () {
let data = {
recommendId: $('#recommendId').val(),
startTime: $('#startTime').val(),
endTime: $('#endTime').val(),
activeType: $("#activeType").find("option:selected").text(),
status: $("#status").find("option:selected").text()
}
let isRequired = data.recommendId && data.startTime &&data.endTime &&data.activeType &&data.status
console.log('params', data)
if (isRequired) { // 必填ok
$.ajax({
url: `/kylin-recommend-active/addKylinRecommendActive`,
type: 'post',
data,
success: function(res) {
console.log('success', res)
if (res.code == 200) {
alert('新增成功')
} else {
layer.msg(res.msg)
}
}
})
} else {
$.modal.msgWarning("拒绝原因为必填项!")
}
}
// 保存关联活动内容
function saveListAffiliated() {
let _recommendBindId = document.getElementsByName("recommendBindId")[0].value
let _type = $("#listActiveType").find("option:selected").text() // 已经获取
}
// 打开增加活动 modal
function openAddActivityModal () {
$('#addClassify').html('')
$('#addClassify').append(addActivityModalDom)
$("input[name='startTime']").datetimepicker({
format: "yyyy-mm-dd hh:ii:ss",
autoclose: true
});
$("input[name='endTime']").datetimepicker({
format: "yyyy-mm-dd hh:ii:ss",
autoclose: true
});
// 输入检索功能
$('#remoteSearch').remoteSearchPerformance({
ajax: {
url: ctx + `goblin/common/mix`,
type: "get"
},
chose: function(text, val) {
document.getElementsByName("recommendId")[0].value = val;
},
success: function(res) {
console.log('remoteSearch-res', res)
}
})
layer.open({
type: 1,
shade: .3,
title: '增加活动', // 不显示标题
content: $('#addClassify'), // 捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
cancel: function(res){
$("#addClassify").empty()
// layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', {time: 5000, icon:6});
}
});
}
// 打开 list 选择
function openAffiliatedModal (val, index) {
$('#addClassify2').html('')
$('#addClassify2').append(affiliatedChildModal)
// 输入检索功能
$('#listRemoteSearch').remoteSearchPerformance({
ajax: {
url: ctx + `goblin/common/mix`,
type: "get"
},
chose: function(text, val) {
document.getElementsByName("recommendBindId")[0].value = val;
},
success: function(res) {
console.log('remoteSearch-res', res)
}
})
layer.open({
type: 2,
shade: .3,
title: '增加关联推荐', // 不显示标题
content: $('#addClassify2'), // 捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
cancel: function(res){
$("#addClassify2").empty()
// layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', {time: 5000, icon:6});
}
});
$('#listActiveType').find(`option[value=${index}]`).attr('selected', true)
}
// 关闭模态框
function closeModal () {
$("#addClassify").empty()
$(".layui-layer-close1").click();
}
// 关闭模态框2
function closeModal2 () {
$("#addClassify2").empty()
layer.close(2)
}
// ------------------------------------------------------------------------------------------------------
function opendTicketList (id) {
console.log(id, '121212121212activityTicketList')
var url = prefix2+'/activityTicketList?id=' + id;
$.modal.openTab("活动券列表", url);
}
// 导出数据
function exportSelected() {
// console.log(userIds.toString(), 'dataParam')
$.modal.open('创建活动', prefix2 + "/createActivityModal", 500, 260, cancel)
}
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment