v1.2.26 - Info页面修复：寻配号发布改为独立页面，新增行情发布保持原有样式
This commit is contained in:
甲辰生产
parent
7009d1126c
commit
188458d2bc
|
|
@ -1 +1 @@
|
|||
VERSION=1.2.25
|
||||
VERSION=1.2.26
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<title>甲辰收藏 v1.2.24</title>
|
||||
<title>甲辰收藏 v1.2.25</title>
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="/static/icons/favicon.ico" />
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ export default function Info() {
|
|||
// 顶部tab：寻配号发布 / 发布管理
|
||||
const [activeTab, setActiveTab] = useState('publish')
|
||||
const [showPublish, setShowPublish] = useState(false)
|
||||
const [publishType, setPublishType] = useState('deal') // 'seek' 或 'deal'
|
||||
const [myList, setMyList] = useState([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [editingItem, setEditingItem] = useState(null)
|
||||
|
|
@ -20,9 +21,9 @@ export default function Info() {
|
|||
edition: '龙钞', type: '标百', isGraded: true, category: '成交', source: '直播', title: ''
|
||||
})
|
||||
|
||||
// 寻配号发布表单（新版）
|
||||
// 寻配号发布表单
|
||||
const [seekForm, setSeekForm] = useState({
|
||||
edition: '龙钞,马钞,蛇钞', price: '', features: '', contact: '', content: ''
|
||||
edition: '龙钞', price: '', features: '', contact: '', content: '', title: ''
|
||||
})
|
||||
|
||||
const API_BASE = localStorage.getItem('API_BASE') || ''
|
||||
|
|
@ -32,9 +33,18 @@ export default function Info() {
|
|||
}, [activeTab])
|
||||
|
||||
useEffect(() => {
|
||||
// 自动生成标题
|
||||
// 自动生成行情标题
|
||||
const now = new Date()
|
||||
const date = `${now.getFullYear()}/${now.getMonth()+1}/${now.getDate()}`
|
||||
const grade = formData.isGraded ? '（评级币）' : '（裸钞）'
|
||||
const title = `「${date} ${formData.edition} ${formData.type} ${formData.category} 行情信息${grade}」`
|
||||
setFormData(prev => ({ ...prev, title }))
|
||||
}, [formData.edition, formData.type, formData.isGraded, formData.category])
|
||||
|
||||
useEffect(() => {
|
||||
// 自动生成寻配号标题
|
||||
if (seekForm.edition || seekForm.features) {
|
||||
const title = `「寻号 ${seekForm.edition || '龙钞,马钞,蛇钞'} J0${seekForm.features || 'XXXXXXXX'}」`
|
||||
const title = `「寻号 ${seekForm.edition} J0${seekForm.features || 'XXXXXXXX'}」`
|
||||
setSeekForm(prev => ({ ...prev, title }))
|
||||
}
|
||||
}, [seekForm.edition, seekForm.features])
|
||||
|
|
@ -82,7 +92,7 @@ export default function Info() {
|
|||
if (data.id || data.code === 0) {
|
||||
alert('发布成功！')
|
||||
setShowPublish(false)
|
||||
setSeekForm({ edition: '龙钞,马钞,蛇钞', price: '', features: '', contact: '', content: '', title: '' })
|
||||
setSeekForm({ edition: '龙钞', price: '', features: '', contact: '', content: '', title: '' })
|
||||
const contentEl = document.getElementById('seekContent')
|
||||
if (contentEl) contentEl.value = ''
|
||||
fetchMyList()
|
||||
|
|
@ -94,7 +104,7 @@ export default function Info() {
|
|||
}
|
||||
}
|
||||
|
||||
// 发布行情
|
||||
// 发布行情（新增发布默认是行情）
|
||||
const handlePublishDeal = async () => {
|
||||
const content = document.getElementById('publishContent')?.value || ''
|
||||
if (!formData.title) {
|
||||
|
|
@ -236,188 +246,261 @@ export default function Info() {
|
|||
<div style={{ padding: '20px' }}>
|
||||
{/* 寻配号发布页 */}
|
||||
{activeTab === 'publish' && (
|
||||
<div style={{ padding: '40px', textAlign: 'center', color: '#94a3b8' }}>
|
||||
<div style={{ fontSize: '48px', marginBottom: '16px' }}>📝</div>
|
||||
<div style={{ fontSize: '16px', marginBottom: '8px', color: '#fff' }}>寻配号发布</div>
|
||||
<div style={{ fontSize: '13px' }}>请到「发布管理」tab进行发布</div>
|
||||
<div style={{ background: 'linear-gradient(145deg, #1f2937 0%, #111827 100%)', borderRadius: '16px', padding: '20px', border: '1px solid #374151', boxShadow: '0 4px 20px rgba(0,0,0,0.3)' }}>
|
||||
<h3 style={{ color: '#f9fafb', margin: '0 0 20px 0', fontSize: '18px', fontWeight: '600' }}>🔍 寻配号发布</h3>
|
||||
|
||||
<div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '13px', display: 'block', marginBottom: '8px' }}>版别</label>
|
||||
<div style={{ display: 'flex', gap: '8px' }}>
|
||||
{['龙钞', '马钞', '蛇钞'].map(ed => {
|
||||
const selected = seekForm.edition === ed
|
||||
return (
|
||||
<button
|
||||
key={ed}
|
||||
onClick={() => setSeekForm({ ...seekForm, edition: ed })}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '10px',
|
||||
borderRadius: '8px',
|
||||
border: selected ? '2px solid #10b981' : '1px solid #374151',
|
||||
background: selected ? 'rgba(16,185,129,0.15)' : '#1f2937',
|
||||
color: selected ? '#10b981' : '#d1d5db',
|
||||
cursor: 'pointer',
|
||||
fontSize: '14px',
|
||||
fontWeight: '500'
|
||||
}}
|
||||
>
|
||||
{ed}
|
||||
</button>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '13px', display: 'block', marginBottom: '8px' }}>号码特征（8位）</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.features}
|
||||
onChange={e => setSeekForm({ ...seekForm, features: e.target.value.toUpperCase().slice(0, 8) })}
|
||||
placeholder="输入号码特征，如：12345678"
|
||||
maxLength={8}
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#fff', fontSize: '14px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
<div style={{ color: '#6b7280', fontSize: '11px', marginTop: '4px' }}>X=任意数字 A=非4 B=非47 C=非347 D=非247</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '13px', display: 'block', marginBottom: '8px' }}>标题（自动生成）</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.title}
|
||||
readOnly
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#10b981', fontSize: '14px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '13px', display: 'block', marginBottom: '8px' }}>正文</label>
|
||||
<textarea
|
||||
id="seekContent"
|
||||
placeholder="请输入详细信息..."
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#fff', fontSize: '14px', boxSizing: 'border-box', resize: 'vertical', minHeight: '80px' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#ef4444', fontSize: '13px', display: 'block', marginBottom: '8px' }}>联系方式 *</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.contact}
|
||||
onChange={e => setSeekForm({ ...seekForm, contact: e.target.value })}
|
||||
placeholder="请输入手机号或微信"
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#fff', fontSize: '14px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={handlePublishSeek}
|
||||
style={{
|
||||
width: '100%',
|
||||
padding: '14px',
|
||||
background: 'linear-gradient(135deg, #10b981 0%, #059669 100%)',
|
||||
border: 'none',
|
||||
borderRadius: '10px',
|
||||
color: '#fff',
|
||||
fontSize: '16px',
|
||||
fontWeight: 'bold',
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
>
|
||||
🚀 发布寻配号
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* 发布管理页 */}
|
||||
{activeTab === 'manage' && (
|
||||
<div>
|
||||
{/* 新增发布区域 */}
|
||||
{/* 新增发布区域 - 发布行情信息 */}
|
||||
<div style={{ background: 'linear-gradient(145deg, #1f2937 0%, #111827 100%)', borderRadius: '16px', padding: '20px', marginBottom: '16px', border: '1px solid #374151', boxShadow: '0 4px 20px rgba(0,0,0,0.3)' }}>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '16px' }}>
|
||||
<h3 style={{ color: '#f9fafb', margin: 0, fontSize: '16px', fontWeight: '600' }}>📋 发布管理</h3>
|
||||
<button
|
||||
onClick={() => setShowPublish(!showPublish)}
|
||||
style={{
|
||||
padding: '8px 16px',
|
||||
background: showPublish ? 'rgba(108,114,132,0.5)' : '#10b981',
|
||||
padding: '10px 20px',
|
||||
background: showPublish ? 'rgba(108,114,132,0.5)' : 'linear-gradient(135deg, #f59e0b 0%, #d97706 100%)',
|
||||
border: 'none',
|
||||
borderRadius: '8px',
|
||||
borderRadius: '10px',
|
||||
color: '#fff',
|
||||
cursor: 'pointer',
|
||||
fontSize: '13px'
|
||||
fontSize: '14px',
|
||||
fontWeight: '600'
|
||||
}}
|
||||
>
|
||||
{showPublish ? '收起' : '+ 新增发布'}
|
||||
{showPublish ? '✕ 收起' : '+ 💰 新增行情发布'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* 发布表单 - 两个Tab：寻配号 / 行情 */}
|
||||
{/* 行情发布表单 */}
|
||||
{showPublish && (
|
||||
<div style={{ background: '#0f172a', borderRadius: '12px', padding: '16px', marginBottom: '16px' }}>
|
||||
{/* 内部Tab：寻配号 / 行情 */}
|
||||
<div style={{ display: 'flex', gap: '8px', marginBottom: '16px' }}>
|
||||
<button
|
||||
onClick={() => setSeekForm(prev => ({ ...prev, _tab: 'seek' }))}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '10px',
|
||||
borderRadius: '8px',
|
||||
border: '1px solid #10b981',
|
||||
background: 'rgba(16,185,129,0.15)',
|
||||
color: '#10b981',
|
||||
cursor: 'pointer',
|
||||
fontSize: '14px',
|
||||
fontWeight: '600'
|
||||
}}
|
||||
>
|
||||
🔍 寻配号
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setSeekForm(prev => ({ ...prev, _tab: 'deal' }))}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '10px',
|
||||
borderRadius: '8px',
|
||||
border: '1px solid #f59e0b',
|
||||
background: 'rgba(245,158,11,0.15)',
|
||||
color: '#f59e0b',
|
||||
cursor: 'pointer',
|
||||
fontSize: '14px',
|
||||
fontWeight: '600'
|
||||
}}
|
||||
>
|
||||
💰 行情
|
||||
</button>
|
||||
</div>
|
||||
<div style={{ color: '#f59e0b', fontSize: '14px', fontWeight: '600', marginBottom: '16px' }}>💰 发布行情信息</div>
|
||||
|
||||
{/* 寻配号表单 */}
|
||||
<div style={{ display: 'flex', flexDirection: 'column', gap: '12px' }}>
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>版别（多选）</label>
|
||||
<div style={{ display: 'flex', gap: '8px' }}>
|
||||
{['龙钞', '马钞', '蛇钞'].map(ed => {
|
||||
const selected = seekForm.edition?.split(',').includes(ed)
|
||||
return (
|
||||
<div style={{ display: 'flex', gap: '12px' }}>
|
||||
<div style={{ flex: 2 }}>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>版别</label>
|
||||
<div style={{ display: 'flex', gap: '6px' }}>
|
||||
{['龙钞', '马钞', '蛇钞', '其他'].map(ed => (
|
||||
<button
|
||||
key={ed}
|
||||
onClick={() => {
|
||||
const editions = seekForm.edition ? seekForm.edition.split(',').filter(e => e) : []
|
||||
if (selected) {
|
||||
setSeekForm({ ...seekForm, edition: editions.filter(e => e !== ed).join(',') })
|
||||
} else {
|
||||
editions.push(ed)
|
||||
setSeekForm({ ...seekForm, edition: editions.join(',') })
|
||||
}
|
||||
}}
|
||||
onClick={() => setFormData({ ...formData, edition: ed })}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '8px',
|
||||
borderRadius: '6px',
|
||||
border: selected ? '2px solid #10b981' : '1px solid #334155',
|
||||
background: selected ? 'rgba(16,185,129,0.2)' : '#1f2937',
|
||||
color: '#fff',
|
||||
border: formData.edition === ed ? '2px solid #f59e0b' : '1px solid #374151',
|
||||
background: formData.edition === ed ? 'rgba(245,158,11,0.15)' : '#1f2937',
|
||||
color: formData.edition === ed ? '#f59e0b' : '#d1d5db',
|
||||
cursor: 'pointer',
|
||||
fontSize: '12px'
|
||||
}}
|
||||
>
|
||||
{ed}
|
||||
</button>
|
||||
)
|
||||
})}
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{ display: 'flex', gap: '12px' }}>
|
||||
<div style={{ flex: 2 }}>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>类型</label>
|
||||
<div style={{ display: 'flex', gap: '6px' }}>
|
||||
{['标百', '标十', '单张'].map(t => (
|
||||
<button
|
||||
key={t}
|
||||
onClick={() => setFormData({ ...formData, type: t })}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '8px',
|
||||
borderRadius: '6px',
|
||||
border: formData.type === t ? '2px solid #f59e0b' : '1px solid #374151',
|
||||
background: formData.type === t ? 'rgba(245,158,11,0.15)' : '#1f2937',
|
||||
color: formData.type === t ? '#f59e0b' : '#d1d5db',
|
||||
cursor: 'pointer',
|
||||
fontSize: '12px'
|
||||
}}
|
||||
>
|
||||
{t}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ flex: 1 }}>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>是否评级</label>
|
||||
<button
|
||||
onClick={() => setFormData({ ...formData, isGraded: !formData.isGraded })}
|
||||
style={{
|
||||
width: '100%',
|
||||
padding: '8px',
|
||||
borderRadius: '6px',
|
||||
border: formData.isGraded ? '2px solid #f59e0b' : '1px solid #374151',
|
||||
background: formData.isGraded ? 'rgba(245,158,11,0.15)' : '#1f2937',
|
||||
color: formData.isGraded ? '#f59e0b' : '#d1d5db',
|
||||
cursor: 'pointer',
|
||||
fontSize: '12px'
|
||||
}}
|
||||
>
|
||||
{formData.isGraded ? '✓ 评级币' : '○ 裸钞'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>价格（选填）</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.price}
|
||||
onChange={e => setSeekForm({ ...seekForm, price: e.target.value })}
|
||||
placeholder="请输入价格"
|
||||
style={{ width: '100%', padding: '8px', background: '#1f2937', border: '1px solid #334155', borderRadius: '6px', color: '#fff', fontSize: '13px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>分类</label>
|
||||
<div style={{ display: 'flex', gap: '8px' }}>
|
||||
{[{value:'成交',label:'💰 成交'},{value:'求购',label:'🔍 求购'},{value:'出售',label:'💵 出售'}].map(opt => (
|
||||
<button
|
||||
key={opt.value}
|
||||
onClick={() => setFormData({ ...formData, category: opt.value })}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '10px',
|
||||
borderRadius: '8px',
|
||||
border: formData.category === opt.value ? '2px solid #f59e0b' : '1px solid #374151',
|
||||
background: formData.category === opt.value ? 'rgba(245,158,11,0.15)' : '#1f2937',
|
||||
color: formData.category === opt.value ? '#f59e0b' : '#d1d5db',
|
||||
cursor: 'pointer',
|
||||
fontSize: '13px',
|
||||
fontWeight: '500'
|
||||
}}
|
||||
>
|
||||
{opt.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>号码特征（8位）</label>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>标题（自动生成）</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.features}
|
||||
onChange={e => setSeekForm({ ...seekForm, features: e.target.value.toUpperCase().slice(0, 8) })}
|
||||
placeholder="输入号码特征，如：12345678 或 XXXXXXXX"
|
||||
maxLength={8}
|
||||
style={{ width: '100%', padding: '8px', background: '#1f2937', border: '1px solid #334155', borderRadius: '6px', color: '#fff', fontSize: '13px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#ef4444', fontSize: '12px', display: 'block', marginBottom: '6px' }}>联系方式 *</label>
|
||||
<input
|
||||
type="text"
|
||||
value={seekForm.contact}
|
||||
onChange={e => setSeekForm({ ...seekForm, contact: e.target.value })}
|
||||
placeholder="请输入手机号或微信"
|
||||
style={{ width: '100%', padding: '8px', background: '#1f2937', border: '1px solid #334155', borderRadius: '6px', color: '#fff', fontSize: '13px', boxSizing: 'border-box' }}
|
||||
value={formData.title}
|
||||
readOnly
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#10b981', fontSize: '14px', boxSizing: 'border-box' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label style={{ color: '#9ca3af', fontSize: '12px', display: 'block', marginBottom: '6px' }}>正文</label>
|
||||
<textarea
|
||||
id="seekContent"
|
||||
placeholder="请输入详细信息..."
|
||||
style={{ width: '100%', padding: '8px', background: '#1f2937', border: '1px solid #334155', borderRadius: '6px', color: '#fff', fontSize: '13px', boxSizing: 'border-box', resize: 'vertical', minHeight: '60px' }}
|
||||
id="publishContent"
|
||||
placeholder="请输入行情详细信息..."
|
||||
style={{ width: '100%', padding: '12px', background: '#1f2937', border: '1px solid #374151', borderRadius: '10px', color: '#fff', fontSize: '14px', boxSizing: 'border-box', resize: 'vertical', minHeight: '80px' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style={{ display: 'flex', gap: '12px' }}>
|
||||
<button
|
||||
onClick={handlePublishSeek}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '12px',
|
||||
background: '#10b981',
|
||||
border: 'none',
|
||||
borderRadius: '8px',
|
||||
color: '#fff',
|
||||
fontSize: '14px',
|
||||
fontWeight: 'bold',
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
>
|
||||
🔍 发布寻号
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setShowPublish(false)}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '12px',
|
||||
background: 'transparent',
|
||||
border: '1px solid #334155',
|
||||
borderRadius: '8px',
|
||||
color: '#94a3b8',
|
||||
fontSize: '14px',
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
onClick={handlePublishDeal}
|
||||
style={{
|
||||
width: '100%',
|
||||
padding: '14px',
|
||||
background: 'linear-gradient(135deg, #f59e0b 0%, #d97706 100%)',
|
||||
border: 'none',
|
||||
borderRadius: '10px',
|
||||
color: '#fff',
|
||||
fontSize: '15px',
|
||||
fontWeight: 'bold',
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
>
|
||||
🚀 提交发布
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue