<template>
|
<div class="app-container">
|
<el-card>
|
<!-- 标签页 -->
|
<el-tabs
|
v-model="activeTab"
|
class="info-tabs"
|
@tab-click="handleTabClick"
|
>
|
<el-tab-pane
|
v-for="tab in tabs"
|
:key="tab.name"
|
:label="tab.label"
|
:name="tab.name"
|
/>
|
</el-tabs>
|
<div>
|
<div>
|
<el-table ref="table" :data="tableData" height="480" v-loading="tableLoading">
|
<el-table-column label="序号" type="index" width="60" align="center" />
|
<el-table-column prop="taskName" label="巡检任务名称" :show-overflow-tooltip="true"></el-table-column>
|
<el-table-column prop="port" label="地点" :show-overflow-tooltip="true"></el-table-column>
|
<el-table-column prop="remarks" label="备注"></el-table-column>
|
<el-table-column prop="inspector" label="执行巡检人"></el-table-column>
|
<el-table-column fixed="right" label="操作">
|
<template #default="scope">
|
<el-button link type="primary" @click="handleAdd(scope.row)">上传</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<pagination
|
v-if="total>0"
|
:page-num="pageNum"
|
:page-size="pageSize"
|
:total="total"
|
@pagination="handleQuery"
|
:layout="'total, prev, pager, next, jumper'"
|
/>
|
</div>
|
</el-card>
|
<form-dia ref="formDia" @closeDia="handleQuery"></form-dia>
|
</div>
|
</template>
|
|
<script setup>
|
import Pagination from "@/components/Pagination/index.vue";
|
import {inspectionTaskList} from "@/api/inspectionManagement/index.js";
|
import {onMounted, ref} from "vue";
|
import FormDia from "@/views/inspectionUpload/components/formDia.vue";
|
const formDia = ref()
|
// 当前标签
|
const activeTab = ref("task");
|
const tabName = ref("task");
|
// 标签页数据
|
const tabs = reactive([
|
{ name: "task", label: "任务下发" },
|
{ name: "qrCode", label: "二维码管理" },
|
]);
|
// 表格
|
const tableData = ref([]);
|
const tableLoading = ref(false);
|
const total = ref(0);
|
const pageNum = ref(1);
|
const pageSize = ref(10);
|
|
onMounted(() => {
|
handleTabClick({ props: { name: "task" } });
|
});
|
// 标签页点击
|
const handleTabClick = (tab) => {
|
tabName.value = tab.props.name;
|
tableData.value = [];
|
getList();
|
};
|
// 点击查询
|
const handleQuery = () => {
|
pageNum.value = 1
|
pageSize.value = 10
|
getList()
|
}
|
const getList = () => {
|
tableLoading.value = true;
|
inspectionTaskList({size: pageSize.value, current: pageNum.value}).then(res => {
|
tableLoading.value = false;
|
tableData.value = res.data.records;
|
total.value = res.data.total;
|
})
|
};
|
// 上传
|
const handleAdd = (row) => {
|
nextTick(() => {
|
formDia.value?.openDialog(row)
|
})
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
