321
This commit is contained in:
zpc
parent
6749e1e882
commit
131768c78b
|
|
@ -0,0 +1,271 @@
|
||||||
|
<script type="text/html" template lay-done="layui.data.sendParams(d);">
|
||||||
|
<div style="padding: 20px;">
|
||||||
|
<!-- 日期和房间信息 -->
|
||||||
|
<div class="layui-row">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"><h3>日期信息</h3></div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-row">
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<p><strong>日期：</strong>{{d.params.data.dateStr || ''}}</p>
|
||||||
|
<p><strong>房间：</strong>{{d.params.data.roomName || ''}}</p>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<p><strong>星期：</strong><span id="weekDayText"></span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 时段详情 -->
|
||||||
|
<div class="layui-row" style="margin-top: 20px;" id="timeSlotsSection">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"><h3>时段详情</h3></div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<table id="dateDetailsTable" lay-filter="dateDetailsTable"></table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 预约详情列表（按时段分组） -->
|
||||||
|
<div id="reservationsBySlot"></div>
|
||||||
|
</div>
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
var debug = layui.setter.debug;
|
||||||
|
layui.data.sendParams = function (d) {
|
||||||
|
//开启调试情况下获取接口赋值数据
|
||||||
|
if (debug) { console.log(d.params.data); }
|
||||||
|
|
||||||
|
layui.use(['admin', 'table', 'coreHelper', 'layer'],
|
||||||
|
function () {
|
||||||
|
var $ = layui.$
|
||||||
|
, table = layui.table
|
||||||
|
, admin = layui.admin
|
||||||
|
, coreHelper = layui.coreHelper
|
||||||
|
, layer = layui.layer;
|
||||||
|
|
||||||
|
// 从 d.params.data 中获取参数
|
||||||
|
var params = d.params.data;
|
||||||
|
var dateStr = params.dateStr;
|
||||||
|
var roomId = params.roomId;
|
||||||
|
var roomName = params.roomName;
|
||||||
|
|
||||||
|
// 获取星期几的辅助函数
|
||||||
|
function getWeekDay(dateStr) {
|
||||||
|
var date = new Date(dateStr);
|
||||||
|
var weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
||||||
|
return weekDays[date.getDay()];
|
||||||
|
}
|
||||||
|
|
||||||
|
// 设置星期显示
|
||||||
|
$('#weekDayText').text(getWeekDay(dateStr));
|
||||||
|
|
||||||
|
// 请求详细数据
|
||||||
|
coreHelper.Get("Api/SQRoomPricing/GetDateDetails?date=" + encodeURIComponent(dateStr) + "&roomId=" + roomId, function (e) {
|
||||||
|
if (e.code === 0 && e.data) {
|
||||||
|
var data = e.data;
|
||||||
|
|
||||||
|
// 渲染时段详情表格
|
||||||
|
if (data.time_slots && data.time_slots.length > 0) {
|
||||||
|
var tableData = data.time_slots.map(function (slot) {
|
||||||
|
return {
|
||||||
|
slot_name: slot.slot_name || '',
|
||||||
|
status: slot.status || '',
|
||||||
|
price_desc_standard: slot.price_desc_standard || '',
|
||||||
|
price_desc_member: slot.price_desc_member || '',
|
||||||
|
participant_avatars: slot.participant_avatars || [],
|
||||||
|
reservation_count: slot.reservation_count || 0
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
table.render({
|
||||||
|
elem: '#dateDetailsTable',
|
||||||
|
data: tableData,
|
||||||
|
page: false,
|
||||||
|
cols: [[
|
||||||
|
{ field: 'slot_name', title: '时段', width: 100 },
|
||||||
|
{
|
||||||
|
field: 'status',
|
||||||
|
title: '状态',
|
||||||
|
width: 100,
|
||||||
|
templet: function (d) {
|
||||||
|
var statusText = '';
|
||||||
|
var statusColor = '';
|
||||||
|
if (d.status === 'available') {
|
||||||
|
statusText = '可用';
|
||||||
|
statusColor = '#5FB878';
|
||||||
|
} else if (d.status === 'reserved') {
|
||||||
|
statusText = '已预约';
|
||||||
|
statusColor = '#FFB800';
|
||||||
|
} else if (d.status === 'using') {
|
||||||
|
statusText = '使用中';
|
||||||
|
statusColor = '#999';
|
||||||
|
} else if (d.status === 'unavailable') {
|
||||||
|
statusText = '不可用';
|
||||||
|
statusColor = '#FF5722';
|
||||||
|
} else {
|
||||||
|
statusText = d.status;
|
||||||
|
statusColor = '#999';
|
||||||
|
}
|
||||||
|
return '<span style="background: ' + statusColor + '; color: white; padding: 2px 8px; border-radius: 3px; font-size: 12px;">' + statusText + '</span>';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ field: 'price_desc_standard', title: '普通价格描述', width: 150 },
|
||||||
|
{ field: 'price_desc_member', title: '会员价格描述', width: 150 },
|
||||||
|
{
|
||||||
|
field: 'participant_avatars',
|
||||||
|
title: '预约人头像',
|
||||||
|
width: 200,
|
||||||
|
templet: function (d) {
|
||||||
|
if (!d.participant_avatars || d.participant_avatars.length === 0) {
|
||||||
|
return '<span style="color: #999;">无</span>';
|
||||||
|
}
|
||||||
|
var html = '<div style="display: flex; gap: 4px; flex-wrap: wrap;">';
|
||||||
|
d.participant_avatars.forEach(function (avatar) {
|
||||||
|
html += '<img src="' + avatar + '" style="width:28px;height:28px;border-radius:50%;object-fit:cover;" onerror="this.src=\'/images/default-avatar.png\'" />';
|
||||||
|
});
|
||||||
|
html += '</div>';
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ field: 'reservation_count', title: '预约人数', width: 100 }
|
||||||
|
]]
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// 如果没有时段数据，隐藏时段详情区域
|
||||||
|
$('#timeSlotsSection').hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 渲染按时段分组的预约详情
|
||||||
|
if (data.reservations_by_slot) {
|
||||||
|
var slotNames = ['凌晨', '上午', '下午', '晚上'];
|
||||||
|
var reservationsBySlotContainer = $('#reservationsBySlot');
|
||||||
|
|
||||||
|
for (var slotType = 0; slotType <= 3; slotType++) {
|
||||||
|
var slotReservations = data.reservations_by_slot[slotType];
|
||||||
|
|
||||||
|
if (slotReservations && slotReservations.length > 0) {
|
||||||
|
// 时段标题
|
||||||
|
var slotHtml = '<div class="layui-row" style="margin-top: 20px;">';
|
||||||
|
slotHtml += ' <div class="layui-col-md12">';
|
||||||
|
slotHtml += ' <h3 style="padding: 10px; background: #f8f8f8; border-left: 4px solid #009688;">预约详情列表（' + slotNames[slotType] + '）</h3>';
|
||||||
|
|
||||||
|
// 遍历该时段的每个预约
|
||||||
|
slotReservations.forEach(function (reservation, idx) {
|
||||||
|
slotHtml += ' <div class="layui-card" style="margin-top: 10px;">';
|
||||||
|
slotHtml += ' <div class="layui-card-header">';
|
||||||
|
slotHtml += ' <div class="layui-row">';
|
||||||
|
slotHtml += ' <div class="layui-col-md3"><strong>组局名称：</strong>' + (reservation.title || '无') + '</div>';
|
||||||
|
slotHtml += ' <div class="layui-col-md2"><strong>参与人数：</strong>' + (reservation.player_count || 0) + '人</div>';
|
||||||
|
slotHtml += ' <div class="layui-col-md2"><strong>鸽子费：</strong>' + (reservation.deposit_fee || 0) + '元</div>';
|
||||||
|
slotHtml += ' <div class="layui-col-md3"><strong>最晚到店：</strong>' + (reservation.latest_arrival_time || '无') + '</div>';
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
slotHtml += ' <div class="layui-row" style="margin-top: 5px;">';
|
||||||
|
slotHtml += ' <div class="layui-col-md3"><strong>玩法类型：</strong>' + (reservation.game_type || '无') + '</div>';
|
||||||
|
slotHtml += ' <div class="layui-col-md3"><strong>具体规则：</strong>' + (reservation.game_rule || '无') + '</div>';
|
||||||
|
slotHtml += ' <div class="layui-col-md4"><strong>开始时间：</strong>' + (reservation.start_time || '无') + '</div>';
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
slotHtml += ' <div class="layui-card-body">';
|
||||||
|
slotHtml += ' <table id="participantsTable_' + slotType + '_' + reservation.id + '" lay-filter="participantsTable_' + slotType + '_' + reservation.id + '"></table>';
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
});
|
||||||
|
|
||||||
|
slotHtml += ' </div>';
|
||||||
|
slotHtml += '</div>';
|
||||||
|
|
||||||
|
reservationsBySlotContainer.append(slotHtml);
|
||||||
|
|
||||||
|
// 渲染每个预约的参与者表格
|
||||||
|
slotReservations.forEach(function (reservation, idx) {
|
||||||
|
var participants = reservation.participants || [];
|
||||||
|
|
||||||
|
table.render({
|
||||||
|
elem: '#participantsTable_' + slotType + '_' + reservation.id,
|
||||||
|
data: participants,
|
||||||
|
page: false,
|
||||||
|
cols: [[
|
||||||
|
{ field: 'id', title: 'ID', width: 60 },
|
||||||
|
{ field: 'user_id', title: '用户ID', width: 80 },
|
||||||
|
{ field: 'user_name', title: '用户昵称', width: 120 },
|
||||||
|
{
|
||||||
|
field: 'avatar_image',
|
||||||
|
title: '用户头像',
|
||||||
|
width: 80,
|
||||||
|
templet: function (d) {
|
||||||
|
if (d.avatar_image) {
|
||||||
|
return '<img src="' + d.avatar_image + '" style="width:40px;height:40px;border-radius:50%;object-fit:cover;" onerror="this.src=\'/images/default-avatar.png\'" />';
|
||||||
|
}
|
||||||
|
return '<span style="color: #999;">无</span>';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ field: 'join_time', title: '参与时间', width: 150 },
|
||||||
|
{
|
||||||
|
field: 'role',
|
||||||
|
title: '角色',
|
||||||
|
width: 80,
|
||||||
|
templet: function (d) {
|
||||||
|
return d.role === 1 ? '<span style="color: #ff5722;">发起者</span>' : '参与者';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ field: 'quit_time', title: '退出时间', width: 150 },
|
||||||
|
{
|
||||||
|
field: 'is_refund',
|
||||||
|
title: '鸽子费状态',
|
||||||
|
width: 100,
|
||||||
|
templet: function (d) {
|
||||||
|
var refundText = '';
|
||||||
|
var refundColor = '';
|
||||||
|
switch (d.is_refund) {
|
||||||
|
case 0:
|
||||||
|
refundText = '无需退款';
|
||||||
|
refundColor = '#999';
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
refundText = '未付鸽子费';
|
||||||
|
refundColor = '#1E9FFF';
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
refundText = '已付鸽子费';
|
||||||
|
refundColor = '#FFB800';
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
refundText = '退款中';
|
||||||
|
refundColor = '#5FB878';
|
||||||
|
break;
|
||||||
|
case 4:
|
||||||
|
refundText = '退款成功';
|
||||||
|
refundColor = '#5FB878';
|
||||||
|
break;
|
||||||
|
case 9:
|
||||||
|
refundText = '退款失败';
|
||||||
|
refundColor = '#FF5722';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
refundText = '未知状态';
|
||||||
|
refundColor = '#999';
|
||||||
|
}
|
||||||
|
return '<span style="background: ' + refundColor + '; color: white; padding: 2px 6px; border-radius: 3px; font-size: 12px;">' + refundText + '</span>';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ field: 'remarks', title: '备注', minWidth: 150 }
|
||||||
|
]]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
layer.msg(e.msg || '获取数据失败');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -1325,252 +1325,21 @@
|
||||||
});
|
});
|
||||||
var roomName = selectedRoom ? selectedRoom.name : '未知房间';
|
var roomName = selectedRoom ? selectedRoom.name : '未知房间';
|
||||||
|
|
||||||
// 请求详细数据
|
// 使用模板弹窗
|
||||||
coreHelper.Get("Api/SQRoomPricing/GetDateDetails?date=" + encodeURIComponent(dateStr) + "&roomId=" + selectedRoomId, function (e) {
|
admin.popup({
|
||||||
if (e.code === 0 && e.data) {
|
title: roomName + ' - ' + dateStr + ' 详情',
|
||||||
var data = e.data;
|
area: ['1200px', '90%'],
|
||||||
|
id: 'LAY-popup-sqroompricing-datedetails',
|
||||||
// 构建弹窗内容
|
success: function (layero, index) {
|
||||||
var content = '<div style="padding: 20px;">';
|
view(this.id).render('sq/sqroompricing/date-details', {
|
||||||
|
data: {
|
||||||
// 日期和房间信息
|
dateStr: dateStr,
|
||||||
content += '<div class="layui-row">';
|
roomId: selectedRoomId,
|
||||||
content += ' <div class="layui-col-md12">';
|
roomName: roomName
|
||||||
content += ' <div class="layui-card">';
|
|
||||||
content += ' <div class="layui-card-header"><h3>日期信息</h3></div>';
|
|
||||||
content += ' <div class="layui-card-body">';
|
|
||||||
content += ' <div class="layui-row">';
|
|
||||||
content += ' <div class="layui-col-md6">';
|
|
||||||
content += ' <p><strong>日期：</strong>' + dateStr + '</p>';
|
|
||||||
content += ' <p><strong>房间：</strong>' + roomName + '</p>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' <div class="layui-col-md6">';
|
|
||||||
content += ' <p><strong>星期：</strong>' + getWeekDay(dateStr) + '</p>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += '</div>';
|
|
||||||
|
|
||||||
// 时段详情
|
|
||||||
if (data.time_slots && data.time_slots.length > 0) {
|
|
||||||
content += '<div class="layui-row" style="margin-top: 20px;">';
|
|
||||||
content += ' <div class="layui-col-md12">';
|
|
||||||
content += ' <div class="layui-card">';
|
|
||||||
content += ' <div class="layui-card-header"><h3>时段详情</h3></div>';
|
|
||||||
content += ' <div class="layui-card-body">';
|
|
||||||
content += ' <table id="dateDetailsTable" lay-filter="dateDetailsTable"></table>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += ' </div>';
|
|
||||||
content += '</div>';
|
|
||||||
}
|
|
||||||
|
|
||||||
// 预约详情列表（按时段分组）
|
|
||||||
content += '<div id="reservationsBySlot"></div>';
|
|
||||||
|
|
||||||
content += '</div>';
|
|
||||||
|
|
||||||
// 弹出窗口
|
|
||||||
layer.open({
|
|
||||||
type: 1,
|
|
||||||
title: roomName + ' - ' + dateStr + ' 详情',
|
|
||||||
area: ['1200px', '90%'],
|
|
||||||
content: content,
|
|
||||||
success: function (layero, index) {
|
|
||||||
// 渲染时段详情表格
|
|
||||||
if (data.time_slots && data.time_slots.length > 0) {
|
|
||||||
var tableData = data.time_slots.map(function (slot) {
|
|
||||||
return {
|
|
||||||
slot_name: slot.slot_name || '',
|
|
||||||
status: slot.status || '',
|
|
||||||
price_desc_standard: slot.price_desc_standard || '',
|
|
||||||
price_desc_member: slot.price_desc_member || '',
|
|
||||||
participant_avatars: slot.participant_avatars || [],
|
|
||||||
reservation_count: slot.reservation_count || 0
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
table.render({
|
|
||||||
elem: '#dateDetailsTable',
|
|
||||||
data: tableData,
|
|
||||||
page: false,
|
|
||||||
cols: [[
|
|
||||||
{ field: 'slot_name', title: '时段', width: 100 },
|
|
||||||
{
|
|
||||||
field: 'status',
|
|
||||||
title: '状态',
|
|
||||||
width: 100,
|
|
||||||
templet: function (d) {
|
|
||||||
var statusText = '';
|
|
||||||
var statusColor = '';
|
|
||||||
if (d.status === 'available') {
|
|
||||||
statusText = '可用';
|
|
||||||
statusColor = '#5FB878';
|
|
||||||
} else if (d.status === 'reserved') {
|
|
||||||
statusText = '已预约';
|
|
||||||
statusColor = '#FFB800';
|
|
||||||
} else if (d.status === 'using') {
|
|
||||||
statusText = '使用中';
|
|
||||||
statusColor = '#999';
|
|
||||||
} else if (d.status === 'unavailable') {
|
|
||||||
statusText = '不可用';
|
|
||||||
statusColor = '#FF5722';
|
|
||||||
} else {
|
|
||||||
statusText = d.status;
|
|
||||||
statusColor = '#999';
|
|
||||||
}
|
|
||||||
return '<span style="background: ' + statusColor + '; color: white; padding: 2px 8px; border-radius: 3px; font-size: 12px;">' + statusText + '</span>';
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ field: 'price_desc_standard', title: '普通价格描述', width: 150 },
|
|
||||||
{ field: 'price_desc_member', title: '会员价格描述', width: 150 },
|
|
||||||
{
|
|
||||||
field: 'participant_avatars',
|
|
||||||
title: '预约人头像',
|
|
||||||
width: 200,
|
|
||||||
templet: function (d) {
|
|
||||||
if (!d.participant_avatars || d.participant_avatars.length === 0) {
|
|
||||||
return '<span style="color: #999;">无</span>';
|
|
||||||
}
|
|
||||||
var html = '<div style="display: flex; gap: 4px; flex-wrap: wrap;">';
|
|
||||||
d.participant_avatars.forEach(function (avatar) {
|
|
||||||
html += '<img src="' + avatar + '" style="width:28px;height:28px;border-radius:50%;object-fit:cover;" onerror="this.src=\'/images/default-avatar.png\'" />';
|
|
||||||
});
|
|
||||||
html += '</div>';
|
|
||||||
return html;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ field: 'reservation_count', title: '预约人数', width: 100 }
|
|
||||||
]]
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 渲染按时段分组的预约详情
|
|
||||||
if (data.reservations_by_slot) {
|
|
||||||
var slotNames = ['凌晨', '上午', '下午', '晚上'];
|
|
||||||
var reservationsBySlotContainer = $('#reservationsBySlot');
|
|
||||||
|
|
||||||
for (var slotType = 0; slotType <= 3; slotType++) {
|
|
||||||
var slotReservations = data.reservations_by_slot[slotType];
|
|
||||||
|
|
||||||
if (slotReservations && slotReservations.length > 0) {
|
|
||||||
// 时段标题
|
|
||||||
var slotHtml = '<div class="layui-row" style="margin-top: 20px;">';
|
|
||||||
slotHtml += ' <div class="layui-col-md12">';
|
|
||||||
slotHtml += ' <h3 style="padding: 10px; background: #f8f8f8; border-left: 4px solid #009688;">预约详情列表（' + slotNames[slotType] + '）</h3>';
|
|
||||||
|
|
||||||
// 遍历该时段的每个预约
|
|
||||||
slotReservations.forEach(function (reservation, idx) {
|
|
||||||
slotHtml += ' <div class="layui-card" style="margin-top: 10px;">';
|
|
||||||
slotHtml += ' <div class="layui-card-header">';
|
|
||||||
slotHtml += ' <div class="layui-row">';
|
|
||||||
slotHtml += ' <div class="layui-col-md3"><strong>组局名称：</strong>' + (reservation.title || '无') + '</div>';
|
|
||||||
slotHtml += ' <div class="layui-col-md2"><strong>参与人数：</strong>' + (reservation.player_count || 0) + '人</div>';
|
|
||||||
slotHtml += ' <div class="layui-col-md2"><strong>鸽子费：</strong>' + (reservation.deposit_fee || 0) + '元</div>';
|
|
||||||
slotHtml += ' <div class="layui-col-md3"><strong>最晚到店：</strong>' + (reservation.latest_arrival_time || '无') + '</div>';
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
slotHtml += ' <div class="layui-row" style="margin-top: 5px;">';
|
|
||||||
slotHtml += ' <div class="layui-col-md3"><strong>玩法类型：</strong>' + (reservation.game_type || '无') + '</div>';
|
|
||||||
slotHtml += ' <div class="layui-col-md3"><strong>具体规则：</strong>' + (reservation.game_rule || '无') + '</div>';
|
|
||||||
slotHtml += ' <div class="layui-col-md4"><strong>开始时间：</strong>' + (reservation.start_time || '无') + '</div>';
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
slotHtml += ' <div class="layui-card-body">';
|
|
||||||
slotHtml += ' <table id="participantsTable_' + slotType + '_' + reservation.id + '" lay-filter="participantsTable_' + slotType + '_' + reservation.id + '"></table>';
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
});
|
|
||||||
|
|
||||||
slotHtml += ' </div>';
|
|
||||||
slotHtml += '</div>';
|
|
||||||
|
|
||||||
reservationsBySlotContainer.append(slotHtml);
|
|
||||||
|
|
||||||
// 渲染每个预约的参与者表格
|
|
||||||
slotReservations.forEach(function (reservation, idx) {
|
|
||||||
var participants = reservation.participants || [];
|
|
||||||
|
|
||||||
table.render({
|
|
||||||
elem: '#participantsTable_' + slotType + '_' + reservation.id,
|
|
||||||
data: participants,
|
|
||||||
page: false,
|
|
||||||
cols: [[
|
|
||||||
{ field: 'id', title: 'ID', width: 60 },
|
|
||||||
{ field: 'user_id', title: '用户ID', width: 80 },
|
|
||||||
{ field: 'user_name', title: '用户昵称', width: 120 },
|
|
||||||
{
|
|
||||||
field: 'avatar_image',
|
|
||||||
title: '用户头像',
|
|
||||||
width: 80,
|
|
||||||
templet: function (d) {
|
|
||||||
if (d.avatar_image) {
|
|
||||||
return '<img src="' + d.avatar_image + '" style="width:40px;height:40px;border-radius:50%;object-fit:cover;" onerror="this.src=\'/images/default-avatar.png\'" />';
|
|
||||||
}
|
|
||||||
return '<span style="color: #999;">无</span>';
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ field: 'join_time', title: '参与时间', width: 150 },
|
|
||||||
{
|
|
||||||
field: 'role',
|
|
||||||
title: '角色',
|
|
||||||
width: 80,
|
|
||||||
templet: function (d) {
|
|
||||||
return d.role === 1 ? '<span style="color: #ff5722;">发起者</span>' : '参与者';
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ field: 'quit_time', title: '退出时间', width: 150 },
|
|
||||||
{
|
|
||||||
field: 'is_refund',
|
|
||||||
title: '鸽子费状态',
|
|
||||||
width: 100,
|
|
||||||
templet: function (d) {
|
|
||||||
var refundText = '';
|
|
||||||
var refundColor = '';
|
|
||||||
switch (d.is_refund) {
|
|
||||||
case 0:
|
|
||||||
refundText = '无需退款';
|
|
||||||
refundColor = '#999';
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
refundText = '未付鸽子费';
|
|
||||||
refundColor = '#1E9FFF';
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
refundText = '已付鸽子费';
|
|
||||||
refundColor = '#FFB800';
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
refundText = '退款中';
|
|
||||||
refundColor = '#5FB878';
|
|
||||||
break;
|
|
||||||
case 4:
|
|
||||||
refundText = '退款成功';
|
|
||||||
refundColor = '#5FB878';
|
|
||||||
break;
|
|
||||||
case 9:
|
|
||||||
refundText = '退款失败';
|
|
||||||
refundColor = '#FF5722';
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
refundText = '未知状态';
|
|
||||||
refundColor = '#999';
|
|
||||||
}
|
|
||||||
return '<span style="background: ' + refundColor + '; color: white; padding: 2px 6px; border-radius: 3px; font-size: 12px;">' + refundText + '</span>';
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ field: 'remarks', title: '备注', minWidth: 150 }
|
|
||||||
]]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}).done(function () {
|
||||||
|
// 模板加载完成后的回调
|
||||||
});
|
});
|
||||||
} else {
|
|
||||||
layer.msg(e.msg || '获取数据失败');
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user