<!-- 任务统计表格 -->
|
<template>
|
<div class="order-log-update">
|
<el-tabs v-model="activeTab" @tab-click="handleTabChange">
|
<el-tab-pane v-for="tab in tabsList" :key="tab.name" :label="`${tab.label} (${tab.count})`" :name="tab.name">
|
<SearchBox @search="searchClick"></SearchBox>
|
<el-button v-if="permission?.order_log_add && activeTab != 'WAIT_AUDIT'" type="primary" icon="el-icon-plus" @click="handleAddOrder">新建工单
|
</el-button>
|
<el-button type="success" plain icon="el-icon-download" @click="exportData">导出
|
</el-button>
|
<div class="task-table">
|
<el-table border :data="orderListTable" class="custom-header" @cell-click="handleCellClick">
|
<el-table-column label="序号" type="index" width="60">
|
<template #default="{ $index }">
|
{{ ($index + 1 + (orderListParams.current - 1) * orderListParams.size).toString().padStart(2,
|
'0') }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="job_info_num" label="工单编号" width="150" show-overflow-tooltip>
|
<template #default="scope">
|
<el-tooltip-copy :content="scope.row.job_info_num" :showCopyText="true">
|
{{scope.row.job_info_num}}
|
</el-tooltip-copy>
|
</template>
|
</el-table-column>
|
<el-table-column prop="name" label="工单名称" width="100" show-overflow-tooltip>
|
<template #default="scope">
|
<el-tooltip-copy :content="scope.row.name" :showCopyText="true">
|
{{scope.row.name}}
|
</el-tooltip-copy>
|
</template>
|
</el-table-column>
|
<el-table-column prop="dept_name" label="工单状态" width="88">
|
<template #default="scope">
|
<el-tag :type="getStatusTagType(scope.row.status)">{{ getOrderStatus(scope.row.status) }}</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column prop="dept_name" label="所属单位" width="88" show-overflow-tooltip/>
|
<el-table-column prop="create_time" label="创建时间" width="120" show-overflow-tooltip/>
|
<el-table-column prop="job_num" label="已执行次数" width="100" align="center" />
|
<el-table-column prop="content" label="工单内容" show-overflow-tooltip align="center"/>
|
<el-table-column prop="wayline_name" label="关联航线" show-overflow-tooltip />
|
<el-table-column prop="ai_type_str" label="关联算法" width="100" align="center" show-overflow-tooltip/>
|
<el-table-column prop="device_names" label="关联机巢" width="100" align="center" show-overflow-tooltip/>
|
<el-table-column prop="creator_name" label="创建人" width="100" align="center" show-overflow-tooltip />
|
<el-table-column prop="cycle_time_value" label="工单周期频次" width="110" align="center" show-overflow-tooltip />
|
<el-table-column label="操作" width="200" fixed="right" align="center">
|
<template #default="scope">
|
<!-- {{scope.row.status}}-->
|
<template v-if="scope.row.status === 1">
|
<el-button type="text" icon="el-icon-view" v-if="permission.order_log_review" @click="handleCheckDetail(scope.row, '工单审核')">审核</el-button>
|
<!--待审核状态-->
|
<el-button type="text" icon="el-icon-warning" v-if="permission.order_log_recall" @click="revokeOrder(scope.row.id)">撤回</el-button>
|
<el-button type="text" icon="el-icon-view" @click="handleViewDetail(scope.row, '工单详情')">详情</el-button>
|
</template>
|
<!--已驳回-->
|
<template v-if="scope.row.status === 2">
|
<el-button type="text" icon="el-icon-warning" @click="rejectReason(scope.row.id, scope.row)">驳回原因</el-button>
|
<el-button type="text" icon="el-icon-view" @click="handleViewDetail(scope.row, '工单详情')">详情</el-button>
|
<!-- <el-button type="text" icon="el-icon-view" v-if="userInfo.user_id === scope.row.create_user" @click="handleViewDetail(scope.row, '工单编辑')">编辑</el-button>-->
|
<!-- <el-button type="text" icon="el-icon-view" v-else @click="handleViewDetail(scope.row, '工单详情')">详情</el-button>-->
|
</template>
|
<!-- 已通过 -->
|
<template v-if="scope.row.status === 3">
|
<el-button type="text" icon="el-icon-view" @click="handleViewDetail(scope.row, '工单详情')">详情</el-button>
|
</template>
|
<!--草稿-->
|
<!-- <template v-if="scope.row.status === 0">-->
|
<!-- <el-button type="text" icon="el-icon-edit" @click="handleViewDetail(scope.row, '工单编辑')">编辑</el-button>-->
|
<!-- <el-button type="text" icon="el-icon-position" @click="userPublishPush(scope.row.id)">发布</el-button>-->
|
<!-- <el-button type="text" icon="el-icon-delete" @click="deleteOrder(scope.row.id)">删除</el-button>-->
|
<!-- </template>-->
|
</template>
|
</el-table-column>
|
<template #empty>
|
<el-empty
|
class="custom-empty"
|
:image-size="100"
|
>
|
<template #description>
|
<span class="custom-text">暂无数据</span>
|
</template>
|
</el-empty>
|
</template>
|
</el-table>
|
</div>
|
<div class="pagination" v-if="orderListTable.length > 0">
|
<el-pagination class="command-pagination" popper-class="custom-pagination-dropdown" background
|
:page-sizes="[10, 20, 30, 40, 50, 100]" v-model:current-page="orderListParams.current"
|
v-model:page-size="orderListParams.size" layout="total, sizes, prev, pager, next, jumper" :total="total"
|
@size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
<AddEditDetails v-model:show="isShowAddEditDetails" @refresh="refreshGetOrderList" />
|
</template>
|
|
<script setup>
|
import SearchBox from './component/SearchBox.vue'
|
import AddEditDetails from './component/AddEditDetails.vue'
|
import NProgress from 'nprogress'
|
import { useStore } from 'vuex'
|
import { useRoute } from 'vue-router'
|
import { downloadXls } from '@/utils/util'
|
import {
|
getList,
|
orderLogDetails,
|
orderLogExport,
|
jobStatusNum,
|
deleteOrderLog,
|
} from '@/api/tickets/orderLog'
|
import { newGetWorkspacesPage } from '@/api/resource/wayline'
|
import { getDictionaryByCode } from '@/api/system/dictbiz'
|
import { cloneDeep } from 'lodash';
|
import { computed, onMounted } from 'vue';
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
import dayjs from 'dayjs'
|
import 'dayjs/locale/zh-cn' // 导入中文语言包
|
import weekday from 'dayjs/plugin/weekday'
|
import { aiImagesPage } from '@/api/dataCenter/dataCenter';
|
|
const store = useStore()
|
const route = useRoute()
|
|
const userInfo = computed(() => store.state.user.userInfo)
|
const permission = computed(() => store.state.user.permission);
|
|
const isShowAddEditDetails = ref(false)
|
|
const activeTab = ref('all')
|
provide('activeTab', activeTab)
|
let tabsList = ref([
|
// { label: '我的工单', name: 'my_order', value: null, count: 0 },
|
// { label: '全部工单', name: 'all', value: null, count: 0 },
|
// { label: '待审核', name: 'WAIT_AUDIT', value: 1, count: 0 },
|
// { label: '已驳回', name: 'REJECTED', value: 2, count: 0 },
|
// { label: '已通过', name: 'PASS', value: 3, count: 0 },
|
// { label: '草稿', name: 'DRAFT', value: 0, count: 0 }
|
])
|
function filteredTabs () {
|
if (permission?.value.orderLog_tab_allOrders) {
|
tabsList.value.push({ label: '全部工单', name: 'all', value: null, count: 0 })
|
}
|
if (permission?.value.orderLog_tab_pending) {
|
tabsList.value.push({ label: '待审核', name: 'WAIT_AUDIT', value: 1, count: 0 })
|
}
|
if (permission?.value.orderLog_tab_reject) {
|
tabsList.value.push({ label: '已驳回', name: 'REJECTED', value: 2, count: 0 })
|
}
|
if (permission?.value.orderLog_tab_pass) {
|
tabsList.value.push({ label: '已通过', name: 'PASS', value: 3, count: 0 })
|
}
|
activeTab.value = tabsList.value[0].name
|
// tab值传
|
orderListParams.status = tabsList.value[0].value
|
// tabsList.value
|
// .map(tab => {
|
// if (tab.name === 'all') {
|
// return { ...tab, isShow: permission?.value.orderLog_tab_allOrders }
|
// }
|
// if (tab.name === 'WAIT_AUDIT') {
|
// return { ...tab, isShow: permission?.value.orderLog_tab_pending }
|
// }
|
// if (tab.name === 'REJECTED') {
|
// return { ...tab, isShow: permission?.value.orderLog_tab_reject }
|
// }
|
// if (tab.name === 'PASS') {
|
// return { ...tab, isShow: permission?.value.orderLog_tab_pass }
|
// }
|
// // return { ...tab, isShow: true }
|
// })
|
// .filter(tab => tab.isShow)
|
}
|
|
// tab切换
|
function handleTabChange (tab) {
|
activeTab.value = tab.paneName
|
// orderListParams.status = ''
|
// if (tab.paneName === 'WAIT_AUDIT') {
|
// orderListParams.status = '1'
|
// } else if (tab.paneName === 'REJECTED') {
|
// orderListParams.status = '2'
|
// } else if (tab.paneName === 'PASS') {
|
// orderListParams.status = '3'
|
// } else if (tab.paneName === 'DRAFT') {
|
// orderListParams.status = '0'
|
// }
|
// refreshGetOrderList()
|
}
|
|
// 更新统计数
|
async function updateGlobalCounts() {
|
let res = await jobStatusNum()
|
res.data.data.forEach(item => {
|
const tab = tabsList.value.find(t => t.name === item.dict_key)
|
if (tab) {
|
tab.count = item.num
|
}
|
})
|
}
|
|
// 获取航线
|
let lineList = ref([])
|
provide('lineList', lineList)
|
function getLines() {
|
const formData = {
|
name: '',
|
waylineType: undefined,
|
current: 1,
|
size: 99999999,
|
descs: 'update_time'
|
}
|
newGetWorkspacesPage(formData).then(res => {
|
lineList.value = res.data.data.records
|
})
|
}
|
|
// 获取算法
|
let aiTypeList = ref([])
|
provide('aiTypeList', aiTypeList)
|
function aitypeList() {
|
getDictionaryByCode('SF').then(res => {
|
aiTypeList.value = res.data.data['SF']
|
})
|
}
|
|
const total = ref(0)
|
const orderListParams = reactive({
|
current: 1,
|
size: 10,
|
searchParams: {},
|
status: ''
|
})
|
|
const orderListTable = ref([])
|
function getTableList() {
|
orderListParams.searchParams.ai_types = orderListParams.searchParams.ai_typesValue ? [ orderListParams.searchParams.ai_typesValue] : null
|
const apiParams = {
|
...cloneDeep(orderListParams),
|
...cloneDeep(orderListParams.searchParams)
|
}
|
getList(apiParams, orderListParams.current, orderListParams.size).then(res => {
|
orderListTable.value = res.data.data.records
|
total.value = res.data.data.total
|
// updateGlobalCounts()
|
})
|
}
|
|
// 分页大小改变
|
const handleSizeChange = val => {
|
orderListParams.size = val
|
getTableList()
|
}
|
|
// 页码改变
|
const handleCurrentChange = val => {
|
orderListParams.current = val
|
getTableList()
|
}
|
|
// 传参查询条件
|
const searchClick = params => {
|
orderListParams.current = 1
|
orderListParams.size = 10
|
orderListParams.searchParams = params
|
getTableList()
|
}
|
|
const refreshGetOrderList = () => {
|
orderListParams.current = 1
|
orderListParams.size = 10
|
getTableList()
|
}
|
|
function getOrderStatus (status) {
|
const statusTextMap = {
|
// 0: '草稿',
|
1: '待审核',
|
2: '已驳回',
|
3: '已通过'
|
}
|
return statusTextMap[status] || '未知状态'
|
}
|
function getStatusTagType (status) {
|
const statusMap = {
|
1: 'warning',
|
2: 'info',
|
3: 'primary',
|
4: 'success',
|
5: 'danger'
|
}
|
return statusMap[status] || 'info'
|
}
|
// 新增按钮 和 导出按钮
|
// function hasAddBtnPermission () {
|
// return permission && permission?.value.order_log_add
|
// }
|
|
// 新建工单、编辑、详情
|
const txtTitle = ref('新建工单')
|
const rowObj = ref({})
|
provide('txtTitle', txtTitle)
|
provide('rowObj', rowObj)
|
function handleAddOrder() {
|
txtTitle.value = '新建工单'
|
isShowAddEditDetails.value = true
|
}
|
// 详情、编辑
|
function handleViewDetail(row, txt) {
|
rowObj.value = row
|
txtTitle.value = txt
|
isShowAddEditDetails.value = true
|
}
|
|
// 审核
|
function handleCheckDetail(row, txt) {
|
rowObj.value = row
|
txtTitle.value = txt
|
isShowAddEditDetails.value = true
|
}
|
|
// 导出
|
async function exportData() {
|
try {
|
await ElMessageBox.confirm('是否导出智飞工单数据?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
|
NProgress.start()
|
|
orderListParams.searchParams.ai_types = orderListParams.searchParams.ai_typesValue ? [ orderListParams.searchParams.ai_typesValue] : null
|
const apiParams = {
|
...cloneDeep(orderListParams),
|
...cloneDeep(orderListParams.searchParams)
|
}
|
const res = await orderLogExport(apiParams)
|
downloadXls(res.data, `智飞工单${dayjs().format('YYYY-MM-DD')}.xlsx`)
|
ElMessage.success('导出成功')
|
|
} catch (error) {
|
if (error !== 'cancel') {
|
ElMessage.error('导出失败')
|
console.error('导出错误:', error)
|
}
|
} finally {
|
NProgress.done()
|
}
|
}
|
|
// 撤回工单
|
async function revokeOrder(id) {
|
try {
|
await ElMessageBox.confirm('撤回会删除本工单,需重新提交?', '是否撤回', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
// 用户点击确定，执行撤回操作
|
// await orderLogRecall(id)
|
await deleteOrderLog(id)
|
// 显示成功消息
|
ElMessage.success('撤回成功')
|
// 触发搜索刷新
|
refreshGetOrderList()
|
} catch (error) {
|
// 用户点击取消，不执行任何操作
|
if (error !== 'cancel') {
|
ElMessage.error('撤回失败')
|
console.error('撤回错误:', error)
|
}
|
}
|
}
|
|
// 驳回原因
|
async function rejectReason(id, row) {
|
try {
|
const res = await orderLogDetails(id)
|
const data = res.data.data
|
|
await ElMessageBox.confirm(data.remark, '驳回原因', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
|
// 用户点击确定后的逻辑 TODO
|
// form.value = { ...res.data.data }
|
handleViewDetail(row, userInfo.value.user_id === row.create_user ? '工单编辑':'工单详情')
|
|
} catch (error) {
|
// 用户点击取消，不执行任何操作
|
if (error !== 'cancel') {
|
ElMessage.error('操作失败')
|
console.error('错误:', error)
|
}
|
}
|
}
|
|
function handleCellClick (row, column) {
|
if (column.no === 1) {
|
navigator.clipboard.writeText(row.job_info_num).then(() => {
|
ElMessage.success('复制工单编号成功')
|
})
|
} else if (column.no === 2) {
|
navigator.clipboard.writeText(row.name).then(() => {
|
ElMessage.success('复制工单名称成功')
|
})
|
} else if (column.no === 4) {
|
navigator.clipboard.writeText(row.dept_name).then(() => {
|
ElMessage.success('复制所属单位成功')
|
})
|
} else if (column.no === 8) {
|
navigator.clipboard.writeText(row.wayline_name).then(() => {
|
ElMessage.success('复制关联航线成功')
|
})
|
} else if (column.no === 9) {
|
navigator.clipboard.writeText(row.ai_type_str).then(() => {
|
ElMessage.success('复制关联算法成功')
|
})
|
}
|
}
|
|
// 删除
|
async function deleteOrder(id) {
|
try {
|
await ElMessageBox.confirm('确定删除吗?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
deleteOrderLog(id)
|
ElMessage.success('删除成功')
|
// 触发搜索刷新
|
refreshGetOrderList()
|
} catch (error) {
|
if (error !== 'cancel') {
|
ElMessage.error('删除失败')
|
console.error('删除错误:', error)
|
}
|
}
|
}
|
|
onMounted(() => {
|
getLines()
|
aitypeList()
|
filteredTabs()
|
getTableList()
|
updateGlobalCounts()
|
if (route.query.id) {
|
route.query.status === '1' ? handleCheckDetail({ id: route.query.id}, '工单审核') : handleCheckDetail({ id: route.query.id}, '工单详情')
|
}
|
})
|
</script>
|
|
<style lang="scss" scoped>
|
.order-log-update {
|
height: 0;
|
flex: 1;
|
margin: 0 10px 10px 10px;
|
background-color: #ffffff;
|
padding: 10px 20px;
|
border-radius: 5px;
|
display: flex;
|
flex-direction: column;
|
|
// 表格
|
.task-table {
|
//height: 0;
|
//flex: 1;
|
height: calc(100vh - 380px);
|
margin-top: 18px;
|
overflow: auto;
|
:deep(.el-scrollbar__view) {
|
height: 100%;
|
}
|
:deep(.el-table--fit,.el-scrollbar__view) {
|
height: 100%;
|
}
|
}
|
|
.btnItem {
|
height: 27px;
|
line-height: 27px;
|
border-radius: 0px 0px 0px 0px;
|
border: 1px solid #51a8ff;
|
font-family: Segoe UI, Segoe UI;
|
font-weight: 400;
|
font-size: 14px;
|
color: #1C5CFF;
|
padding: 0 10px;
|
display: inline-block;
|
margin-right: 10px;
|
cursor: pointer;
|
|
&.turnBack {
|
border: 1px solid #ffa500;
|
color: #ffa500;
|
}
|
|
&.cancelTask {
|
border: 1px solid #00AA2D;
|
color: #00AA2D;
|
}
|
}
|
// 分页
|
:deep(.custom-header th.el-table__cell) {
|
color: rgba(0, 0, 0, 0.85);
|
}
|
|
:deep(.el-table td.el-table__cell) {
|
color: #606266;
|
}
|
|
:deep(.el-pagination) {
|
display: flex;
|
justify-content: right;
|
padding: 20px 0;
|
}
|
|
:deep(.el-pagination button) {
|
background: center center no-repeat none !important;
|
color: #8eb8ea !important;
|
}
|
}
|
</style>
|
