mirror of
http://112.124.100.131/ebiz-ai/ebiz-ai-knowledge-manage.git
synced 2025-12-10 03:16:49 +08:00
fix: 风筛记录优化
This commit is contained in:
陈昱达
@@ -1,6 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
@@ -15,6 +15,12 @@
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/json2/20160511/json2.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- IE8 兼容 polyfill -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.14/es5-shim.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.14/es5-sham.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
@@ -39,6 +45,12 @@
|
||||
font-size: 0; /* 消除 inline-block 间隙 */
|
||||
}
|
||||
|
||||
.tree-icon{
|
||||
width: 15px!important;
|
||||
height: 15px!important;
|
||||
margin-right: 10px;
|
||||
//height: 20px;
|
||||
}
|
||||
.left-nav {
|
||||
width: 20%;
|
||||
float: left;
|
||||
@@ -170,10 +182,20 @@
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* IE8兼容 */
|
||||
*font-family: 'iconfont';
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.tree-item-header {
|
||||
background: #fff!important;
|
||||
padding: 5px 20px;
|
||||
//background: #f0f4fa;
|
||||
margin: 5px 0;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
@@ -182,7 +204,8 @@
|
||||
color: #2c3e50;
|
||||
transition: background 0.3s;
|
||||
/* IE8兼容样式 */
|
||||
//*background: #e3e9f2;
|
||||
*zoom: 1; /* 触发IE hasLayout */
|
||||
*background: #fff;
|
||||
}
|
||||
|
||||
.tree-item-header:hover {
|
||||
@@ -193,18 +216,6 @@
|
||||
.tree-item-header::before{
|
||||
margin-right: 10px;
|
||||
}
|
||||
//.tree-item-header::before {
|
||||
// content: '\e61f';
|
||||
// margin-right: 10px;
|
||||
// transition: transform 0.3s;
|
||||
// /* IE8不支持::before伪元素和transform */
|
||||
//}
|
||||
//
|
||||
//.tree-item-header.expanded::before {
|
||||
// content: '\e61f';
|
||||
// /* IE8不支持 */
|
||||
//}
|
||||
|
||||
.result-container-item {
|
||||
padding: 0 10px;
|
||||
margin-bottom: 20px;
|
||||
@@ -333,13 +344,14 @@
|
||||
}
|
||||
|
||||
.png-icon {
|
||||
//float: left;
|
||||
//margin-top: 10px;
|
||||
vertical-align: middle;
|
||||
margin: -2px 10px 0 10px;
|
||||
outline: none;
|
||||
border: none;
|
||||
display: inline-block;
|
||||
/* IE8兼容 */
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
}
|
||||
//.empty-message:before {
|
||||
// content: 'ℹ';
|
||||
@@ -366,43 +378,6 @@
|
||||
cursor: pointer;
|
||||
width: 15px;
|
||||
}
|
||||
.dialog{
|
||||
position: absolute;
|
||||
width: 50%;
|
||||
height: 300px;
|
||||
background: #fff;
|
||||
left:25%;
|
||||
top:50%;
|
||||
margin-top: -150px;
|
||||
border: 1px solid #ccc;
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.2);
|
||||
}
|
||||
.dialog .title{
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
padding: 20px 30px;
|
||||
text-align: left;
|
||||
}
|
||||
.dialog textarea{
|
||||
text-align: left;
|
||||
width:90%;
|
||||
padding:10px;
|
||||
margin:10px;
|
||||
outline:none;
|
||||
left: 0;
|
||||
right:0;
|
||||
border:1px solid #ccc;
|
||||
height: 150px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.dialog-action{
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.dialog-action button{
|
||||
//height: 30px;
|
||||
outline:none;
|
||||
@@ -411,17 +386,163 @@
|
||||
border-radius: 5px;
|
||||
border: 1px solid #f0f4fa;
|
||||
}
|
||||
|
||||
/* 美化后的dialog样式 */
|
||||
.dialog {
|
||||
position: absolute;
|
||||
width: 50%;
|
||||
min-width: 300px;
|
||||
background: #fff;
|
||||
left: 25%;
|
||||
top: 50%;
|
||||
margin-top: -150px;
|
||||
border: 1px solid #ccc;
|
||||
text-align: center;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
|
||||
/* IE8兼容的阴影效果 */
|
||||
filter: progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction=135, Strength=5);
|
||||
z-index: 1000;
|
||||
font-family: 'Microsoft YaHei', Arial, sans-serif;
|
||||
/* IE8 居中对齐 */
|
||||
*left: 0;
|
||||
*top: 0;
|
||||
*margin-left: 25%;
|
||||
*margin-top: 100px;
|
||||
}
|
||||
|
||||
.dialog .title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding: 20px 30px;
|
||||
text-align: left;
|
||||
background: #f8f9fa;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-radius: 8px 8px 0 0;
|
||||
color: #2c3e50;
|
||||
position: relative;
|
||||
zoom: 1; /* 触发IE hasLayout */
|
||||
}
|
||||
|
||||
.dialog-close {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 50%;
|
||||
/* IE8兼容的垂直居中 */
|
||||
*top: 20px;
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
color: #aaa;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
/* IE8兼容方案 */
|
||||
*line-height: 24px;
|
||||
}
|
||||
|
||||
.dialog-close:hover {
|
||||
color: #333;
|
||||
background: #eee;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.dialog textarea {
|
||||
text-align: left;
|
||||
width: 90%;
|
||||
padding: 15px;
|
||||
margin: 20px 0;
|
||||
outline: none;
|
||||
border: 1px solid #ddd;
|
||||
height: 150px;
|
||||
border-radius: 4px;
|
||||
font-family: 'Microsoft YaHei', Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
resize: none;
|
||||
/* IE8 兼容 */
|
||||
*padding: 10px;
|
||||
*width: 85%;
|
||||
}
|
||||
|
||||
.dialog textarea:focus {
|
||||
border-color: #3498db;
|
||||
/* IE8 不支持 box-shadow */
|
||||
*border-color: #3498db;
|
||||
}
|
||||
|
||||
.dialog-action {
|
||||
text-align: right;
|
||||
padding: 0 20px 20px;
|
||||
zoom: 1; /* 触发IE hasLayout */
|
||||
}
|
||||
|
||||
.dialog-action button {
|
||||
padding: 8px 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #ddd;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
margin-left: 10px;
|
||||
/* IE8 兼容 */
|
||||
*padding: 5px 15px;
|
||||
*border: 1px solid #ccc;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.dialog-action button:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* IE8 不支持 :hover 伪类在非 a 标签上，但可以定义以防在支持的浏览器中使用 */
|
||||
.dialog-action button:hover {
|
||||
opacity: 0.9;
|
||||
/* IE8 不支持 opacity */
|
||||
*filter: alpha(opacity=90);
|
||||
}
|
||||
|
||||
.dialog-action button:last-child {
|
||||
background: #fff;
|
||||
color: #333;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
/* 遮罩层 */
|
||||
.dialog-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0.5);
|
||||
z-index: 999;
|
||||
display: none;
|
||||
/* IE8 兼容方案 */
|
||||
*position: absolute;
|
||||
*top: 0;
|
||||
*left: 0;
|
||||
*width: 100%;
|
||||
*height: 100%;
|
||||
*background: #000;
|
||||
*filter: alpha(opacity=50);
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<div class="no-js-warning">
|
||||
您的浏览器不支持JavaScript或已禁用JavaScript，请开启JavaScript以获得最佳体验。
|
||||
</div>
|
||||
</noscript>
|
||||
</noscript>
|
||||
|
||||
<!-- 注意：两个 div 写在同一行，避免 inline-block 空隙 -->
|
||||
<div class="main" id="main">
|
||||
<!-- 注意：两个 div 写在同一行，避免 inline-block 空隙 -->
|
||||
<div class="main" id="main">
|
||||
<div class="left-nav" id="leftNav">
|
||||
<div class="nav-header">历史风险筛查结果</div>
|
||||
<div class="nav-body" id="navBody">
|
||||
@@ -461,23 +582,25 @@
|
||||
</div>
|
||||
</div>
|
||||
<div style="clear: both"></div>
|
||||
</div>
|
||||
|
||||
<!-- 悬浮弹窗 -->
|
||||
<div class='dialog-overlay' id='dialogOverlay' onclick="closeDialog()"></div>
|
||||
<div class='dialog' id='commentDialog' style='display: none;'>
|
||||
<div class='title'>
|
||||
<span>查看评价</span>
|
||||
<button class="dialog-close" onclick="closeDialog()" type="button">×</button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- 悬浮弹窗-->
|
||||
<div class='dialog'>
|
||||
<div class='title'>查看评价</div>
|
||||
<textarea></textarea>
|
||||
<textarea id="commentText" placeholder="请输入您的评价..."></textarea>
|
||||
<div class='dialog-action'>
|
||||
<button style='background: #f0f4fa;margin-right: 20px;'>保存</button>
|
||||
<button style='background: #fff'>关闭</button>
|
||||
</div>
|
||||
<button style='background: #3498db; color: white; border: 1px solid #3498db;' onclick="saveComment()" type="button">保存</button>
|
||||
<button onclick="closeDialog()" type="button">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="ajax.js"></script>
|
||||
<script>
|
||||
<script src="ajax.js"></script>
|
||||
<script>
|
||||
var noNav = getQueryParam('noNav')
|
||||
var noPadding = getQueryParam('noPT')
|
||||
if (noPadding) {
|
||||
@@ -746,14 +869,28 @@
|
||||
}
|
||||
|
||||
var treeItem = document.createElement('div')
|
||||
treeItem.className = 'tree-item-header icon iconfont icon-youjiantou'
|
||||
treeItem.className = 'tree-item-header '
|
||||
// 添加降级样式
|
||||
treeItem.style.background = '#f0f4fa'
|
||||
treeItem.style.cursor = 'pointer'
|
||||
// treeItem.style.border = '1px solid #d6dde6'
|
||||
treeItem.innerHTML = resultDetail.typeName
|
||||
|
||||
// 创建img元素而不是使用innerHTML，提高IE8兼容性
|
||||
var treeIcon = document.createElement('img');
|
||||
treeIcon.src = './toRight.png';
|
||||
treeIcon.className = 'tree-icon';
|
||||
treeIcon.alt = '';
|
||||
// 为IE8添加特殊属性
|
||||
treeIcon.setAttribute('alt', '');
|
||||
treeIcon.style.verticalAlign = 'middle';
|
||||
treeIcon.style.marginRight = '10px';
|
||||
|
||||
var textNode = document.createTextNode(resultDetail.typeName
|
||||
? resultDetail.typeName
|
||||
: resultDetail.dictLabel
|
||||
: resultDetail.dictLabel);
|
||||
|
||||
treeItem.appendChild(treeIcon);
|
||||
treeItem.appendChild(textNode);
|
||||
|
||||
resultDom.appendChild(treeItem)
|
||||
|
||||
@@ -822,20 +959,21 @@
|
||||
resultDom.appendChild(resultContainer)
|
||||
|
||||
// 绑定点击事件展开/收起内容
|
||||
treeItem.onclick = (function(index, item) {
|
||||
treeItem.onclick = (function(index, item, iconElement) {
|
||||
return function() {
|
||||
var resultContainer = document.getElementById(
|
||||
'result-container-' + index
|
||||
)
|
||||
if (resultContainer.style.display === 'none') {
|
||||
resultContainer.style.display = 'block'
|
||||
this.className = 'tree-item-header expanded icon iconfont icon-xiala'
|
||||
// 使用setAttribute提高IE8兼容性
|
||||
iconElement.setAttribute('src', './toDown.png');
|
||||
} else {
|
||||
resultContainer.style.display = 'none'
|
||||
this.className = 'tree-item-header icon iconfont icon-youjiantou'
|
||||
iconElement.setAttribute('src', './toRight.png');
|
||||
}
|
||||
}
|
||||
})(ind, resultDetail)
|
||||
})(ind, resultDetail, treeIcon)
|
||||
|
||||
resultDom.style.minHeight = 30 * arrs.length + 'px'
|
||||
resultDom.style.overflowY = 'auto'
|
||||
@@ -854,8 +992,11 @@
|
||||
if (firstTreeItem && firstResultContainer) {
|
||||
// 显示第一个结果容器
|
||||
firstResultContainer.style.display = 'block'
|
||||
// 更新第一个树项的类名以显示展开状态
|
||||
firstTreeItem.className = 'tree-item-header expanded icon iconfont icon-xiala'
|
||||
// 更新第一个树项的图标为展开状态
|
||||
var firstIcon = firstTreeItem.getElementsByTagName('img')[0];
|
||||
if (firstIcon) {
|
||||
firstIcon.setAttribute('src', './toDown.png');
|
||||
}
|
||||
}
|
||||
}, 0)
|
||||
}
|
||||
@@ -868,6 +1009,44 @@
|
||||
}
|
||||
)
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
// 添加关闭对话框的函数
|
||||
function closeDialog() {
|
||||
document.getElementById('commentDialog').style.display = 'none';
|
||||
document.getElementById('dialogOverlay').style.display = 'none';
|
||||
}
|
||||
|
||||
// 添加保存评论的函数
|
||||
function saveComment() {
|
||||
var comment = document.getElementById('commentText').value;
|
||||
alert('评论已保存: ' + comment);
|
||||
closeDialog();
|
||||
}
|
||||
|
||||
// 显示对话框
|
||||
function showDialog() {
|
||||
document.getElementById('commentDialog').style.display = 'block';
|
||||
document.getElementById('dialogOverlay').style.display = 'block';
|
||||
}
|
||||
|
||||
// 页面加载完成后为按钮添加点击事件
|
||||
window.onload = function() {
|
||||
var buttons = document.querySelectorAll('.actions button');
|
||||
buttons[2].onclick = function() {
|
||||
showDialog();
|
||||
}
|
||||
}
|
||||
|
||||
// 添加错误处理函数
|
||||
function handleError(errorMsg, url, line) {
|
||||
console.log('Error occurred: ' + errorMsg + ' at ' + url + ':' + line)
|
||||
// 可以在这里添加用户友好的错误提示
|
||||
return true // 阻止浏览器默认的错误处理
|
||||
}
|
||||
|
||||
// 设置全局错误处理
|
||||
window.onerror = handleError
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
BIN
public/bpic_eli/toDown.png
Normal file
BIN
public/bpic_eli/toDown.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 370 B |
BIN
public/bpic_eli/toRight.png
Normal file
BIN
public/bpic_eli/toRight.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 337 B |
Reference in New Issue
Block a user