forked from integrated_whb/integrated_whb_vue
139 lines
4.5 KiB
Vue
139 lines
4.5 KiB
Vue
<template>
|
||
<div>
|
||
<el-card>
|
||
<el-form
|
||
:model="searchForm"
|
||
label-width="70px"
|
||
@submit.prevent="fnGetDataTransfer"
|
||
>
|
||
<el-row>
|
||
<el-col :span="5">
|
||
<el-form-item label="姓名" prop="KEYWORDS">
|
||
<el-input
|
||
v-model="searchForm.KEYWORDS"
|
||
placeholder="请输入关键字"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<el-form-item label="部门" prop="DEPTIDS">
|
||
<layout-department
|
||
v-model="searchForm.DEPTIDS"
|
||
multiple
|
||
show-checkbox
|
||
collapse-tags
|
||
root-disabled="Y"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<el-form-item label="时间" prop="TIME">
|
||
<el-date-picker
|
||
v-model="searchForm.TIME"
|
||
format="YYYY-MM-DD"
|
||
value-format="YYYY-MM-DD"
|
||
type="date"
|
||
placeholder="选择查询日期"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<el-form-item label="登录情况" label-width="80px">
|
||
<el-select v-model="searchForm.STATE">
|
||
<el-option label="已登录" value="1" />
|
||
<el-option label="未登录" value="2" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label-width="10px">
|
||
<el-button type="primary" native-type="submit">搜索</el-button>
|
||
<el-button native-type="reset" @click="fnGetDataTransfer">
|
||
重置
|
||
</el-button>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
</el-card>
|
||
<layout-card>
|
||
<div class="mb-10" style="display: flex">
|
||
<div>
|
||
部门共有<span class="text-red"> {{ list.length }} </span>人,
|
||
</div>
|
||
<div>
|
||
登录<span class="text-red"> {{ loginNum }} </span>人,
|
||
</div>
|
||
<div>
|
||
登录率<span class="text-red"> {{ achieving }}% </span>。
|
||
</div>
|
||
<div>
|
||
共有清单<span class="text-red"> {{ listNoCheckNum }} </span>张,
|
||
</div>
|
||
<div>
|
||
已检查<span class="text-red"> {{ listCheckedNum }} </span>张,
|
||
</div>
|
||
<div>
|
||
检查率<span class="text-red"> {{ checkTheRate }}% </span>。
|
||
</div>
|
||
</div>
|
||
<layout-table :data="list" :show-pagination="false">
|
||
<el-table-column label="序号" width="70">
|
||
<template #default="{ $index }">
|
||
{{ serialNumber(pagination, $index) }}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="DEPARTMENTNAME_ALL" label="部门" />
|
||
<el-table-column prop="POSTNAME" label="岗位" />
|
||
<el-table-column prop="USERNAME" label="姓名" />
|
||
<el-table-column prop="NOTEXAMINEDNUM" label="待排查清单数" />
|
||
<el-table-column prop="INSPECTEDNUM" label="已排查清单数" />
|
||
<el-table-column prop="PERCENT" label="排查率" />
|
||
<el-table-column label="登录情况">
|
||
<template #default="{ row }">
|
||
{{ row.ISLOGIN > 0 ? "已登录" : "未登录" }}
|
||
</template>
|
||
</el-table-column>
|
||
</layout-table>
|
||
</layout-card>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import LayoutDepartment from "@/components/department/index.vue";
|
||
import { serialNumber } from "@/assets/js/utils.js";
|
||
import useListData from "@/assets/js/useListData.js";
|
||
import { getUsageSituationList } from "@/request/statistical_analysis.js";
|
||
import { ref } from "vue";
|
||
import dayjs from "dayjs";
|
||
|
||
const loginNum = ref(0);
|
||
const achieving = ref(0);
|
||
const listNoCheckNum = ref(0);
|
||
const listCheckedNum = ref(0);
|
||
const checkTheRate = ref(0);
|
||
const { list, searchForm, pagination, fnGetData } = useListData(
|
||
getUsageSituationList,
|
||
{
|
||
defaultSearchForm: {
|
||
TIME: dayjs().format("YYYY-MM-DD"),
|
||
},
|
||
usePagination: false,
|
||
callbackFn: (list, resData) => {
|
||
achieving.value = resData.achieving;
|
||
checkTheRate.value = resData.checkTheRate;
|
||
listCheckedNum.value = resData.listCheckedNum;
|
||
listNoCheckNum.value = resData.listNoCheckNum;
|
||
loginNum.value = resData.loginNum;
|
||
},
|
||
}
|
||
);
|
||
const fnGetDataTransfer = () => {
|
||
fnGetData({
|
||
DEPTIDS: searchForm.value.DEPTIDS?.join(","),
|
||
});
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss"></style>
|