228 lines
9.1 KiB
HTML
Executable File
228 lines
9.1 KiB
HTML
Executable File
{include file="Public:header2"/}
|
|
|
|
<body>
|
|
<div class="layui-fluid">
|
|
<div class="layui-card">
|
|
<!-- 搜索表单 -->
|
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">奖品状态</label>
|
|
<div class="layui-input-inline">
|
|
<select name="status" lay-filter="status">
|
|
<option value="">全部状态</option>
|
|
<option value="0">盒柜中</option>
|
|
<option value="1">兑换达达卷</option>
|
|
<option value="2">选择发货</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">奖品名称</label>
|
|
<div class="layui-input-inline">
|
|
<input type="text" name="goodslist_title" autocomplete="off" class="layui-input"
|
|
placeholder="奖品名称">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">盒子名称</label>
|
|
<div class="layui-input-inline">
|
|
<input type="text" name="good_title" autocomplete="off" class="layui-input"
|
|
placeholder="盒子名称">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">获取时间</label>
|
|
<div class="layui-input-inline">
|
|
<input type="text" id="addtime" name="addtime" autocomplete="off" class="layui-input"
|
|
placeholder="获取时间范围">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<button class="layui-btn" lay-submit lay-filter="boxSearch">
|
|
搜索
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 数据表格 -->
|
|
<div class="layui-card-body">
|
|
<table id="user-box-table" lay-filter="user-box-table"></table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 定义复制按钮模板 -->
|
|
<script type="text/html" id="copyOrderNumTpl">
|
|
<a class="layui-btn layui-btn-xs" lay-event="copyOrderNum">复制订单号</a>
|
|
</script>
|
|
|
|
<!-- 定义发货状态模板 -->
|
|
<script type="text/html" id="fhStatusTpl">
|
|
{{# if(d.status == 2) { }}
|
|
{{# if(d.fh_status == 1) { }}
|
|
<span class="layui-badge layui-bg-green">已发货</span>
|
|
{{# } else if(d.fh_status == 2) { }}
|
|
<span class="layui-badge layui-bg-red">未发货</span>
|
|
{{# } else { }}
|
|
<span class="layui-badge layui-bg-gray">待处理</span>
|
|
{{# } }}
|
|
{{# } else { }}
|
|
-
|
|
{{# } }}
|
|
</script>
|
|
|
|
<!-- 定义发货备注模板 -->
|
|
<script type="text/html" id="fhRemarksTpl">
|
|
{{# if(d.status == 2 && d.fh_remarks) { }}
|
|
<div class="layui-elip" title="{{d.fh_remarks}}">{{d.fh_remarks}}</div>
|
|
{{# } else { }}
|
|
-
|
|
{{# } }}
|
|
</script>
|
|
|
|
{include file="Public:footer"/}
|
|
<script>
|
|
layui.use(['table', 'form', 'laydate'], function () {
|
|
var table = layui.table;
|
|
var form = layui.form;
|
|
var laydate = layui.laydate;
|
|
|
|
// 初始化日期范围选择器
|
|
laydate.render({
|
|
elem: '#addtime',
|
|
type: 'datetime',
|
|
range: true
|
|
});
|
|
|
|
// 获取URL参数
|
|
var user_id = '{$user_id}';
|
|
var nickname = '{$nickname}';
|
|
|
|
// 设置页面标题
|
|
document.title = nickname + ' 的盒柜';
|
|
|
|
// 初始化盒柜表格
|
|
var boxTable = table.render({
|
|
elem: '#user-box-table',
|
|
url: '{:url("/admin/user_box_list")}',
|
|
where: { user_id: user_id },
|
|
height: 'full-140',
|
|
cols: [[
|
|
{ field: 'good_title', title: '盒子名称', width: 140 },
|
|
{ field: 'goodslist_title', title: '奖品名称', width: 200 },
|
|
{ field: 'shang_title', title: '奖品类型', width: 120 },
|
|
{ field: 'goodslist_money', title: '调换商品', width: 100 },
|
|
{ field: 'goodslist_price', title: '售价', width: 100 },
|
|
{ field: 'order_num', title: '订单编号', width: 240 },
|
|
{
|
|
field: 'status', title: '状态', width: 100, templet: function (d) {
|
|
var statusText = '';
|
|
switch (parseInt(d.status)) {
|
|
case 0: statusText = '<span class="layui-badge layui-bg-blue">盒柜中</span>'; break;
|
|
case 1: statusText = '<span class="layui-badge layui-bg-orange">兑换达达卷</span>'; break;
|
|
case 2: statusText = '<span class="layui-badge layui-bg-green">选择发货</span>'; break;
|
|
default: statusText = '<span class="layui-badge layui-bg-gray">未知</span>';
|
|
}
|
|
return statusText;
|
|
}
|
|
},
|
|
{ field: 'fh_status', title: '发货状态', width: 80, templet: '#fhStatusTpl' },
|
|
{ field: 'fh_remarks', title: '发货备注', width: 120, templet: '#fhRemarksTpl' },
|
|
{
|
|
field: 'addtime', title: '获得时间', width: 160, templet: function (d) {
|
|
return timestampToDatetime(d.addtime);
|
|
}
|
|
},
|
|
{ title: '操作', toolbar: '#copyOrderNumTpl', width: 120 }
|
|
]],
|
|
page: true,
|
|
limit: 50,
|
|
text: {
|
|
none: '暂无盒柜数据'
|
|
}
|
|
});
|
|
|
|
// 监听搜索按钮
|
|
form.on('submit(boxSearch)', function (data) {
|
|
boxTable.reload({
|
|
where: {
|
|
user_id: user_id,
|
|
status: data.field.status,
|
|
goodslist_title: data.field.goodslist_title,
|
|
good_title: data.field.good_title,
|
|
addtime: data.field.addtime
|
|
},
|
|
page: { curr: 1 }
|
|
});
|
|
return false;
|
|
});
|
|
|
|
// 监听表格工具条事件
|
|
table.on('tool(user-box-table)', function (obj) {
|
|
var data = obj.data;
|
|
if (obj.event === 'copyOrderNum') {
|
|
copyToClipboard(data.order_num);
|
|
}
|
|
});
|
|
|
|
// 复制到剪贴板函数
|
|
function copyToClipboard(text) {
|
|
// 创建临时文本区域
|
|
var textarea = document.createElement('textarea');
|
|
textarea.value = text;
|
|
document.body.appendChild(textarea);
|
|
textarea.select();
|
|
|
|
try {
|
|
// 执行复制命令
|
|
document.execCommand('copy');
|
|
layer.msg('订单编号复制成功: ' + text, {icon: 1});
|
|
} catch (err) {
|
|
layer.msg('复制失败，请手动复制', {icon: 2});
|
|
}
|
|
|
|
// 移除临时文本区域
|
|
document.body.removeChild(textarea);
|
|
}
|
|
|
|
// 时间戳转日期时间格式
|
|
function timestampToDatetime(timestamp) {
|
|
var date = new Date(timestamp * 1000);
|
|
var year = date.getFullYear();
|
|
var month = ('0' + (date.getMonth() + 1)).slice(-2);
|
|
var day = ('0' + date.getDate()).slice(-2);
|
|
var hours = ('0' + date.getHours()).slice(-2);
|
|
var minutes = ('0' + date.getMinutes()).slice(-2);
|
|
var seconds = ('0' + date.getSeconds()).slice(-2);
|
|
return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
.layui-form-label {
|
|
width: 90px;
|
|
}
|
|
|
|
.layui-table thead th {
|
|
background-color: #f8f8f8;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.layui-table-page {
|
|
text-align: center;
|
|
}
|
|
|
|
/* 添加发货备注的样式 */
|
|
.layui-elip {
|
|
max-width: 150px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
</style>
|
|
</body>
|
|
|
|
</html> |