104 lines
3.6 KiB
HTML
104 lines
3.6 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="zh-CN">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>测试修改版岗位</title>
|
|||
|
|
<style>
|
|||
|
|
body { font-family: Arial, sans-serif; padding: 20px; }
|
|||
|
|
.container { max-width: 800px; margin: 0 auto; }
|
|||
|
|
h2 { color: #333; }
|
|||
|
|
.position-list { list-style: none; padding: 0; }
|
|||
|
|
.position-item {
|
|||
|
|
padding: 10px;
|
|||
|
|
margin: 5px 0;
|
|||
|
|
background: #f5f5f5;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
.modified {
|
|||
|
|
background: #e7f5ff;
|
|||
|
|
border-left: 4px solid #1890ff;
|
|||
|
|
}
|
|||
|
|
.modified::after {
|
|||
|
|
content: " ✓ 有修改版";
|
|||
|
|
color: #1890ff;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
.group-title {
|
|||
|
|
font-size: 18px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
color: #1890ff;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="container">
|
|||
|
|
<h1>化工岗位修改版标记测试</h1>
|
|||
|
|
<p>以下10个岗位应该显示修改标记：</p>
|
|||
|
|
|
|||
|
|
<div id="positions"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
const modifiedPositions = [
|
|||
|
|
"EHS安全工程师",
|
|||
|
|
"EHS专员",
|
|||
|
|
"EHS安全工程师助理",
|
|||
|
|
"化工体系审核员",
|
|||
|
|
"ISO体系专员",
|
|||
|
|
"化工仪表技术员",
|
|||
|
|
"自动化仪表工程师",
|
|||
|
|
"化工质量工程师",
|
|||
|
|
"质量控制专员",
|
|||
|
|
"化工DCS操作员"
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
const allPositions = {
|
|||
|
|
"化工安全": ["化工安全工程师", "化工安全员", "EHS安全工程师", "EHS专员", "化工实验员", "EHS安全工程师助理"],
|
|||
|
|
"化工体系管理": ["化工体系审核员", "ISO体系专员"],
|
|||
|
|
"化工仪表自动化": ["化工仪表技术员", "自动化仪表工程师", "化工仪表工程师"],
|
|||
|
|
"化工质量管理": ["化工质量工程师", "质量控制专员"],
|
|||
|
|
"化工自动化": ["化工DCS操作员", "自动化控制工程师"]
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const container = document.getElementById('positions');
|
|||
|
|
|
|||
|
|
for (const [group, positions] of Object.entries(allPositions)) {
|
|||
|
|
const groupDiv = document.createElement('div');
|
|||
|
|
groupDiv.innerHTML = `<div class="group-title">${group}</div>`;
|
|||
|
|
|
|||
|
|
const list = document.createElement('ul');
|
|||
|
|
list.className = 'position-list';
|
|||
|
|
|
|||
|
|
positions.forEach(position => {
|
|||
|
|
const item = document.createElement('li');
|
|||
|
|
item.className = 'position-item';
|
|||
|
|
if (modifiedPositions.includes(position)) {
|
|||
|
|
item.className += ' modified';
|
|||
|
|
}
|
|||
|
|
item.textContent = position;
|
|||
|
|
list.appendChild(item);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
groupDiv.appendChild(list);
|
|||
|
|
container.appendChild(groupDiv);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 统计
|
|||
|
|
const modifiedCount = document.querySelectorAll('.modified').length;
|
|||
|
|
const summary = document.createElement('div');
|
|||
|
|
summary.style.marginTop = '30px';
|
|||
|
|
summary.style.padding = '15px';
|
|||
|
|
summary.style.background = '#f0f0f0';
|
|||
|
|
summary.style.borderRadius = '5px';
|
|||
|
|
summary.innerHTML = `
|
|||
|
|
<h3>统计结果：</h3>
|
|||
|
|
<p>共有 ${modifiedCount} 个岗位显示修改标记</p>
|
|||
|
|
<p>预期应该有 ${modifiedPositions.length} 个岗位有修改版</p>
|
|||
|
|
<p>状态：${modifiedCount === modifiedPositions.length ? '✅ 正确' : '❌ 不正确'}</p>
|
|||
|
|
`;
|
|||
|
|
container.appendChild(summary);
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|