meteteme/projectmanager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化界面

Browse Source
This commit is contained in:
李志强 2025-07-02 17:50:40 +08:00
parent 7937db5733
commit 63e6365337
1 changed files with 248 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

160
app/workorder/view/index/edit.html
View File

@ -271,33 +271,43 @@
if (res.code === 0 && Array.isArray(res.data)) {
res.data.forEach(function (msg) {
var who = '';
var color = '';
var labelClass = '';
var avatarClass = '';
var avatarText = '';
var userMsgClass = 'user-message';
if (msg.msgby == 1) {
who = '客户留言';
color = '#409eff';
labelClass = 'msgby-customer';
avatarClass = 'avatar msgby-customer';
avatarText = '客';
// 客户留言不加 platform 类
} else if (msg.msgby == 0) {
who = '平台回复';
color = '#67c23a';
labelClass = 'msgby-platform';
avatarClass = 'avatar msgby-platform';
avatarText = '平';
userMsgClass += ' platform'; // 平台回复加 platform 类
} else {
who = '未知';
color = '#aaa';
labelClass = '';
avatarClass = 'avatar';
avatarText = '?';
}
html += '<div class="user-message" style="margin-bottom:10px;padding:10px;border-bottom:1px solid #eee;">';
html += '<div><span class="msgby-label ' + labelClass + '">[' + who + ']</span> <strong>时间：</strong>' + (msg.create_time || '') + '</div>';
html += '<div><strong>内容：</strong>' + (msg.content || '') + '</div>';
// 客户留言下方加回复按钮
html += '<div class="' + userMsgClass + '">';
html += '<div class="msg-main">';
html += '<div><span class="msgby-label ' + labelClass + '">[' + who + ']</span>';
html += '<span class="msg-time">' + (msg.create_time || '') + '</span></div>';
html += '<div class="msg-content">' + (msg.content || '') + '</div>';
html += '<div class="msg-actions">';
if (msg.msgby == 1) {
html += '<div style="margin-top:8px;"><button type="button" class="layui-btn layui-btn-xs reply-btn" data-msgid="' + msg.msg_id + '" data-orderid="' + msg.order_id + '">回复</button></div>';
html += '<button type="button" class="layui-btn layui-btn-xs reply-btn" data-msgid="' + msg.msg_id + '" data-orderid="' + msg.order_id + '">回复</button>';
}
// 平台回复下方加删除按钮
if (msg.msgby == 0) {
html += '<div style="margin-top:8px;"><button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete-btn" data-msgid="' + msg.msg_id + '" data-orderid="' + msg.order_id + '">删除</button></div>';
html += '<button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete-btn" data-msgid="' + msg.msg_id + '" data-orderid="' + msg.order_id + '">删除</button>';
}
html += '</div>';
html += '</div>';
html += '</div>';
});
}
if (!html) html = '<div style="color:#888;">暂无沟通信息</div>';
@ -429,13 +439,13 @@
.yhgt-content,
.wtbz {
padding: 15px;
background-color: #f5f5f5;
background-color: #f8fafc;
}
.wtjs-box h4,
.yhgt-box h4 {
margin-bottom: 15px;
border-bottom: 1px solid #949494;
border-bottom: 1px solid #ddd;
padding-bottom: 15px;
color: #4b4b4b;
}
@ -457,4 +467,128 @@
background: #f0f9eb;
color: #67c23a;
}
/* 留言区整体背景 */
.yhgt-content {
background: #f8fafc;
border-radius: 10px;
padding: 24px;
min-height: 120px;
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
/* 单条留言卡片 */
.user-message {
display: flex;
align-items: flex-start;
gap: 16px;
background: #fff;
border-radius: 8px;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
padding: 16px 20px;
margin-bottom: 18px;
border: none;
position: relative;
transition: box-shadow 0.2s;
}
.user-message:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.10);
}
/* 气泡箭头 */
.user-message::before {
content: "";
display: block;
position: absolute;
left: -8px;
top: 24px;
width: 0;
height: 0;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-right: 8px solid #fff;
}
/* 平台回复三角标在右 */
.user-message.platform {
flex-direction: row-reverse;
}
.user-message.platform::before {
left: auto;
right: -8px;
border-right: none;
border-left: 8px solid #fff;
}
.user-message.platform .avatar {
background: #f0f9eb;
color: #67c23a;
box-shadow: 0 1px 4px rgba(103,194,58,0.08);
}
/* 客户留言和平台回复头像 */
.user-message .avatar {
width: 38px;
height: 38px;
border-radius: 50%;
background: #e6f7ff;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
color: #409eff;
font-weight: bold;
flex-shrink: 0;
box-shadow: 0 1px 4px rgba(64,158,255,0.08);
}
.user-message .msgby-platform.avatar {
background: #f0f9eb;
color: #67c23a;
box-shadow: 0 1px 4px rgba(103,194,58,0.08);
}
/* 留言内容主体 */
.user-message .msg-main {
flex: 1;
}
.user-message .msgby-label {
font-size: 13px;
font-weight: 500;
margin-right: 8px;
padding: 2px 10px;
border-radius: 12px;
vertical-align: middle;
}
.user-message .msgby-customer {
background: #e6f7ff;
color: #409eff;
}
.user-message .msgby-platform {
background: #f0f9eb;
color: #67c23a;
}
.user-message .msg-time {
color: #999;
font-size: 12px;
margin-bottom: 4px;
}
.user-message .msg-content {
font-size: 15px;
color: #333;
margin-bottom: 6px;
line-height: 1.7;
padding: 20px;
padding-left: 0;
}
/* 按钮区 */
.user-message .msg-actions {
margin-top: 8px;
}
.user-message .layui-btn-xs {
padding: 0 10px;
font-size: 12px;
}
.layui-td-gray, .layui-td-gray-2, .layui-td-gray-3, .layui-td-gray-4{
background-color:#f8fafc ;
}
</style>