Default Changelist

Admin

2022-09-09 1c3fd3dd743262b0f62e7f16999de2b9267845b0

Default Changelist

 src/views/specialWorkSystem/workAlert/alertRecord/index.vue

@@ -49,7 +49,7 @@
                            ref="multipleTableRef"
                            :data="tableData"
                            style="width: 100%"
                            height="calc(100% - 48px)"
                            height="calc(100% - 100px)"
                            :header-cell-style="{background: '#fafafa'}"
                    >
                        <el-table-column type="index" label="序号" width="80"/>

 src/views/specialWorkSystem/workPlan/workAppoint/index.vue

@@ -1,65 +1,63 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <div style="height: 100%">
        <el-row class="homeCard">
            <el-col :span="12">
                <el-col :span="6" style="display:flex;align-items: center">
                    <span style="white-space: nowrap">申请部门：</span>
                <div class="grid-content topInfo">
                    <el-date-picker
                            v-model="searchTime"
                            type="datetime"
                            placeholder="预约时间"
                            size="large"
                            style="width: 100%;white-space: nowrap;margin-right: 20px"
                    />
                    <el-select v-model="typeValue" placeholder="请选择预约类型" style="width: 100%">
                        <el-option label="类型1" value="类型1"/>
                        <el-option label="类型2" value="类型2"/>
                        <el-option label="类型3" value="类型3"/>
                    </el-select>
                    <el-button type="primary">查询历史</el-button>
                    <el-button plain>重置</el-button>
                    <el-button type="primary" @click="dialogChartsVisible = true">查看统计图表</el-button>
                        <el-input v-model="workPermitNo" placeholder="请输入部门名称"></el-input>
                </div>
            </el-col>
                <el-col :span="6" style="display:flex;align-items: center">
                    <span style="white-space: nowrap">预约日期：</span>
                    <div class="grid-content topInfo">
                        <el-select v-model="workType" placeholder="请选择作业类型">
                            <el-option
                                    v-for="item in workTypeList"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id"
                            />
                        </el-select>
                    </div>
                </el-col>
                <el-button type="primary" @click="searchRecord">查询</el-button>
                <el-button plain @click="clearSearch">重置</el-button>
        </el-row>
        <div class="homeCard">
            <div class="main-card">
                <el-row class="cardTop">
                    <el-col :span="12" class="mainCardBtn">
                        <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新增</el-button>
<!--                        <el-button type="warning" :icon="Edit" size="default" plain>修改</el-button>-->
                        <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button>
                    </el-col>
                    <el-button type="primary" :icon="Refresh" size="default"/>
                </el-row>
<!--                    <el-row class="cardTop">-->
<!--                        <el-col :span="12" class="mainCardBtn">-->
<!--                            <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord = true">新增</el-button>-->
<!--                        </el-col>-->
<!--                        <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData"/>-->
<!--                    </el-row>-->
                <el-table
                        ref="multipleTableRef"
                        :data="tableData"
                        style="width: 100%"
                            height="calc(100% - 100px)"
                        :header-cell-style="{background: '#fafafa'}"
                        @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="55" />
                    <el-table-column type="index" label="序号" width="120" />
                    <el-table-column prop="time" label="预约时间" width="150" />
                    <el-table-column prop="department" label="预约部门" width="180" />
                    <el-table-column prop="dirtyWork" label="动土作业" width="100" />
                    <el-table-column prop="fireWork" label="动火作业" width="100" />
                    <el-table-column prop="hangWork" label="吊装作业" width="100" />
<!--                        <el-table-column type="selection" width="55" />-->
                        <el-table-column type="index" label="序号" width="80" />
                        <el-table-column prop="department" label="申请部门"/>
                        <el-table-column prop="time" label="预约时间"/>
                        <el-table-column prop="fireWork" label="动火作业"/>
                    <el-table-column prop="spaceWork" label="受限空间作业"/>
                        <el-table-column prop="hangWork" label="吊装作业"/>
                        <el-table-column prop="dirtyWork" label="动土作业"/>
                    <el-table-column prop="cut" label="断路作业"/>
                    <el-table-column prop="high" label="高处作业" />
                    <el-table-column prop="block" label="盲板抽堵作业"/>
                    <el-table-column prop="tempUse" label="临时用电作业"/>
                        <el-table-column prop="block" label="盲板抽堵作业"/>
                    <el-table-column fixed="right" label="操作" align="center" width="250">
                        <template #default="scope">
                            <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
                            <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
                            <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button>
                                <el-button link type="primary" size="small" :icon="Edit" @click="editRecordBtn(scope.$index, scope.row)">修改</el-button>
                                <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecordBtn(scope.row)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="pageBtn">
                <el-pagination
                        v-model:currentPage="currentPage"
@@ -68,63 +66,25 @@
                        small=false
                        background
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="100"
                                :total="totalSize"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </div>
        </el-scrollbar>
        <el-dialog v-model="dialogChartsVisible" title="统计图表" @opened="openChart">
            <el-row>
                <div class="grid-content">
                    <div style="margin-bottom: 10px">日期查询：</div>
                    <div class="block">
                        <el-date-picker
                                v-model="dateRange"
                                type="daterange"
                                unlink-panels
                                range-separator="至"
                                start-placeholder="开始日期"
                                end-placeholder="截止日期"
                                :shortcuts="shortcuts"
                                size="large"
                        />
                    </div>
                </div>
            </el-row>
            <el-row>
                <div class="grid-content">
                    <div style="margin-bottom: 10px">部门查询：</div>
                    <div>
                        <el-cascader
                                v-model="departmentName"
                                :options="departmentOptions"
                                :props="{expandTrigger: 'hover'}"
                                @change="handleChange"
                        />
                    </div>
                </div>
            </el-row>
            <div ref="myChart" style="width: 100%;height:400px;"></div>
        </el-dialog>
        <el-dialog v-model="dialogDetails" title="作业预约">
            <el-form :model="details" label-width="120px">
                <el-form-item label="预约时间">
                    <el-input
                            v-model="details.time"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="预约部门">
                <el-form-item label="申请部门">
                    <el-input
                            v-model="details.department"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="动土作业">
                <el-form-item label="预约时间">
                    <el-input
                            v-model="details.dirtyWork"
                            v-model="details.time"
                            readonly
                    />
                </el-form-item>
@@ -134,15 +94,21 @@
                            readonly
                    />
                </el-form-item>
                <el-form-item label="受限空间作业">
                    <el-input
                            v-model="details.spaceWork"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="吊装作业">
                    <el-input
                            v-model="details.hangWork"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="受限空间作业">
                <el-form-item label="动土作业">
                    <el-input
                            v-model="details.spaceWork"
                            v-model="details.dirtyWork"
                            readonly
                    />
                </el-form-item>
@@ -158,25 +124,30 @@
                            readonly
                    />
                </el-form-item>
                <el-form-item label="盲板抽堵作业">
                    <el-input
                            v-model="details.block"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="临时用电作业">
                    <el-input
                            v-model="details.tempUse"
                            readonly
                    />
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
                <el-form-item label="盲板抽堵作业">
                    <el-input
                            v-model="details.block"
                            readonly
                    />
                </el-form-item>
            </el-form>
            <template #footer>
              <span class="dialog-footer">
                <el-button type="primary" @click="dialogDetails = false">确认</el-button>
              </span>
            </template>
        </el-dialog>
        <el-dialog v-model="dialogAddRecord" title="作业预约编辑" @close="closeAdd">
        <el-dialog v-model="dialogAddRecord" title="作业预约编辑" @close="closeAdd" @open="openAdd">
            <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
                <el-form-item label="申请部门" prop="department">
                    <el-cascader v-model="addRecord.department" :options="departmentList" :props="casProps" :show-all-levels="false" @change="handleChange" />
                </el-form-item>
                <el-form-item label="预约时间" prop="time">
                    <el-date-picker
                            v-model="addRecord.time"
@@ -184,20 +155,14 @@
                            format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
                    />
                </el-form-item>
                <el-form-item label="预约部门" prop="department">
                    <el-select v-model="addRecord.department" placeholder="请选择">
                        <el-option label="部门一" value="部门一" />
                        <el-option label="部门二" value="部门二" />
                    </el-select>
                </el-form-item>
                <el-form-item label="动土作业">
                    <el-input
                            v-model="addRecord.dirtyWork"
                    />
                </el-form-item>
                <el-form-item label="动火作业">
                    <el-input
                            v-model="addRecord.fireWork"
                    />
                </el-form-item>
                <el-form-item label="受限空间作业">
                    <el-input
                            v-model="addRecord.spaceWork"
                    />
                </el-form-item>
                <el-form-item label="吊装作业">
@@ -205,9 +170,9 @@
                            v-model="addRecord.hangWork"
                    />
                </el-form-item>
                <el-form-item label="受限空间作业">
                <el-form-item label="动土作业">
                    <el-input
                            v-model="addRecord.spaceWork"
                            v-model="addRecord.dirtyWork"
                    />
                </el-form-item>
                <el-form-item label="断路作业">
@@ -220,389 +185,378 @@
                            v-model="addRecord.high"
                    />
                </el-form-item>
                <el-form-item label="盲板抽堵作业">
                    <el-input
                            v-model="addRecord.block"
                    />
                </el-form-item>
                <el-form-item label="临时用电作业">
                    <el-input
                            v-model="addRecord.tempUse"
                    />
                </el-form-item>
                <el-form-item>
                    <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
                    <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
                <el-form-item label="盲板抽堵作业">
                    <el-input
                            v-model="addRecord.block"
                    />
                </el-form-item>
            </el-form>
        </el-dialog>
        <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
            <span>您确定要删除该条记录吗？</span>
            <template #footer>
          <span class="dialog-footer">
              <el-button @click="deleteDialog = false" size="default">取消</el-button>
            <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
                <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
                <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
          </span>
            </template>
        </el-dialog>
    </div>
</template>

<script lang="ts" setup>
    import { toRefs, reactive, ref } from 'vue';
<script lang="ts">
    import {toRefs, reactive, ref, onMounted, defineAsyncComponent} from 'vue';
    import { storeToRefs } from 'pinia';
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { useUserInfo } from '/@/stores/userInfo';
    import { Session } from '/@/utils/storage';
    import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
    import { ElTable } from 'element-plus'
    import { FormInstance, FormRules } from 'element-plus'
    import * as echarts from 'echarts/core';
    import { TooltipComponent, TooltipComponentOption, GridComponent, GridComponentOption, LegendComponent, LegendComponentOption } from 'echarts/components';
    import { BarChart, BarSeriesOption } from 'echarts/charts';
    import { CanvasRenderer } from 'echarts/renderers';
    echarts.use([
        TooltipComponent,
        GridComponent,
        LegendComponent,
        BarChart,
        CanvasRenderer
    ]);
    let global: any = {
        homeChartOne: null,
        homeChartTwo: null,
        homeCharThree: null,
        dispose: [null, '', undefined],
    };
    import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue';
    import { ElTable, ElMessage, ElMessageBox } from 'element-plus'
    import type { FormInstance, FormRules, UploadProps, UploadUserFile } from 'element-plus'
    import { teamManageApi } from '/@/api/systemManage/basicDateManage/personShiftManage/teamManage';

    // 定义接口来定义对象的类型
    interface stateType {
        homeOne: Array <type>
    }
    interface type {
        tableData: Array<any>;
        departmentList: Array<any>;
        department:string;
        casProps: {};
        multipleSelection: Array<any>;
        deleteArr: Array<any>;
        dialogDetails: boolean;
        dialogAddRecord: boolean;
        deleteDialog: boolean;
        deleteSetDialog: boolean;
        pageIndex: number;
        pageSize: number;
        chosenIndex: null | number;
        deleteId: null | number;
        workPermitNo: string;
        workType: number | null;
        totalSize: number;
        addRecord: {

        };
        details: {

        };
        workTypeList: Array<any>
    }
    // export default defineComponent({
    //     name: 'workCheckinRecord',
    //     setup() {
            const userInfo = useUserInfo()

    export default {
        name: 'workReservation',
        components: {},
        setup() {
            const userInfo = useUserInfo();
            const { userInfos } = storeToRefs(userInfo);
            const typeValue = ref('')
            const dialogChartsVisible = ref(false);
            const dateRange = ref('')
            const departmentName = ref('')
            const departmentOptions = [
                {
                    value: 'guide',
                    label: 'Guide',
                    children: [
                        {
                            value: 'disciplines',
                            label: 'Disciplines',
                            children: [
                                {
                                    value: 'consistency',
                                    label: 'Consistency',
            const state = reactive<stateType>({
                pageIndex: 1,
                pageSize: 10,
                totalSize: 0,
                chosenIndex: null,
                workPermitNo: '',
                workType: null,
                tableData: [],
                departmentList: [],
                department: '',
                casProps: {
                    expandTrigger: 'hover',
                    emitPath: false,
                    value: 'depId',
                    label: 'depName',
                    checkStrictly: true
                                },
                                {
                                    value: 'feedback',
                                    label: 'Feedback',
                                }
                            ],
                        },
                        {
                            value: 'navigation',
                            label: 'Navigation',
                            children: [
                                {
                                    value: 'side nav',
                                    label: 'Side Navigation',
                                },
                                {
                                    value: 'top nav',
                                    label: 'Top Navigation',
                                },
                            ],
                        },
                    ],
                },
                {
                    value: 'component',
                    label: 'Component',
                },
                {
                    value: 'resource',
                    label: 'Resource',
                    children: [
                        {
                            value: 'axure',
                            label: 'Axure Components',
                        },
                        {
                            value: 'sketch',
                            label: 'Sketch Templates',
                        },
                        {
                            value: 'docs',
                            label: 'Design Documentation',
                        },
                    ],
                },
                multipleSelection: [],
                dialogDetails: false,
                dialogAddRecord: false,
                deleteDialog: false,
                deleteSetDialog: false,
                addRecord: {},
                details: {},
                deleteId: null,
                deleteArr: [],
                workTypeList: [
                    { id: 1, name: '动火作业' },
                    { id: 2, name: '受限空间作业' },
                    { id: 3, name: '吊装作业' },
                    { id: 4, name: '动土作业' },
                    { id: 5, name: '断路作业' },
                    { id: 6, name: '高处作业' },
                    { id: 7, name: '临时用电作业' },
                    { id: 8, name: '盲板抽堵作业' }
            ]
            const handleChange = (value) => {
                console.log(value)
            }
            const currentPage = ref(1)
            const pageSize = ref(10)
            const chosenIndex = ref(-1)
            const handleSizeChange = (val: number) => {
                console.log(`${val} items per page`)
            }
            const handleCurrentChange = (val: number) => {
                console.log(`current page: ${val}`)
            }
            const tableData = reactive(
                    [
                        {
                            time: '2022-06-29 12:32:52',
                            department: '电工部',
                            dirtyWork: '',
                            fireWork: '',
                            hangWork: '',
                            spaceWork: '',
                            cut: '',
                            high: '',
                            block: '',
                            tempUse: ''
                        },
                        {
                            time: '2022-06-29 12:32:52',
                            department: '电工部',
                            dirtyWork: '',
                            fireWork: '',
                            hangWork: '',
                            spaceWork: '',
                            cut: '',
                            high: '',
                            block: '',
                            tempUse: ''
                        },
                        {
                            time: '2022-06-29 12:32:52',
                            department: '土木',
                            dirtyWork: '',
                            fireWork: '',
                            hangWork: '',
                            spaceWork: '',
                            cut: '',
                            high: '',
                            block: '',
                            tempUse: ''
                        }
                ]
            )
            const addRef = ref<FormInstance>()
            const addRules = reactive<FormRules>({
                time:[{required: true, message: '该内容不能为空',trigger:'blur'}],
                department:[{required: true, message: '该内容不能为空',trigger:'blur'}]
            })
            const dialogDetails = ref(false)
            const dialogAddRecord = ref(false)
            const deleteDialog = ref(false)
            const addRecord = ref({})
            const details = ref({})
            const viewRecord = (row) =>{
                details.value = JSON.parse(JSON.stringify(row))
                dialogDetails.value = true
            }
            const deleteRecord = (index) =>{
                chosenIndex.value = index
                deleteDialog.value = true
            }
            const conFirmDelete = ()=> {
                tableData.splice(chosenIndex.value,1)
                deleteDialog.value = false
            }
            const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
                if (!formEl) return
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        if(chosenIndex.value == -1){
                            tableData.unshift(addRecord.value)
                        }else{
                            tableData[chosenIndex.value] = addRecord.value
                        }
                        dialogAddRecord.value =false
                    } else {
                        console.log('error submit!', fields)
                    }
                })
            });

            const addRef = ref<FormInstance>();
            const addRules = reactive<FormRules>({
                workPermitNo: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                combustible: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                oxygen: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                carbonMonoxide: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                hydrogenSulfide: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                info: [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
            });

            // 页面载入时执行方法
            onMounted(() => {
                // getListByPage()
                getAllDepartment()
            });

            // 获取部门列表
            const getAllDepartment = async () => {
                let res = await teamManageApi().getAllDepartment();
                if (res.data.code === '200') {
                    state.departmentList = JSON.parse(JSON.stringify(res.data.data))
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
            }
            const closeAdd =()=>{
                addRecord.value={}
                chosenIndex.value = -1
            }
            const indexClear = ()=>{
                chosenIndex.value = -1
            }
            const editRecord =(index, row)=>{
                dialogAddRecord.value = true
                chosenIndex.value = index
                addRecord.value = JSON.parse(JSON.stringify(row))
            }
            const myChart = ref<HTMLElement>()
            const myCharts = ref<any>()
            const openChart =()=>{
                type EChartsOption = echarts.ComposeOption<
                        | TooltipComponentOption
                        | GridComponentOption
                        | LegendComponentOption
                        | BarSeriesOption
                        >;
                myCharts.value = echarts.init(myChart.value!);
                const option: EChartsOption = {
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            // Use axis to trigger tooltip
                            type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
                        }
                    },
                    legend: {},
                    grid: {
                        left: '3%',
                        right: '3%',
                        bottom: '3%',
                        containLabel: true
                    },
                    xAxis: {
                        type: 'value'
                    },
                    yAxis: {
                        type: 'category',
                        data: ['部门A', '部门B', '部门C', '部门D', '部门E', '部门F', '部门G']
                    },
                    series: [
                        {
                            name: '动火作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        },
                        {
                            name: '受限空间作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [120, 132, 101, 134, 90, 230, 210]
                        },
                        {
                            name: '吊装作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [220, 182, 191, 234, 290, 330, 310]
                        },
                        {
                            name: '动土作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [150, 212, 201, 154, 190, 330, 410]
                        },
                        {
                            name: '断路作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [820, 832, 901, 934, 1290, 1330, 1320]
                        },
                        {
                            name: '高处作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [820, 832, 901, 934, 1290, 1330, 1320]
                        },
                        {
                            name: '临时用电作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [820, 832, 901, 934, 1290, 1330, 1320]
                        },
                        {
                            name: '盲板抽堵作业',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true
                            },
                            emphasis: {
                                focus: 'series'
                            },
                            data: [820, 832, 901, 934, 1290, 1330, 1320]
                        }
                    ]
                };

                option && myCharts.value.setOption(option);
            // 分页获取气体检测列表
            const getListByPage = async () => {
                getAll()
                const data = { pageSize: state.pageSize, pageIndex: state.pageIndex, searchParams: { workType: state.workType, workPermitNo: state.workPermitNo } };
                let res = await workProcessApi().getDetectionListPage(data);
                if (res.data.code === '200') {
                    state.tableData = JSON.parse(JSON.stringify(res.data.data))
                    state.totalSize = res.data.total;
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
            }
            };

            // 获取用户列表
            const getAll = async ()=>{
                const res = await workApplyApi().getAllUsers()
                if (res.data.code === '200') {
                    state.workerList = JSON.parse(JSON.stringify(res.data.data))
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            };

            // 关键词查询记录
            const searchRecord = async () => {
                if (state.workPermitNo == ''&& state.workType == null) {
                    ElMessage({
                        type: 'warning',
                        message: '请输入查询关键词'
                    });
                } else {
                    getListByPage();
                }
            };

            const clearSearch = async () => {
                state.workPermitNo = '';
                state.workType = null;
                getListByPage();
            };

            // 添加气体检测方法
            const addRecord = async (data: any) => {
                let res = await workProcessApi().postDetectionReport(data);
                if (res.data.code === '200') {
                    ElMessage({
                        type: 'success',
                        message: res.data.msg
                    });
                    getListByPage();
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            };

            // 点击修改
            const editRecordBtn = (index, row) => {
                state.dialogAddRecord = true;
                state.chosenIndex = index;
                state.addRecord = JSON.parse(JSON.stringify(row));
                console.log(state.addRecord, 'state.addRecord');
            };

            // 新增修改记录
            const confirmAddRecord = async (formEl: FormInstance | undefined) => {
                if (!formEl) return;
                await formEl.validate(async (valid, fields) => {
                    if (valid) {
                        const data = {
                            workPermitNo: state.addRecord.workPermitNo,
                            info: state.addRecord.info,
                            combustible: Number(state.addRecord.combustible),
                            oxygen: Number(state.addRecord.oxygen),
                            carbonMonoxide: Number(state.addRecord.carbonMonoxide),
                            hydrogenSulfide: Number(state.addRecord.hydrogenSulfide),
                            source: 2,
                        };
                        await addRecord(data);
                        state.dialogAddRecord = false;
                        getListByPage();
                    } else {
                        console.log('error submit!', fields);
                    }
                });
            };

            const handleSizeChange = (val: number) => {
                state.pageSize = val;
                getListByPage();
            };
            const handleCurrentChange = (val: number) => {
                state.pageIndex = val;
                getListByPage();
            };

            // 查看记录
            const viewRecord = (row) => {
                state.details = JSON.parse(JSON.stringify(row));
                state.dialogDetails = true;
            };

            // 刷新
            const reLoadData = async () => {
                getListByPage();
            };


            // 删除班组策略方法
            const deleteRecord = async (data: any) => {
                let res = await teamStrategyApi().deleteRecord(data);
                if (res.data.code === '200') {
                    ElMessage({
                        type: 'success',
                        message: res.data.msg
                    });
                    getListByPage();
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            };

            const deleteRecordBtn = (row) => {
                state.deleteId = row.groupStrategyId;
                state.deleteDialog = true;
            };

            const conFirmDelete = () => {
                deleteRecord({ groupStrategyId: state.deleteId });
                state.deleteDialog = false;
            };


            const closeAdd = () => {
                state.addRecord = {};
                state.chosenIndex = null;
            };

            const openAdd = () => {
                if (state.chosenIndex == null) {
                    state.addRecord.info = '';
                }
            };
            const indexClear = () => {
                state.deleteId = null;
            };

            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
                userInfos.value.projectId = value
                Session.set('projectId', value);
                userInfos.value.projectId = value;
                await initBackEndControlRoutes();
            };
            return {
                addRef,
                addRules,
                View,
                Edit,
                Delete,
                Refresh,
                Plus,
                Search,
                searchRecord,
                clearSearch,
                viewRecord,
                editRecordBtn,
                deleteRecordBtn,
                conFirmDelete,
                getListByPage,
                reLoadData,
                handleSizeChange,
                handleCurrentChange,
                confirmAddRecord,
                closeAdd,
                openAdd,
                indexClear,
                ...toRefs(state)
            };
        }
            };
</script>

<style scoped lang="scss">
    $homeNavLengh: 8;
    .red{
        color: red;
    }
    .home-container {
        height: 100%;
        height: calc(100vh - 144px);
        box-sizing: border-box;
        overflow: hidden;
        padding: 20px;
        .homeCard{
            width: 100%;
            padding: 20px;
            box-sizing: border-box;
            background: #fff;
            border-radius: 4px;

            .main-card {
                width: 100%;
                height: 100%;
                .cardTop {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    margin-bottom: 20px;
                    .mainCardBtn {
                        margin: 0;
                    }
                }
                .pageBtn {
                    height: 60px;
                    display: flex;
                    align-items: center;
                    justify-content: right;

                    .demo-pagination-block + .demo-pagination-block {
                        margin-top: 10px;
                    }
                    .demo-pagination-block .demonstration {
                        margin-bottom: 16px;
                    }
                }
            }
            &:last-of-type {
                height: calc(100% - 100px);
            }
        }
        .el-row{
            display: flex;
@@ -617,6 +571,7 @@
            }

            .topInfo {
                width: 100%;
                display: flex;
                align-items: center;
                font-size: 16px;
@@ -628,45 +583,17 @@
                }
            }
        }
        .mainPages{
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .main-card{
            width: 100%;
            .cardTop{
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 20px;
                .mainCardBtn{
                    margin: 0;
                }
            }
        }
        .pageBtn{
            display: flex;
            align-items: center;
            justify-content: right;
            margin-top: 20px;

            .demo-pagination-block + .demo-pagination-block {
                margin-top: 10px;
            }
            .demo-pagination-block .demonstration {
                margin-bottom: 16px;
            }
        }
    }
    .el-input{
        width: 100% !important;
    }
    .el-date-editor::v-deep{
    ::v-deep(.el-date-editor){
        width: 100%;
    }
    .el-select{
        width: 100%;
    }
    :deep(.el-cascader){
        width: 100% !important;
    }
</style>