我的工单
This commit is contained in:
parent
2314d15847
commit
00149a359b
|
|
@ -5,4 +5,6 @@ export const ticketPoolList = (data : any = {}) => get('v1/ticket/pool/list', da
|
|||
// 工单详情（工单池）
|
||||
export const ticketPoolInfo = (data : any = {}) => get('v1/ticket/pool/info', data);
|
||||
// 接单接口
|
||||
export const ticketAccept = (data : any = {}) => get('v1/ticket/accept', data);
|
||||
export const ticketAccept = (data : any = {}) => get('v1/ticket/accept', data);
|
||||
// 我的工单
|
||||
export const myTicketList = (data : any = {}) => get('v1/ticket/my/list', data);
|
||||
|
|
@ -12,12 +12,12 @@
|
|||
</view>
|
||||
<!-- 搜索框 -->
|
||||
<view class="li-w-90% li-mx-auto li-mt-15 li-mb-25">
|
||||
<wd-search placeholderStyle="color:#d9d9d9" v-model="keyword" placeholder="工单编号/业主姓名" hide-cancel
|
||||
placeholder-left></wd-search>
|
||||
<wd-search placeholderStyle="color:#d9d9d9" v-model="query.ticket_no" placeholder="工单编号查询" hide-cancel
|
||||
placeholder-left @search="search"></wd-search>
|
||||
</view>
|
||||
<!-- 工单类型tabs -->
|
||||
<view class="li-flex li-items-center">
|
||||
<wd-tabs v-model="activeTab" slidable="auto" :slidable-num="4" :map-num='4'>
|
||||
<wd-tabs v-model="activeTab" slidable="auto" :slidable-num="4" :map-num='4' @click="tabChange">
|
||||
<block v-for="(item, index) in tabList" :key="index">
|
||||
<wd-tab :title="item.name" :badge-props="item.badgeProps"></wd-tab>
|
||||
</block>
|
||||
|
|
@ -30,70 +30,58 @@
|
|||
</view>
|
||||
<view class="li-flex li-items-center li-mx-auto li-w-92% li-mt-check-costom">
|
||||
<text v-for="(item,index) in orderStatusList" :key="index"
|
||||
:class="item.id==currentStatus?'space-check':'space-checkOut'" @click="handleStatusChange(item.id)">
|
||||
:class="item.id==query.status?'space-check':'space-checkOut'" @click="handleStatusChange(item.id)">
|
||||
{{item.title}}
|
||||
</text>
|
||||
</view>
|
||||
|
||||
<!-- 工单列表 -->
|
||||
<view class="li-w-92% li-mx-auto li-mt-list-costom">
|
||||
<!-- 商城待配送工单 -->
|
||||
<template v-if="activeTab === 0">
|
||||
<view v-for="(item, index) in deliveryList" :key="index" @click="toPages({type:'detail',value:item})"
|
||||
class="li-task-card li-bg-white li-mt-20 li-rd-15 li-pt-25 li-pb-30 li-px-30">
|
||||
<view class="li-flex li-items-center li-justify-between li-bottom-border2 li-pb-15">
|
||||
<view class="li-text-28 li-flex li-items-center li-justify-between li-text-#999">
|
||||
<text class="ri-todo-line sli-mr-3"></text>
|
||||
{{item.number}}
|
||||
<text class="ri-file-copy-line li-text-#009aff li-ml-15"></text>
|
||||
</view>
|
||||
<wd-tag custom-class="space" :color="getStatusColor(item.status)"
|
||||
:bg-color="getStatusBgColor(item.status)">
|
||||
{{getStatusText(item.status)}}
|
||||
</wd-tag>
|
||||
<view v-for="(item, index) in taskList" :key="index" @click="toPages({type:'detail',value:item})"
|
||||
class="li-task-card li-bg-white li-mt-20 li-rd-15 li-pt-25 li-pb-30 li-px-30">
|
||||
<view class="li-flex li-items-center li-justify-between li-bottom-border2 li-pb-15">
|
||||
<view class="li-text-28 li-flex li-items-center li-justify-between li-text-#999">
|
||||
<text class="ri-todo-line sli-mr-3"></text>
|
||||
{{item.ticket_no}}
|
||||
<text class="ri-file-copy-line li-text-#009aff li-ml-15"></text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">配送地址</text>
|
||||
<text>{{item.address}}</text>
|
||||
</view>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">收货人</text>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">联系方式</text>
|
||||
<text>{{item.phone}}</text>
|
||||
</view>
|
||||
<view class="li-mt-20 bg-#f9f9f9 li-rd-10 li-p-15 li-text-24">
|
||||
<text>{{item.remarks}}</text>
|
||||
</view>
|
||||
<wd-tag custom-class="space" :color="getStatusColor(item.status)"
|
||||
:bg-color="getStatusBgColor(item.status)">
|
||||
{{getStatusText(item.status)}}
|
||||
</wd-tag>
|
||||
</view>
|
||||
<view>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">配送地址</text>
|
||||
<text>{{item.address}}</text>
|
||||
</view>
|
||||
<view class="li-flex li-items-center li-justify-between li-mt-20">
|
||||
<text class="li-text-24 li-text-#999">{{item.time}}</text>
|
||||
<wd-button custom-class="custom-shadow" size="small" v-if="item.status === 1">开始配送</wd-button>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">收货人</text>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<view class="li-flex li-items-center li-justify-between li-text-26 li-mt-20">
|
||||
<text class="li-text-#9a9a9a">联系方式</text>
|
||||
<text>{{item.phone}}</text>
|
||||
</view>
|
||||
<view class="li-mt-20 bg-#f9f9f9 li-rd-10 li-p-15 li-text-24">
|
||||
<text>{{item.remarks}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 维修工单 -->
|
||||
<template v-if="activeTab === 1">
|
||||
<view v-for="(item, index) in repairList" :key="index"
|
||||
class="li-task-card li-bg-white li-mt-20 li-rd-15 li-pt-25 li-pb-30 li-px-30">
|
||||
<!-- 维修工单内容结构类似，根据需要调整显示字段 -->
|
||||
<view class="li-flex li-items-center li-justify-between li-mt-20">
|
||||
<text class="li-text-24 li-text-#999">{{item.time}}</text>
|
||||
<wd-button custom-class="custom-shadow" size="small" v-if="item.status === 1">开始配送</wd-button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 其他类型工单... -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { onLoad, onShow, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'
|
||||
import SafeAreaTop from '@/components/SafeAreaTop/index.vue'
|
||||
import { useNavigation } from '@/hooks/useNavigation'
|
||||
import { myTicketList } from '@/api/ticket'
|
||||
// 使用导航 composable
|
||||
const {
|
||||
hasMultiplePages, // 是否有多个页面在路由栈中
|
||||
|
|
@ -101,14 +89,56 @@
|
|||
checkRouteStack // 检查当前路由栈状态的方法
|
||||
} = useNavigation()
|
||||
|
||||
|
||||
onLoad(() => {
|
||||
checkRouteStack()
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
query.value.page = 1
|
||||
taskList.value = []
|
||||
poolList()
|
||||
})
|
||||
|
||||
onPullDownRefresh(() => {
|
||||
query.value.page = 1
|
||||
taskList.value = []
|
||||
poolList()
|
||||
setTimeout(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
}, 300)
|
||||
})
|
||||
|
||||
onReachBottom(() => {
|
||||
if (finish.value) return
|
||||
query.value.page++
|
||||
poolList()
|
||||
})
|
||||
|
||||
const poolList = async () => {
|
||||
loading.value = true
|
||||
const res = await myTicketList(query.value)
|
||||
loading.value = false
|
||||
if (res.data.length < query.value.limit) {
|
||||
finish.value = true
|
||||
}
|
||||
taskList.value.push(...res.data)
|
||||
}
|
||||
|
||||
const query = ref({
|
||||
page: 1,
|
||||
limit: 10,
|
||||
type: 'ALL',
|
||||
status: 'ALL',
|
||||
ticket_no: ''
|
||||
})
|
||||
|
||||
const finish = ref<boolean>(false)
|
||||
const loading = ref<boolean>(false)
|
||||
const keyword = ref('')
|
||||
const activeTab = ref(0)
|
||||
const status = ref('0')
|
||||
const currentStatus = ref(0) // 默认选中"未完成"
|
||||
const taskList = ref([])
|
||||
|
||||
// tab列表
|
||||
const tabList = ref([
|
||||
|
|
@ -116,20 +146,12 @@
|
|||
name: '全部',
|
||||
value: 0,
|
||||
badgeProps: {
|
||||
modelValue: 11,
|
||||
modelValue: 0,
|
||||
right: '-8px'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '商品配送',
|
||||
value: 0,
|
||||
badgeProps: {
|
||||
modelValue: 1,
|
||||
right: '-8px'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '维修工单',
|
||||
value: 1,
|
||||
badgeProps: {
|
||||
modelValue: 0,
|
||||
|
|
@ -137,28 +159,28 @@
|
|||
}
|
||||
},
|
||||
{
|
||||
name: '量房工单',
|
||||
name: '维修工单',
|
||||
value: 2,
|
||||
badgeProps: {
|
||||
modelValue: 0,
|
||||
right: '-8px'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// name: '待入库',
|
||||
// value: 3,
|
||||
// badgeProps: {
|
||||
// modelValue: 0,
|
||||
// right: '-8px'
|
||||
// }
|
||||
// }
|
||||
{
|
||||
name: '量房工单',
|
||||
value: 3,
|
||||
badgeProps: {
|
||||
modelValue: 0,
|
||||
right: '-8px'
|
||||
}
|
||||
}
|
||||
])
|
||||
|
||||
|
||||
const orderStatusList = ref([
|
||||
{
|
||||
title: '全部',
|
||||
id: 0
|
||||
id: 'ALL'
|
||||
},
|
||||
{
|
||||
title: '未完成',
|
||||
|
|
@ -170,32 +192,31 @@
|
|||
}
|
||||
])
|
||||
|
||||
// 商城待配送工单列表
|
||||
const deliveryList = ref([
|
||||
{
|
||||
number: 'JD1232122932919',
|
||||
status: 1, // 1待配送 2已完成
|
||||
address: '中金北区17号楼一单元201室',
|
||||
name: '王先生',
|
||||
phone: '177****4485',
|
||||
remarks: '请在下午6点前送达，谢谢。',
|
||||
time: '2024-03-01 10:30'
|
||||
},
|
||||
{
|
||||
number: 'JD1232122932919',
|
||||
status: 2,
|
||||
address: '中金北区2号楼二单元502室',
|
||||
name: '李先生',
|
||||
phone: '138****6678',
|
||||
remarks: '放在门口即可。',
|
||||
time: '2024-03-01 09:15'
|
||||
const tabChange = () => {
|
||||
switch (activeTab.value) {
|
||||
case 1:
|
||||
query.value.type = 'F2'
|
||||
break;
|
||||
case 2:
|
||||
query.value.type = 'F6'
|
||||
break;
|
||||
case 3:
|
||||
query.value.type = 'F4'
|
||||
break;
|
||||
default:
|
||||
query.value.type = 'ALL'
|
||||
break;
|
||||
}
|
||||
])
|
||||
query.value.page = 1
|
||||
taskList.value = []
|
||||
poolList()
|
||||
}
|
||||
|
||||
// 维修工单列表
|
||||
const repairList = ref([
|
||||
// 维修工单数据结构
|
||||
])
|
||||
const search = async () => {
|
||||
query.value.page = 1
|
||||
taskList.value = []
|
||||
poolList()
|
||||
}
|
||||
|
||||
const toPages = (item : any) => {
|
||||
console.log(item);
|
||||
|
|
@ -223,10 +244,10 @@
|
|||
// 状态颜色配置
|
||||
const getStatusColor = (status : number) => {
|
||||
const colorMap = {
|
||||
1: '#ff9d00', // 待配送
|
||||
0: '#ff9d00', // 待配送
|
||||
1: '#37A5FF', // 未入库
|
||||
2: '#00b42a', // 已完成
|
||||
3: '#37A5FF', // 未入库
|
||||
4: '#F42429' // 已取消
|
||||
3: '#F42429' // 已取消
|
||||
}
|
||||
return colorMap[status] || '#666666'
|
||||
}
|
||||
|
|
@ -234,10 +255,10 @@
|
|||
// 状态背景色配置
|
||||
const getStatusBgColor = (status : number) => {
|
||||
const bgColorMap = {
|
||||
1: '#fff6e9', // 待配送
|
||||
0: '#fff6e9', // 待配送
|
||||
1: '#e8f4ff', // 未入库
|
||||
2: '#e8ffea', // 已完成
|
||||
3: '#e8f4ff', // 未入库
|
||||
4: '#ffe8e8' // 已取消
|
||||
3: '#ffe8e8' // 已取消
|
||||
}
|
||||
return bgColorMap[status] || '#f5f5f5'
|
||||
}
|
||||
|
|
@ -245,17 +266,19 @@
|
|||
// 状态文字配置
|
||||
const getStatusText = (status : number) => {
|
||||
const textMap = {
|
||||
1: '待配送',
|
||||
0: '待接单',
|
||||
1: '待完成',
|
||||
2: '已完成',
|
||||
3: '未入库',
|
||||
4: '已取消'
|
||||
3: '已取消'
|
||||
}
|
||||
return textMap[status] || '未知状态'
|
||||
}
|
||||
|
||||
const handleStatusChange = (id : number) => {
|
||||
currentStatus.value = id
|
||||
// 这里可以处理状态切换后的逻辑
|
||||
const handleStatusChange = (id : any) => {
|
||||
query.value.page = 1
|
||||
query.value.status = id
|
||||
taskList.value = []
|
||||
poolList()
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -90,11 +90,17 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<view class="li-flex li-items-start li-justify-between li-mt-30 li-text-28">
|
||||
<view v-if="ticketInfo?.order?.remark" class="li-flex li-items-start li-justify-between li-mt-30 li-text-28">
|
||||
<text class="li-w-150 li-text-#9a9a9a">工单备注</text>
|
||||
<text class="li-w-400 li-two-line li-text-right">{{ticketInfo?.order?.remark}}</text>
|
||||
</view>
|
||||
|
||||
<view v-if="ticketInfo.type == 'F6'"
|
||||
class="li-flex li-items-start li-justify-between li-mt-30 li-text-28">
|
||||
<text class="li-w-150 li-text-#9a9a9a">报修内容</text>
|
||||
<text class="li-w-400 li-two-line li-text-right">{{ticketInfo?.order?.content}}</text>
|
||||
</view>
|
||||
|
||||
<view class="li-flex li-items-start li-justify-between li-mt-30 li-text-28">
|
||||
<text class="li-w-150 li-text-#9a9a9a">工单类型</text>
|
||||
<view class="li-w-400 li-text-right">
|
||||
|
|
@ -104,7 +110,7 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="ticketInfo?.type =='F4' || ticketInfo?.type =='F6'"
|
||||
<view v-if="(ticketInfo?.type =='F4' || ticketInfo?.type =='F6') && ticketInfo.images"
|
||||
class="li-flex li-items-start li-justify-between li-mt-30 li-text-28">
|
||||
<text class="li-w-150 li-text-#9a9a9a">附件上传</text>
|
||||
<view class="li-flex li-flex-col li-w-400 justify-end">
|
||||
|
|
|
|||
Loading…
Reference in New Issue