Files
ba_web/src/views/Training/AnnualInspectionApplicants/index.vue
2025-09-22 17:21:03 +08:00

155 lines
4.1 KiB
Vue

<template>
<div>
<div class="titleBox">
<PageTitle title="年检申请人员">
<el-button type="primary" @click="addEdit('pxsq')">年检培训</el-button>
</PageTitle>
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
</div>
<!-- 表格 -->
<div class="tabBox">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
@chooseData="chooseData">
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" link @click="addEdit('detail', row.id)">详情</el-link>
<el-link type="success" link @click="addEdit('add', '')">上传资料</el-link>
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"></Pages>
</div>
<!-- 详情 -->
<DetailForm ref="detailDiloag" @refresh="getList" />
<!-- 培训申请 -->
<PxApllication ref="pxApllication" />
</div>
</template>
<script setup>
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import DetailForm from "./components/detailForm.vue";
import PxApllication from "./components/pxApllication.vue";
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
const { proxy } = getCurrentInstance();
const detailDiloag = ref();
const pxApllication = ref();
const searchBox = ref(); //搜索框
const baseUrl = 'data:image/jpeg;base64,'
const searchConfiger = ref([
{
label: "申请时间",
prop: "sqsj",
placeholder: "请选择申请时间",
showType: "date"
},
]);
const queryFrom = ref({});
const pageData = reactive({
tableData: [
{
name: '张三',
idNumber: '44032519900101001X',
contactInfo: '13800000000',
isUploaded: '是',
applyTime: '2023-01-01',
reviewStatus: '是'
}
],
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null",
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
},
controlsWidth: 180,
tableColumn: [
{ label: "姓名", prop: "name" },
{ label: "证件号码", prop: "idNumber" },
{ label: "联系方式", prop: "contactInfo" },
{ label: "是否上传资料", prop: "isUploaded" },
{ label: "申请时间", prop: "applyTime", },
{ label: "资料审核是否通过", prop: "reviewStatus"}
]
});
onMounted(() => {
getList();
tabHeightFn();
});
// 搜索
const onSearch = (val) => {
queryFrom.value = { ...val };
pageData.pageConfiger.pageCurrent = 1;
getList();
};
const changeNo = (val) => {
pageData.pageConfiger.pageNum = val;
getList();
};
const changeSize = (val) => {
pageData.pageConfiger.pageSize = val;
getList();
};
// 获取列表
const getList = () => {
// pageData.tableConfiger.loading = true;
// let data = { ...pageData.pageConfiger, ...queryFrom.value };
// qcckGet(data, "/mosty-jbld/jbldzsd/selectPage").then((res) => {
// pageData.tableData = res.records || [];
// pageData.total = res.total;
// pageData.tableConfiger.loading = false;
// }).catch(() => {
// pageData.tableConfiger.loading = false;
// });
};
// 详情
const addEdit = (type, id) => {
nextTick(() => {
if(type == 'pxsq'){
pxApllication.value.init(type, id);
}else{
detailDiloag.value.init(type, id);
}
})
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
window.onresize = function () {
tabHeightFn();
};
};
</script>
<style>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
</style>