parent
c12893d077
commit
ff7c3acc58
@ -0,0 +1,203 @@ |
||||
<template> |
||||
<div class="app-container"> |
||||
<el-card shadow="never"> |
||||
<template #header> |
||||
<div style="display: flex; justify-content: space-between"> |
||||
<div style="font-weight: 700; line-height: 32px; font-size: 14px"> |
||||
设备工单 |
||||
</div> |
||||
<table-bar :columns="columns" @change-columns="changeColumns" /> |
||||
</div> |
||||
</template> |
||||
<div class="any-table"> |
||||
<el-table v-loading="loading" :data="tableData" max-height="380"> |
||||
<el-table-column |
||||
label="工单序号" |
||||
align="center" |
||||
fixed |
||||
width="250" |
||||
prop="receivedOrderId" |
||||
v-if="columns[0].show" |
||||
> |
||||
<template #default="scope"> |
||||
<el-button |
||||
type="primary" |
||||
@click="skipOrderEdit(scope.row.orderId)" |
||||
link |
||||
>{{ scope.row.receivedOrderId }} |
||||
</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="受理号" |
||||
align="center" |
||||
width="180" |
||||
prop="receivedOrderLhs" |
||||
v-if="columns[1].show" |
||||
/> |
||||
<el-table-column |
||||
label="开工单日期" |
||||
align="center" |
||||
prop="orderDate" |
||||
width="180" |
||||
v-if="columns[2].show" |
||||
/> |
||||
<el-table-column |
||||
label="AD编号" |
||||
align="center" |
||||
prop="adNo" |
||||
width="180" |
||||
v-if="columns[3].show" |
||||
/> |
||||
<el-table-column |
||||
label="工单状态" |
||||
align="center" |
||||
prop="orderStatus" |
||||
v-if="columns[4].show" |
||||
/> |
||||
<el-table-column |
||||
label="操作类型" |
||||
align="center" |
||||
prop="orderRemark" |
||||
v-if="columns[5].show" |
||||
/> |
||||
<el-table-column |
||||
label="工单业务类型" |
||||
align="center" |
||||
width="180" |
||||
prop="orderServiceType" |
||||
v-if="columns[6].show" |
||||
/> |
||||
<el-table-column |
||||
label="业务类型" |
||||
align="center" |
||||
width="180" |
||||
prop="operRemark" |
||||
v-if="columns[7].show" |
||||
/> |
||||
<el-table-column |
||||
label="端口" |
||||
align="center" |
||||
prop="port" |
||||
v-if="columns[8].show" |
||||
/> |
||||
<el-table-column |
||||
label="PPPoe账号" |
||||
align="center" |
||||
prop="pppoeAccount" |
||||
width="180" |
||||
v-if="columns[9].show" |
||||
/> |
||||
<el-table-column |
||||
label="电话号码" |
||||
align="center" |
||||
width="180" |
||||
prop="telNum" |
||||
v-if="columns[10].show" |
||||
/> |
||||
<el-table-column |
||||
label="系统管理域" |
||||
align="center" |
||||
prop="domain" |
||||
width="180" |
||||
v-if="columns[11].show" |
||||
/> |
||||
<el-table-column |
||||
label="是否定制终端" |
||||
align="center" |
||||
prop="remark3" |
||||
width="180" |
||||
v-if="columns[12].show" |
||||
> |
||||
<template #default="scope"> |
||||
<span v-if="scope.row.remark3 === '1'">非定制终端</span> |
||||
<span v-else>定制终端</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="工单接收日期" |
||||
align="center" |
||||
prop="receivedDate" |
||||
width="180" |
||||
v-if="columns[13].show" |
||||
/> |
||||
<el-table-column |
||||
label="设备上线状态" |
||||
align="center" |
||||
width="180" |
||||
prop="devOnLineStatus" |
||||
v-if="columns[14].show" |
||||
/> |
||||
</el-table> |
||||
</div> |
||||
<pagination |
||||
v-if="total > 0" |
||||
v-model:total="total" |
||||
v-model:page="queryForm.pageNum" |
||||
v-model:limit="queryForm.pageSize" |
||||
@pagination="getData" |
||||
/> |
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { DeviceOrderQuery, OrderTableVO } from "@/api/order/types"; |
||||
import { deviceOderTablePage } from "@/api/order"; |
||||
|
||||
const route = useRoute(); |
||||
const router = useRouter(); |
||||
let devId: number = parseInt(<string>route.params.devId); |
||||
let devOui: string = <string>route.query.devOui; |
||||
let devSno: string = <string>route.query.devSno; |
||||
let pppoe: string = <string>route.query.pppoeAccount; |
||||
const queryForm = ref<DeviceOrderQuery>({ |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}); |
||||
const loading = ref<boolean>(false); |
||||
const total = ref<number>(0); |
||||
const tableData = ref<OrderTableVO[]>([]); |
||||
const columns = ref<TableColumns[]>([ |
||||
{ name: "工单序号", show: true }, |
||||
{ name: "受理号", show: true }, |
||||
{ name: "开工单日期", show: true }, |
||||
{ name: "AD编号", show: true }, |
||||
{ name: "工单状态", show: true }, |
||||
{ name: "操作类型", show: false }, |
||||
{ name: "工单业务类型", show: false }, |
||||
{ name: "业务类型", show: true }, |
||||
{ name: "端口", show: true }, |
||||
{ name: "PPPoe账号", show: true }, |
||||
{ name: "电话号码", show: true }, |
||||
{ name: "系统管理域", show: true }, |
||||
{ name: "是否定制终端", show: false }, |
||||
{ name: "工单接收日期", show: false }, |
||||
{ name: "设备上线状态", show: false }, |
||||
]); |
||||
const changeColumns = (newColumns: TableColumns[]) => { |
||||
columns.value = newColumns; |
||||
}; |
||||
const skipOrderEdit = (orderId: number) => { |
||||
router.push({ path: `/resources/order-info-edit/${orderId}` }); |
||||
}; |
||||
const getData = async () => { |
||||
loading.value = true; |
||||
queryForm.value.devSno = devSno; |
||||
queryForm.value.devOui = devOui; |
||||
queryForm.value.pppoeAccount = pppoe; |
||||
await deviceOderTablePage(queryForm.value) |
||||
.then(({ data }) => { |
||||
tableData.value = data.list; |
||||
total.value = data.total; |
||||
}) |
||||
.finally(() => { |
||||
loading.value = false; |
||||
}); |
||||
}; |
||||
onMounted(() => { |
||||
getData(); |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped></style> |
||||
Loading…
Reference in new issue