添加项目文件。
This commit is contained in:
@@ -0,0 +1,215 @@
|
||||
|
||||
<title>会话管理</title>
|
||||
|
||||
<div class="layui-card layadmin-header">
|
||||
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||
<a lay-href="">主页</a>
|
||||
<a><cite>客服管理</cite></a>
|
||||
<a><cite>会话列表</cite></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-fluid">
|
||||
<div class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="layadmin-conversation-formlist">
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">用户ID</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="userId" placeholder="请输入用户ID" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">客服ID</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="customerId" placeholder="请输入客服ID" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">状态</label>
|
||||
<div class="layui-input-block">
|
||||
<select name="status">
|
||||
<option value="">全部</option>
|
||||
<option value="0">等待中</option>
|
||||
<option value="1">进行中</option>
|
||||
<option value="2">已结束</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-inline">
|
||||
<button class="layui-btn layuiadmin-btn-conversation" lay-submit lay-filter="LAY-conversation-front-search">
|
||||
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i> 搜索
|
||||
</button>
|
||||
<button class="layui-btn layui-btn-primary" lay-filter="LAY-conversation-front-reset">
|
||||
<i class="layui-icon layui-icon-refresh layuiadmin-button-btn"></i> 重置
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-card">
|
||||
<div class="layui-card-body">
|
||||
<div class="layui-btn-group">
|
||||
<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="refresh">
|
||||
<i class="layui-icon layui-icon-refresh"></i> 刷新
|
||||
</button>
|
||||
</div>
|
||||
<br><br>
|
||||
|
||||
<table id="LAY-conversation-manage" lay-filter="LAY-conversation-manage"></table>
|
||||
|
||||
<script type="text/html" id="table-conversation-admin">
|
||||
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="chatlog"><i class="layui-icon layui-icon-log"></i>聊天记录</a>
|
||||
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
layui.use(['admin', 'table', 'form', 'layer'], function () {
|
||||
var $ = layui.$,
|
||||
admin = layui.admin,
|
||||
view = layui.view,
|
||||
table = layui.table,
|
||||
layer = layui.layer,
|
||||
setter = layui.setter,
|
||||
form = layui.form,
|
||||
customerApiUrl = setter.customerApiUrl || setter.baseurl;
|
||||
|
||||
form.render(null, 'layadmin-conversation-formlist');
|
||||
|
||||
//监听搜索
|
||||
form.on('submit(LAY-conversation-front-search)', function (data) {
|
||||
var field = data.field;
|
||||
//执行重载
|
||||
table.reload('LAY-conversation-manage', {
|
||||
where: field,
|
||||
page: { curr: 1 }
|
||||
});
|
||||
});
|
||||
|
||||
// 监听重置
|
||||
$('.layui-btn-group').on('click', '[lay-event="refresh"]', function () {
|
||||
table.reload('LAY-conversation-manage');
|
||||
});
|
||||
|
||||
table.render({
|
||||
elem: "#LAY-conversation-manage",
|
||||
url: customerApiUrl + "customerapi/customer/conversations",
|
||||
method: "get",
|
||||
headers: {
|
||||
'token': layui.data(setter.tableName)[setter.request.tokenName]
|
||||
},
|
||||
page: true,
|
||||
where: {
|
||||
userId: "",
|
||||
customerId: "",
|
||||
status: ""
|
||||
},
|
||||
request: {
|
||||
pageName: 'pageIndex',
|
||||
limitName: 'pageSize'
|
||||
},
|
||||
limit: 10,
|
||||
cols: [[
|
||||
{ field: "userName", title: "用户名称", width: 150 },
|
||||
{ field: "userId", title: "用户ID", width: 200 },
|
||||
{ field: "customerName", title: "客服名称", width: 150 },
|
||||
{ field: "customerId", title: "客服ID", width: 200 },
|
||||
{
|
||||
field: "status",
|
||||
title: "状态",
|
||||
width: 100,
|
||||
templet: function(d) {
|
||||
var statusMap = {
|
||||
0: '<span class="layui-badge">等待中</span>',
|
||||
1: '<span class="layui-badge layui-bg-green">进行中</span>',
|
||||
2: '<span class="layui-badge layui-bg-gray">已结束</span>'
|
||||
};
|
||||
return statusMap[d.status] || '-';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: "createTime",
|
||||
title: "创建时间",
|
||||
width: 180,
|
||||
templet: function(d) {
|
||||
return d.createTime ? formatTimestamp(d.createTime) : '-';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: "endTime",
|
||||
title: "结束时间",
|
||||
width: 180,
|
||||
templet: function(d) {
|
||||
return d.endTime ? formatTimestamp(d.endTime) : '-';
|
||||
}
|
||||
},
|
||||
{ width: 190, title: "操作", align: "center", fixed: "right", toolbar: "#table-conversation-admin" }
|
||||
]],
|
||||
text: "对不起，加载出现异常！",
|
||||
response: {
|
||||
statusName: 'code',
|
||||
statusCode: 0,
|
||||
msgName: 'info',
|
||||
countName: 'count',
|
||||
dataName: 'data'
|
||||
}
|
||||
});
|
||||
|
||||
// 监听工具条
|
||||
table.on("tool(LAY-conversation-manage)", function (e) {
|
||||
var l = e.data;
|
||||
|
||||
if ("chatlog" === e.event) {
|
||||
// 打开新页面查看聊天记录
|
||||
var url = 'customer/chatlog.html?conversationId=' + l.id + '&userName=' + encodeURIComponent(l.userName || '') + '&customerName=' + encodeURIComponent(l.customerName || '');
|
||||
window.location.hash = '/' + url;
|
||||
} else if ("delete" === e.event) {
|
||||
layer.confirm('确定删除该会话及全部聊天记录吗？此操作不可恢复。', function(index) {
|
||||
admin.req({
|
||||
method: 'delete',
|
||||
// 删除属于后台管理操作，必须走带鉴权的 AdminApi。
|
||||
url: setter.baseurl + 'adminapi/Customer/conversation/' + encodeURIComponent(l.id),
|
||||
done: function(res) {
|
||||
if (res.code === 0 || res.code === 200) {
|
||||
e.del();
|
||||
layer.close(index);
|
||||
layer.msg(res.info || '删除成功');
|
||||
table.reload('LAY-conversation-manage');
|
||||
} else {
|
||||
layer.msg(res.info || '删除失败');
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 时间戳格式化
|
||||
function formatTimestamp(timestamp) {
|
||||
if (!timestamp) return '-';
|
||||
var date = new Date(timestamp);
|
||||
var o = {
|
||||
'M+': date.getMonth() + 1,
|
||||
'd+': date.getDate(),
|
||||
'h+': date.getHours(),
|
||||
'm+': date.getMinutes(),
|
||||
's+': date.getSeconds()
|
||||
};
|
||||
var format = 'yyyy-MM-dd hh:mm:ss';
|
||||
if (/(y+)/.test(format)) {
|
||||
format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
|
||||
}
|
||||
for (var k in o) {
|
||||
if (new RegExp('(' + k + ')').test(format)) {
|
||||
format = format.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)));
|
||||
}
|
||||
}
|
||||
return format;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user