@@ -169,12 +169,18 @@
<view class="timeline-dot" :class="getTimelineDotClass(item.status)"></view>
<view class="timeline-line" v-if="index < processList.length - 1"></view>
<view class="timeline-body">
<view class="timeline-header">
<text class="timeline-actor">{{ item.actor }}</text>
<text class="timeline-action">{{ item.action }}</text>
<text class="timeline-time">{{ getTime(item.createTime) }}</text>
<text class="timeline-date">{{ getDate(item.createTime) }}</text>
</view>
<view class="timeline-info">
<text class="timeline-action" >{{ getActionText(item.action) }}:</text>
<text class="timeline-desc">{{ item.message }}</text>
</view>
<view class="timeline-files">
</view>
<text class="timeline-desc" v-if="item.desc">{{ item.desc }}</text>
<text class="timeline-time">{{ item.time }}</text>
</view>
</view>
</view>
@@ -206,20 +212,11 @@
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { ref, onMounted, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import type { TbWorkcaseDTO, TbWorkcaseProcessDTO } from '@/types/workcase'
import { workcaseAPI, fileAPI } from '@/api'
// 接口定义
interface ProcessItem {
status: 'system' | 'manager' | 'engineer'
actor: string
action: string
desc?: string
time: string
}
// 响应式数据
const headerPaddingTop = ref<number>(44)
const headerTotalHeight = ref<number>(88)
@@ -233,10 +230,10 @@ const emergencies = ref<string[]>(['普通', '紧急'])
const emergencyIndex = ref<number>(0)
// 工单数据
const workcase = ref <TbWorkcaseDTO>({})
const workcase = reactive <TbWorkcaseDTO>({})
// 处理记录
const processList = ref< ProcessItem []>([])
const processList = reactive<TbWorkcase ProcessDTO []>([])
// 获取图片 URL( 通过 fileId)
function getImageUrl(fileId: string): string {
@@ -278,7 +275,8 @@ onLoad((options: any) => {
console.error('读取loginDomain失败:', e)
}
workcase.value = {
// 使用 Object.assign 更新 reactive 对象
Object.assign(workcase, {
username,
phone,
userId,
@@ -289,7 +287,7 @@ onLoad((options: any) => {
description: '',
emergency: 'normal',
imgs: []
}
})
} else if (options.workcaseId) {
// 查看模式
workcaseId.value = options.workcaseId
@@ -319,44 +317,49 @@ onMounted(() => {
})
// 加载工单详情
async function loadWorkcaseDetail(id : string) {
uni.showLoading({ title: '加载中...' })
try {
const res = await workcaseAPI.getWorkcaseById(i d)
if (res.success && res.data) {
workcase.value = res.data
// 加载处理记录
await loadProcessList(id )
} else {
uni.showToast({ title: res.message || '加载失败', icon: 'none' } )
async function loadWorkcaseDetail(workcaseId : string) {
uni.showLoading({ title: '加载中...' })
try {
const res = await workcaseAPI.getWorkcaseById(workcaseI d)
if (res.success && res.data) {
// 使用 Object.assign 更新 reactive 对象
Object.assign(workcase, res.data)
console.log('工单详情:', workcase )
// 加载处理记录
await loadProcessList(workcaseId )
} else {
uni.showToast({ title: res.message || '加载失败', icon: 'none' })
}
} catch (error) {
console.error('加载工单详情失败:', error)
uni.showToast({ title: '加载失败', icon: 'none' })
} finally {
uni.hideLoading()
}
} catch (error) {
console.error('加载工单详情失败:', error)
uni.showToast({ title: '加载失败', icon: 'none' })
} finally {
uni.hideLoading()
}
}
// 加载处理记录
async function loadProcessList(i d: string) {
async function loadProcessList(workcaseI d: string) {
try {
const res = await workcaseAPI.getWorkcaseProcessList({ workcaseId: i d })
const res = await workcaseAPI.getWorkcaseProcessList({ workcaseId: workcaseI d })
if (res.success && res.dataList) {
// 转换为界面需要的格式
processList.value = res.dataList.map((item: TbWorkcaseProcessDTO) => ({
status: item.processorType === 'system' ? 'system' : item.processorType === 'manager' ? 'manager' : 'engineer',
actor: item.processorName || '未知',
action: item.action || '',
desc: item.description || '',
time: item.createTime || ''
}))
// 清空并重新填充 reactive 数组
processList.length = 0
processList.push(...res.dataList)
console.log('处理记录:', processList)
}
} catch (error) {
console.error('加载处理记录失败:', error)
}
}
function getTime(datetime: string): string{
return datetime.split(" ")[1]
}
function getDate(datetime: string): string{
return datetime.split(" ")[0]
}
// 获取状态样式类
function getStatusClass(status?: string): string {
switch (status) {
@@ -378,23 +381,51 @@ function getStatusText(status?: string): string {
}
// 获取时间线圆点样式类
function getTimelineDotClass(status : string): string {
switch (status ) {
case 'system': return 'dot-system'
case 'manager': return 'dot-manager'
case 'engineer': return 'dot-engineer '
default: return 'dot-system'
function getTimelineDotClass(action? : string): string {
switch (action ) {
case 'create':
case 'info':
return 'dot-system '
case 'assign':
case 'redeploy':
return 'dot-manager'
case 'finish':
return 'dot-engineer'
case 'repeal':
return 'dot-cancel'
default:
return 'dot-system'
}
}
// 获取动作文本
function getActionText(action?: string): string {
switch (action) {
case 'create':
return '工单创建'
case 'info':
return '记录信息'
case 'assign':
return '指派工程师'
case 'redeploy':
return '转派工程师'
case 'repeal':
return '撤销工单'
case 'finish':
return '完成工单'
default:
return '未知操作'
}
}
// 查看对话
function handleViewChat() {
if (!workcase.value. roomId) {
if (!workcase.roomId) {
uni.showToast({ title: '未关联聊天室', icon: 'none' })
return
}
uni.navigateTo({
url: `/pages/chatRoom/chatRoom/chatRoom?roomId=${workcase.value. roomId}`
url: `/pages/chatRoom/chatRoom/chatRoom?roomId=${workcase.roomId}`
})
}
@@ -427,23 +458,23 @@ function handleComplete() {
// 表单选择器事件
function onTypeChange(e: any) {
typeIndex.value = e.detail.value
workcase.value. type = faultTypes.value[e.detail.value]
workcase.type = faultTypes.value[e.detail.value]
}
function onEmergencyChange(e: any) {
emergencyIndex.value = e.detail.value
workcase.value. emergency = emergencyIndex.value === 0 ? 'normal' : 'emergency'
workcase.emergency = emergencyIndex.value === 0 ? 'normal' : 'emergency'
}
// 选择故障图片
async function chooseFaultImages() {
uni.chooseImage({
count: 9 - (workcase.value. imgs?.length || 0),
count: 9 - (workcase.imgs?.length || 0),
sizeType: ['compressed'],
sourceType: ['camera', 'album'],
success: async (res) => {
if (!workcase.value. imgs) {
workcase.value. imgs = []
if (!workcase.imgs) {
workcase.imgs = []
}
// 上传图片到服务器
@@ -452,7 +483,7 @@ async function chooseFaultImages() {
const uploadPromises = res.tempFilePaths.map(filePath =>
fileAPI.uploadFile(filePath, {
module: 'workcase',
optsn: workcase.value. workcaseId || 'temp'
optsn: workcase.workcaseId || 'temp'
})
)
@@ -462,7 +493,7 @@ async function chooseFaultImages() {
results.forEach(result => {
if (result.success && result.data?.fileId) {
// 存储 fileId, 用于提交时使用
workcase.value. imgs!.push(result.data.fileId)
workcase.imgs!.push(result.data.fileId)
}
})
@@ -482,8 +513,8 @@ async function chooseFaultImages() {
// 删除故障图片
function deleteFaultImage(index: number) {
if (workcase.value. imgs) {
workcase.value. imgs.splice(index, 1)
if (workcase.imgs) {
workcase.imgs.splice(index, 1)
}
}
@@ -499,11 +530,11 @@ async function chooseNameplateImage() {
try {
const result = await fileAPI.uploadFile(res.tempFilePaths[0], {
module: 'workcase',
optsn: workcase.value. workcaseId || 'temp'
optsn: workcase.workcaseId || 'temp'
})
if (result.success && result.data?.fileId) {
workcase.value. deviceNamePlateImg = result.data.fileId
workcase.deviceNamePlateImg = result.data.fileId
uni.hideLoading()
uni.showToast({ title: '上传成功', icon: 'success' })
} else {
@@ -524,13 +555,13 @@ async function chooseNameplateImage() {
// 删除铭牌照片
function deleteNameplateImage() {
workcase.value. deviceNamePlateImg = ''
workcase.deviceNamePlateImg = ''
}
// 预览铭牌照片
function previewNameplateImage() {
if (!workcase.value. deviceNamePlateImg) return
const imageUrl = getImageUrl(workcase.value. deviceNamePlateImg)
if (!workcase.deviceNamePlateImg) return
const imageUrl = getImageUrl(workcase.deviceNamePlateImg)
uni.previewImage({
urls: [imageUrl],
current: 0
@@ -539,9 +570,9 @@ function previewNameplateImage() {
// 预览故障图片
function previewFaultImages(index: number) {
if (!workcase.value. imgs || workcase.value. imgs.length === 0) return
if (!workcase.imgs || workcase.imgs.length === 0) return
// 将 fileId 数组转换为 URL 数组
const imageUrls = workcase.value. imgs.map(fileId => getImageUrl(fileId))
const imageUrls = workcase.imgs.map(fileId => getImageUrl(fileId))
uni.previewImage({
urls: imageUrls,
current: index
@@ -551,35 +582,35 @@ function previewFaultImages(index: number) {
// 提交工单
async function submitWorkcase() {
// 校验必填项
if (!workcase.value. username) {
if (!workcase.username) {
uni.showToast({ title: '请输入客户姓名', icon: 'none' })
return
}
if (!workcase.value. phone) {
if (!workcase.phone) {
uni.showToast({ title: '请输入联系电话', icon: 'none' })
return
}
if (!workcase.value. device) {
if (!workcase.device) {
uni.showToast({ title: '请输入设备名称', icon: 'none' })
return
}
if (!workcase.value. type) {
if (!workcase.type) {
uni.showToast({ title: '请选择故障类型', icon: 'none' })
return
}
if (!workcase.value. address) {
if (!workcase.address) {
uni.showToast({ title: '请输入现场地址', icon: 'none' })
return
}
if (!workcase.value. description) {
if (!workcase.description) {
uni.showToast({ title: '请输入故障描述', icon: 'none' })
return
}
if (!workcase.value. deviceNamePlateImg) {
if (!workcase.deviceNamePlateImg) {
uni.showToast({ title: '请上传设备铭牌照片', icon: 'none' })
return
}
if (!workcase.value. imgs || workcase.value. imgs.length === 0) {
if (!workcase.imgs || workcase.imgs.length === 0) {
uni.showToast({ title: '请至少上传一张故障图片', icon: 'none' })
return
}
@@ -588,7 +619,7 @@ async function submitWorkcase() {
try {
// 调用 API 提交工单
const res = await workcaseAPI.createWorkcase(workcase.value )
const res = await workcaseAPI.createWorkcase(workcase)
uni.hideLoading()
if (res.success && res.data) {
@@ -599,7 +630,7 @@ async function submitWorkcase() {
// 创建成功后直接回到该聊天室(闭环)
setTimeout(() => {
uni.redirectTo({
url: `/pages/chatRoom/chatRoom/chatRoom?roomId=${workcase.value. roomId}&workcaseId=${res.data.workcaseId || ''}`
url: `/pages/chatRoom/chatRoom/chatRoom?roomId=${workcase.roomId}&workcaseId=${res.data.workcaseId || ''}`
})
}, 600)
} else {