|
|
@@ -0,0 +1,439 @@
|
|
|
+<%@ page contentType="text/html;charset=UTF-8" %>
|
|
|
+<%@ include file="/webpage/include/taglib.jsp" %>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <title>确认最佳答案</title>
|
|
|
+ <%@ include file="/webpage/include/head.jsp" %>
|
|
|
+ <script type="text/javascript" src="${ctxStatic}/layui/layui.js"></script>
|
|
|
+ <link rel='stylesheet' type="text/css" href="${ctxStatic}/layui/css/layui.css"/>
|
|
|
+ <style>
|
|
|
+ .detail-label { font-weight: bold; color: #555; }
|
|
|
+ .detail-value { color: #333; word-break: break-all; }
|
|
|
+
|
|
|
+ /* 选择按钮样式 */
|
|
|
+ .select-best-btn {
|
|
|
+ padding: 5px 15px;
|
|
|
+ border: 1px solid #d9d9d9;
|
|
|
+ border-radius: 4px;
|
|
|
+ color: #666;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 13px;
|
|
|
+ transition: all 0.3s;
|
|
|
+ background: white;
|
|
|
+ }
|
|
|
+ .select-best-btn:hover {
|
|
|
+ color: #ff9800;
|
|
|
+ border-color: #ff9800;
|
|
|
+ }
|
|
|
+ .select-best-btn.selected {
|
|
|
+ background-color: #ff9800;
|
|
|
+ color: white;
|
|
|
+ border-color: #ff9800;
|
|
|
+ }
|
|
|
+ .footer-bar {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ background: white;
|
|
|
+ padding: 15px;
|
|
|
+ box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
|
|
|
+ text-align: center;
|
|
|
+ z-index: 999;
|
|
|
+ }
|
|
|
+ .selected-count {
|
|
|
+ color: #666;
|
|
|
+ margin-right: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .selected-count strong {
|
|
|
+ color: #52c41a;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+<div class="single-form">
|
|
|
+ <div class="container">
|
|
|
+ <form:form id="inputForm" modelAttribute="entity" action="" method="post" class="layui-form">
|
|
|
+ <input type="hidden" id="questionId" name="questionId" value="${entity.id}"/>
|
|
|
+
|
|
|
+ <!-- 问答答疑信息 -->
|
|
|
+ <div class="form-group layui-row">
|
|
|
+ <div class="form-group-label"><h2 style="display:inline-block;">问答答疑信息</h2></div>
|
|
|
+
|
|
|
+ <!-- 问题概述 -->
|
|
|
+ <div class="layui-item layui-col-sm6 lw6">
|
|
|
+ <label class="layui-form-label detail-label">问题概述:</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input type="text" class="form-control layui-input" value="${entity.name}" readonly="readonly"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 内容属性 -->
|
|
|
+ <div class="layui-item layui-col-sm6 lw6">
|
|
|
+ <label class="layui-form-label"><span class="require-item">*</span>内容属性:</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input type="radio" name="contentAttribute" disabled lay-filter="contentAttributeRadio" title="原创" value="0">
|
|
|
+ <input type="radio" name="contentAttribute" disabled lay-filter="contentAttributeRadio" title="转载" value="1">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 说明(富文本) -->
|
|
|
+ <div class="layui-item layui-col-sm12 lw6" style="padding-bottom: 20px;">
|
|
|
+ <label class="layui-form-label detail-label">说明:</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <div class="wrapForm">
|
|
|
+ <div class="mask">
|
|
|
+ <form:textarea path="questionDescription" disabled="true" htmlEscape="false" colspan="3" rows="6" class="form-control"/>
|
|
|
+ <sys:ckeditorView replace="questionDescription" uploadPath="/workKnowledgeBase/share"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 附件展示 -->
|
|
|
+ <c:if test="${not empty entity.workAttachments}">
|
|
|
+ <div class="form-group layui-row">
|
|
|
+ <div class="form-group-label"><h2>附件信息</h2></div>
|
|
|
+ <div class="layui-item layui-col-xs12" style="padding:0 16px;">
|
|
|
+ <table class="table table-bordered table-condensed details">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>文件预览</th>
|
|
|
+ <th>上传人</th>
|
|
|
+ <th>上传时间</th>
|
|
|
+ <th>文件大小(MB)</th>
|
|
|
+ <th>操作</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <c:forEach items="${entity.workAttachments}" var="attach">
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <c:choose>
|
|
|
+ <c:when test="${fn:containsIgnoreCase(attach.attachmentName,'jpg')
|
|
|
+ or fn:containsIgnoreCase(attach.attachmentName,'png')
|
|
|
+ or fn:containsIgnoreCase(attach.attachmentName,'gif')
|
|
|
+ or fn:containsIgnoreCase(attach.attachmentName,'jpeg')}">
|
|
|
+ <img src="${attach.temporaryUrl}" width="50" height="50"
|
|
|
+ onclick="openPreview('${attach.temporaryUrl}',5)"
|
|
|
+ alt="${attach.attachmentName}"/>
|
|
|
+ </c:when>
|
|
|
+ <c:when test="${fn:containsIgnoreCase(attach.attachmentName,'pdf')}">
|
|
|
+ <a class="attention-info" href="javascript:void(0)"
|
|
|
+ onclick="openPreview('${attach.temporaryUrl}',1)">${attach.attachmentName}</a>
|
|
|
+ </c:when>
|
|
|
+ <c:otherwise>
|
|
|
+ <a class="attention-info" href="javascript:void(0)"
|
|
|
+ onclick="openPreview('${attach.temporaryUrl}',2)">${attach.attachmentName}</a>
|
|
|
+ </c:otherwise>
|
|
|
+ </c:choose>
|
|
|
+ </td>
|
|
|
+ <td>${attach.createBy.name}</td>
|
|
|
+ <td><fmt:formatDate value="${attach.createDate}" type="both"/></td>
|
|
|
+ <td>${attach.fileSize}</td>
|
|
|
+ <td>
|
|
|
+ <a href="${attach.temporaryUrl}" class="op-btn op-btn-download">
|
|
|
+ <i class="fa fa-download"></i> 下载
|
|
|
+ </a>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </c:forEach>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </c:if>
|
|
|
+
|
|
|
+ <!-- 发表回答区域 -->
|
|
|
+ <div class="form-group layui-row">
|
|
|
+ <div class="form-group-label"><h2>发表回答</h2></div>
|
|
|
+ <div class="layui-item layui-col-xs12 with-textarea">
|
|
|
+ <div class="layui-input-block" style="margin-left:0px;position: relative">
|
|
|
+ <textarea id="answerContent" placeholder="请输入回答内容:" class="form-control required" rows="4" maxlength="2000"></textarea>
|
|
|
+ </div>
|
|
|
+ <div style="float: right;margin-right: 10%">
|
|
|
+ <br/>
|
|
|
+ <a href="javascript:void(0)" id="submitAnswerBtn" class="layui-btn" onclick="submitAnswer()">发表</a>
|
|
|
+ <a href="javascript:void(0)" id="resetAnswerBtn" class="layui-btn layui-btn-primary" onclick="resetAnswer()">清空</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 回答列表区域 -->
|
|
|
+ <div class="form-group layui-row">
|
|
|
+ <h2>全部回答(<span id="answerTotalCount">0</span>条)<span class="selected-count">最多可选择5条回复作为最佳答案。当前已选择 <strong id="selectedCount" style="font-weight:normal;">0</strong>/5 条</span></h2>
|
|
|
+ <hr>
|
|
|
+ <div id="answerListContainer"></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 底部操作栏 -->
|
|
|
+ <%--<div class="footer-bar">
|
|
|
+
|
|
|
+ <button type="button" class="layui-btn layui-btn-normal" id="submitBtn" onclick="doSubmit()" disabled>
|
|
|
+ <i class="fa fa-check"></i> 提交确认
|
|
|
+ </button>
|
|
|
+ <button type="button" class="layui-btn layui-btn-primary" onclick="closeWindow()">
|
|
|
+ <i class="fa fa-close"></i> 关 闭
|
|
|
+ </button>
|
|
|
+ </div>--%>
|
|
|
+ </form:form>
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+
|
|
|
+ <script src="${ctxStatic}/layer-v2.3/layui/layui.all.js" charset="utf-8"></script>
|
|
|
+ <script>
|
|
|
+ var questionId = '${entity.id}';
|
|
|
+ var currentUserId = '${fns:getUser().id}';
|
|
|
+ var questionCreatorId = '${entity.createBy.id}';
|
|
|
+ var selectedAnswers = [];
|
|
|
+
|
|
|
+ // 页面加载时获取回答列表
|
|
|
+ $(document).ready(function() {
|
|
|
+ loadAnswers();
|
|
|
+ });
|
|
|
+
|
|
|
+ /** 加载回答列表 */
|
|
|
+ function loadAnswers() {
|
|
|
+ $.ajax({
|
|
|
+ type: 'GET',
|
|
|
+ url: '${ctx}/workKnowledgeBase/share/getAnswers',
|
|
|
+ data: { questionId: questionId },
|
|
|
+ success: function(data) {
|
|
|
+ if (data.success && data.answers) {
|
|
|
+ renderAnswers(data.answers);
|
|
|
+ $('#answerTotalCount').text(data.answerCount);
|
|
|
+ } else {
|
|
|
+ $('#answerListContainer').html('<div style="padding:40px;text-align:center;color:#999;">暂无回答</div>');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function() {
|
|
|
+ $('#answerListContainer').html('<div style="padding:40px;text-align:center;color:red;">加载失败,请刷新重试</div>');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 渲染回答列表 */
|
|
|
+ function renderAnswers(answers) {
|
|
|
+ var html = '';
|
|
|
+ if (answers && answers.length > 0) {
|
|
|
+ for (var i = 0; i < answers.length; i++) {
|
|
|
+ var ans = answers[i];
|
|
|
+ html += renderAnswerItem(ans);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ html = '<div style="padding:40px;text-align:center;color:#999;">暂无回答</div>';
|
|
|
+ }
|
|
|
+ $('#answerListContainer').html(html);
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 渲染单个回答项(与详情页保持一致) */
|
|
|
+ function renderAnswerItem(ans) {
|
|
|
+ var isCreator = ans.createBy && ans.createBy.id == questionCreatorId;
|
|
|
+ var answerUserId = (ans.answerUser && ans.answerUser.id) || (ans.createBy && ans.createBy.id) || '';
|
|
|
+ var canDelete = currentUserId == answerUserId;
|
|
|
+
|
|
|
+ var html = '';
|
|
|
+
|
|
|
+ // 最佳答案使用特殊背景色突出显示
|
|
|
+ if (ans.isBestAnswer == 1) {
|
|
|
+ html += '<div class="layui-item layui-col-xs12" id="answer' + ans.id + '" style="padding:10px 0;background-color:#f6ffed;border-radius:5px;margin-bottom:10px;">';
|
|
|
+ } else {
|
|
|
+ html += '<div class="layui-item layui-col-xs12" id="answer' + ans.id + '" style="padding:10px 0;">';
|
|
|
+ }
|
|
|
+
|
|
|
+ // 用户名:淡蓝色、字体放大
|
|
|
+ html += '<span class="comment_name" style="color:#1E9FFF;font-size:16px;font-weight:500;">' + (ans.answerUserName || '未知') + '</span>';
|
|
|
+
|
|
|
+ // 如果是提问者,添加标识
|
|
|
+ if (isCreator) {
|
|
|
+ html += ' <span style="color:#1890ff;font-size:14px;">(提问者)</span>';
|
|
|
+ }
|
|
|
+
|
|
|
+ // 最佳答案标识
|
|
|
+ if (ans.isBestAnswer == 1) {
|
|
|
+ html += ' <span style="color:#52c41a;font-weight:bold;font-size:14px;">✓ 最佳答案</span>';
|
|
|
+ }
|
|
|
+
|
|
|
+ // 回答内容:缩进、行高加大
|
|
|
+ html += '<div class="comment_content" style="margin-left:25px;margin-top:8px;font-size:14px;line-height:1.8;color:#333;">' + (ans.answerContent || '') + '</div>';
|
|
|
+
|
|
|
+ // 底部信息:时间和操作按钮
|
|
|
+ html += '<div class="del" style="color:#999;font-size:12px;margin-top:5px;">';
|
|
|
+ html += '<span>' + (ans.createDate || '') + '</span>';
|
|
|
+
|
|
|
+ // 删除按钮(仅回答人可看到,最佳答案不能删除)
|
|
|
+ if (ans.isBestAnswer != 1 && canDelete) {
|
|
|
+ html += '<a href="javascript:void(0)" onclick="deleteAnswer(\'' + ans.id + '\')" style="float:right;margin-right:20px;color:#666;font-size:14px;font-weight:500;">删除</a>';
|
|
|
+ }
|
|
|
+
|
|
|
+ html += '</div>'; // 闭合 .del
|
|
|
+
|
|
|
+ // 选择按钮(非最佳答案才显示,放在右下方)
|
|
|
+ if (ans.isBestAnswer != 1) {
|
|
|
+ html += '<div style="text-align:right;margin-top:10px;">';
|
|
|
+ html += '<button type="button" class="select-best-btn" data-id="' + ans.id + '" onclick="toggleSelect(this)">选择为最佳答案</button>';
|
|
|
+ html += '</div>';
|
|
|
+ }
|
|
|
+
|
|
|
+ html += '<hr style="margin:15px 0;border:none;border-top:1px solid #eee;">';
|
|
|
+ html += '</div>'; // 闭合 .layui-item
|
|
|
+
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 切换选择状态 */
|
|
|
+ function toggleSelect(btn) {
|
|
|
+ var $btn = $(btn);
|
|
|
+ var answerId = $btn.attr('data-id');
|
|
|
+
|
|
|
+ if ($btn.hasClass('selected')) {
|
|
|
+ // 取消选择
|
|
|
+ $btn.removeClass('selected').text('选择为最佳答案');
|
|
|
+ selectedAnswers = selectedAnswers.filter(function(id) {
|
|
|
+ return id !== answerId;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ // 选择判定
|
|
|
+ if (selectedAnswers.length >= 5) {
|
|
|
+ layer.msg('最多只能选择5个最佳答案', {icon: 2});
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ $btn.addClass('selected').text('取消选择');
|
|
|
+ selectedAnswers.push(answerId);
|
|
|
+ }
|
|
|
+
|
|
|
+ updateUI();
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 更新界面状态 */
|
|
|
+ function updateUI() {
|
|
|
+ $('#selectedCount').text(selectedAnswers.length);
|
|
|
+
|
|
|
+ if (selectedAnswers.length > 0) {
|
|
|
+ $('#submitBtn').prop('disabled', false).removeClass('layui-btn-disabled');
|
|
|
+ } else {
|
|
|
+ $('#submitBtn').prop('disabled', true).addClass('layui-btn-disabled');
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 提交回答 */
|
|
|
+ function submitAnswer() {
|
|
|
+ var content = $('#answerContent').val().trim();
|
|
|
+ if (!content) {
|
|
|
+ layer.msg('请输入回答内容', {icon: 2});
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ $.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: '${ctx}/workKnowledgeBase/share/submitAnswer',
|
|
|
+ data: {
|
|
|
+ questionId: questionId,
|
|
|
+ answerContent: content
|
|
|
+ },
|
|
|
+ success: function(data) {
|
|
|
+ if (data.success) {
|
|
|
+ layer.msg('回答提交成功', {icon: 1});
|
|
|
+ $('#answerContent').val('');
|
|
|
+ loadAnswers(); // 刷新列表
|
|
|
+ } else {
|
|
|
+ layer.msg(data.message || '回答失败', {icon: 2});
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function() {
|
|
|
+ layer.msg('请求失败,请重试', {icon: 2});
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 清空回答 */
|
|
|
+ function resetAnswer() {
|
|
|
+ $('#answerContent').val('');
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 删除回答 */
|
|
|
+ function deleteAnswer(answerId) {
|
|
|
+ layer.confirm('确认删除此回答吗?', {
|
|
|
+ icon: 3,
|
|
|
+ title: '删除提示'
|
|
|
+ }, function(index){
|
|
|
+ $.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: '${ctx}/workKnowledgeBase/share/deleteAnswer',
|
|
|
+ data: {
|
|
|
+ answerId: answerId
|
|
|
+ },
|
|
|
+ success: function(data) {
|
|
|
+ if (data.success) {
|
|
|
+ layer.msg('删除成功', {icon: 1});
|
|
|
+ layer.close(index);
|
|
|
+ loadAnswers(); // 刷新列表
|
|
|
+ } else {
|
|
|
+ layer.msg(data.message || '删除失败', {icon: 2});
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function() {
|
|
|
+ layer.msg('请求失败,请重试', {icon: 2});
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 提交确认最佳答案 */
|
|
|
+ function doSubmit() {
|
|
|
+ // 验证至少选择1条
|
|
|
+ if (selectedAnswers.length === 0) {
|
|
|
+ layer.msg('请至少选择一个答案', {icon: 2});
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 创建隐藏字段并添加到表单中
|
|
|
+ var form = $('#inputForm');
|
|
|
+
|
|
|
+ // 移除旧的answerIds字段(如果存在)
|
|
|
+ form.find('input[name="answerIds"]').remove();
|
|
|
+
|
|
|
+
|
|
|
+ // 为每个选中的答案ID创建隐藏字段
|
|
|
+ for (var i = 0; i < selectedAnswers.length; i++) {
|
|
|
+ form.append('<input type="hidden" name="answerIds" value="' + selectedAnswers[i] + '"/>');
|
|
|
+ }
|
|
|
+
|
|
|
+ // 设置表单action和method
|
|
|
+ form.attr('action', '${ctx}/workKnowledgeBase/share/confirmMultipleBestAnswers');
|
|
|
+ form.attr('method', 'POST');
|
|
|
+
|
|
|
+ // 设置 target 为 _self,让 redirect 结果只在弹窗 iframe 内加载,不影响父页面
|
|
|
+ form.attr('target', '_self');
|
|
|
+ form.submit();
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 暴露给父窗口调用 */
|
|
|
+ window.doSubmit = doSubmit;
|
|
|
+
|
|
|
+ /** 关闭窗口 */
|
|
|
+ function closeWindow() {
|
|
|
+ var index = parent.layer.getFrameIndex(window.name);
|
|
|
+ parent.layer.close(index);
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 打开预览 */
|
|
|
+ function openPreview(url, type) {
|
|
|
+ if (type == 1) { // PDF
|
|
|
+ window.open(url);
|
|
|
+ } else if (type == 2) { // Word/Excel
|
|
|
+ window.open(url);
|
|
|
+ } else if (type == 5) { // 图片
|
|
|
+ top.layer.photos({
|
|
|
+ photos: {data: [{src: url}]},
|
|
|
+ anim: 5
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|