添加页面

Admin

2022-07-12 d1d56c89cff34a9a2d52ca6b4694ec0672dadb09

添加页面

 src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue

对比新文件
@@ -0,0 +1,339 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row class="homeCard">
            <el-col :span="8">
                <div class="grid-content topInfo">
                    <el-input v-model="searchWord" placeholder="作业证编号"></el-input>
                    <el-button type="primary">查询</el-button>
                    <el-button plain>重置</el-button>
                    <el-button plain :icon="Download"></el-button>
                </div>
            </el-col>
        </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-table
                        ref="multipleTableRef"
                        :data="tableData"
                        style="width: 100%"
                        :header-cell-style="{background: '#fafafa'}"
                        @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="55" />
                    <el-table-column property="id" label="作业证编号" width="200" sortable/>
                    <el-table-column property="cardName" label="作业证名称" width="180" />
                    <el-table-column property="checkinTime" label="抽检日期" sortable/>
                    <el-table-column property="name" label="抽检人"/>
                    <el-table-column property="result" label="抽检结果"/>
                    <el-table-column property="remark" label="抽检意见"/>
                    <el-table-column fixed="right" label="操作" width="180">
                        <template #default="scope">
                            <el-button link type="primary" size="small" @click="viewRecord(scope.row)">查看</el-button>
                            <el-button link type="danger" size="small" @click="deleteRecord(scope.row)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="pageBtn">
                <el-pagination
                        v-model:currentPage="currentPage"
                        v-model:page-size="pageSize"
                        :page-sizes="[10, 15]"
                        small=false
                        background
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="100"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </div>
        </el-scrollbar>
        <el-dialog v-model="dialogDetails" title="作业票抽检" @close="dialogColse">
            <el-form :model="details" label-width="120px">
                <el-form-item label="作业证编号">
                    <el-input
                            v-model="details.id"
                            class="input-with-select"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="抽检人">
                    <el-input
                            v-model="details.name"
                            class="input-with-select"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="抽检结果">
                    <el-input
                            v-model="details.result"
                            class="input-with-select"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="抽检时间">
                    <el-input
                            v-model="details.checkinTime"
                            class="input-with-select"
                            readonly
                    />
                </el-form-item>
                <el-form-item label="抽检意见">
                    <el-input v-model="details.remark" type="textarea" readonly/>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        <el-dialog v-model="dialogAddRecord" title="新建作业票抽检" @close="dialogColse">
            <el-form :model="AddRecord" label-width="120px">
                <el-form-item label="作业证编号">
                    <el-input
                            v-model="AddRecord.id"
                            class="input-with-select"
                    >
                        <template #append>
                            <el-button :icon="Search"/>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item label="作业证名称">
                    <el-input
                            v-model="AddRecord.cardName"
                            class="input-with-select"
                    >
                        <template #append>
                            <el-button :icon="Search"/>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item label="抽检人">
                    <el-input
                            v-model="AddRecord.name"
                            class="input-with-select"
                    >
                        <template #append>
                            <el-button :icon="Search"/>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item label="抽检结果">
                    <el-select v-model="AddRecord.result">
                        <el-option label="合格" value="合格" />
                        <el-option label="不合格" value="不合格" />
                    </el-select>
                </el-form-item>
                <el-form-item label="抽检时间">
                    <el-date-picker
                            v-model="AddRecord.checkinTime"
                            type="datetime"
                            placeholder="请选择"
                    />
                </el-form-item>
                <el-form-item label="抽检意见">
                    <el-input v-model="AddRecord.remark" type="textarea"/>
                </el-form-item>
                <el-form-item>
                    <el-button type="warning" @click="dialogDetails = false" size="default" plain>取消</el-button>
                    <el-button type="primary" @click="addRecord" size="default">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        <el-dialog v-model="deleteDialog" title="提示" width="30%" center>
            <span>您确定要删除该条记录吗？</span>
            <template #footer>
          <span class="dialog-footer">
            <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
            <el-button @click="deleteDialog = false" size="default">取消</el-button>
          </span>
            </template>
        </el-dialog>
    </div>
</template>

<script lang="ts" setup>
    import { toRefs, reactive, ref } from 'vue';
    import { storeToRefs } from 'pinia';
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Edit, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
    import { ElTable } from 'element-plus'
    let global: any = {
        homeChartOne: null,
        homeChartTwo: null,
        homeCharThree: null,
        dispose: [null, '', undefined],
    };

    interface stateType {
        homeOne: Array <type>
    }
    interface type {

    }
    // export default defineComponent({
    //     name: 'workCheckinRecord',
    //     setup() {
            const userInfo = useUserInfo()
            const { userInfos } = storeToRefs(userInfo);
            const state  = reactive<stateType>({});
            const currentPage = ref(1)
            const pageSize = ref(10)
            const handleSizeChange = (val: number) => {
                console.log(`${val} items per page`)
            }
            const handleCurrentChange = (val: number) => {
                console.log(`current page: ${val}`)
            }
            const tableData = ref(
                    [
                    {
                        id: '11011',
                        cardName: '动火作业证',
                        checkinTime: '2021-04-22 15:21:31',
                        name: '吴海涛',
                        result: '合格',
                        remark: '没意见'
                    },
                    {
                        id: '11012',
                        cardName: '动火作业证',
                        checkinTime: '2021-04-22 15:21:31',
                        name: '吴沈峰',
                        result: '合格',
                        remark: '有点意见'
                    },
                ]
            )
            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 = (row) =>{
                deleteDialog.value = true
            }
            const conFirmDelete = (row)=> {
                console.log(row,'row')
                details.value = JSON.parse(JSON.stringify(row))
                console.log(details,'details')
                dialogDetails.value = true
            }
            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
                userInfos.value.projectId = value
                await initBackEndControlRoutes();
            };
            // return {
            //     renderMenu,
            //     multipleTableRef,
            //     tableData,
            //     currentPage,
            //     pageSize,
            //     dialogDetails,
            //     details,
            //     deleteDialog,
            //     dialogAddRecord,
            //     viewRecord,
            //     deleteRecord,
            //     handleSizeChange,
            //     handleCurrentChange,
            //     Plus,
            //     Edit,
            //     Delete,
            //     Search,
            //     Download,
            //     handleSelectionChange,
            //     Refresh,
            //     ...toRefs(state),
            // };
    //     },
    // });
</script>

<style scoped lang="scss">
    $homeNavLengh: 8;
    .home-container {
        height: 100%;
        overflow: hidden;
        padding: 20px;
        .homeCard{
            width: 100%;
            padding: 20px;
            background: #fff;
            border-radius: 4px;
        }
        .el-row{
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin-bottom: 0;
            }
            .grid-content{
                align-items: center;
                min-height: 36px;
            }

            .topInfo {
                display: flex;
                align-items: center;
                font-size: 16px;
                font-weight: bold;

                &>div{
                    white-space: nowrap;
                    margin-right: 20px;
                }
            }
        }
        .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;
            }
        }
    }
</style>

 src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue

对比新文件
@@ -0,0 +1,249 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row class="homeCard">
            <el-col :span="12">
                <div class="grid-content topInfo">
                    <el-select v-model="searchType" placeholder="请选择" style="width: 100%">
                        <el-option label="动火作业" value="动火作业" />
                        <el-option label="动土作业" value="动土作业" />
                    </el-select>
                    <el-input v-model="searchWord" placeholder="作业证编号"></el-input>
                    <el-button type="primary">查询</el-button>
                    <el-button plain>重置</el-button>
                    <el-button-group style="display: flex;margin-left: 12px">
                        <el-button plain :icon="Download"></el-button>
                        <el-button plain :icon="Refresh"></el-button>
                    </el-button-group>
                </div>
            </el-col>
        </el-row>
        <div class="homeCard">
            <div class="main-card">
                <el-table
                        ref="multipleTableRef"
                        :data="tableData"
                        style="width: 100%"
                        :header-cell-style="{background: '#fafafa'}"
                        @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="55" />
                    <el-table-column property="id" label="作业证编号" width="300" sortable />
                    <el-table-column property="cardName" label="作业证名称" width="300" />
                    <el-table-column property="name" label="申请人" width="300" />
                    <el-table-column property="department" label="申请部门" />
                    <el-table-column property="date" label="归档日期" sortable />
                </el-table>
            </div>
            <div class="pageBtn">
                <el-pagination
                        v-model:currentPage="currentPage"
                        v-model:page-size="pageSize"
                        :page-sizes="[10, 15]"
                        small=false
                        background
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="100"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </div>
        <el-dialog v-model="dialogDetails" title="签到记录" @close="dialogColse">
            <el-form :model="details" label-width="120px">
                <el-form-item label="作业证编号">
                    <el-input v-model="details.id" readonly/>
                </el-form-item>
                <el-form-item label="签到人">
                    <el-input
                        v-model="details.worker"
                        class="input-with-select"
                        readonly
                    >
                        <template #append>
                            <el-button :icon="Search" />
                        </template>
                    </el-input>
                </el-form-item>
<!--                <el-form-item label="签到状态">-->
<!--                    <el-select v-model="details.status" readonly>-->
<!--                        <el-option label="已签到" value="已签到" />-->
<!--                        <el-option label="未签到" value="未签到" />-->
<!--                    </el-select>-->
<!--                </el-form-item>-->
                <el-form-item label="签到时间">
                    <el-input v-model="details.checkinTime" readonly/>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="details.remark" type="textarea" readonly/>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        </el-scrollbar>
    </div>
</template>

<script lang="ts">
    import { toRefs, reactive, defineComponent, ref } from 'vue';
    import { storeToRefs } from 'pinia';
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Plus, Edit, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
    import { ElTable } from 'element-plus'
    let global: any = {
        homeChartOne: null,
        homeChartTwo: null,
        homeCharThree: null,
        dispose: [null, '', undefined],
    };

    interface stateType {
        homeOne: Array <type>
    }
    interface type {

    }
    interface User {
        date: string
        name: string
        address: string
    }
    export default defineComponent({
        name: 'gasCheckAnalyze',
        setup() {
            const userInfo = useUserInfo()
            const { userInfos } = storeToRefs(userInfo);
            const state  = reactive<stateType>({});
            const multipleTableRef = ref<InstanceType<typeof ElTable>>()
            const multipleSelection = ref<User[]>([])
            const handleSelectionChange = (val: User[]) => {
                multipleSelection.value = val
            }
            const currentPage = ref(1)
            const pageSize = ref(10)
            const handleSizeChange = (val: number) => {
                console.log(`${val} items per page`)
            }
            const handleCurrentChange = (val: number) => {
                console.log(`current page: ${val}`)
            }
            const tableData: User[] = [
                {
                    id: '11011',
                    cardName: '动火作业证',
                    name: '吴沈峰',
                    department: '土木部',
                    date: '2021-04-22 15:21:31'
                }
            ]
            const dialogDetails = ref(false)
            const details = ref({})
            const viewDetails = (row)=> {
                console.log(row,'row')
                details.value = JSON.parse(JSON.stringify(row))
                console.log(details,'details')
                dialogDetails.value = true
            }
            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
                userInfos.value.projectId = value
                await initBackEndControlRoutes();
            };
            return {
                renderMenu,
                multipleTableRef,
                tableData,
                currentPage,
                pageSize,
                dialogDetails,
                details,
                viewDetails,
                handleSizeChange,
                handleCurrentChange,
                Plus,
                Edit,
                Delete,
                Search,
                Download,
                handleSelectionChange,
                Refresh,
                ...toRefs(state),
            };
        },
    });
</script>

<style scoped lang="scss">
    $homeNavLengh: 8;
    .home-container {
        height: 100%;
        overflow: hidden;
        padding: 20px;
        .homeCard{
            width: 100%;
            padding: 20px;
            background: #fff;
            border-radius: 4px;
        }
        .el-row{
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin-bottom: 0;
            }
            .grid-content{
                align-items: center;
                min-height: 36px;
            }

            .topInfo {
                display: flex;
                align-items: center;
                font-size: 16px;
                font-weight: bold;

                &>div{
                    white-space: nowrap;
                    margin-right: 20px;
                }
            }
        }
        .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;
            }
        }
    }
</style>

 src/views/specialWorkSystem/approveProcessManagement/addApproveProcess/index.vue

 src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue

文件名从 src/views/specialWorkSystem/approvalProcess/approveProcessManagement/index.vue 修改
@@ -1,9 +1,8 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row>
            <div class="homeCard">
            <el-col :span="12">
        <el-row class="homeCard">
            <el-col :span="8">
                <div class="grid-content topInfo">
                    <div>流程名称</div>
                    <el-input v-model="searchWord" placeholder="请输入关键词"></el-input>
@@ -11,7 +10,6 @@
                    <el-button plain>重置</el-button>
                </div>
            </el-col>
            </div>
        </el-row>
        <div class="homeCard">
            <div class="main-card">
@@ -21,7 +19,7 @@
                        <el-button type="danger" :icon="Delete" size="default">删除</el-button>
                        <el-button type="success" size="default">设置分类</el-button>
                    </el-col>
                    <el-button type="primary" :icon="Refresh" />
                    <el-button type="primary" :icon="Refresh" size="default"/>
                </el-row>
                <el-table
                        ref="multipleTableRef"

 src/views/specialWorkSystem/approveProcessManagement/approveProcessSetting/index.vue

 src/views/specialWorkSystem/approveProcessManagement/reportTypeSetting/index.vue

 src/views/specialWorkSystem/workApplyManagement/myApply/index.vue

@@ -3,16 +3,14 @@
        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
            <el-tab-pane label="申请中" name="Applying">
                <el-scrollbar height="100%">
                    <el-row>
                        <div class="homeCard">
                            <el-col :span="12">
                    <el-row class="homeCard">
                            <el-col :span="8">
                                <div class="grid-content topInfo">
                                    <el-input v-model="searchWord" placeholder="作业证名称"></el-input>
                                    <el-button type="primary">查询</el-button>
                                    <el-button plain>重置</el-button>
                                </div>
                            </el-col>
                        </div>
                    </el-row>
                    <div class="homeCard">
                        <div class="main-card">
@@ -22,7 +20,7 @@
<!--                                    <el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
<!--                                    <el-button type="success" size="default">设置分类</el-button>-->
                                </el-col>
                                <el-button type="primary" :icon="Refresh" />
                                <el-button type="primary" :icon="Refresh" size="default"/>
                            </el-row>
                            <el-table
                                    ref="multipleTableRef"

 src/views/specialWorkSystem/workApplyManagement/workApplyForm/index.vue

@@ -2,10 +2,10 @@
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-form :model="form" label-width="150px" :rules="applyRules" ref="ruleFormRef2">
<!--            <blind-panel-form :bpForm="form.addForm" ref="additionalForm"></blind-panel-form>-->
            <blind-panel-form :bpForm="form.addForm" ref="additionalForm"></blind-panel-form>
<!--            <cut-line-form :clForm="form.addForm" ref="additionalForm"></cut-line-form>-->
<!--            <dirt-work-form :dwForm="form.addForm" ref="additionalForm"></dirt-work-form>-->
            <fire-work-form :fwForm="form.addForm" ref="additionalForm"></fire-work-form>
<!--            <fire-work-form :fwForm="form.addForm" ref="additionalForm"></fire-work-form>-->
<!--            <hang-load-form :hlForm="form.addForm" ref="additionalForm"></hang-load-form>-->
<!--            <high-work-form :hwForm="form.addForm" ref="additionalForm"></high-work-form>-->
<!--            <limited-space-form :lsForm="form.addForm" ref="additionalForm"></limited-space-form>-->

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

@@ -1,8 +1,8 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row>
            <div class="homeCard">
        <el-row class="homeCard">
<!--            <div class="homeCard">-->
            <el-col :span="6">
                <div class="grid-content topInfo">
                    <div>预约时间：</div>
@@ -37,7 +37,7 @@
                    <div><el-button type="primary" @click="dialogChartsVisible = true">查看统计图表</el-button></div>
                </div>
            </el-col>
            </div>
<!--            </div>-->
        </el-row>
        <el-row>
            <div class="homeCard">

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

@@ -1,8 +1,8 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row>
            <div class="homeCard">
        <el-row class="homeCard">
<!--            <div class="homeCard">-->
            <el-col :span="6">
                <div class="grid-content topInfo">
                    <div>当前所属部门：</div>
@@ -43,7 +43,7 @@
                    <div><el-button type="success" @click="dialogFormVisible = true">新增预约</el-button></div>
                </div>
            </el-col>
        </div>
<!--        </div>-->
        </el-row>
        <el-row>
            <div class="homeCard">

 src/views/specialWorkSystem/workProcessManagement/gasCheckAnalyze/index.vue

对比新文件
@@ -0,0 +1,261 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row class="homeCard">
            <el-col :span="8">
                <div class="grid-content topInfo">
                    <el-input v-model="searchWord" placeholder="作业证编号"></el-input>
                    <el-button type="primary">查询</el-button>
                    <el-button plain>重置</el-button>
                </div>
            </el-col>
        </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">新建</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-table
                        ref="multipleTableRef"
                        :data="tableData"
                        style="width: 100%"
                        :header-cell-style="{background: '#fafafa'}"
                        @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="55" />
                    <el-table-column property="id" label="作业证编号" width="200" sortable/>
                    <el-table-column property="date" label="日期" width="180" sortable/>
                    <el-table-column property="combustible" label="可燃气%" sortable/>
                    <el-table-column property="oxygen" label="氧气%" sortable/>
                    <el-table-column property="co" label="一氧化碳ppm" sortable/>
                    <el-table-column property="hs" label="硫化氢ppm" sortable/>
                    <el-table-column property="updateTime" label="更新时间" sortable/>
                </el-table>
            </div>
            <div class="pageBtn">
                <el-pagination
                        v-model:currentPage="currentPage"
                        v-model:page-size="pageSize"
                        :page-sizes="[10, 15]"
                        small=false
                        background
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="100"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </div>
        <el-dialog v-model="dialogDetails" title="签到记录" @close="dialogColse">
            <el-form :model="details" label-width="120px">
                <el-form-item label="作业证编号">
                    <el-input v-model="details.id" readonly/>
                </el-form-item>
                <el-form-item label="签到人">
                    <el-input
                        v-model="details.worker"
                        class="input-with-select"
                        readonly
                    >
                        <template #append>
                            <el-button :icon="Search" />
                        </template>
                    </el-input>
                </el-form-item>
<!--                <el-form-item label="签到状态">-->
<!--                    <el-select v-model="details.status" readonly>-->
<!--                        <el-option label="已签到" value="已签到" />-->
<!--                        <el-option label="未签到" value="未签到" />-->
<!--                    </el-select>-->
<!--                </el-form-item>-->
                <el-form-item label="签到时间">
                    <el-input v-model="details.checkinTime" readonly/>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="details.remark" type="textarea" readonly/>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        </el-scrollbar>
    </div>
</template>

<script lang="ts">
    import { toRefs, reactive, defineComponent, ref } from 'vue';
    import { storeToRefs } from 'pinia';
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Plus, Edit, Delete, Refresh, Search } from '@element-plus/icons-vue'
    import { ElTable } from 'element-plus'
    let global: any = {
        homeChartOne: null,
        homeChartTwo: null,
        homeCharThree: null,
        dispose: [null, '', undefined],
    };

    interface stateType {
        homeOne: Array <type>
    }
    interface type {

    }
    interface User {
        date: string
        name: string
        address: string
    }
    export default defineComponent({
        name: 'gasCheckAnalyze',
        setup() {
            const userInfo = useUserInfo()
            const { userInfos } = storeToRefs(userInfo);
            const state  = reactive<stateType>({});
            const multipleTableRef = ref<InstanceType<typeof ElTable>>()
            const multipleSelection = ref<User[]>([])
            const handleSelectionChange = (val: User[]) => {
                multipleSelection.value = val
            }
            const currentPage = ref(1)
            const pageSize = ref(10)
            const handleSizeChange = (val: number) => {
                console.log(`${val} items per page`)
            }
            const handleCurrentChange = (val: number) => {
                console.log(`current page: ${val}`)
            }
            const tableData: User[] = [
                {
                    id: '11011',
                    date: '2021-04-22 15:21:31',
                    combustible: 0,
                    oxygen: 21,
                    co: 0,
                    hs: 0,
                    updateTime: '2021-04-22 15:21:31',
                },
                {
                    id: '11011',
                    date: '2021-04-22 15:21:31',
                    combustible: 1,
                    oxygen: 21,
                    co: 0,
                    hs: 0,
                    updateTime: '2021-04-22 15:21:31',
                }
            ]
            const dialogDetails = ref(false)
            const details = ref({})
            const viewDetails = (row)=> {
                console.log(row,'row')
                details.value = JSON.parse(JSON.stringify(row))
                console.log(details,'details')
                dialogDetails.value = true
            }
            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
                userInfos.value.projectId = value
                await initBackEndControlRoutes();
            };
            return {
                renderMenu,
                multipleTableRef,
                tableData,
                currentPage,
                pageSize,
                dialogDetails,
                details,
                viewDetails,
                handleSizeChange,
                handleCurrentChange,
                Plus,
                Edit,
                Delete,
                Search,
                handleSelectionChange,
                Refresh,
                ...toRefs(state),
            };
        },
    });
</script>

<style scoped lang="scss">
    $homeNavLengh: 8;
    .home-container {
        height: 100%;
        overflow: hidden;
        padding: 20px;
        .homeCard{
            width: 100%;
            padding: 20px;
            background: #fff;
            border-radius: 4px;
        }
        .el-row{
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin-bottom: 0;
            }
            .grid-content{
                align-items: center;
                min-height: 36px;
            }

            .topInfo {
                display: flex;
                align-items: center;
                font-size: 16px;
                font-weight: bold;

                &>div{
                    white-space: nowrap;
                    margin-right: 20px;
                }
            }
        }
        .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;
            }
        }
    }
</style>

 src/views/specialWorkSystem/workProcessManagement/workCheckinRecord/index.vue

对比新文件
@@ -0,0 +1,255 @@
<template>
    <div class="home-container">
        <el-scrollbar height="100%">
        <el-row class="homeCard">
            <el-col :span="8">
                <div class="grid-content topInfo">
                    <el-input v-model="searchWord" placeholder="作业证编号"></el-input>
                    <el-button type="primary">查询</el-button>
                    <el-button plain>重置</el-button>
                </div>
            </el-col>
        </el-row>
        <div class="homeCard">
            <div class="main-card">
                <el-row class="cardTop">
                    <el-col :span="12" class="mainCardBtn">
                        <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-table
                        ref="multipleTableRef"
                        :data="tableData"
                        style="width: 100%"
                        :header-cell-style="{background: '#fafafa'}"
                        @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="55" />
                    <el-table-column property="id" label="作业证编号" width="200" sortable/>
                    <el-table-column property="worker" label="签到人" width="180" />
                    <el-table-column property="checkinTime" label="签到时间" sortable/>
                    <el-table-column property="remark" label="备注"/>
                    <el-table-column fixed="right" label="操作" width="180">
                        <template #default="scope">
                            <el-button link type="primary" size="small" @click="viewDetails(scope.row)">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="pageBtn">
                <el-pagination
                        v-model:currentPage="currentPage"
                        v-model:page-size="pageSize"
                        :page-sizes="[10, 15]"
                        small=false
                        background
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="100"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </div>
        <el-dialog v-model="dialogDetails" title="签到记录" @close="dialogColse">
            <el-form :model="details" label-width="120px">
                <el-form-item label="作业证编号">
                    <el-input v-model="details.id" readonly/>
                </el-form-item>
                <el-form-item label="签到人">
                    <el-input
                        v-model="details.worker"
                        class="input-with-select"
                        readonly
                    >
                        <template #append>
                            <el-button :icon="Search" />
                        </template>
                    </el-input>
                </el-form-item>
<!--                <el-form-item label="签到状态">-->
<!--                    <el-select v-model="details.status" readonly>-->
<!--                        <el-option label="已签到" value="已签到" />-->
<!--                        <el-option label="未签到" value="未签到" />-->
<!--                    </el-select>-->
<!--                </el-form-item>-->
                <el-form-item label="签到时间">
                    <el-input v-model="details.checkinTime" readonly/>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="details.remark" type="textarea" readonly/>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        </el-scrollbar>
    </div>
</template>

<script lang="ts">
    import { toRefs, reactive, defineComponent, ref } from 'vue';
    import { storeToRefs } from 'pinia';
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Edit, Delete, Refresh, Search } from '@element-plus/icons-vue'
    import { ElTable } from 'element-plus'
    let global: any = {
        homeChartOne: null,
        homeChartTwo: null,
        homeCharThree: null,
        dispose: [null, '', undefined],
    };

    interface stateType {
        homeOne: Array <type>
    }
    interface type {

    }
    interface User {
        date: string
        name: string
        address: string
    }
    export default defineComponent({
        name: 'workCheckinRecord',
        setup() {
            const userInfo = useUserInfo()
            const { userInfos } = storeToRefs(userInfo);
            const state  = reactive<stateType>({});
            const multipleTableRef = ref<InstanceType<typeof ElTable>>()
            const multipleSelection = ref<User[]>([])
            const handleSelectionChange = (val: User[]) => {
                multipleSelection.value = val
            }
            const currentPage = ref(1)
            const pageSize = ref(10)
            const handleSizeChange = (val: number) => {
                console.log(`${val} items per page`)
            }
            const handleCurrentChange = (val: number) => {
                console.log(`current page: ${val}`)
            }
            const tableData: User[] = [
                {
                    id: '11011',
                    worker: '吴海涛',
                    checkinTime: '2021-04-22 15:21:31',
                    remark: ''
                },
                {
                    id: '11012',
                    worker: '吴沈峰',
                    checkinTime: '2021-04-22 15:21:31',
                    remark: ''
                }
            ]
            const dialogDetails = ref(false)
            const details = ref({})
            const viewDetails = (row)=> {
                console.log(row,'row')
                details.value = JSON.parse(JSON.stringify(row))
                console.log(details,'details')
                dialogDetails.value = true
            }
            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
                userInfos.value.projectId = value
                await initBackEndControlRoutes();
            };
            return {
                renderMenu,
                multipleTableRef,
                tableData,
                currentPage,
                pageSize,
                dialogDetails,
                details,
                viewDetails,
                handleSizeChange,
                handleCurrentChange,
                Edit,
                Delete,
                Search,
                handleSelectionChange,
                Refresh,
                ...toRefs(state),
            };
        },
    });
</script>

<style scoped lang="scss">
    $homeNavLengh: 8;
    .home-container {
        height: 100%;
        overflow: hidden;
        padding: 20px;
        .homeCard{
            width: 100%;
            padding: 20px;
            background: #fff;
            border-radius: 4px;
        }
        .el-row{
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            &:last-child {
                margin-bottom: 0;
            }
            .grid-content{
                align-items: center;
                min-height: 36px;
            }

            .topInfo {
                display: flex;
                align-items: center;
                font-size: 16px;
                font-weight: bold;

                &>div{
                    white-space: nowrap;
                    margin-right: 20px;
                }
            }
        }
        .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;
            }
        }
    }
</style>