SwtTt29
/
web-follow
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Labels Milestones
New Pull Request

ly #5

Merged
ly merged 3 commits from ly into KH 2 months ago
Conversation 0 Commits 3 Files Changed 1
1 changed files with 303 additions and 6 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 309
      web/src/main/resources/static/index.html

309
web/src/main/resources/static/index.html
View File

@ -700,6 +700,7 @@
var managersList = [];
var allPersonalData = [];
var allPublicData = [];
var isLoadingAllData = false;
var currentManagerFilter = null;
var currentFilterTable = 'personal';
@ -949,7 +950,7 @@
// 只对管理员显示负责人信息
if (userRole === '管理员') {
managerCell = '<td style="cursor: pointer;">' + (user.managerName || '-') + '</td>';
managerCell = '<td onclick="showManagerDropdown(event, this, \'' + (user.managerName || '-') + '\')" style="cursor: pointer; position: relative;">' + (user.managerName || '-') + '</td>';
} else {
managerCell = '<td style="display: none;"></td>';
}
@ -976,7 +977,7 @@
'<td>' + (user.followup || '-') + '</td>' +
'<td>' + responseTime + '</td>' +
managerCell +
'<td><button onclick="openFollowupModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #1890ff; color: white; border: none; border-radius: 4px; font-size: 12px;">跟进</button> <button onclick="openReturnModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\', \'' + (user.type || '') + '\')" style="padding: 4px 8px; background-color: #faad14; color: white; border: none; border-radius: 4px; font-size: 12px;">归还</button> ' + jianDaoYunButton + '</td>' +
'<td><button onclick="openDetailModal(\'' + (user.userId || '') + '\')" style="padding: 4px 8px; background-color: #13c2c2; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">详情</button><button onclick="openFollowupModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #1890ff; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">跟进</button> <button onclick="openReturnModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\', \'' + (user.type || '') + '\')" style="padding: 4px 8px; background-color: #faad14; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">归还</button> ' + jianDaoYunButton + '</td>' +
'</tr>';
personalBody.innerHTML += row;
@ -1132,6 +1133,114 @@
});
}
function showManagerDropdown(event, cell, managerName) {
// 防止事件冒泡
event.stopPropagation();
// 移除已存在的下拉菜单
var existingDropdown = document.getElementById('managerDropdown');
if (existingDropdown) {
existingDropdown.remove();
}
// 创建下拉菜单
var dropdown = document.createElement('div');
dropdown.id = 'managerDropdown';
dropdown.style.cssText = `
position: absolute;
background-color: white;
border: 1px solid #d9d9d9;
border-radius: 4px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
z-index: 1001;
padding: 8px 0;
min-width: 150px;
max-height: 200px;
overflow-y: auto;
`;
// 添加查看详情选项
var detailOption = document.createElement('div');
detailOption.textContent = '查看详情';
detailOption.style.cssText = `
padding: 8px 16px;
cursor: pointer;
font-size: 14px;
`;
detailOption.onmouseover = function() {
this.style.backgroundColor = '#f5f5f5';
};
detailOption.onmouseout = function() {
this.style.backgroundColor = 'white';
};
detailOption.onclick = function() {
// 这里可以添加查看负责人详情的逻辑
showAlert('查看负责人：' + managerName + ' 的详情');
dropdown.remove();
};
dropdown.appendChild(detailOption);
// 添加筛选此负责人选项
var filterOption = document.createElement('div');
filterOption.textContent = '筛选此负责人';
filterOption.style.cssText = `
padding: 8px 16px;
cursor: pointer;
font-size: 14px;
`;
filterOption.onmouseover = function() {
this.style.backgroundColor = '#f5f5f5';
};
filterOption.onmouseout = function() {
this.style.backgroundColor = 'white';
};
filterOption.onclick = function() {
currentManagerFilter = managerName;
applyManagerFilter();
dropdown.remove();
};
dropdown.appendChild(filterOption);
// 添加清除筛选选项
var clearOption = document.createElement('div');
clearOption.textContent = '清除筛选';
clearOption.style.cssText = `
padding: 8px 16px;
cursor: pointer;
font-size: 14px;
`;
clearOption.onmouseover = function() {
this.style.backgroundColor = '#f5f5f5';
};
clearOption.onmouseout = function() {
this.style.backgroundColor = 'white';
};
clearOption.onclick = function() {
currentManagerFilter = null;
applyManagerFilter();
dropdown.remove();
};
dropdown.appendChild(clearOption);
// 获取单元格位置并显示菜单
var rect = cell.getBoundingClientRect();
var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
dropdown.style.left = (rect.left + scrollLeft) + 'px';
dropdown.style.top = (rect.top + rect.height + scrollTop) + 'px';
// 添加到页面
document.body.appendChild(dropdown);
// 点击页面其他地方关闭菜单
document.addEventListener('click', function closeDropdown(event) {
if (!dropdown.contains(event.target) && event.target !== cell) {
dropdown.remove();
}
});
}
function applyManagerFilter() {
if (currentFilterTable === 'personal') {
// 个人表格筛选
@ -1442,6 +1551,10 @@
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var data = JSON.parse(xhr.responseText);
// 保存公海池数据到全局变量
if (data.users) {
allPublicData = data.users;
}
displayPublicData(data);
renderPublicPagination(data.page, data.pages);
}
@ -1839,6 +1952,104 @@
</div>
`;
// 详情弹窗HTML
var detailModalHTML = `
<div id="detailModal" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); display: none; z-index: 1000; animation: fadeIn 0.3s ease;">
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; padding: 24px; border-radius: 8px; width: 600px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); animation: slideIn 0.3s ease; max-height: 90vh; overflow-y: auto;">
<h3 style="margin: 0 0 20px 0; font-size: 18px; font-weight: 600; color: #333; text-align: center;">客户详情</h3>
<div style="margin-bottom: 24px;">
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户ID：</span>
<span id="detailUserId" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户名称：</span>
<span id="detailUserName" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">电话号码：</span>
<span id="detailPhone" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户类型：</span>
<span id="detailType" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">创建时间：</span>
<span id="detailCreatedAt" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">跟进内容：</span>
<span id="detailFollowup" style="font-size: 14px; color: #333; max-width: 400px; text-align: right;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">响应时间：</span>
<span id="detailResponseTime" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">负责人：</span>
<span id="detailManagerName" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">简道云状态：</span>
<span id="detailSyncStatus" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户等级：</span>
<span id="detailLevel" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户地区：</span>
<span id="detailRegion" style="font-size: 14px; color: #333;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">详细地址：</span>
<span id="detailDetailedAddress" style="font-size: 14px; color: #333; max-width: 400px; text-align: right;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户公司：</span>
<span id="detailCompany" style="font-size: 14px; color: #333; max-width: 400px; text-align: right;"></span>
</div>
</div>
<div style="margin-bottom: 16px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
<span style="font-size: 14px; font-weight: 500; color: #666;">客户需求：</span>
<span id="detailDemand" style="font-size: 14px; color: #333;"></span>
</div>
</div>
</div>
<div style="text-align: center; margin-top: 24px;">
<button onclick="closeDetailModal()" style="padding: 10px 24px; border: none; border-radius: 4px; font-size: 14px; color: white; background-color: #1890ff; cursor: pointer; transition: all 0.3s ease;">关闭</button>
</div>
</div>
</div>
`;
// 分配弹窗HTML
var assignModalHTML = `
<div id="assignModal" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); display: none; z-index: 1000; animation: fadeIn 0.3s ease;">
@ -1918,6 +2129,7 @@
document.body.insertAdjacentHTML('beforeend', followupModalHTML);
document.body.insertAdjacentHTML('beforeend', returnModalHTML);
document.body.insertAdjacentHTML('beforeend', jianDaoYunModalHTML);
document.body.insertAdjacentHTML('beforeend', detailModalHTML);
document.body.insertAdjacentHTML('beforeend', assignModalHTML);
document.body.insertAdjacentHTML('beforeend', alertModalHTML);
document.body.insertAdjacentHTML('beforeend', typeHelpModalHTML);
@ -1942,6 +2154,8 @@
closeAssignModal();
} else if (modalId === 'typeHelpModal') {
closeTypeHelpModal();
} else if (modalId === 'detailModal') {
closeDetailModal();
}
}
});
@ -1955,6 +2169,7 @@
addModalOutsideClose('alertModal');
addModalOutsideClose('assignModal');
addModalOutsideClose('typeHelpModal');
addModalOutsideClose('detailModal');
function showTypeHelp() {
document.getElementById('typeHelpModal').style.display = 'block';
@ -2079,6 +2294,17 @@
return typeMap[type] || type;
}
function mapUserLevel(level) {
var levelMap = {
'important': 'A-重要客户',
'ordinary': 'B-普通客户',
'low_value': 'C-低价值客户',
'logistics': 'D-物流自提客户',
'unclassified': '-'
};
return levelMap[level] || level;
}
function calculateResponseTime(createdAt, followupAt) {
if (!createdAt || !followupAt) return '-';
var createTime = new Date(createdAt);
@ -2190,7 +2416,7 @@
// 只对管理员显示负责人信息
if (userRole === '管理员') {
managerCell = '<td style="cursor: pointer;">' + (user.managerName || '-') + '</td>';
managerCell = '<td onclick="showManagerDropdown(event, this, \'' + (user.managerName || '-') + '\')" style="cursor: pointer; position: relative;">' + (user.managerName || '-') + '</td>';
} else {
managerCell = '<td style="display: none;"></td>';
}
@ -2217,7 +2443,7 @@
'<td>' + (user.followup || '-') + '</td>' +
'<td>' + responseTime + '</td>' +
managerCell +
'<td><button onclick="openFollowupModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #1890ff; color: white; border: none; border-radius: 4px; font-size: 12px;">跟进</button> <button onclick="openReturnModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\', \'' + (user.type || '') + '\')" style="padding: 4px 8px; background-color: #faad14; color: white; border: none; border-radius: 4px; font-size: 12px;">归还</button> ' + jianDaoYunButton + '</td>' +
'<td><button onclick="openDetailModal(\'' + (user.userId || '') + '\')" style="padding: 4px 8px; background-color: #13c2c2; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">详情</button><button onclick="openFollowupModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #1890ff; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">跟进</button> <button onclick="openReturnModal(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\', \'' + (user.type || '') + '\')" style="padding: 4px 8px; background-color: #faad14; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">归还</button> ' + jianDaoYunButton + '</td>' +
'</tr>';
personalBody.innerHTML += row;
@ -2286,7 +2512,7 @@
// 只对管理员显示负责人信息
if (userRole === '管理员') {
managerCell = '<td>' + (user.managerName || '-') + '</td>';
managerCell = '<td onclick="showManagerDropdown(event, this, \'' + (user.managerName || '-') + '\')" style="cursor: pointer; position: relative;">' + (user.managerName || '-') + '</td>';
} else {
managerCell = '<td style="display: none;"></td>';
}
@ -2300,7 +2526,7 @@
'<td>' + (user.followup || '-') + '</td>' +
'<td>' + responseTime + '</td>' +
managerCell +
'<td><button onclick="claimCustomer(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #52c41a; color: white; border: none; border-radius: 4px; font-size: 12px;">认领</button></td>' +
'<td><button onclick="openDetailModal(\'' + (user.userId || '') + '\')" style="padding: 4px 8px; background-color: #13c2c2; color: white; border: none; border-radius: 4px; font-size: 12px; margin-right: 4px;">详情</button><button onclick="claimCustomer(\'' + (user.userId || '') + '\', \'' + (user.nickName || '') + '\', \'' + (user.phoneNumber || '') + '\')" style="padding: 4px 8px; background-color: #52c41a; color: white; border: none; border-radius: 4px; font-size: 12px;">认领</button></td>' +
'</tr>';
publicBody.innerHTML += row;
@ -2497,6 +2723,77 @@
document.body.style.overflow = 'auto';
}
function openDetailModal(userId) {
// 根据userId查找用户数据
var user = null;
// 首先在个人数据中查找
if (allPersonalData.length > 0) {
for (var i = 0; i < allPersonalData.length; i++) {
if (allPersonalData[i].userId === userId) {
user = allPersonalData[i];
break;
}
}
}
// 如果在个人数据中找不到，尝试在公海池数据中查找
if (!user && allPublicData.length > 0) {
for (var i = 0; i < allPublicData.length; i++) {
if (allPublicData[i].userId === userId) {
user = allPublicData[i];
break;
}
}
}
if (!user) {
// 如果在所有数据源中都找不到
showAlert('未找到该客户数据');
return;
}
// 填充客户详情数据
document.getElementById('detailUserId').textContent = user.userId || '-';
document.getElementById('detailUserName').textContent = user.nickName || '-';
document.getElementById('detailPhone').textContent = user.phoneNumber || '-';
document.getElementById('detailType').textContent = mapUserType(user.type) || '-';
document.getElementById('detailCreatedAt').textContent = formatDateTime(user.created_at) || '-';
document.getElementById('detailFollowup').textContent = user.followup || '-';
var responseTime = calculateResponseTime(user.created_at, user.followup_at);
document.getElementById('detailResponseTime').textContent = responseTime;
document.getElementById('detailManagerName').textContent = user.managerName || '-';
// 显示简道云状态
var syncStatus = '';
if (user.sync_statuss === 0 || user.sync_statuss === 1) {
syncStatus = '已写入简道云';
} else {
syncStatus = '未写入简道云';
}
document.getElementById('detailSyncStatus').textContent = syncStatus;
// 显示其他可能的字段
document.getElementById('detailLevel').textContent = mapUserLevel(user.level) || '-';
document.getElementById('detailRegion').textContent = user.region || '-';
document.getElementById('detailDetailedAddress').textContent = user.detailedaddress || '-';
document.getElementById('detailCompany').textContent = user.company || '-';
document.getElementById('detailDemand').textContent = user.demand || '-';
// 显示弹窗
document.getElementById('detailModal').style.display = 'block';
// 防止背景滚动
document.body.style.overflow = 'hidden';
}
function closeDetailModal() {
document.getElementById('detailModal').style.display = 'none';
// 恢复背景滚动
document.body.style.overflow = 'auto';
}
function saveJianDaoYun() {
var userId = document.getElementById('jianDaoYunUserId').value;
var usersManagements = userInfo.usersManagements;

Write Preview
Loading…
Cancel
Save