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