feature/login-screen #4
@ -1,7 +1,7 @@
|
||||
import axios from 'axios';
|
||||
import { logoutUser } from '../utils/jwt'; // logoutUser会处理清除存储和重定向
|
||||
|
||||
const API_BASE_URL = 'http://zybdatasupport.online:8000';
|
||||
const API_BASE_URL = 'https://zybdatasupport.online';
|
||||
|
||||
const axiosInstance = axios.create({
|
||||
baseURL: API_BASE_URL,
|
||||
|
||||
@ -75,4 +75,27 @@ export const deleteDemand = async (id) => {
|
||||
console.error('删除需求失败:', error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
* 添加需求回复
|
||||
* @param {number} id - 需求ID
|
||||
* @param {Object} replyData - 回复数据
|
||||
* @param {string} replyData.reply - 回复内容
|
||||
* @returns {Promise<Object>} 返回添加回复的响应数据
|
||||
* 说明：会将回复内容与用户qq拼接在一起，格式qq:内容|qq:内容
|
||||
*/
|
||||
export const addDemandReply = async (id, replyData) => {
|
||||
try {
|
||||
const payload = {
|
||||
id: id,
|
||||
reply: replyData.reply
|
||||
};
|
||||
console.log('添加需求回复的数据:', payload);
|
||||
const response = await axiosInstance.put('/demands/reply', payload);
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
console.error('添加需求回复失败:', error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,54 +1,6 @@
|
||||
import axiosInstance from './axiosConfig';
|
||||
import { loginSuccess } from '../utils/jwt';
|
||||
|
||||
// const API_BASE_URL = 'http://zybdatasupport.online:8000' // 不再需要
|
||||
|
||||
// // 创建 axios 实例 // 不再需要
|
||||
// const axiosInstance = axios.create({
|
||||
// baseURL: API_BASE_URL,
|
||||
// headers: {
|
||||
// 'Content-Type': 'application/json',
|
||||
// 'Accept': 'application/json',
|
||||
// 'X-Requested-With': 'XMLHttpRequest'
|
||||
// },
|
||||
// timeout: 10000 // 添加超时设置
|
||||
// })
|
||||
|
||||
// // 设置请求拦截器，自动添加 token // 不再需要
|
||||
// axiosInstance.interceptors.request.use(
|
||||
// config => {
|
||||
// const token = localStorage.getItem('access_token')
|
||||
// if (token) {
|
||||
// config.headers.Authorization = `bearer ${token}`
|
||||
// }
|
||||
// return config
|
||||
// },
|
||||
// error => {
|
||||
// return Promise.reject(error)
|
||||
// }
|
||||
// )
|
||||
|
||||
// // 添加响应拦截器 // 不再需要
|
||||
// axiosInstance.interceptors.response.use(
|
||||
// response => response,
|
||||
// error => {
|
||||
// if (error.response) {
|
||||
// // 服务器返回错误状态码
|
||||
// console.error('请求错误:', {
|
||||
// status: error.response.status,
|
||||
// data: error.response.data,
|
||||
// config: error.config
|
||||
// })
|
||||
// } else if (error.request) {
|
||||
// // 请求已发出但没有收到响应
|
||||
// console.error('网络错误:', error.request)
|
||||
// } else {
|
||||
// // 请求配置出错
|
||||
// console.error('请求配置错误:', error.message)
|
||||
// }
|
||||
// return Promise.reject(error)
|
||||
// }
|
||||
// )
|
||||
|
||||
/**
|
||||
* 获取验证码
|
||||
|
||||
964
src/components/backend/AffairManagement.vue
Normal file
964
src/components/backend/AffairManagement.vue
Normal file
@ -0,0 +1,964 @@
|
||||
<template>
|
||||
<div class="affair-management">
|
||||
<div class="page-header">
|
||||
<h1>事项管理</h1>
|
||||
<div class="header-actions">
|
||||
<button class="btn-common btn-gradient" @click="openAddModal">添加需求</button>
|
||||
<button class="btn-common btn-light" @click="onRefresh">刷新</button>
|
||||
<button class="btn-common btn-gradient" @click="showDeletedItems = !showDeletedItems">
|
||||
{{ showDeletedItems ? '隐藏已删除' : '显示已删除' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="error" class="error-message">
|
||||
{{ error }}
|
||||
</div>
|
||||
|
||||
<div class="table-container">
|
||||
<table class="maps-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>请求者</th>
|
||||
<th>QQ号</th>
|
||||
<th>请求内容</th>
|
||||
<th>悬赏金额</th>
|
||||
<th>需求创建时间</th>
|
||||
<th>回复数量</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(demand, index) in displayDemands" :key="demand.id" class="table-row">
|
||||
<td class="id" data-label="ID">{{ index + 1 }}</td>
|
||||
<td class="requester" data-label="请求者">
|
||||
<span v-if="!demand.requester" class="tag no-reward">匿名</span>
|
||||
<span v-else>{{ demand.requester }}</span>
|
||||
</td>
|
||||
<td class="name" data-label="QQ号">
|
||||
<span v-if="!demand.qq_code" class="tag no-reward">匿名</span>
|
||||
<span v-else>{{ demand.qq_code }}</span>
|
||||
</td>
|
||||
<td class="content" data-label="请求内容">{{ getDisplayContent(demand.content) }}</td>
|
||||
<td class="reward" data-label="悬赏金额">
|
||||
<span :class="['tag', isNoReward(demand.reward) ? 'no-reward' : 'has-reward']">
|
||||
{{ isNoReward(demand.reward) ? '无赏金' : demand.reward }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="date" data-label="创建时间">{{ formatDate(demand.date) }}</td>
|
||||
<td class="reply-count" data-label="回复数量">{{ getReplyCount(demand.sendcontent) }}</td>
|
||||
<td class="status" data-label="状态">
|
||||
<span :class="['tag', isDeleted(demand.content) ? 'deleted' : 'active']">
|
||||
{{ isDeleted(demand.content) ? '已删除' : '正常' }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="actions" data-label="操作">
|
||||
<button class="btn-common btn-small btn-gradient" @click="showDetail(demand)">查看</button>
|
||||
<button v-if="!isDeleted(demand.content)" class="btn-common btn-small btn-warning" @click="handleHide(demand)">隐藏</button>
|
||||
<button v-else class="btn-common btn-small btn-restore" @click="handleRestore(demand)">恢复</button>
|
||||
<button v-if="showDeletedItems" class="btn-common btn-small btn-danger" @click="handleDelete(demand)">删除</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 详情弹窗 -->
|
||||
<div v-if="showModal" class="modal-overlay" @click="closeModal">
|
||||
<div class="modal-content" @click.stop>
|
||||
<div class="modal-header">
|
||||
<h2>需求详情</h2>
|
||||
<button class="close-btn" @click="closeModal">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="detail-item">
|
||||
<span class="label">QQ号：</span>
|
||||
<span v-if="!selectedDemand?.qq_code" class="tag no-reward">匿名</span>
|
||||
<span v-else>{{ selectedDemand?.qq_code }}</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">请求者：</span>
|
||||
<span v-if="!selectedDemand?.requester" class="tag no-reward">匿名</span>
|
||||
<span v-else>{{ selectedDemand?.requester }}</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">需求内容：</span>
|
||||
<span class="value">{{ getDisplayContent(selectedDemand?.content) }}</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">赏金：</span>
|
||||
<span :class="['tag', isNoReward(selectedDemand?.reward) ? 'no-reward' : 'has-reward']">
|
||||
{{ isNoReward(selectedDemand?.reward) ? '无赏金' : selectedDemand?.reward }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">发布时间：</span>
|
||||
<span class="value">{{ formatDate(selectedDemand?.date) }}</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">状态：</span>
|
||||
<span :class="['tag', isDeleted(selectedDemand?.content) ? 'deleted' : 'active']">
|
||||
{{ isDeleted(selectedDemand?.content) ? '已删除' : '正常' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="reply-section">
|
||||
<h3>回复内容</h3>
|
||||
<div class="reply-list">
|
||||
<div v-if="selectedDemand?.sendcontent">
|
||||
<div v-for="(reply, index) in selectedDemand.sendcontent.split('|')" :key="index" class="reply-content">
|
||||
<div class="reply-with-avatar">
|
||||
<img :src="`https://q1.qlogo.cn/g?b=qq&nk=${extractQQ(reply)}&s=40`" alt="User Avatar" class="reply-avatar" />
|
||||
<div class="reply-text">
|
||||
<b>{{ parseReplyText(reply).user }}</b> {{ parseReplyText(reply).content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="no-reply">
|
||||
暂无回复
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 删除确认弹窗 -->
|
||||
<div v-if="showDeleteConfirm" class="modal-overlay" style="z-index:2000;">
|
||||
<div class="modal-content" style="max-width:350px;text-align:center;">
|
||||
<div class="modal-header">
|
||||
<h2 style="color:#F56C6C;">{{ currentOperation === 'hide' ? '隐藏确认' : '删除确认' }}</h2>
|
||||
</div>
|
||||
<div class="modal-body" style="font-size:16px;">
|
||||
{{ currentOperation === 'hide' ? '确定要隐藏该需求吗？' : '确定要删除该需求吗？此操作不可恢复。' }}
|
||||
</div>
|
||||
<div class="delete-dialog-footer" style="display:flex;justify-content:center;gap:18px;margin:18px 0 8px 0;">
|
||||
<button class="confirm-button" @click="confirmOperation">
|
||||
{{ currentOperation === 'hide' ? '确认隐藏' : '确认删除' }}
|
||||
</button>
|
||||
<button class="cancel-button" @click="cancelDelete">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 恢复确认弹窗 -->
|
||||
<div v-if="showRestoreConfirm" class="modal-overlay" style="z-index:2000;">
|
||||
<div class="modal-content" style="max-width:350px;text-align:center;">
|
||||
<div class="modal-header">
|
||||
<h2 style="color:#10B981;">恢复确认</h2>
|
||||
</div>
|
||||
<div class="modal-body" style="font-size:16px;">确定要恢复该需求吗？</div>
|
||||
<div class="delete-dialog-footer" style="display:flex;justify-content:center;gap:18px;margin:18px 0 8px 0;">
|
||||
<button class="confirm-button restore" @click="confirmRestore">确认恢复</button>
|
||||
<button class="cancel-button" @click="cancelRestore">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 添加需求弹窗 -->
|
||||
<div v-if="showAddModal" class="modal-overlay" @click="closeAddModal">
|
||||
<div class="modal-content" @click.stop>
|
||||
<div class="modal-header">
|
||||
<h2>添加需求</h2>
|
||||
<button class="close-btn" @click="closeAddModal">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="add-modal-form" @submit.prevent="submitAddForm">
|
||||
<div class="form-row">
|
||||
<span class="label">请求者：</span>
|
||||
<input v-model="addForm.requester" class="input" placeholder="可选" />
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<span class="label">QQ号：</span>
|
||||
<input v-model="addForm.qq_code" class="input" placeholder="可选" />
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<span class="label">需求内容：</span>
|
||||
<textarea
|
||||
v-model="addForm.content"
|
||||
class="input"
|
||||
placeholder="请输入需求内容"
|
||||
rows="3"
|
||||
required
|
||||
></textarea>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<span class="label">赏金：</span>
|
||||
<input v-model="addForm.reward" class="input" placeholder="可选" />
|
||||
</div>
|
||||
<div v-if="addError" class="error">{{ addError }}</div>
|
||||
<button class="btn-common btn-gradient submit-btn" :disabled="addLoading">
|
||||
{{ addLoading ? '提交中...' : '提交' }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, computed } from 'vue'
|
||||
import { getDemandsList, updateDemand, deleteDemand, addDemand } from '../../api/demands'
|
||||
|
||||
// 响应式数据
|
||||
const demands = ref([])
|
||||
const loading = ref(false)
|
||||
const error = ref(null)
|
||||
const showModal = ref(false)
|
||||
const selectedDemand = ref(null)
|
||||
const showDeleteConfirm = ref(false)
|
||||
const showRestoreConfirm = ref(false)
|
||||
const pendingDeleteId = ref(null)
|
||||
const pendingRestoreId = ref(null)
|
||||
const showDeletedItems = ref(false)
|
||||
const currentOperation = ref('') // 'hide' 或 'delete'
|
||||
const showAddModal = ref(false)
|
||||
const addForm = ref({
|
||||
requester: '',
|
||||
content: '',
|
||||
reward: '',
|
||||
qq_code: ''
|
||||
})
|
||||
const addError = ref('')
|
||||
const addLoading = ref(false)
|
||||
|
||||
// 计算属性：根据显示设置过滤需求
|
||||
const displayDemands = computed(() => {
|
||||
if (showDeletedItems.value) {
|
||||
return demands.value
|
||||
} else {
|
||||
return demands.value.filter(demand => !isDeleted(demand.content))
|
||||
}
|
||||
})
|
||||
|
||||
// 判断是否为无赏金
|
||||
const isNoReward = (reward) => {
|
||||
return !reward || reward === '无赏金'
|
||||
}
|
||||
|
||||
// 判断是否已删除
|
||||
const isDeleted = (content) => {
|
||||
return content?.startsWith('&DEL')
|
||||
}
|
||||
|
||||
// 获取显示内容（去掉删除标记）
|
||||
const getDisplayContent = (content) => {
|
||||
if (!content) return ''
|
||||
return content.replace(/^&DEL/, '')
|
||||
}
|
||||
|
||||
// 获取回复数量
|
||||
const getReplyCount = (sendcontent) => {
|
||||
if (!sendcontent) return 0
|
||||
return sendcontent.split('|').length
|
||||
}
|
||||
|
||||
// 格式化日期
|
||||
const formatDate = (dateString) => {
|
||||
if (!dateString || dateString === 'Test_date') return '日期未提供'
|
||||
|
||||
try {
|
||||
const date = new Date(dateString)
|
||||
if (isNaN(date.getTime())) {
|
||||
return dateString
|
||||
}
|
||||
|
||||
const pad = num => num.toString().padStart(2, '0')
|
||||
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`
|
||||
} catch (e) {
|
||||
return dateString
|
||||
}
|
||||
}
|
||||
|
||||
// 获取需求列表
|
||||
const fetchDemands = async () => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const data = await getDemandsList()
|
||||
demands.value = data
|
||||
} catch (err) {
|
||||
console.error('加载需求列表失败:', err)
|
||||
if (err.response?.status === 403) {
|
||||
error.value = '权限不足，请确认您有管理员权限'
|
||||
} else if (err.response?.status === 401) {
|
||||
error.value = '登录已过期，请重新登录'
|
||||
} else {
|
||||
error.value = `加载失败: ${err.response?.data?.detail || err.message}`
|
||||
}
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 显示详情弹窗
|
||||
const showDetail = (demand) => {
|
||||
selectedDemand.value = demand
|
||||
showModal.value = true
|
||||
}
|
||||
|
||||
// 关闭弹窗
|
||||
const closeModal = () => {
|
||||
showModal.value = false
|
||||
selectedDemand.value = null
|
||||
}
|
||||
|
||||
// 处理隐藏
|
||||
const handleHide = (demand) => {
|
||||
pendingDeleteId.value = demand.id
|
||||
currentOperation.value = 'hide'
|
||||
showDeleteConfirm.value = true
|
||||
}
|
||||
|
||||
// 确认操作
|
||||
const confirmOperation = async () => {
|
||||
try {
|
||||
if (currentOperation.value === 'hide') {
|
||||
const demand = demands.value.find(d => d.id === pendingDeleteId.value)
|
||||
if (!demand) return
|
||||
|
||||
const updatedContent = `&DEL${demand.content}`
|
||||
await updateDemand(pendingDeleteId.value, {
|
||||
requester: demand.requester,
|
||||
qq_code: demand.qq_code,
|
||||
content: updatedContent,
|
||||
reward: demand.reward,
|
||||
date: demand.date,
|
||||
sendcontent: demand.sendcontent
|
||||
})
|
||||
} else if (currentOperation.value === 'delete') {
|
||||
await deleteDemand(pendingDeleteId.value)
|
||||
}
|
||||
fetchDemands()
|
||||
} catch (e) {
|
||||
console.error('操作失败:', e)
|
||||
} finally {
|
||||
showDeleteConfirm.value = false
|
||||
pendingDeleteId.value = null
|
||||
currentOperation.value = ''
|
||||
}
|
||||
}
|
||||
|
||||
// 处理删除
|
||||
const handleDelete = (demand) => {
|
||||
pendingDeleteId.value = demand.id
|
||||
currentOperation.value = 'delete'
|
||||
showDeleteConfirm.value = true
|
||||
}
|
||||
|
||||
// 取消删除
|
||||
const cancelDelete = () => {
|
||||
showDeleteConfirm.value = false
|
||||
pendingDeleteId.value = null
|
||||
}
|
||||
|
||||
// 处理恢复
|
||||
const handleRestore = (demand) => {
|
||||
pendingRestoreId.value = demand.id
|
||||
showRestoreConfirm.value = true
|
||||
}
|
||||
|
||||
// 确认恢复
|
||||
const confirmRestore = async () => {
|
||||
try {
|
||||
const demand = demands.value.find(d => d.id === pendingRestoreId.value)
|
||||
if (!demand) return
|
||||
|
||||
const restoredContent = demand.content.replace(/^&DEL/, '')
|
||||
await updateDemand(pendingRestoreId.value, {
|
||||
requester: demand.requester,
|
||||
qq_code: demand.qq_code,
|
||||
content: restoredContent,
|
||||
reward: demand.reward,
|
||||
date: demand.date,
|
||||
sendcontent: demand.sendcontent
|
||||
})
|
||||
fetchDemands()
|
||||
} catch (e) {
|
||||
console.error('恢复失败:', e)
|
||||
} finally {
|
||||
showRestoreConfirm.value = false
|
||||
pendingRestoreId.value = null
|
||||
}
|
||||
}
|
||||
|
||||
// 取消恢复
|
||||
const cancelRestore = () => {
|
||||
showRestoreConfirm.value = false
|
||||
pendingRestoreId.value = null
|
||||
}
|
||||
|
||||
// 刷新
|
||||
const onRefresh = () => {
|
||||
fetchDemands()
|
||||
}
|
||||
|
||||
// 打开添加需求弹窗
|
||||
const openAddModal = () => {
|
||||
addForm.value = {
|
||||
requester: '',
|
||||
content: '',
|
||||
reward: '',
|
||||
qq_code: ''
|
||||
}
|
||||
addError.value = ''
|
||||
showAddModal.value = true
|
||||
}
|
||||
|
||||
// 关闭添加需求弹窗
|
||||
const closeAddModal = () => {
|
||||
showAddModal.value = false
|
||||
addError.value = ''
|
||||
}
|
||||
|
||||
// 提交添加需求表单
|
||||
const submitAddForm = async () => {
|
||||
if (!addForm.value.content?.trim()) {
|
||||
addError.value = '需求内容不能为空'
|
||||
return
|
||||
}
|
||||
|
||||
addLoading.value = true
|
||||
addError.value = ''
|
||||
try {
|
||||
const now = new Date()
|
||||
const dateStr = `${now.getFullYear()}-${(now.getMonth()+1).toString().padStart(2,'0')}-${now.getDate().toString().padStart(2,'0')} ${now.getHours().toString().padStart(2,'0')}:${now.getMinutes().toString().padStart(2,'0')}:${now.getSeconds().toString().padStart(2,'0')}`
|
||||
const payload = {
|
||||
requester: addForm.value.requester || '',
|
||||
sendcontent: '',
|
||||
content: addForm.value.content,
|
||||
reward: addForm.value.reward || '',
|
||||
date: dateStr,
|
||||
qq_code: addForm.value.qq_code || ''
|
||||
}
|
||||
|
||||
console.log('提交的数据:', payload)
|
||||
await addDemand(payload)
|
||||
showAddModal.value = false
|
||||
fetchDemands() // 刷新列表
|
||||
} catch (e) {
|
||||
console.error('提交失败:', e)
|
||||
addError.value = e.response?.data?.detail || '提交失败，请稍后重试'
|
||||
} finally {
|
||||
addLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 解析回复文本
|
||||
function parseReplyText(str) {
|
||||
// 首先尝试解析 qq:内容 格式
|
||||
const qqMatch = str.match(/^(\d+):(.+)$/)
|
||||
if (qqMatch) {
|
||||
return {
|
||||
user: qqMatch[1],
|
||||
content: qqMatch[2].trim()
|
||||
}
|
||||
}
|
||||
|
||||
// 兼容原有的昵称（QQ号）格式，允许有空格
|
||||
const match = str.match(/^(.+?[（(][1-9][0-9]{4,}[）)])(.*)$/)
|
||||
if (match) {
|
||||
return {
|
||||
user: match[1].trim(),
|
||||
content: match[2].replace(/^：|^:/, '').trim()
|
||||
}
|
||||
}
|
||||
// fallback
|
||||
return {
|
||||
user: '',
|
||||
content: str
|
||||
}
|
||||
}
|
||||
|
||||
// 提取QQ号
|
||||
function extractQQ(str) {
|
||||
// 首先尝试解析 qq:内容 格式
|
||||
const qqMatch = str.match(/^(\d+):(.+)$/)
|
||||
if (qqMatch) {
|
||||
return qqMatch[1]
|
||||
}
|
||||
|
||||
// 兼容原有的昵称（QQ号）格式
|
||||
const match = str.match(/[（(]([1-9][0-9]{4,})[）)]/)
|
||||
return match ? match[1] : ''
|
||||
}
|
||||
|
||||
// 组件挂载时自动加载数据
|
||||
onMounted(() => {
|
||||
fetchDemands()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.affair-management {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
color: #1a237e;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.btn-common {
|
||||
display: inline-block;
|
||||
padding: 8px 22px;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #b6d2ff;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s, color 0.2s, border 0.2s;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn-gradient {
|
||||
background: linear-gradient(90deg, #71eaeb 0%, #416bdf 100%);
|
||||
color: #fff;
|
||||
border: 1px solid #71eaeb;
|
||||
}
|
||||
|
||||
.btn-gradient:hover {
|
||||
background: linear-gradient(90deg, #416bdf 0%, #71eaeb 100%);
|
||||
color: #fff;
|
||||
border: 1.5px solid #416bdf;
|
||||
}
|
||||
|
||||
.btn-light {
|
||||
background: linear-gradient(90deg, #e3f0ff 0%, #f7fbff 100%);
|
||||
color: #2563eb;
|
||||
border: 1px solid #b6d2ff;
|
||||
}
|
||||
|
||||
.btn-light:hover {
|
||||
background: linear-gradient(90deg, #d0e7ff 0%, #eaf4ff 100%);
|
||||
color: #174ea6;
|
||||
border: 1.5px solid #2563eb;
|
||||
}
|
||||
|
||||
.btn-small {
|
||||
padding: 5px 15px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: #ef4444;
|
||||
color: #fff;
|
||||
border: 1px solid #ef4444;
|
||||
}
|
||||
|
||||
.btn-danger:hover {
|
||||
background: #dc2626;
|
||||
border: 1.5px solid #dc2626;
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background: #f59e0b;
|
||||
color: #fff;
|
||||
border: 1px solid #f59e0b;
|
||||
}
|
||||
|
||||
.btn-warning:hover {
|
||||
background: #d97706;
|
||||
border: 1.5px solid #d97706;
|
||||
}
|
||||
|
||||
.btn-restore {
|
||||
background: #10b981;
|
||||
color: #fff;
|
||||
border: 1px solid #10b981;
|
||||
}
|
||||
|
||||
.btn-restore:hover {
|
||||
background: #059669;
|
||||
border: 1.5px solid #059669;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.maps-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.maps-table th,
|
||||
.maps-table td {
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
padding: 12px 8px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.maps-table th {
|
||||
background: #f8fafc;
|
||||
font-weight: 600;
|
||||
color: #1a237e;
|
||||
}
|
||||
|
||||
.maps-table tr:hover {
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 300px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: inline-block;
|
||||
padding: 2px 10px;
|
||||
border-radius: 12px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
line-height: 1.2;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.has-reward {
|
||||
background: #fff7e6;
|
||||
color: #d46b08;
|
||||
border: 1px solid #ffd591;
|
||||
}
|
||||
|
||||
.no-reward {
|
||||
background: #f5f5f5;
|
||||
color: #8c8c8c;
|
||||
border: 1px solid #d9d9d9;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #f0f9ff;
|
||||
color: #0369a1;
|
||||
border: 1px solid #7dd3fc;
|
||||
}
|
||||
|
||||
.deleted {
|
||||
background: #fef2f2;
|
||||
color: #dc2626;
|
||||
border: 1px solid #fca5a5;
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.modal-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
padding-top: 80px;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
width: 90%;
|
||||
max-width: 800px;
|
||||
max-height: 80vh;
|
||||
overflow-y: auto;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 20px;
|
||||
border-bottom: 1px solid #eee;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modal-header h2 {
|
||||
margin: 0;
|
||||
color: #1a237e;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 24px;
|
||||
color: #666;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.close-btn:hover {
|
||||
color: #1a237e;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.detail-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-weight: 600;
|
||||
color: #1a237e;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.reply-section {
|
||||
margin-top: 20px;
|
||||
padding-top: 20px;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
.reply-section h3 {
|
||||
color: #1a237e;
|
||||
margin-bottom: 15px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.reply-list {
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.reply-content {
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
color: #333;
|
||||
border-left: 3px solid #2563eb;
|
||||
padding-left: 15px;
|
||||
margin: 10px 0;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.no-reply {
|
||||
text-align: center;
|
||||
color: #666;
|
||||
padding: 20px;
|
||||
background: #f7faff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.reply-with-avatar {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.reply-with-avatar:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.reply-avatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
object-fit: cover;
|
||||
flex-shrink: 0;
|
||||
background: #f3f6fa;
|
||||
}
|
||||
|
||||
.reply-text {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 40px;
|
||||
font-size: 15px;
|
||||
color: #222;
|
||||
line-height: 1.7;
|
||||
padding-left: 14px;
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.reply-text b {
|
||||
font-weight: 600;
|
||||
margin-right: 6px;
|
||||
color: #2563eb;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.confirm-button {
|
||||
background-color: #f56c6c;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 8px 24px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.confirm-button:hover {
|
||||
background-color: #f78989;
|
||||
}
|
||||
|
||||
.confirm-button.restore {
|
||||
background-color: #10b981;
|
||||
}
|
||||
|
||||
.confirm-button.restore:hover {
|
||||
background-color: #059669;
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
background-color: #f0f0f0;
|
||||
color: #333;
|
||||
border: none;
|
||||
padding: 8px 24px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cancel-button:hover {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.add-modal-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-weight: 600;
|
||||
color: #1a237e;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.input {
|
||||
flex: 1;
|
||||
padding: 8px;
|
||||
border: 1px solid #b6d2ff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #f56c6c;
|
||||
font-size: 14px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background-color: #416bdf;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 8px 24px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.submit-btn:hover {
|
||||
background-color: #71eaeb;
|
||||
}
|
||||
|
||||
.submit-btn:disabled {
|
||||
background-color: #b6d2ff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
color: #f56c6c;
|
||||
font-size: 14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* --- Mobile Responsiveness: Horizontal Scroll Table --- */
|
||||
@media (max-width: 768px) {
|
||||
/* Header actions */
|
||||
.page-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Make the table container scrollable */
|
||||
.table-container {
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch; /* for smooth scrolling on iOS */
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* Give the table a minimum width to ensure scrolling is needed */
|
||||
.maps-table {
|
||||
min-width: 900px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Modal Windows */
|
||||
.modal-content {
|
||||
width: calc(100% - 2rem);
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
max-height: 70vh;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -69,6 +69,7 @@
|
||||
</div>
|
||||
<div class="admin-main-content">
|
||||
<AdminEditUserPrivilege v-if="currentAdminView === 'admin-edit-user-privilege'" />
|
||||
<AffairManagement v-if="currentAdminView === 'affair-management'" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -79,6 +80,7 @@ import { ref, onMounted, computed, onUnmounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { getUserInfo } from '@/utils/jwt'
|
||||
import AdminEditUserPrivilege from '@/components/backend/AdminEditUserPrivilege.vue'
|
||||
import AffairManagement from '@/components/backend/AffairManagement.vue'
|
||||
|
||||
const router = useRouter()
|
||||
const hasToken = ref(false)
|
||||
@ -91,7 +93,11 @@ const dropdownOpen3 = ref(false)
|
||||
let privilegeCheckTimer = null
|
||||
|
||||
const isAdmin = computed(() => {
|
||||
return currentUserData.value && currentUserData.value.privilege === 'lv-admin';
|
||||
return currentUserData.value && (
|
||||
currentUserData.value.privilege === 'lv-admin' ||
|
||||
currentUserData.value.privilege === 'lv-user' ||
|
||||
currentUserData.value.privilege === 'admin'
|
||||
);
|
||||
})
|
||||
|
||||
async function checkPrivilege() {
|
||||
@ -106,7 +112,7 @@ async function checkPrivilege() {
|
||||
try {
|
||||
const userInfo = await getUserInfo();
|
||||
currentUserData.value = userInfo;
|
||||
if (!userInfo || userInfo.privilege !== 'lv-admin') {
|
||||
if (!userInfo || (userInfo.privilege !== 'lv-admin' && userInfo.privilege !== 'lv-user' && userInfo.privilege !== 'admin')) {
|
||||
// 退出登录并跳转首页
|
||||
localStorage.removeItem('access_token')
|
||||
currentUserData.value = null
|
||||
|
||||
@ -602,4 +602,84 @@ const showCompetitionMenu = computed(() => showCompetition.value)
|
||||
background-color: #f5f5f5;
|
||||
color: #416bdf;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
/* 整体导航栏布局 */
|
||||
.nav-container {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.nav-brand {
|
||||
text-align: center;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/* 固定汉堡菜单按钮到右上角 */
|
||||
.mobile-menu-toggle {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
z-index: 1002;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 50%;
|
||||
padding: 8px;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 移动端菜单展开后的容器样式 */
|
||||
.nav-left.active,
|
||||
.nav-right.active {
|
||||
display: flex !important; /* 由脚本控制，我们只定义样式 */
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
gap: 5px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.nav-right {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* 调整下拉菜单在一级菜单内的定位方式 */
|
||||
.nav-dropdown {
|
||||
position: static;
|
||||
}
|
||||
|
||||
/* 下拉菜单内容区的移动端样式 */
|
||||
.dropdown-content {
|
||||
position: static; /* 覆盖桌面端的 absolute 定位 */
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
padding: 8px 0 8px 15px; /* 子菜单缩进 */
|
||||
margin-top: 5px;
|
||||
border-left: 2px solid rgba(255, 255, 255, 0.15);
|
||||
min-width: unset;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 下拉菜单中的链接在移动端的样式 */
|
||||
.dropdown-content .nav-link {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.dropdown-content .nav-link:hover {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
/* 用户登录/信息区域的移动端样式 */
|
||||
.login-btn,
|
||||
.user-info-nav {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
margin: 5px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -22,7 +22,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(demand, index) in demands" :key="demand.id" class="table-row" @click="showDetail(demand)">
|
||||
<tr v-for="(demand, index) in filteredDemands" :key="demand.id" class="table-row" @click="showDetail(demand)">
|
||||
<td class="id">{{ index + 1 }}</td>
|
||||
<td class="requester">
|
||||
<span v-if="!demand.requester" class="tag no-reward">匿名</span>
|
||||
@ -55,13 +55,6 @@
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="add-modal-form" @submit.prevent="submitReply">
|
||||
<!-- <div class="form-row">-->
|
||||
<!-- <span class="label">回复消息：</span>-->
|
||||
<!-- <select v-model="addForm.replyTo" class="input">-->
|
||||
<!-- <option value="">无</option>-->
|
||||
<!-- <option v-for="msg in replyOptions" :key="msg.id" :value="msg.id">{{ msg.text }}</option>-->
|
||||
<!-- </select>-->
|
||||
<!-- </div>-->
|
||||
<div class="form-row">
|
||||
<span class="label">昵称：</span>
|
||||
<input
|
||||
@ -132,7 +125,7 @@
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">需求内容：</span>
|
||||
<span class="value">{{ selectedDemand?.content }}</span>
|
||||
<span class="value">{{ selectedDemand?.content?.replace(/^&DEL/, '') || selectedDemand?.content }}</span>
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<span class="label">赏金：</span>
|
||||
@ -263,11 +256,11 @@
|
||||
<div v-if="showDeleteConfirm" class="modal-overlay" style="z-index:2000;">
|
||||
<div class="modal-content" style="max-width:350px;text-align:center;">
|
||||
<div class="modal-header">
|
||||
<h2 style="color:#F56C6C;">删除确认</h2>
|
||||
<h2 style="color:#F56C6C;">隐藏并删除</h2>
|
||||
</div>
|
||||
<div class="modal-body" style="font-size:16px;">确定要删除该需求吗？此操作不可恢复。</div>
|
||||
<div class="modal-body" style="font-size:16px;">确定要隐藏并删除该需求吗？此操作不可恢复。</div>
|
||||
<div class="delete-dialog-footer" style="display:flex;justify-content:center;gap:18px;margin:18px 0 8px 0;">
|
||||
<button class="confirm-button" @click="confirmDelete">确认删除</button>
|
||||
<button class="confirm-button" @click="confirmDelete">确认</button>
|
||||
<button class="cancel-button" @click="cancelDelete">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -278,7 +271,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, nextTick, computed } from 'vue'
|
||||
import { getDemandsList, addDemand, updateDemand, deleteDemand } from '../../api/demands'
|
||||
import { getDemandsList, addDemand, updateDemand, deleteDemand, addDemandReply } from '../../api/demands'
|
||||
import { getStoredUser } from '@/utils/jwt'
|
||||
import ErrorDialog from '@/components/ErrorDialog.vue'
|
||||
|
||||
@ -322,6 +315,12 @@ const pendingDeleteId = ref(null)
|
||||
const isNoReward = (reward) => {
|
||||
return !reward || reward === '无赏金'
|
||||
}
|
||||
|
||||
// 过滤掉已删除的需求（带有&DEL标记）
|
||||
const filteredDemands = computed(() => {
|
||||
return demands.value.filter(demand => !demand.content?.startsWith('&DEL'))
|
||||
})
|
||||
|
||||
// 格式化日期
|
||||
const formatDate = (dateString) => {
|
||||
if (!dateString || dateString === 'Test_date') return '日期未提供'
|
||||
@ -363,24 +362,6 @@ const fetchDemands = async () => {
|
||||
const showReply = (demand) => {
|
||||
reply.value = demand
|
||||
replyModal.value = true
|
||||
// 解析 sendcontent 为下拉选项
|
||||
if (demand.sendcontent) {
|
||||
replyOptions.value = demand.sendcontent.split('|').map((msg, idx) => {
|
||||
// 尝试提取昵称和qq号
|
||||
// 支持格式：昵称（qq）：内容 或 昵称(qq)：内容
|
||||
let match = msg.match(/^(.+?)[（(](\d+)[）)]/)
|
||||
let nickname = match ? match[1] : ''
|
||||
let qq = match ? match[2] : ''
|
||||
return {
|
||||
id: idx,
|
||||
text: msg,
|
||||
nickname,
|
||||
qq
|
||||
}
|
||||
})
|
||||
} else {
|
||||
replyOptions.value = []
|
||||
}
|
||||
resetReplyForm();
|
||||
}
|
||||
|
||||
@ -397,8 +378,7 @@ const resetReplyForm = () => {
|
||||
addForm.value = {
|
||||
sendcontent: '',
|
||||
author: '',
|
||||
author_contact: user && user.qq_code ? user.qq_code : '',
|
||||
replyTo: ''
|
||||
author_contact: user && user.qq_code ? user.qq_code : ''
|
||||
};
|
||||
addError.value = '';
|
||||
// 重置文本框高度
|
||||
@ -430,8 +410,7 @@ const openAddModal = () => {
|
||||
qq_code: user && user.qq_code ? user.qq_code : '',
|
||||
sendcontent: '',
|
||||
author: '',
|
||||
author_contact: '',
|
||||
replyTo: ''
|
||||
author_contact: ''
|
||||
};
|
||||
addError.value = '';
|
||||
showAddModal.value = true;
|
||||
@ -506,36 +485,12 @@ const submitReply = async () => {
|
||||
addLoading.value = true;
|
||||
addError.value = '';
|
||||
try {
|
||||
const now = new Date();
|
||||
const dateStr = `${now.getFullYear()}-${(now.getMonth()+1).toString().padStart(2,'0')}-${now.getDate().toString().padStart(2,'0')} ${now.getHours().toString().padStart(2,'0')}:${now.getMinutes().toString().padStart(2,'0')}:${now.getSeconds().toString().padStart(2,'0')}`;
|
||||
|
||||
// 拼接回复内容
|
||||
let newReply = '';
|
||||
if (addForm.value.replyTo !== '' && replyOptions.value.length > 0) {
|
||||
const targetMsg = replyOptions.value.find(msg => String(msg.id) === String(addForm.value.replyTo));
|
||||
let targetName = targetMsg && targetMsg.nickname ? targetMsg.nickname : '';
|
||||
newReply = `${addForm.value.author}（${addForm.value.author_contact}）回复${targetName ? ' ' + targetName : ''}：${addForm.value.sendcontent}`;
|
||||
} else {
|
||||
newReply = `${addForm.value.author}（${addForm.value.author_contact}）：${addForm.value.sendcontent}`;
|
||||
}
|
||||
|
||||
const formattedContent = reply.value.sendcontent
|
||||
? `${reply.value.sendcontent}|${newReply}`
|
||||
: newReply;
|
||||
|
||||
const payload = {
|
||||
requester: reply.value.requester || '',
|
||||
sendcontent: formattedContent,
|
||||
content: reply.value.content,
|
||||
reward: reply.value.reward || '',
|
||||
date: dateStr,
|
||||
qq_code: reply.value.qq_code || '',
|
||||
author: addForm.value.author,
|
||||
author_contact: addForm.value.author_contact
|
||||
const replyData = {
|
||||
reply: addForm.value.sendcontent
|
||||
};
|
||||
|
||||
console.log('提交的回复数据:', payload);
|
||||
await updateDemand(reply.value.id, payload);
|
||||
console.log('提交的回复数据:', replyData);
|
||||
await addDemandReply(reply.value.id, replyData);
|
||||
replyModal.value = false;
|
||||
resetReplyForm();
|
||||
fetchDemands(); // 刷新列表
|
||||
@ -563,12 +518,28 @@ function autoResize() {
|
||||
}
|
||||
|
||||
function extractQQ(str) {
|
||||
// 首先尝试解析 qq:内容 格式
|
||||
const qqMatch = str.match(/^(\d+):(.+)$/)
|
||||
if (qqMatch) {
|
||||
return qqMatch[1]
|
||||
}
|
||||
|
||||
// 兼容原有的昵称（QQ号）格式
|
||||
const match = str.match(/[（(]([1-9][0-9]{4,})[）)]/)
|
||||
return match ? match[1] : ''
|
||||
}
|
||||
|
||||
function parseReplyText(str) {
|
||||
// 兼容全角/半角括号，允许有空格
|
||||
// 首先尝试解析 qq:内容 格式
|
||||
const qqMatch = str.match(/^(\d+):(.+)$/)
|
||||
if (qqMatch) {
|
||||
return {
|
||||
user: qqMatch[1],
|
||||
content: qqMatch[2].trim()
|
||||
}
|
||||
}
|
||||
|
||||
// 兼容原有的昵称（QQ号）格式，允许有空格
|
||||
const match = str.match(/^(.+?[（(][1-9][0-9]{4,}[）)])(.*)$/)
|
||||
if (match) {
|
||||
// match[1] 是昵称（QQ号），match[2] 是剩余内容（可能有"回复 xxx "等）
|
||||
@ -634,7 +605,16 @@ function handleDeleteDemand() {
|
||||
|
||||
async function confirmDelete() {
|
||||
try {
|
||||
await deleteDemand(pendingDeleteId.value)
|
||||
// 使用updateDemand API，在content前面添加&DEL标记
|
||||
const updatedContent = `&DEL${selectedDemand.value.content}`
|
||||
await updateDemand(pendingDeleteId.value, {
|
||||
requester: selectedDemand.value.requester,
|
||||
qq_code: selectedDemand.value.qq_code,
|
||||
content: updatedContent,
|
||||
reward: selectedDemand.value.reward,
|
||||
date: selectedDemand.value.date,
|
||||
sendcontent: selectedDemand.value.sendcontent
|
||||
})
|
||||
fetchDemands()
|
||||
closeModal()
|
||||
} catch (e) {
|
||||
|
||||
@ -74,7 +74,7 @@
|
||||
error: null,
|
||||
currentPage: 1,
|
||||
itemsPerPage: 100,
|
||||
apiBaseUrl: 'http://zybdatasupport.online:8000',
|
||||
apiBaseUrl: 'https://zybdatasupport.online',
|
||||
categoryList: [],
|
||||
selectedCategory: '全部',
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user