马宇豪
2025-03-04 1b9fea7d4af68d8f933b2dc42bf6084b9646f64c
src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue
@@ -1,17 +1,30 @@
<template>
    <div class="home-container">
        <div style="height: 100%">
        <div style="height: 100%;display: flex;flex-direction: column;align-items: stretch;">
            <el-row class="homeCard">
                <div class="basic-line">
                    <span>任务类型:</span>
                    <el-select v-model="tableData.params.workType" clearable filterable class="input-box" placeholder="任务类型">
                    <el-select v-model="tableData.params.taskType" clearable filterable class="input-box" placeholder="任务类型">
                        <el-option v-for="item in workTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </div>
                <div class="basic-line">
                    <span>部门:</span>
                    <el-cascader class="input-box" :options="departmentList" :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }"
                                 placeholder="请选择部门" clearable v-model="tableData.params.execDepId"
                                 @change="changeGroup"
                    > </el-cascader>
                </div>
                <div class="basic-line">
                    <span>执行班组:</span>
                    <el-select v-model="tableData.params.execClassgroupId" clearable filterable class="input-box" placeholder="执行班组">
                        <el-option v-for="item in classGroupList" :key="item.id" :label="item.groupName" :value="item.id"></el-option>
                    </el-select>
                </div>
                <div class="basic-line">
                    <span>任务状态:</span>
                    <el-select v-model="tableData.params.taskStatus" clearable filterable class="input-box" placeholder="任务状态">
                        <el-option v-for="item in taskStatusList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </div>
                <div style="padding-bottom: 10px">
@@ -25,7 +38,13 @@
                        <el-button type="primary" :icon="Refresh" size="default" />
                    </el-row>
                    <el-table ref="multipleTableRef" :data="tableData.inspectRecordData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }">
                        <el-table-column property="taskName" label="任务名称" />
                        <el-table-column property="taskName" label="任务名称">
                            <template #default="scope">
                                <div :class="hasJump == true && scope.row.startTime.slice(0, 10) == date && (tableData.params.taskStatus == 4 || tableData.params.taskStatus == 5) ? 'redTit' : ''">
                                    {{ scope.row.taskName }}
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column property="taskType" label="任务类型">
                            <template #default="scope">
                                <span>
@@ -33,13 +52,7 @@
                                </span>
                            </template>
                        </el-table-column>
                        <el-table-column property="execClassgroupId" label="巡检班组">
                            <template #default="scope">
                                <span>
                                    {{ parseNumber(scope.row.execClassgroupId, '巡检班组') }}
                                </span>
                            </template>
                        </el-table-column>
                        <el-table-column property="execClassgroupName" label="巡检班组"/>
                        <el-table-column property="frequency" label="检查频次">
                            <template #default="scope">
                                <span>
@@ -50,29 +63,33 @@
                                </span>
                            </template>
                        </el-table-column>
                        <!--                        <el-table-column prop="validTime" label="有效时间" show-overflow-tooltip>-->
                        <!--                            <template #default="scope">-->
                        <!--                                <span>-->
                        <!--                                    {{ scope.row.validTime }}-->
                        <!--                                </span>-->
                        <!--                                <span>-->
                        <!--                                    {{ parseNumber(scope.row.validTimeUnit, '检查频次') }}-->
                        <!--                                </span>-->
                        <!--                            </template>-->
                        <!--                        </el-table-column>-->
                        <!--                        <el-table-column prop="validTime" label="提醒时间" show-overflow-tooltip>-->
                        <!--                            <template #default="scope">-->
                        <!--                                <span>-->
                        <!--                                    {{ scope.row.noticeTime }}-->
                        <!--                                </span>-->
                        <!--                                <span>-->
                        <!--                                    {{ parseNumber(scope.row.noticeTimeUnit, '检查频次') }}-->
                        <!--                                </span>-->
                        <!--                            </template>-->
                        <!--                        </el-table-column>-->
                        <el-table-column property="startTime" label="任务开始时间" />
                        <el-table-column prop="execUserName" label="执行人" show-overflow-tooltip></el-table-column>
                        <el-table-column property="resultStatus" label="状态">
                        <el-table-column property="taskStatus" label="任务状态" width="180">
                            <template #default="scope">
                                <el-tag :type="scope.row.resultStatus === 1 ? 'danger' : scope.row.taskStatus === 1 ? 'info' : scope.row.taskStatus === 2 ? '' : scope.row.taskStatus === 3 ? 'success' : 'danger'">
                                    <span>
                                        {{ scope.row.resultStatus === 1 ? '已巡检存在异常' : parseNumber(scope.row.taskStatus, '任务状态') }}
                                    </span>
                                </el-tag>
                            </template>
                        </el-table-column>
                      <el-table-column property="taskClaimTime" label="认领时间">
                        <template #default="scope">
                          {{scope.row.taskClaimTime?scope.row.taskClaimTime:'--'}}
                        </template>
                      </el-table-column>
                      <el-table-column property="reportTime" label="填报时间">
                        <template #default="scope">
                          {{scope.row.reportTime?scope.row.reportTime:'--'}}
                        </template>
                      </el-table-column>
                      <el-table-column property="taskTimeConsuming" label="巡检耗时">
                        <template #default="scope">
                          {{scope.row.taskTimeConsuming?scope.row.taskTimeConsuming:'--'}}
                        </template>
                      </el-table-column>
                        <el-table-column property="resultStatus" label="巡检结果">
                            <template #default="scope">
                                <span>
                                    {{ parseNumber(scope.row.resultStatus, '巡检状态') }}
@@ -100,11 +117,12 @@
import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue';
import { ElTable, ElMessage } from 'element-plus';
import { inspectRecordApi } from '/@/api/intellectInspectSystem/inspectRecord';
import inspectRecordDialog from './components/inspectRecordDialog.vue';
import inspectRecordDialog from '../../inspectIndex/components/inspectRecordDialog.vue';
import { departmentApi } from '/@/api/systemManage/department';
import { teamManageApi } from '/@/api/systemManage/personShiftManage/teamManage';
import { inspectPointApi } from '/@/api/intellectInspectSystem/inspectPointManage';
import { inspectTaskApi } from '/@/api/intellectInspectSystem/inspectTask';
import { useRoute } from 'vue-router';
let global: any = {
    homeChartOne: null,
    homeChartTwo: null,
@@ -113,6 +131,9 @@
};
interface stateType {
    isRed: boolean;
    hasJump: boolean;
    date: string;
    tableData: {
        inspectRecordData: [];
        total: number;
@@ -130,9 +151,11 @@
            validTime: string | null;
            createUserId: number | null;
            reportTime: string | null;
            resultStatus: number | null;
        };
    };
    workTypeList: Array<type>;
    taskStatusList: Array<type>;
    quotaList: [];
    departmentList: [];
    classGroupList: Array<classGroup>;
@@ -148,12 +171,15 @@
    id: number;
    groupName: string;
}
interface timeType {}
export default {
    name: 'index',
    components: { inspectRecordDialog },
    setup() {
        const inspectRecordDialogRef = ref();
        const route = useRoute();
        const state = reactive<stateType>({
            hasJump: false,
            tableData: {
                inspectRecordData: [],
                total: 0,
@@ -170,16 +196,27 @@
                    startTime: null,
                    validTime: null,
                    createUserId: null,
                    reportTime: null
                    reportTime: null,
                    resultStatus: null
                }
            },
            isRed: false,
            date: '',
            workTypeList: [
                { id: 1, name: '日常任务' },
                { id: 2, name: '周期任务' }
                { id: 1, name: '周期任务' },
                { id: 2, name: '单次任务' }
            ],
            resultStatusList: [
                { id: 0, name: '正常' },
                { id: 1, name: '异常' }
                { id: 1, name: '存在异常' },
                { id: 2, name: '备' }
            ],
            taskStatusList: [
                { id: 1, name: '待巡检' },
                { id: 2, name: '巡检中' },
                { id: 3, name: '已巡检正常' },
                { id: 5, name: '已巡检存在异常' },
                { id: 4, name: '超时未完成巡检' }
            ],
            quotaList: [],
            departmentList: [],
@@ -196,9 +233,19 @@
        //获取巡检记录数据
        const getInspectRecord = async () => {
            let res = await inspectRecordApi().getInspectRecordList(state.tableData.params);
            const data = JSON.parse(JSON.stringify(state.tableData.params));
            if (state.tableData.params.taskStatus == 3) {
                data.taskStatus = 3;
                data.resultStatus = 0;
            }
            if (state.tableData.params.taskStatus == 5) {
                data.taskStatus = 3;
                data.resultStatus = 1;
            }
            console.log(state.tableData.params.taskStatus, data.taskStatus, 'data');
            let res = await inspectRecordApi().getInspectRecordList(data);
            if (res.data.code === '200') {
                state.tableData.inspectRecordData = res.data.data.records;
                state.tableData.inspectRecordData = JSON.parse(JSON.stringify(res.data.data.records));
                state.tableData.total = res.data.data.total;
            } else {
                ElMessage({
@@ -247,18 +294,22 @@
            }
        };
        //获取班组
        const getClassGroupData = async () => {
            let res = await teamManageApi().getRecord({ depIp: null, groupName: null, containGroupMemberEnable: null });
            if (res.data.code === '200') {
                state.classGroupList = res.data.data;
            } else {
                ElMessage({
                    type: 'warning',
                    message: res.data.msg
                });
        const changeGroup = async () => {
            if(state.tableData.params.execDepId === null) {
                state.classGroupList = []
            }else{
                let res = await departmentApi().getByDepId({depId:state.tableData.params.execDepId})
                if(res.data.code === '200'){
                    state.classGroupList = res.data.data
                }else{
                }
            }
        };
        // const turnRed =()=>{
        //     date
        // }
        const openInspectRecordDialog = (type: string, value: {}) => {
            inspectRecordDialogRef.value.showInspectRecordDialog(type, value, state.workTypeList, state.departmentList, state.timeType, state.classGroupList, state.quotaList, state.inspectPointAllList);
@@ -271,6 +322,8 @@
                return state.timeType.find((item) => item.id == value)?.name;
            } else if (type === '巡检状态') {
                return state.resultStatusList.find((item) => item.id == value)?.name;
            } else if (type === '任务状态') {
                return state.taskStatusList.find((item) => item.id == value)?.name;
            } else {
                return state.classGroupList.find((item) => item.id == value)?.groupName;
            }
@@ -285,28 +338,57 @@
        const onHandleCurrentChange = (val: number) => {
            state.tableData.params.pageIndex = val;
            getInspectRecord();
            state.isRed = false;
        };
        // 时间格式化
        const timeForm: timeType = {
            hour12: false,
            year: 'numeric',
            month: '2-digit',
            day: '2-digit',
            hour: '2-digit',
            minute: '2-digit',
            second: '2-digit'
        };
        const reset = () => {
            state.tableData.params = {
                pageIndex: 1,
                pageSize: 10,
                unitName: null,
                workType: null,
                createUserId: null,
                taskName: null,
                taskType: null,
                taskStatus: null,
                execUserId: null,
                execClassgroupId: null,
                checkCycle: null,
                checkCycleUnit: null
                execDepId: null,
                startTime: null,
                validTime: null,
                createUserId: null,
                resultStatus: null,
                reportTime: null
            };
        };
        // 当前时间
        const getDateTime = () => {
            const curTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-');
            state.date = curTime.slice(0, 10);
        };
        // 页面加载时
        onMounted(() => {
            getInspectRecord();
            getQuotaList();
            getDepartmentData();
            getClassGroupData();
            getInspectTaskPoint();
            getDateTime();
            if (route.query.id) {
                state.hasJump = true;
                state.tableData.params.taskStatus = Number(route.query.id);
                state.isRed = true;
                getInspectRecord();
                getQuotaList();
                getDepartmentData();
                getInspectTaskPoint();
            } else {
                getInspectRecord();
                getQuotaList();
                getDepartmentData();
                getInspectTaskPoint();
            }
        });
        return {
@@ -317,6 +399,7 @@
            Plus,
            reset,
            parseNumber,
            changeGroup,
            getInspectRecord,
            onHandleSizeChange,
            onHandleCurrentChange,
@@ -331,15 +414,17 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
    height: calc(100vh - 114px);
    height: calc(100vh - 144px);
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    .homeCard {
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        background: #fff;
        border-radius: 4px;
        flex: 0 auto;
        .main-card {
            width: 100%;
@@ -354,7 +439,15 @@
                }
            }
            .pageBtn {
                position: absolute;
                width: 100%;
                z-index: 99;
                bottom: 0;
                right: 0;
                height: 60px;
                border-radius: 0 0 4px 4px;
                padding-right: 20px;
                background: #fff;
                display: flex;
                align-items: center;
                justify-content: right;
@@ -367,8 +460,8 @@
                }
            }
        }
        &:last-of-type {
            height: calc(100% - 100px);
        &:last-of-type{
          flex: 1;
        }
    }
    .el-row {
@@ -454,6 +547,9 @@
        color: #0098f5;
    }
}
.redTit {
    color: red;
}
.el-input {
    width: 100% !important;
}
@@ -463,4 +559,14 @@
.el-select {
    width: 100%;
}
:deep(.el-textarea.is-disabled .el-textarea__inner) {
    background-color: var(--el-card-bg-color);
    color: var(--el-input-text-color, var(--el-text-color-regular));
}
:deep(.el-input.is-disabled .el-input__inner) {
    color: var(--el-input-text-color, var(--el-text-color-regular));
}
:deep(.el-input.is-disabled .el-input__wrapper) {
    background-color: var(--el-card-bg-color);
}
</style>