156 lines
6.8 KiB
Vue
156 lines
6.8 KiB
Vue
<!-- 人员出入次数统计详情 -->
|
|
<template>
|
|
<el-dialog title="人员进出详情" v-model="visible" width="80%" :close-on-click-modal="false" draggable>
|
|
<el-row shadow="hover" class="ml10">
|
|
<el-form-item style="width: 250px;" label="进出门类型" prop="enterOrExit">
|
|
<dict-select v-model="state.queryForm.enterOrExit" :options="dh_enter_or_exit" placeholder="请选择进出门类型" />
|
|
</el-form-item>
|
|
<el-form-item style="width: 250px;" label="开门类型" prop="openType">
|
|
<dict-select v-model="state.queryForm.openType" :options="dh_door_open_type" placeholder="请选择进开门类型" />
|
|
</el-form-item>
|
|
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
|
<el-form-item style="width: 350px;" label="抓拍时间" prop="swingTimeList">
|
|
<el-date-picker v-model="state.queryForm.swingTimeList" value-format="YYYY-MM-DD"
|
|
type="daterange" />
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-form-item>
|
|
<el-button icon="search" type="primary" @click="getDataList">
|
|
{{ $t('common.queryBtn') }}
|
|
</el-button>
|
|
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
|
</el-form-item>
|
|
|
|
<el-table :data="state.dataList" v-loading="state.loading" height="50vh" border
|
|
:cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
|
|
@sort-change="sortChangeHandle">
|
|
|
|
<el-table-column min-width="100" label="人员">
|
|
<el-table-column prop="personCode" min-width="100" label="人员编号">
|
|
<template #default="{ row }">
|
|
<span v-if="row.personCode">{{ row.personCode }}</span>
|
|
<span v-else class="color-danger">未知</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="personName" min-width="100" label="姓名">
|
|
<template #default="{ row }">
|
|
<span v-if="row.personName">{{ row.personName }}</span>
|
|
<span v-else class="color-danger">未知</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="paperNumber" min-width="100" label="证件号码" show-overflow-tooltip>
|
|
<template #default="{ row }">
|
|
<span v-if="row.paperNumber">{{ row.paperNumber }}</span>
|
|
<span v-else class="color-danger">未知</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="deptName" min-width="100" label="部门名称">
|
|
<template #default="{ row }">
|
|
<span v-if="row.deptName">{{ row.deptName }}</span>
|
|
<span v-else class="color-danger">未知</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
|
<el-table-column min-width="100" label="卡">
|
|
<el-table-column prop="cardType" min-width="100" label="卡类型">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="dh_card_type" :value="row.cardType" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="cardStatus" label="卡状态">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="dh_card_status" :value="row.cardStatus" />
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="enterOrExit" min-width="100" label="进出门类型">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="dh_enter_or_exit" :value="row.enterOrExit" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="openResult" min-width="100" label="开门结果">
|
|
<template #default="{ row }">
|
|
<el-tag v-if="row.openResult == 1" type="success">成功</el-tag>
|
|
<el-tag v-if="row.openResult == 0" type="danger">失败</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="openType" label="开门类型" min-width="150">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="dh_door_open_type" :value="row.openType" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="抓图图片" min-width="100">
|
|
<template #default="{ row }">
|
|
<preview-image width="50px" height="50px" v-if="row.parseRecordImage"
|
|
:src="row.parseRecordImage" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="remark" label="开门失败原因" min-width="200" show-overflow-tooltip />
|
|
<el-table-column prop="swingTime" label="刷卡时间" min-width="180" />
|
|
|
|
</el-table>
|
|
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
|
v-bind="state.pagination" />
|
|
|
|
</el-row>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup lang="ts" name="doorTimesTableDialog">
|
|
import { BasicTableProps, useTable } from "/@/hooks/table";
|
|
import { useDict } from '/@/hooks/dict';
|
|
|
|
import * as DoorRecordApi from "/@/api/door/doorRecord";
|
|
|
|
const { dh_enter_Mode } = useDict("dh_enter_Mode")
|
|
|
|
defineExpose({
|
|
openDialog
|
|
});
|
|
|
|
// 定义查询字典
|
|
const { dh_card_status, dh_card_type, dh_enter_or_exit, dh_image_type, dh_door_open_type } = useDict("dh_card_status", "dh_card_type", "dh_enter_or_exit", "dh_image_type", "dh_door_open_type")
|
|
|
|
// 搜索变量
|
|
const queryRef = ref()
|
|
|
|
// 定义变量内容
|
|
const visible = ref(false)
|
|
|
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
|
createdIsNeed: false,
|
|
pagination: {
|
|
size: 10,
|
|
},
|
|
queryForm: {
|
|
},
|
|
pageList: DoorRecordApi.fetchList
|
|
})
|
|
|
|
// table hook
|
|
const {
|
|
getDataList,
|
|
currentChangeHandle,
|
|
sizeChangeHandle,
|
|
sortChangeHandle,
|
|
downBlobFile,
|
|
tableStyle
|
|
} = useTable(state)
|
|
|
|
// 清空搜索条件
|
|
const resetQuery = () => {
|
|
// 清空搜索条件
|
|
queryRef.value?.resetFields()
|
|
getDataList()
|
|
}
|
|
|
|
// 打开弹窗
|
|
function openDialog(query: any) {
|
|
state.queryForm = query
|
|
visible.value = true
|
|
getDataList();
|
|
}
|
|
|
|
</script> |