|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div v-show="!viewState.show" class="app-container">
|
|
|
+ <div v-show="!viewState.show && !editState.show" class="app-container">
|
|
|
<div>
|
|
|
<transition name="fade">
|
|
|
<div v-show="showSearch">
|
|
|
@@ -8,52 +8,39 @@
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="6">
|
|
|
<el-form-item label="关键字搜索：" prop="center">
|
|
|
- <el-input v-model="queryParams.center" placeholder="请输入内容" clearable />
|
|
|
+ <el-input v-model="queryParams.keyword" placeholder="请输入内容" clearable />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="6">
|
|
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
|
</el-col>
|
|
|
- <el-col :span="12" style="text-align: right;">
|
|
|
+ <el-col :span="12" style="text-align: right">
|
|
|
<el-button type="primary" @click="exportExcel">导出excel</el-button>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-form>
|
|
|
-
|
|
|
</div>
|
|
|
</transition>
|
|
|
<!-- 表格组件 -->
|
|
|
<el-table ref="multipleTable" v-loading="loading" :data="tableData" style="width: 100%" :max-height="400">
|
|
|
- <el-table-column label="序号" align="center" width="55" fixed="left">
|
|
|
- <template #default="scope">
|
|
|
- {{ (queryParams.page - 1) * queryParams.pageSize + scope.$index + 1 }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
<el-table-column label="姓名" align="center" prop="name" width="100" fixed="left" />
|
|
|
- <el-table-column label="荣誉称号" align="center" prop="" />
|
|
|
- <el-table-column label="单位" align="center" prop="unit" />
|
|
|
- <el-table-column label="职位" align="center" prop="position" />
|
|
|
- <el-table-column label="职称" align="center" prop="" />
|
|
|
- <el-table-column label="发证日期" align="center" prop="" />
|
|
|
- <el-table-column label="专业分组" align="center" prop="" />
|
|
|
- <el-table-column label="专业领域" align="center" prop="" />
|
|
|
- <el-table-column label="工作电话" align="center" prop="phone" />
|
|
|
- <el-table-column label="住宅电话" align="center" prop="phone" />
|
|
|
- <el-table-column label="移动电话" align="center" prop="phone" />
|
|
|
- <el-table-column label="电子邮箱" align="center" prop="" />
|
|
|
- <el-table-column label="联系地址" align="center" prop="address" />
|
|
|
- <el-table-column label="增量标识" align="center" prop="" />
|
|
|
- <el-table-column label="增量时间" align="center" prop="" />
|
|
|
- <el-table-column label="批次号" align="center" prop="" />
|
|
|
- <el-table-column label="新增时间" align="center" prop="" />
|
|
|
-<!-- <el-table-column label="所属区县" align="center" prop="county" />-->
|
|
|
+ <el-table-column label="所属区县" align="center" prop="county" />
|
|
|
<!-- <el-table-column label="专家类型" align="center" prop="expert_type" />-->
|
|
|
-<!-- <el-table-column label="状态" align="center" prop="status" />-->
|
|
|
-<!-- <el-table-column label="擅长事故类型" align="center" prop="accident_type" />-->
|
|
|
-<!-- <el-table-column label="救援经历" align="center" prop="rescue_experience" />-->
|
|
|
-<!-- <el-table-column label="出生日期" align="center" prop="birthdate" />-->
|
|
|
-<!-- <el-table-column label="工作日期" align="center" prop="work_date" />-->
|
|
|
+ <el-table-column label="荣誉称号" align="center" prop="honorary_title" />
|
|
|
+ <el-table-column label="工作单位" align="center" prop="unit" />
|
|
|
+ <el-table-column label="职务" align="center" prop="position" />
|
|
|
+ <el-table-column label="职称" align="center" prop="professional_title" />
|
|
|
+ <el-table-column label="发证日期" align="center" prop="certificate_issue_date" />
|
|
|
+ <el-table-column label="专业分组" align="center" prop="professional_group" />
|
|
|
+ <el-table-column label="专业领域" align="center" prop="professional_field" />
|
|
|
+<!-- <el-table-column label="擅长事故类型" align="center" prop="specialty" />-->
|
|
|
+ <el-table-column label="工作电话" align="center" prop="work_phone" />
|
|
|
+ <el-table-column label="住宅电话" align="center" prop="home_phone" />
|
|
|
+ <el-table-column label="移动电话" align="center" prop="mobile_phone" />
|
|
|
+ <el-table-column label="电子邮箱" align="center" prop="email" />
|
|
|
+ <el-table-column label="联系地址" align="center" prop="contact_address" />
|
|
|
+
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
|
|
|
<template #default="scope">
|
|
|
<el-text class="common-btn-text-primary" @click="handleView(scope.row)">查看</el-text>
|
|
|
@@ -109,14 +96,11 @@
|
|
|
<Map :active-map="activeMap" :point-type="pointType" style="height: 600px" />
|
|
|
</el-card>
|
|
|
</div>
|
|
|
- <View v-if="viewState.show" :event-id="viewState.eventId" @close="handleCancel" />
|
|
|
- <Edit v-if="editState.show" :event-id="editState.eventId" @close="handleCancel" />
|
|
|
+ <View v-if="viewState.show" :id="viewState.eventId" @close="handleCancel" />
|
|
|
+ <Edit v-if="editState.show" :id="editState.eventId" @close="handleCancel" @refresh="handleRefresh" />
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
-import { onMounted, reactive, ref, toRefs } from 'vue';
|
|
|
-import { ElTable, ElTableColumn, ElForm, ElFormItem, ElInput, ElButton, ElText } from 'element-plus';
|
|
|
-import { ComponentInternalInstance, getCurrentInstance } from 'vue';
|
|
|
import View from './view.vue';
|
|
|
import Edit from './edit.vue';
|
|
|
import { PatrolVO } from '@/views/inspectionWork/patrolTask.vue';
|
|
|
@@ -125,94 +109,43 @@ import Map from './Map.vue';
|
|
|
import { PointType } from '@/api/globalMap/type';
|
|
|
import { fillingTable } from '@/api/dataFilling/fillingManage';
|
|
|
import { download2 } from '@/utils/request';
|
|
|
+import { getExpertList, getExpertProfessionalGroupCount } from '@/api/expert';
|
|
|
const loading = ref(true);
|
|
|
const showSearch = ref(true);
|
|
|
-const multiple = ref(true);
|
|
|
const ids = ref<Array<number | string>>([]);
|
|
|
-const single = ref(true);
|
|
|
const total = ref(0);
|
|
|
const tableData = ref<PatrolVO[]>([]);
|
|
|
const baseUrl = import.meta.env.VITE_APP_BASE_API;
|
|
|
-const filename = '专家信息表';
|
|
|
-const selectedRow = ref<PatrolVO | null>(null);
|
|
|
-
|
|
|
-const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
-
|
|
|
-const initFormData = reactive({
|
|
|
- name: '',
|
|
|
- county: '',
|
|
|
- expert_type: '',
|
|
|
- position: '',
|
|
|
- unit: '',
|
|
|
- phone: '',
|
|
|
- address: '',
|
|
|
- status: '',
|
|
|
- accident_type: '',
|
|
|
- rescue_experience: '',
|
|
|
- birthdate: '',
|
|
|
- work_date: ''
|
|
|
-});
|
|
|
|
|
|
let activeMap = ref('satellite');
|
|
|
let pointType = ref<PointType[]>([]);
|
|
|
-const data = reactive({
|
|
|
- form: { ...initFormData },
|
|
|
- queryParams: {
|
|
|
- page: 1,
|
|
|
- pageSize: 10
|
|
|
- }
|
|
|
-});
|
|
|
|
|
|
-const { queryParams, form } = toRefs(data);
|
|
|
+const queryParams = reactive({
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ keyword: ''
|
|
|
+});
|
|
|
|
|
|
-const fetchWorkrData = () => {
|
|
|
+const fetchData = () => {
|
|
|
loading.value = true;
|
|
|
- const mockData = [
|
|
|
- {
|
|
|
- id: 1,
|
|
|
- name: '张三',
|
|
|
- county: '茂南',
|
|
|
- expert_type: '技术专家',
|
|
|
- position: '工程师',
|
|
|
- unit: '某科技公司',
|
|
|
- phone: '13800000000',
|
|
|
- address: '茂名市茂南XX路XX号',
|
|
|
- status: '在线',
|
|
|
- accident_type: '网络故障',
|
|
|
- rescue_experience: '5年以上',
|
|
|
- birthdate: '1990-01-01',
|
|
|
- work_date: '2015-01-01'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- name: '李四',
|
|
|
- county: '高州',
|
|
|
- expert_type: '安全专家',
|
|
|
- position: '高级安全顾问',
|
|
|
- unit: '某安全咨询公司',
|
|
|
- phone: '13800000001',
|
|
|
- address: '茂名市高州XX路XX号',
|
|
|
- status: '离线',
|
|
|
- accident_type: '安全事故',
|
|
|
- rescue_experience: '10年以上',
|
|
|
- birthdate: '1985-01-01',
|
|
|
- work_date: '2010-01-01'
|
|
|
- }
|
|
|
- ];
|
|
|
-
|
|
|
- tableData.value = mockData;
|
|
|
- total.value = mockData.length;
|
|
|
-
|
|
|
- loading.value = false;
|
|
|
+ getExpertList(queryParams)
|
|
|
+ .then((res) => {
|
|
|
+ tableData.value = res.data;
|
|
|
+ total.value = res.total;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
};
|
|
|
|
|
|
const handleQuery = () => {
|
|
|
- queryParams.value.page = 1;
|
|
|
- fetchWorkrData();
|
|
|
+ queryParams.page = 1;
|
|
|
+ fetchData();
|
|
|
};
|
|
|
|
|
|
const resetQuery = () => {
|
|
|
- queryParams.value = { page: 1, pageSize: 10 };
|
|
|
+ queryParams.page = 1;
|
|
|
+ queryParams.keyword = '';
|
|
|
handleQuery();
|
|
|
};
|
|
|
let viewState = reactive({
|
|
|
@@ -223,21 +156,26 @@ let editState = reactive({
|
|
|
show: false,
|
|
|
eventId: ''
|
|
|
});
|
|
|
-const handleView = () => {
|
|
|
- // viewState.eventId = row.id;
|
|
|
+const handleView = (row) => {
|
|
|
+ viewState.eventId = row.id;
|
|
|
viewState.show = true;
|
|
|
};
|
|
|
-const handleUpdate = () => {
|
|
|
- // editState.eventId = row.id;
|
|
|
+const handleUpdate = (row) => {
|
|
|
+ editState.eventId = row.id;
|
|
|
editState.show = true;
|
|
|
};
|
|
|
const handleCancel = () => {
|
|
|
viewState.show = false;
|
|
|
editState.show = false;
|
|
|
};
|
|
|
+const handleRefresh = () => {
|
|
|
+ editState.show = false;
|
|
|
+ fetchData();
|
|
|
+ initData();
|
|
|
+};
|
|
|
const exportExcel = () => {
|
|
|
fillingTable(ids.value[0]);
|
|
|
- download2(baseUrl + '/api/dataFilling/export_to_excel?report_id='+ids.value[0], filename + '.xlsx');
|
|
|
+ download2(baseUrl + '/api/dataFilling/export_to_excel?report_id=' + ids.value[0], '专家信息表.xlsx');
|
|
|
};
|
|
|
let option1 = ref({
|
|
|
grid: {
|
|
|
@@ -570,14 +508,9 @@ const initData = () => {
|
|
|
option1.value.xAxis.data = ['茂南区', '电白区', '高州市', '化州市', '信宜市', '高新区', '滨海新区'];
|
|
|
option1.value.series[0].data = [569, 251, 264, 187, 663, 649, 247];
|
|
|
// 类型统计
|
|
|
- // option2.value.legend.data = ['洪水灾害', '城市内涝', '地质灾害', '气象灾害', '生物灾害', '森林火灾'];
|
|
|
- option2.value.series[0].data = [
|
|
|
- { name: '自然灾害类', value: 50 },
|
|
|
- { name: '事故灾害类', value: 69 },
|
|
|
- { name: '公共卫生类', value: 9 },
|
|
|
- { name: '社会安全类', value: 9 },
|
|
|
- { name: '综合管理类', value: 5 }
|
|
|
- ];
|
|
|
+ getExpertProfessionalGroupCount().then((res) => {
|
|
|
+ option2.value.series[0].data = res.data.list;
|
|
|
+ });
|
|
|
// 年龄统计
|
|
|
const data1 = [6, 6, 14, 23, 32];
|
|
|
let max = 0;
|
|
|
@@ -612,7 +545,7 @@ const initData = () => {
|
|
|
option4.value.series[1].data = maxData2;
|
|
|
};
|
|
|
onMounted(() => {
|
|
|
- fetchWorkrData();
|
|
|
+ fetchData();
|
|
|
initData();
|
|
|
});
|
|
|
</script>
|
|
|
@@ -629,4 +562,10 @@ onMounted(() => {
|
|
|
width: calc(50% - 10px);
|
|
|
}
|
|
|
}
|
|
|
+:deep(.amap-info-content) {
|
|
|
+ padding: 0 !important;
|
|
|
+}
|
|
|
+:deep(.amap-info-close) {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
</style>
|
