feat: 文章属性前端完成 — Phase 3
- 写文章页:可见性/类型/转载来源/创作声明/禁止转载 属性表单 - 类型切换联动(转载显示来源,原创显示禁止转载复选框) - 文章详情页:私密角标、置顶标记、创作声明横幅、转载来源 - 管理后台:置顶/取消置顶操作按钮 - PostService Create/Update 签名扩展接受文章属性 - DTO/接口同步更新
This commit is contained in:
@ -1374,3 +1374,39 @@
|
||||
margin-top: 2px;
|
||||
padding-top: 6px;
|
||||
}
|
||||
|
||||
/* --- 文章属性声明 --- */
|
||||
.post-declarations {
|
||||
margin-top: 10px;
|
||||
padding: 10px 14px;
|
||||
background: #fffbeb;
|
||||
border: 1px solid #fde68a;
|
||||
border-radius: 6px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.post-declaration-item {
|
||||
font-size: 13px;
|
||||
color: #92400e;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.post-badge {
|
||||
display: inline-block;
|
||||
padding: 1px 8px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.post-badge-private {
|
||||
background: #f3f4f6;
|
||||
color: #6b7280;
|
||||
}
|
||||
|
||||
.post-badge-pinned {
|
||||
background: #dbeafe;
|
||||
color: #1d4ed8;
|
||||
}
|
||||
|
||||
@ -759,3 +759,48 @@
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Editor Meta (文章属性) --- */
|
||||
.editor-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 24px;
|
||||
padding: 10px 16px;
|
||||
background: #f9fafb;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.meta-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.meta-label {
|
||||
font-weight: 600;
|
||||
color: #374151;
|
||||
min-width: 40px;
|
||||
}
|
||||
|
||||
.meta-radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
cursor: pointer;
|
||||
color: #4b5563;
|
||||
}
|
||||
|
||||
.meta-radio input[type="radio"] {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.meta-checkbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
cursor: pointer;
|
||||
color: #4b5563;
|
||||
}
|
||||
|
||||
@ -98,6 +98,16 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
document.getElementById('postForm')?.addEventListener('submit', handleSubmit)
|
||||
|
||||
// 类型切换联动:转载→显示来源,原创→显示禁止转载
|
||||
const typeRadios = document.querySelectorAll('input[name="post_type"]')
|
||||
const reprintSourceArea = document.getElementById('reprintSourceArea')
|
||||
const reprintProhibitArea = document.getElementById('reprintProhibitArea')
|
||||
typeRadios.forEach(r => r.addEventListener('change', () => {
|
||||
const isReprint = document.querySelector('input[name="post_type"]:checked')?.value === 'reprint'
|
||||
if (reprintSourceArea) reprintSourceArea.style.display = isReprint ? '' : 'none'
|
||||
if (reprintProhibitArea) reprintProhibitArea.style.display = isReprint ? 'none' : ''
|
||||
}))
|
||||
|
||||
if (!isLocked) {
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if ((e.ctrlKey || e.metaKey) && e.key === 's') {
|
||||
@ -174,6 +184,13 @@ async function handleSubmit(e) {
|
||||
const body = vditor ? vditor.getValue() : ''
|
||||
if (!body.trim()) { showToast('请输入正文', 'warning'); return }
|
||||
|
||||
// 读取文章属性
|
||||
const visibility = document.querySelector('input[name="visibility"]:checked')?.value || 'public'
|
||||
const postType = document.querySelector('input[name="post_type"]:checked')?.value || 'original'
|
||||
const reprintSource = document.getElementById('reprintSource')?.value.trim() || ''
|
||||
const declaration = document.getElementById('declaration')?.value || ''
|
||||
const reprintProhibited = document.getElementById('reprintProhibited')?.checked || false
|
||||
|
||||
const isEdit = !!postId
|
||||
const url = isEdit ? '/api/studio/posts/' + postId : '/api/studio/posts'
|
||||
const method = isEdit ? 'PUT' : 'POST'
|
||||
@ -184,7 +201,13 @@ async function handleSubmit(e) {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRF-Token': getCSRFToken(),
|
||||
},
|
||||
body: JSON.stringify({ title, body }),
|
||||
body: JSON.stringify({
|
||||
title, body,
|
||||
visibility, post_type: postType,
|
||||
reprint_source: reprintSource,
|
||||
declaration,
|
||||
reprint_prohibited: reprintProhibited,
|
||||
}),
|
||||
})
|
||||
const data = await resp.json()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user