SmartCommunity/operationSupport/src/views/patrolManagement/patrolRecords.vue

<template>
    <div class="main">
        <template v-if="!isLook">
            <div class="search">
                <el-input placeholder="请输入巡更路线/人员" class="search-input" clearable v-model="mixins_query.partolName"></el-input>
                <el-select class="width90" placeholder="请选择巡更状态" v-model="mixins_query.patrolStatus" clearable>
                    <el-option label="待执行" :value="1"></el-option>
                    <el-option label="执行中" :value="2"></el-option>
                    <el-option label="已完成" :value="3"></el-option>
                    <el-option label="已完成(超时)" :value="4"></el-option>
                    <el-option label="已逾期" :value="5"></el-option>
                </el-select>
                <el-date-picker
                    v-model="times"
                    value-format="yyyy-MM-dd"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    @change="effectiveDateToggle"
                ></el-date-picker>
                <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询</el-button>
            </div>
            <zz-table
                :cols="cols"
                :settings="{ showIndex: true, stripe: true }"
                :loading="mixins_onQuery"
                :data="mixins_list"
                :pageset="mixins_pageset"
                @page-change="pageChange"
            >
                <template slot-scope="scope" slot="patrolDate"> {{ checkDateType(scope.row.patrolDate) }}</template>
                <template slot-scope="scope" slot="opt">
                    <div class="opt">
                        <el-tooltip effect="light" placement="bottom" content="详情">
                            <i class="zoniot_font zoniot-icon-xiangqing" @click="lookDetails(scope.row)"></i>
                        </el-tooltip>
                    </div>
                </template>
            </zz-table>
        </template>
        <patrol-details v-else @initPage="initPage" :thisObj="thisObj"></patrol-details>
    </div>
</template>

<script>
import list from '@utils/list.js';
import patrolDetails from './popups/patrolDetails';
export default {
    mixins: [list],
    name: 'workOrdersRecords',
    components: {
        patrolDetails
    },
    data() {
        return {
            communityArr: [],
            cols: [
                {
                    label: '所属社区',
                    prop: 'communityName'
                },
                {
                    label: '巡更路线',
                    prop: 'routeName'
                },
                {
                    label: '巡更人员',
                    prop: 'partolName'
                },
                {
                    label: '巡更日期',
                    prop: 'patrolDate',
                    slot: 'patrolDate'
                },
                {
                    label: '巡更时间',
                    prop: 'patrolTime'
                },
                {
                    label: '状态',
                    prop: 'patrolStatus',
                    format(val) {
                        if (val == 1) {
                            return '待执行';
                        } else if (val == 2) {
                            return '执行中';
                        } else if (val == 3) {
                            return '已完成';
                        } else if (val == 4) {
                            return '已完成(超时)';
                        } else if (val == 5) {
                            return '已逾期';
                        }
                        return '--';
                    }
                },
                {
                    label: '操作',
                    prop: 'id',
                    slot: 'opt'
                }
            ],
            times: [],
            thisObj: {},
            isLook: false,
            mixins_post: 'post'
        };
    },
    created() {
        this.mixins_dataUrl = '/sc-community/patrolRecord/page';
        this.mixins_query = {};
        this.mixins_search();
    },
    mounted() {},
    methods: {
        effectiveDateToggle(va) {
            let arr = va;
            if (!arr) {
                arr = ['', ''];
            }
            this.mixins_query.startTime = arr[0];
            this.mixins_query.endTime = arr[1];
        },
        lookDetails(row) {
            this.thisObj = row;
            this.isLook = true;
        },
        initPage() {
            this.isLook = false;
            this.thisObj = {};
        },
        checkDateType(time) {
            return !!time ? this.$moment(new Date(time)).format('YYYY-MM-DD') : '--';
        }
    }
};
</script>
<style scoped lang='scss'>
.imgVdio img {
    width: 64px;
}
</style>