shiran/ApiServer-Web-admin_dashboard_pc
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

master #15

Merged
shiran merged 2 commits from master into deploy 2025-12-20 15:47:29 +08:00
Conversation 0 Commits 2 Files Changed 4
+236 -22
4 changed files with 236 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 978b18d5d5 - Show all commits
src/api/ticket.js
+7 -2
View File
@@ -5,8 +5,13 @@ import request from "@/utils/request.js";
* @returns {Promise}
*/
export function getTickerList(count, page, status) {
return request.get('/api/v1/admin/work_order/list', { count, page, status })
export function getTickerList(count, page, status, orderBy, order) {
const params = { count, page }
if (status !== undefined && status !== '') params.status = status
if (orderBy) params.orderBy = orderBy
if (order) params.order = order
console.log('工单列表请求参数:', params) // 调试日志
return request.get('/api/v1/admin/work_order/list', params)
}
// 待处理
src/views/product/ProductList.vue
+16 -4
View File
@@ -678,7 +678,10 @@ const paramValueForm = reactive({
attr_id: undefined,
attr_name: '',
attr_value: '',
attr_price: 0
attr_price: 0,
index: 0,
attr_range: 0,
range_type: 'equal'
})
const paramValueRules = {
@@ -825,7 +828,10 @@ const handleAddParamValue = () => {
attr_id: undefined,
attr_name: '',
attr_value: '',
attr_price: 0
attr_price: 0,
index: 0,
attr_range: 0,
range_type: 'equal'
})
paramValueFormRef.value?.resetFields()
}
@@ -838,7 +844,10 @@ const handleEditParamValue = (row) => {
attr_id: row.id,
attr_name: row.name,
attr_value: row.value,
attr_price: row.price / 100
attr_price: row.price / 100,
index: row.index || 0,
attr_range: row.attr_range || 0,
range_type: row.range_type || 'equal'
})
}
@@ -872,7 +881,10 @@ const submitParamValueForm = () => {
arg_id: Number(currentParam.value.id),
attr_name: paramValueForm.attr_name,
attr_value: paramValueForm.attr_value,
attr_price: paramValueForm.attr_price
attr_price: paramValueForm.attr_price,
index: Number(paramValueForm.index),
attr_range: Number(paramValueForm.attr_range),
range_type: paramValueForm.range_type
}
if (paramValueFormType.value === 'edit') {
submitData.attr_id = paramValueForm.attr_id
src/views/ticket/TicketDetail.vue
+166 -10
View File
@@ -56,9 +56,17 @@
</div>
<div class="header-right" v-if="ticketInfo">
<span class="ticket-id">工单号: {{ ticketInfo.id }}</span>
<el-tag :type="getStatusType(ticketInfo.status)" size="small">
{{ getStatusText(ticketInfo.status) }}
</el-tag>
<el-select
v-model="ticketInfo.status"
size="small"
style="width: 120px"
@change="handleStatusChange"
>
<el-option label="待处理" value="pending" />
<el-option label="处理中" value="processing" />
<el-option label="已回复" value="replied" />
<el-option label="已完成" value="completed" />
</el-select>
<el-button
v-if="ticketInfo.status !== 'completed'"
type="success"
@@ -124,13 +132,21 @@
</div>
<!-- 输入框 -->
<div class="input-area">
<div
class="input-area"
@drop.prevent="handleDrop"
@dragover.prevent="handleDragOver"
@dragleave.prevent="handleDragLeave"
:class="{ 'drag-over': isDragOver }"
>
<el-input
ref="textareaRef"
v-model="messageInput"
type="textarea"
:rows="3"
placeholder="请输入回复内容..."
placeholder="请输入回复内容（支持粘贴图片和拖拽图片）..."
@keyup.ctrl.enter="sendMessage"
@paste="handlePaste"
/>
<div class="input-actions">
<div class="left-actions">
@@ -174,7 +190,7 @@
import { ref, onMounted, nextTick, onBeforeUnmount, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getTicketDetail, replyTicket, closeTicket } from '@/api/ticket'
import { getTicketDetail, replyTicket, closeTicket, updateTicketInfo } from '@/api/ticket'
import { getUserInfo } from '@/api/admin/user'
import { uploadFile } from '@/api/admin/file'
import { useUserStore } from '@/store/userStore'
@@ -200,6 +216,8 @@ const messageInput = ref('')
const selectedImages = ref([])
const selectedFiles = ref([]) // 存储原始文件对象
const messagesContainer = ref(null)
const textareaRef = ref(null)
const isDragOver = ref(false)
// 图片查看
const imageViewerVisible = ref(false)
@@ -283,7 +301,7 @@ const fetchTicketDetail = async (showLoading = true) => {
if (res.code === 200) {
const detail = res.data
ticketInfo.value = {
id: detail.work_id,
id: detail.id,
title: detail.name,
username: detail.user?.userName || `用户${detail.user?.userId || 'Unknown'}`,
userId: detail.user?.userId,
@@ -432,6 +450,38 @@ const sendMessage = async () => {
}
}
// 修改工单状态
const handleStatusChange = async (newStatus) => {
const statusMap = {
'pending': 0,
'processing': 1,
'replied': 2,
'completed': 3
}
const oldStatus = ticketInfo.value.status
try {
const formData = new FormData()
formData.append('work_id', route.query.id)
formData.append('Status', statusMap[newStatus])
const res = await updateTicketInfo(formData)
if (res.code === 200) {
ElMessage.success('工单状态已更新')
ticketInfo.value.status = newStatus
} else {
ElMessage.error(res.message || '更新失败')
ticketInfo.value.status = oldStatus // 恢复原状态
}
} catch (error) {
console.error('更新工单状态出错:', error)
ElMessage.error('网络错误，请稍后重试')
ticketInfo.value.status = oldStatus // 恢复原状态
}
}
// 结束工单
const handleComplete = () => {
ElMessageBox.confirm('确定要结束此工单吗？结束后将无法继续回复。', '确认操作', {
@@ -456,14 +506,81 @@ const handleComplete = () => {
// 图片处理
const handleFileChange = (file) => {
if (!file) return
addImageFile(file.raw)
}
// 添加图片文件（统一处理函数）
const addImageFile = (file) => {
// 验证文件类型
if (!file.type.startsWith('image/')) {
ElMessage.warning('只支持图片格式')
return
}
// 验证文件大小（限制10MB）
if (file.size > 10 * 1024 * 1024) {
ElMessage.warning('图片大小不能超过10MB')
return
}
// 保存原始文件对象用于上传
selectedFiles.value.push(file.raw)
selectedFiles.value.push(file)
// 读取文件用于预览
const reader = new FileReader()
reader.onload = (e) => selectedImages.value.push(e.target.result)
reader.readAsDataURL(file.raw)
reader.readAsDataURL(file)
}
// 处理粘贴事件
const handlePaste = (e) => {
const items = e.clipboardData?.items
if (!items) return
for (let i = 0; i < items.length; i++) {
const item = items[i]
if (item.type.indexOf('image') !== -1) {
e.preventDefault()
const file = item.getAsFile()
if (file) {
addImageFile(file)
ElMessage.success('图片已添加')
}
}
}
}
// 处理拖拽进入
const handleDragOver = (e) => {
isDragOver.value = true
}
// 处理拖拽离开
const handleDragLeave = (e) => {
isDragOver.value = false
}
// 处理文件拖放
const handleDrop = (e) => {
isDragOver.value = false
const files = e.dataTransfer?.files
if (!files || files.length === 0) return
let addedCount = 0
for (let i = 0; i < files.length; i++) {
const file = files[i]
if (file.type.startsWith('image/')) {
addImageFile(file)
addedCount++
}
}
if (addedCount > 0) {
ElMessage.success(`已添加 ${addedCount} 张图片`)
} else {
ElMessage.warning('未找到图片文件')
}
}
const removeImage = (index) => {
@@ -606,10 +723,24 @@ watch(
onMounted(() => {
fetchTicketDetail()
startAutoRefresh()
// 绑定粘贴事件到原生 textarea
nextTick(() => {
const textarea = textareaRef.value?.$el?.querySelector('textarea')
if (textarea) {
textarea.addEventListener('paste', handlePaste)
}
})
})
onBeforeUnmount(() => {
stopAutoRefresh()
// 移除粘贴事件监听
const textarea = textareaRef.value?.$el?.querySelector('textarea')
if (textarea) {
textarea.removeEventListener('paste', handlePaste)
}
})
</script>
@@ -645,7 +776,10 @@ onBeforeUnmount(() => {
.ticket-id {
font-weight: 500;
color: #606266;
color: #303133;
font-size: 14px;
white-space: nowrap;
flex-shrink: 0;
}
.user-info {
@@ -849,6 +983,28 @@ onBeforeUnmount(() => {
display: flex;
flex-direction: column;
gap: 12px;
position: relative;
transition: all 0.3s;
}
.input-area.drag-over {
background: #f0f9ff;
border: 2px dashed #409eff;
border-radius: 4px;
padding: 8px;
}
.input-area.drag-over::before {
content: '释放以添加图片';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #409eff;
font-size: 14px;
font-weight: 500;
pointer-events: none;
z-index: 1;
}
.input-actions {
src/views/ticket/TicketList.vue
+47 -6
View File
@@ -3,9 +3,6 @@
<!-- 顶部工具栏 -->
<div class="toolbar">
<div class="status-tabs">
<div class="tab-item" :class="{ active: activeStatus === '' }" @click="filterByStatus('')">
全部 <span class="count">{{ stats.total }}</span>
</div>
<div class="tab-item pending" :class="{ active: activeStatus === 'pending' }" @click="filterByStatus('pending')">
待处理 <span class="count">{{ stats.pending }}</span>
</div>
@@ -18,8 +15,22 @@
<div class="tab-item completed" :class="{ active: activeStatus === 'completed' }" @click="filterByStatus('completed')">
已完成 <span class="count">{{ stats.completed }}</span>
</div>
<div class="tab-item" :class="{ active: activeStatus === '' }" @click="filterByStatus('')">
全部 <span class="count">{{ stats.total }}</span>
</div>
</div>
<div class="toolbar-right">
<el-select v-model="sortBy" placeholder="排序方式" clearable style="width: 140px" @change="handleSortChange">
<el-option label="不排序" value="" />
<el-option label="创建时间" value="created_at" />
<el-option label="更新时间" value="updated_at" />
<el-option label="工单号" value="id" />
</el-select>
<el-select v-model="sortOrder" placeholder="排序顺序" clearable style="width: 100px" @change="handleSortChange">
<el-option label="默认" value="" />
<el-option label="降序" value="desc" />
<el-option label="升序" value="asc" />
</el-select>
<el-input
v-model="searchKeyword"
placeholder="搜索工单号、标题、用户名"
@@ -92,7 +103,7 @@
</template>
<script setup>
import { ref, reactive, computed, onMounted } from 'vue'
import { ref, reactive, computed, onMounted, onActivated } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus'
import {
@@ -112,7 +123,11 @@ const isLoading = ref(false)
// 工单数据
const ticketList = ref([])
const searchKeyword = ref('')
const activeStatus = ref('')
const activeStatus = ref('pending') // 默认选中"待处理"
// 排序
const sortBy = ref('') // 默认不排序
const sortOrder = ref('') // 默认不选择排序顺序
// 统计数据
const stats = reactive({
@@ -125,6 +140,8 @@ const stats = reactive({
// 状态转换
const convertStatusToString = (status) => {
const statusMap = { 0: 'pending', 1: 'processing', 2: 'replied', 3: 'completed' }
@@ -151,7 +168,14 @@ const fetchTicketList = async () => {
statusParam = statusMap[activeStatus.value] || ''
}
const res = await getTickerList(pageSize.value, currentPage.value, statusParam)
console.log('调用getTickerList，排序参数:', { sortBy: sortBy.value, sortOrder: sortOrder.value })
const res = await getTickerList(
pageSize.value,
currentPage.value,
statusParam,
sortBy.value,
sortOrder.value
)
if (res.code === 200) {
ticketList.value = (res.data.data || []).map(item => ({
@@ -212,6 +236,12 @@ const filterByStatus = (status) => {
fetchTicketList()
}
// 排序变化处理
const handleSortChange = () => {
currentPage.value = 1
fetchTicketList()
}
// 搜索处理
const handleSearch = () => {}
@@ -261,10 +291,21 @@ const handleComplete = (ticket) => {
}).catch(() => {})
}
let isFirstLoad = true
onMounted(() => {
fetchTicketList()
fetchStats()
})
// 当页面被激活时（从详情页返回时）
onActivated(() => {
// 跳过首次加载，只在从其他页面返回时刷新
if (!isFirstLoad) {
refreshList()
}
isFirstLoad = false
})
</script>
<style scoped>