123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294 |
- <template>
- <div>
- <common @asynCallBack="asynCallBack"></common>
- <top-header :pageTitle="pageTitle" ></top-header>
- <div class="mui-content">
- <div class="fyy-temper-date">
- <a @click="selectStartDate" class="mui-col-xs-5" v-text="dataForm.startTime"></a>
- <span class="mui-col-xs-2">至</span>
- <a @click="selectEndDate" class="mui-col-xs-5" v-text="dataForm.endTime"></a>
- </div>
- <ul class="mui-table-view mui-grid-view mui-grid-9 vongi-statistics">
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <div class="vongi-statistics-body">
- <span class="mui-icon mui-icon-home iconfont icon-qiyegongchangjianzhu"></span>
- <div class="mui-media-body">异常数量</div>
- <div class="mui-media-body mui-h3 color4fc5f7" v-text="companyTotalCount"> </div>
- </div>
- </li>
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <div class="vongi-statistics-body">
- <span class="mui-icon mui-icon-home iconfont icon-ziyuan"></span>
- <div class="mui-media-body">异常人数</div>
- <div class="mui-media-body mui-h3 colorfe616c" v-text="personTotalCount"> </div>
- </div>
- </li>
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <div class="vongi-statistics-body">
- <span class="mui-icon mui-icon-home iconfont icon-renshu"></span>
- <div class="mui-media-body">未测人员</div>
- <div class="mui-media-body mui-h3 colorf8b155" v-text="undetectedCount"> </div>
- </div>
- </li>
- </ul>
- <div class="mui-content-padded vongi-yctj-list">
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell mui-collapse">
- <a class="mui-navigate-right" @touchend="setNowOpen(1)" >异常单位列表</a>
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell mui-media" v-for="(item,index) in companyList">
- <router-link :to="{name: 'HouseKeeperControlHealthAbnormalRecord', query: {companyId: item.id,companyName:doEscape(item.name),filter:1,queryDate:item.date}}"
- class="mui-navigate-right">
- <div class="mui-media-body">
- {{item.name}}
- <h4 class='mui-pull-right'><span class="colorfe616c" v-text="item.personCount"></span>人</h4>
- </div>
- </router-link>
- </li>
- </ul>
- </li>
- </ul>
- </div>
- <div class="mui-content-padded vongi-yctj-list">
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell mui-collapse">
- <a class="mui-navigate-right" @touchend="setNowOpen(2)">未检测员工列表</a>
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell" v-for="(item,index) in personList">
- <router-link :to="{name: 'CommonHealthCert', query: {personId: item.id}}" class="mui-navigate-right">
- {{item.name}}<span class="iconfont icon-erweima1 color55f868" :style="'color:'+getGreenCodeColor(item['healthyCode'])" ></span>
- </router-link>
- </li>
- </ul>
- </li>
- </ul>
- </div>
- </div>
- <loading :visible="isLoading"></loading>
- </div>
- </template>
- <script>
- require('$project/assets/js/mui.picker.min.js');
- import * as API_ControlHealth from '@/apis/HouseKeeper/control/health'
- import Common from '$project/components/Common.vue'
- import Loading from '$project/components/Loading.vue'
- import isReachBottom from '$project/utils/isReachBottom'
- import TopHeader from '$project/components/TopHeader.vue'
- import {
- mapGetters,
- mapMutations
- } from 'vuex'
- import {
- currentTimeStamp,
- parseUnixTime,
- beforeTimeStamp
- } from '$project/utils'
- export default {
- name: 'HouseKeeperControlHealthAbnormalStatistics',
- components: {
- Common,
- Loading,
- TopHeader
- },
- data() {
- return {
- pageTitle: "异常统计",
- isLoading: false,
- dataForm: {
- startTime: '',
- endTime: '',
- },
- personTotalCount: 0,
- companyTotalCount: 0,
- undetectedCount: 0,
- companyList: [],
- personList: [],
- personListForm: {
- pageIndex: 1,
- pageSize: 20,
- startTime: '',
- totalPage: 1,
- endTime: 0
- },
- nowOpen: 0,
- };
- },
- created() {
- this.queryDate = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
- //定义当前日期范围
- if (this.$store.state.control_abnormal_statistics_startTime) {
- this.dataForm.startTime = this.$store.state.control_abnormal_statistics_startTime;
- } else {
- this.dataForm.startTime = parseUnixTime(beforeTimeStamp(0), '{y}-{m}-{d}');
- this.$store.commit('setControlAbnormalStatisticsStartTime', this.dataForm.startTime);
- this.personListForm.startTime = parseUnixTime(beforeTimeStamp(0), '{y}-{m}-{d}');
- }
- if (this.$store.state.control_abnormal_statistics_endTime) {
- this.dataForm.endTime = this.$store.state.control_abnormal_statistics_endTime;
- } else {
- this.dataForm.endTime = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
- this.$store.commit('setControlAbnormalStatisticsEndTime', this.dataForm.endTime);
- this.personListForm.endTime = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
- }
- //this.personListForm.startTime = parseUnixTime(beforeTimeStamp(7), '{y}-{m}-{d}');
- //this.personListForm.endTime = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
- },
- methods: {
- asynCallBack(){},
- setNowOpen(val) {
- this.nowOpen = val;
- console.log('当前' + this.nowOpen);
- },
- //选择起始日期
- selectStartDate() {
- var _this = this;
- var picker = new mui.DtPicker({
- "type": "date",
- "beginYear": 2020,
- "endYear": 2040,
- "endDate": new Date(),
- "value": _this.dataForm.startTime
- });
- picker.show(function(rs) {
- _this.dataForm.startTime = rs.text;
- _this.$store.commit('setControlAbnormalStatisticsStartTime', _this.dataForm.startTime);
- _this.getUnusalStatistic();
- picker.dispose();
- });
- },
- //选择结束日期
- selectEndDate() {
- var _this = this;
- var beginDate = new Date(_this.dataForm.startTime);
- beginDate.setDate(beginDate.getDate());
- var endDate = new Date();
- endDate.setDate(endDate.getDate());
- var picker = new mui.DtPicker({
- "type": "date",
- "beginYear": 2020,
- "beginDate": beginDate,
- "endDate": endDate,
- "value": _this.dataForm.endTime
- });
- picker.show(function(rs) {
- _this.dataForm.endTime = rs.text;
- _this.$store.commit('setControlAbnormalStatisticsEndTime', _this.dataForm.endTime);
- _this.getUnusalStatistic();
- _this.getPersonList();
- picker.dispose();
- });
- },
- //获取统计数据
- getUnusalStatistic() {
- this.isLoading = true;
- API_ControlHealth.getAbnormalStatistics(this.dataForm).then(response => {
- this.isLoading = false;
- this.personTotalCount = response.personTotalCount;
- this.companyTotalCount = response.companyTotalCount;
- this.undetectedCount = response.undetectedCount;
- this.companyList = response.list;
- }).catch(error => {
- this.isLoading = false;
- this.mui.toast(error);
- });
- },
- //获取未检测人员列表
- getPersonList() {
- this.isLoading = true;
- API_ControlHealth.getUndetectedPersonList(this.personListForm).then(response => {
- this.isLoading = false;
- if (this.personListForm.pageIndex == 1) {
- this.personList = response.data; // 数据数组
- this.personListForm.pageIndex = response.pageNumber; //当前页数
- this.personListForm.totalPage = response.totalPage; //总页数
- } else {
- this.personList = [ // 当前数据与第二页数据合并到一个数组中
- ...this.personList,
- ...response.data
- ];
- }
- this.personListForm.pageIndex++;
- }).catch(error => {
- this.isLoading = false;
- this.mui.toast(error);
- });
- },
- //下拉事件
- handleScrool() {
- //console.log(window.screen.height + '-' + document.body.scrollTop + '-' + document.body.clientHeight)
- if (isReachBottom()) {
- console.log('到达底部' + this.nowOpen)
- if (this.nowOpen == 2 && this.personListForm.pageIndex <= this.personListForm.totalPage && this.isLoading == false) {
- this.getPersonList();
- } else {
- return;
- }
- }
- },
- doEscape(str) {
- return escape(str);
- },
- //获取健康码颜色值
- getGreenCodeColor(healthyCode) {
- var healthyCode = healthyCode || '11';
- var color = {
- "00": '#09ae47',
- "01": '#e5aa37',
- "10": '#fe616c',
- "11": '#C0C0C0'
- }
- return color[healthyCode];
- }
- },
- mounted() {
- //显示数据
- this.getUnusalStatistic();
- //获取未检测人员列表
- this.getPersonList();
- //监控下拉加载事件
- var _this = this;
- window.addEventListener('scroll', _this.handleScrool);
- },
- destroyed() {
- //销毁监听事件
- var _this = this;
- window.removeEventListener('scroll', _this.handleScrool);
- },
- watch: {
- 'dataForm.startTime': {
- handler(newValue) {
- this.personListForm.startTime = newValue;
- },
- immediate: true,
- deep: true
- },
- 'dataForm.endTime': {
- handler(newValue) {
- this.personListForm.endTime = newValue;
- },
- immediate: true,
- deep: true
- }
- }
- };
- </script>
- <style scoped src="$project/assets/css/sczpfyy.css"></style>
- <style scoped src="$project/assets/css/xpwyfyy.css"></style>
- <style src="$project/assets/css/iconfont.css"></style>
- <style>
- </style>
|