fix
This commit is contained in:
吴红兵
@@ -1,102 +1,95 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="4">
|
||||
<el-collapse v-model="activeNames">
|
||||
<el-collapse-item title="汇总" name="1">
|
||||
<div v-for="(item, index) in infoList" :key="index">
|
||||
{{ item }}
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="4">
|
||||
<el-collapse v-model="activeNames">
|
||||
<el-collapse-item title="汇总" name="1">
|
||||
<div v-for="(item, index) in infoList" :key="index">
|
||||
{{ item }}
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="20">
|
||||
<el-tabs v-model="tabsActiveName" @tab-click="handleClick">
|
||||
<el-tab-pane name="1" label="学历"></el-tab-pane>
|
||||
<el-tab-pane name="2" label="职称"></el-tab-pane>
|
||||
<el-tab-pane name="3" label="职业资格"></el-tab-pane>
|
||||
<el-tab-pane name="4" label="教师资格"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-col :span="20">
|
||||
<el-tabs v-model="tabsActiveName" @tab-click="handleClick">
|
||||
<el-tab-pane name="1" label="学历"></el-tab-pane>
|
||||
<el-tab-pane name="2" label="职称"></el-tab-pane>
|
||||
<el-tab-pane name="3" label="职业资格"></el-tab-pane>
|
||||
<el-tab-pane name="4" label="教师资格"></el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<el-table :data="tableData" show-summary style="height: 800px; overflow-y: auto;" border>
|
||||
<el-table-column prop="deptName" label="部门/资质(人数)" min-width="150" align="center" />
|
||||
|
||||
<el-table-column
|
||||
v-for="(item, index) in tableHead"
|
||||
:key="index"
|
||||
:prop="item"
|
||||
:label="item"
|
||||
min-width="120"
|
||||
align="center">
|
||||
<template #default="scope">
|
||||
{{ scope.row[item] ? scope.row[item] : 0 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="tableData" show-summary style="height: 800px; overflow-y: auto" border>
|
||||
<el-table-column prop="deptName" label="部门/资质(人数)" min-width="150" align="center" />
|
||||
|
||||
<el-table-column v-for="(item, index) in tableHead" :key="index" :prop="item" :label="item" min-width="120" align="center">
|
||||
<template #default="scope">
|
||||
{{ scope.row[item] ? scope.row[item] : 0 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { countInfo } from '/@/api/professional/professionaluser/professionalteacheracademicrelation'
|
||||
import { titleCountInfo } from '/@/api/professional/professionaluser/professionaltitlerelation'
|
||||
import { quaCountInfo } from '/@/api/professional/professionaluser/professionalqualificationrelation'
|
||||
import { cerCountInfo } from '/@/api/professional/professionaluser/professionalteachercertificaterelation'
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { countInfo } from '/@/api/professional/professionaluser/professionalteacheracademicrelation';
|
||||
import { titleCountInfo } from '/@/api/professional/professionaluser/professionaltitlerelation';
|
||||
import { quaCountInfo } from '/@/api/professional/professionaluser/professionalqualificationrelation';
|
||||
import { cerCountInfo } from '/@/api/professional/professionaluser/professionalteachercertificaterelation';
|
||||
|
||||
const activeNames = ref(['1'])
|
||||
const tabsActiveName = ref('1')
|
||||
const tableData = ref<any[]>([])
|
||||
const tableHead = ref<string[]>([])
|
||||
const infoList = ref<string[]>([])
|
||||
const activeNames = ref(['1']);
|
||||
const tabsActiveName = ref('1');
|
||||
const tableData = ref<any[]>([]);
|
||||
const tableHead = ref<string[]>([]);
|
||||
const infoList = ref<string[]>([]);
|
||||
|
||||
const init = async () => {
|
||||
try {
|
||||
const res = await countInfo()
|
||||
tableData.value = res.data.data.tableData || []
|
||||
tableHead.value = res.data.data.tableHead || []
|
||||
infoList.value = res.data.data.infoList || []
|
||||
} catch (error) {
|
||||
console.error('Failed to load data:', error)
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await countInfo();
|
||||
tableData.value = res.data.data.tableData || [];
|
||||
tableHead.value = res.data.data.tableHead || [];
|
||||
infoList.value = res.data.data.infoList || [];
|
||||
} catch (error) {
|
||||
console.error('Failed to load data:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleClick = (tab: any) => {
|
||||
tableData.value = []
|
||||
tableHead.value = []
|
||||
infoList.value = []
|
||||
|
||||
if (tab.name === '1') {
|
||||
init()
|
||||
} else if (tab.name === '2') {
|
||||
titleCountInfo().then(res => {
|
||||
tableData.value = res.data.data.tableData || []
|
||||
tableHead.value = res.data.data.tableHead || []
|
||||
infoList.value = res.data.data.infoList || []
|
||||
})
|
||||
} else if (tab.name === '3') {
|
||||
quaCountInfo().then(res => {
|
||||
tableData.value = res.data.data.tableData || []
|
||||
tableHead.value = res.data.data.tableHead || []
|
||||
infoList.value = res.data.data.infoList || []
|
||||
})
|
||||
} else if (tab.name === '4') {
|
||||
cerCountInfo().then(res => {
|
||||
tableData.value = res.data.data.tableData || []
|
||||
tableHead.value = res.data.data.tableHead || []
|
||||
infoList.value = res.data.data.infoList || []
|
||||
})
|
||||
}
|
||||
}
|
||||
tableData.value = [];
|
||||
tableHead.value = [];
|
||||
infoList.value = [];
|
||||
|
||||
if (tab.name === '1') {
|
||||
init();
|
||||
} else if (tab.name === '2') {
|
||||
titleCountInfo().then((res) => {
|
||||
tableData.value = res.data.data.tableData || [];
|
||||
tableHead.value = res.data.data.tableHead || [];
|
||||
infoList.value = res.data.data.infoList || [];
|
||||
});
|
||||
} else if (tab.name === '3') {
|
||||
quaCountInfo().then((res) => {
|
||||
tableData.value = res.data.data.tableData || [];
|
||||
tableHead.value = res.data.data.tableHead || [];
|
||||
infoList.value = res.data.data.infoList || [];
|
||||
});
|
||||
} else if (tab.name === '4') {
|
||||
cerCountInfo().then((res) => {
|
||||
tableData.value = res.data.data.tableData || [];
|
||||
tableHead.value = res.data.data.tableHead || [];
|
||||
infoList.value = res.data.data.infoList || [];
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
init();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
<style scoped lang="scss"></style>
|
||||
|
||||
Reference in New Issue
Block a user