|
@@ -0,0 +1,210 @@
|
|
|
+<template>
|
|
|
+ <div class="card-search">
|
|
|
+ <a-form
|
|
|
+ ref="formRef"
|
|
|
+ name="advanced_search"
|
|
|
+ class="ant-advanced-search-form"
|
|
|
+ :model="searchParams"
|
|
|
+ >
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="统计日期" :label-col="{span:6}" name="reportDate">
|
|
|
+ <a-range-picker format="YYYY-MM-DD" :placeholder="['开始日期', '结束日期']"
|
|
|
+ @change="onRangeChange"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6" style="text-align: left">
|
|
|
+ <a-button type="primary" html-type="submit" @click="loadData">查询</a-button>
|
|
|
+ <a-button style="margin: 0 8px" @click="onReset">重置</a-button>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ <div class="search-result-list">
|
|
|
+ <a-table :columns="originalColumns" :data-source="systemApplyCount" :scroll="{ x:'100%' }"
|
|
|
+ :loading="tableLoading"
|
|
|
+ :pagination="false"
|
|
|
+ bordered>
|
|
|
+ <template #bodyCell="{ column, text, record }">
|
|
|
+ <template v-if="column.key == 'regionName'">
|
|
|
+ <div>
|
|
|
+ {{ record.regionName }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="column.key == 'siteName'">
|
|
|
+ <div>
|
|
|
+ {{ record.siteName }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="column.key == 'siteUserCount'">
|
|
|
+ <div>
|
|
|
+ {{ record.siteUserCount }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="column.key == 'companyCount'">
|
|
|
+ <div>
|
|
|
+ {{ record.companyCount }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="column.key == 'postCount'">
|
|
|
+ <div>
|
|
|
+ {{ record.postCount }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="column.key == 'jobUserCount'">
|
|
|
+ <div>
|
|
|
+ {{ record.jobUserCount }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import {onMounted, reactive, ref} from "vue";
|
|
|
+import {getSystemApplyCount} from "@/api/statistics";
|
|
|
+import type {FormInstance, TableColumnType} from "ant-design-vue";
|
|
|
+import dayjs from "dayjs";
|
|
|
+
|
|
|
+const formRef = ref<FormInstance>();
|
|
|
+
|
|
|
+const originalColumns: TableColumnType[] = [
|
|
|
+ {
|
|
|
+ title: '行政区划', dataIndex: 'regionName', key: 'regionName', align: "center", width: 250,
|
|
|
+ customCell: (record, index: any) => {
|
|
|
+ const obj = {
|
|
|
+ colSpan: 1,
|
|
|
+ rowSpan: 1,
|
|
|
+ };
|
|
|
+ if (record.regionName == '合计') {
|
|
|
+ obj.colSpan = 2;
|
|
|
+ }
|
|
|
+ if (index === 0 || record.regionName !== systemApplyCount.value[index - 1].regionName) {
|
|
|
+ for (let i = index + 1; i < systemApplyCount.value.length; i++) {
|
|
|
+ if (systemApplyCount.value[i].regionName == record.regionName) {
|
|
|
+ obj.rowSpan++;
|
|
|
+ } else {
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ obj.rowSpan = 0;
|
|
|
+ }
|
|
|
+ return obj;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '驿站名', dataIndex: 'siteName', key: 'siteName', align: "center", width: 250,
|
|
|
+ customCell: (record) => {
|
|
|
+ const obj = {
|
|
|
+ colSpan: 1,
|
|
|
+ };
|
|
|
+ if (record.siteName == '合计') {
|
|
|
+ obj.colSpan = 0;
|
|
|
+ }
|
|
|
+ return obj;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {title: '驿站人员数量', dataIndex: 'siteUserCount', key: 'siteUserCount', align: "center"},
|
|
|
+ {title: '录入企业数量', dataIndex: 'companyCount', key: 'companyCount', align: "center"},
|
|
|
+ {title: '收集岗位数量', dataIndex: 'postCount', key: 'postCount', align: "center"},
|
|
|
+ {title: '登记求职人数', dataIndex: 'jobUserCount', key: 'jobUserCount', align: "center"},
|
|
|
+]
|
|
|
+
|
|
|
+// 统计数据
|
|
|
+const systemApplyCount = ref<Array<any>>([]);
|
|
|
+// 查询条件
|
|
|
+const searchParams = reactive({
|
|
|
+ startDate: "",
|
|
|
+ endDate: ""
|
|
|
+})
|
|
|
+// 表格加载
|
|
|
+const tableLoading = ref(false);
|
|
|
+// const reportDate = ref();
|
|
|
+
|
|
|
+// 数据加载
|
|
|
+function loadData() {
|
|
|
+ tableLoading.value = true;
|
|
|
+ getSystemApplyCount(searchParams).then((result: any) => {
|
|
|
+ systemApplyCount.value = result;
|
|
|
+ // 计算合计数据
|
|
|
+ let total = result.reduce((acc, item) => {
|
|
|
+ acc.siteUserCount += item.siteUserCount || 0;
|
|
|
+ acc.companyCount += item.companyCount || 0;
|
|
|
+ acc.postCount += item.postCount || 0;
|
|
|
+ acc.jobUserCount += item.jobUserCount || 0;
|
|
|
+ return acc;
|
|
|
+ }, {siteUserCount: 0, companyCount: 0, postCount: 0, jobUserCount: 0});
|
|
|
+ total.siteName = "合计"
|
|
|
+ total.regionName = "合计"
|
|
|
+ systemApplyCount.value.unshift(total);
|
|
|
+
|
|
|
+ // 为每个县区计算小计
|
|
|
+ let regionMap = new Map();
|
|
|
+ result.forEach((item: any) => {
|
|
|
+ if (item.regionName !== '合计') {
|
|
|
+ if (!regionMap.has(item.regionCode)) {
|
|
|
+ regionMap.set(item.regionCode, {
|
|
|
+ regionCode: item.regionCode,
|
|
|
+ regionName: item.regionName,
|
|
|
+ siteName: "小计",
|
|
|
+ siteUserCount: 0,
|
|
|
+ companyCount: 0,
|
|
|
+ postCount: 0,
|
|
|
+ jobUserCount: 0
|
|
|
+ });
|
|
|
+ }
|
|
|
+ let regionTotal = regionMap.get(item.regionCode);
|
|
|
+ regionTotal.siteUserCount += item.siteUserCount || 0;
|
|
|
+ regionTotal.companyCount += item.companyCount || 0;
|
|
|
+ regionTotal.postCount += item.postCount || 0;
|
|
|
+ regionTotal.jobUserCount += item.jobUserCount || 0;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 将统计结果插入到相同regionCode的第一个位置
|
|
|
+ let arr = new Array<any>();
|
|
|
+ systemApplyCount.value.forEach(item => {
|
|
|
+ if (regionMap.has(item.regionCode)) {
|
|
|
+ arr.push(regionMap.get(item.regionCode));
|
|
|
+ regionMap.delete(item.regionCode);
|
|
|
+ }
|
|
|
+ arr.push(item);
|
|
|
+ });
|
|
|
+ systemApplyCount.value = arr;
|
|
|
+ }).finally(() => {
|
|
|
+ tableLoading.value = false;
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 时间段变更事件
|
|
|
+const onRangeChange = (dateString: [string, string]) => {
|
|
|
+ searchParams.startDate = dateString != null ? dayjs(dateString[0]).format("YYYY-MM-DD") : "";
|
|
|
+ searchParams.endDate = dateString != null ? dayjs(dateString[1]).format("YYYY-MM-DD") : "";
|
|
|
+};
|
|
|
+
|
|
|
+// 查询表单
|
|
|
+function onReset() {
|
|
|
+ formRef.value?.resetFields();
|
|
|
+ loadData()
|
|
|
+}
|
|
|
+
|
|
|
+// 页面初始化
|
|
|
+onMounted(() => {
|
|
|
+ loadData()
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<script lang="ts">
|
|
|
+// 设置页面名称进行组件缓存
|
|
|
+export default {
|
|
|
+ name: "SystemApplyDataCount",
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.totalCol {
|
|
|
+ background-color: #40a9ff !important;
|
|
|
+}
|
|
|
+</style>
|