From 4ef69f1d7bdd01471d207c865a394c618c214452 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期一, 13 三月 2023 09:46:16 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt --- src/views/specialWorkSystem/specialIndex/index.vue | 2494 +++++++++++++++++++++++++++++----------------------------- 1 files changed, 1,247 insertions(+), 1,247 deletions(-) diff --git a/src/views/specialWorkSystem/specialIndex/index.vue b/src/views/specialWorkSystem/specialIndex/index.vue index f18f329..fea8c63 100644 --- a/src/views/specialWorkSystem/specialIndex/index.vue +++ b/src/views/specialWorkSystem/specialIndex/index.vue @@ -1,261 +1,261 @@ <template> - <div class="home-container" :class="isFull==true?'container':''" id="bigScreen"> - <div class="full"> - <el-button v-if="isFull==false" type="text" style="height: 34px" @click="toFullscreen"> - <el-icon style="vertical-align: middle"> - <FullScreen /> - </el-icon> - <span style="vertical-align: middle">全屏</span> - </el-button> - <el-button v-else type="text" style="height: 34px" @click="toFullscreen"> - <el-icon style="vertical-align: middle"> - <Close /> - </el-icon> - <span style="vertical-align: middle">退出全屏</span> - </el-button> + <div class="home-container" :class="isFull==true?'container':''" id="bigScreen"> + <div class="full"> + <el-button v-if="isFull==false" type="text" style="height: 34px" @click="toFullscreen"> + <el-icon style="vertical-align: middle"> + <FullScreen /> + </el-icon> + <span style="vertical-align: middle">全屏</span> + </el-button> + <el-button v-else type="text" style="height: 34px" @click="toFullscreen"> + <el-icon style="vertical-align: middle"> + <Close /> + </el-icon> + <span style="vertical-align: middle">退出全屏</span> + </el-button> + </div> + <div class="topChart"> + <div class="chart-item"> + <div class="chart-tit"> + <span class="tit">八大作业各分类分布图</span> + <div class="filter-part filter-part2"> + <el-cascader :teleported="false" v-model="chartSearch1.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> + </div> + </div> + <div class="chart" :id="zyfb"></div> + <el-radio-group v-model="chartSearch1.period" size="small"> + <el-radio label="week" border>近7天</el-radio> + <el-radio label="month" border>近30天</el-radio> + <el-radio label="season" border>近90天</el-radio> + <el-radio label="year" border>近一年</el-radio> + </el-radio-group> </div> - <div class="topChart"> - <div class="chart-item"> - <div class="chart-tit"> - <span class="tit">八大作业各分类分布图</span> - <div class="filter-part filter-part2"> - <el-cascader :teleported="false" v-model="chartSearch1.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> - </div> - </div> - <div class="chart" :id="zyfb"></div> - <el-radio-group v-model="chartSearch1.period" size="small"> - <el-radio label="week" border>近7天</el-radio> - <el-radio label="month" border>近30天</el-radio> - <el-radio label="season" border>近90天</el-radio> - <el-radio label="year" border>近一年</el-radio> - </el-radio-group> - </div> - <div class="chart-item"> - <div class="chart-tit"> - <span class="tit">各事业部关联作业分析</span> - <div class="filter-part"> - <el-cascader :teleported="false" v-model="chartSearch2.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> - <el-select v-model="chartSearch2.type" size="small" :teleported="false"> - <el-option - v-for="item in workType1" - :key="item.id" - :label="item.name" - :value="item.id" - /> - </el-select> - </div> - </div> - <div class="chart" :id="slfx"></div> + <div class="chart-item"> + <div class="chart-tit"> + <span class="tit">各事业部关联作业分析</span> + <div class="filter-part"> + <el-cascader :teleported="false" v-model="chartSearch2.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> + <el-select v-model="chartSearch2.type" size="small" :teleported="false"> + <el-option + v-for="item in workType1" + :key="item.id" + :label="item.name" + :value="item.id" + /> + </el-select> </div> </div> - <div class="topChart"> - <div class="chart-item"> - <div class="chart-tit"> - <span class="tit">关联作业趋势图</span> - <div class="filter-part filter-part2"> - <el-cascader :teleported="false" v-model="chartSearch3.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> - </div> - </div> - <div class="chart" :id="zyqs"></div> + <div class="chart" :id="slfx"></div> + </div> + </div> + <div class="topChart"> + <div class="chart-item"> + <div class="chart-tit"> + <span class="tit">关联作业趋势图</span> + <div class="filter-part filter-part2"> + <el-cascader :teleported="false" v-model="chartSearch3.searchDep" :options="departmentList" :props="casProps" :show-all-levels="false" size="small"/> </div> - <div class="chart-item"> - <div class="chart-tit"> - <span class="tit">异常警报关联人</span> - <div class="filter-part"> - <el-switch - v-model="chartSearch4.type" - inline-prompt - style="--el-switch-on-color: #13ce66; --el-switch-off-color: #13ce66" - active-text="作业人" - inactive-text="监护人" + </div> + <div class="chart" :id="zyqs"></div> + </div> + <div class="chart-item"> + <div class="chart-tit"> + <span class="tit">异常警报关联人</span> + <div class="filter-part"> + <el-switch + v-model="chartSearch4.type" + inline-prompt + style="--el-switch-on-color: #13ce66; --el-switch-off-color: #13ce66" + active-text="作业人" + inactive-text="监护人" + /> + <el-select :teleported="false" v-model="chartSearch4.period" size="small"> + <el-option label="近7天" value="week"/> + <el-option label="近30天" value="month"/> + <el-option label="近90天" value="season"/> + <el-option label="近1年" value="year"/> + </el-select> + <el-select :teleported="false" v-model="chartSearch4.workType" size="small"> + <el-option + v-for="item in workType1" + :key="item.id" + :label="item.name" + :value="item.id" + /> + </el-select> + </div> + </div> + <div class="chart"> + <el-table ref="multipleTableRef" :data="warningData" style="width: 100%" stripe border :header-cell-style="{ background: '#fafafa' }"> + <el-table-column property="name" label="姓名" align="center"/> + <el-table-column property="dep" label="所属部门" align="center"/> + <el-table-column property="warning" label="异常报警次数" align="center"/> + <el-table-column property="role" label="角色" align="center"/> + <el-table-column property="isCard" label="是否持证" align="center"> + <template #default="scope"> + <span>{{scope.row.isCard == 1?'是':'否'}}</span> + </template> + </el-table-column> + </el-table> + <el-button type="text" size="small" style="margin-top: 10px">所有记录>></el-button> + </div> + <!-- <div class="chart" :id="slfx"></div>--> + </div> + </div> + <div> + <div class="homeCard"> + <el-row> + <el-col :span="5" style="display:flex;align-items: center"> + <span style="white-space: nowrap">作业类型:</span> + <div class="grid-content topInfo"> + <el-select :teleported="false" v-model="searchWord" size="small"> + <el-option + v-for="item in workType" + :key="item.id" + :label="item.name" + :value="item.id" /> - <el-select :teleported="false" v-model="chartSearch4.period" size="small"> - <el-option label="近7天" value="week"/> - <el-option label="近30天" value="month"/> - <el-option label="近90天" value="season"/> - <el-option label="近1年" value="year"/> - </el-select> - <el-select :teleported="false" v-model="chartSearch4.workType" size="small"> - <el-option - v-for="item in workType1" - :key="item.id" - :label="item.name" - :value="item.id" - /> - </el-select> + </el-select> + </div> + </el-col> + <el-col :span="5" style="display:flex;align-items: center"> + <span style="white-space: nowrap">作业状态:</span> + <div class="grid-content topInfo"> + <el-select :teleported="false" v-model="searchStatus" size="small"> + <el-option + v-for="item in workStatus" + :key="item.value" + :label="item.name" + :value="item.value" + /> + </el-select> + </div> + </el-col> + <el-col :span="5" style="display:flex;align-items: center"> + <span style="white-space: nowrap">作业部门:</span> + <div class="grid-content topInfo"> + <el-cascader :teleported="false" size="small" v-model="searchDep" :options="departmentList" :props="casProps" :show-all-levels="false"/> + </div> + </el-col> + <el-col :span="6" style="display:flex;align-items: center;"> + <span style="white-space: nowrap;margin-left: 20px">申请时间:</span> + <div class="grid-content topInfo"> + <el-date-picker + v-model="searchDate" + size="small" + :teleported="false" + type="daterange" + unlink-panels + range-separator="至" + start-placeholder="开始日期" + end-placeholder="结束日期" + format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" + /> + </div> + </el-col> + <el-button type="primary" style="margin-left: 20px" @click="searchRecord" size="small">查询</el-button> + <el-button plain @click="clearSearch" size="small">重置</el-button> + </el-row> + <div class="main-card"> + <el-row class="cardTop" style="justify-content: space-between"> + <el-col :span="2" class="mainCardBtn"> + <el-button type="primary" :icon="Plus" size="default" @click="toApply()">新作业申请</el-button> + </el-col> + <el-col :span="22" style="display: flex;justify-content: end;align-items: center"> + <div class="top-info"> + <el-icon :size="18" color="#F3001E" style="margin-right: 4px"><BellFilled /></el-icon> + 作业编号 + <div v-if="unchecked != 0"> + <el-tooltip + class="box-item" + effect="light" + content="查看预警详情" + placement="bottom-start" + ><span>123456</span></el-tooltip> + </div> + 可燃气体浓度超过18% + ,请及时处理! </div> - </div> - <div class="chart"> - <el-table ref="multipleTableRef" :data="warningData" style="width: 100%" stripe border :header-cell-style="{ background: '#fafafa' }"> - <el-table-column property="name" label="姓名" align="center"/> - <el-table-column property="dep" label="所属部门" align="center"/> - <el-table-column property="warning" label="异常报警次数" align="center"/> - <el-table-column property="role" label="角色" align="center"/> - <el-table-column property="isCard" label="是否持证" align="center"> - <template #default="scope"> - <span>{{scope.row.isCard == 1?'是':'否'}}</span> - </template> - </el-table-column> - </el-table> - <el-button type="text" size="small" style="margin-top: 10px">所有记录>></el-button> - </div> -<!-- <div class="chart" :id="slfx"></div>--> + <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()" /> + </el-col> + </el-row> + <el-table ref="multipleTableRef" stripe border :data="workData" style="width: 100%" :header-cell-style="{ background: '#fafafa' }"> + <el-table-column property="num" label="作业证编号" align="center"/> + <el-table-column property="dep" label="部门" align="center"/> + <el-table-column property="applyer" label="申请人" align="center"/> + <el-table-column property="worker" label="作业人" align="center"/> + <el-table-column property="type" label="作业类型" align="center"/> + <el-table-column property="level" label="作业等级" align="center"/> + <el-table-column property="applyTime" label="申请时间" align="center"/> + <el-table-column property="startTime" label="作业开始时间" align="center"/> + <el-table-column property="endTime" label="作业结束时间" align="center"/> + <el-table-column label="作业状态" align="center"> + <template #default="scope"> + <el-tag>{{ scope.row.status==0?'进行中':scope.row.status==1?'作业中止':scope.row.status==2?'作业结束验收': '作业完成'}}</el-tag> + </template> + </el-table-column> + <el-table-column property="reason" label="中止原因" align="center"/> + <el-table-column label="安全预警" align="center"> + <template #default="scope"> + <el-tag :type="scope.row.warning==0?'success':(scope.row.warning==1||scope.row.warning==2)?'warning':'danger'">{{ scope.row.warning==0?'正常':'报警' }}</el-tag> + </template> + </el-table-column> + <el-table-column property="message" label="报警信息" align="center"> + <template #default="scope"> + <el-button type="text" size="small" v-if="scope.row.message == 1">查看</el-button> + <span v-else>无</span> + </template> + </el-table-column> + <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="FolderChecked" @click="handleReview(scope.row)">验收</el-button> + <el-button link type="primary" size="small" :icon="VideoPlay" @click="openVideo(scope.row)">查看实时监控</el-button> + </template> + </el-table-column> + </el-table> + <div class="pageBtn"> + <el-pagination v-model:currentPage="pageIndex1" v-model:page-size="pageSize1" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize1" @size-change="handleSizeChange1" @current-change="handleCurrentChange1" /> </div> </div> - <div> - <div class="homeCard"> - <el-row> - <el-col :span="5" style="display:flex;align-items: center"> - <span style="white-space: nowrap">作业类型:</span> - <div class="grid-content topInfo"> - <el-select :teleported="false" v-model="searchWord" size="small"> - <el-option - v-for="item in workType" - :key="item.id" - :label="item.name" - :value="item.id" - /> - </el-select> - </div> - </el-col> - <el-col :span="5" style="display:flex;align-items: center"> - <span style="white-space: nowrap">作业状态:</span> - <div class="grid-content topInfo"> - <el-select :teleported="false" v-model="searchStatus" size="small"> - <el-option - v-for="item in workStatus" - :key="item.value" - :label="item.name" - :value="item.value" - /> - </el-select> - </div> - </el-col> - <el-col :span="5" style="display:flex;align-items: center"> - <span style="white-space: nowrap">作业部门:</span> - <div class="grid-content topInfo"> - <el-cascader :teleported="false" size="small" v-model="searchDep" :options="departmentList" :props="casProps" :show-all-levels="false"/> - </div> - </el-col> - <el-col :span="6" style="display:flex;align-items: center;"> - <span style="white-space: nowrap;margin-left: 20px">申请时间:</span> - <div class="grid-content topInfo"> - <el-date-picker - v-model="searchDate" - size="small" - :teleported="false" - type="daterange" - unlink-panels - range-separator="至" - start-placeholder="开始日期" - end-placeholder="结束日期" - format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" - /> - </div> - </el-col> - <el-button type="primary" style="margin-left: 20px" @click="searchRecord" size="small">查询</el-button> - <el-button plain @click="clearSearch" size="small">重置</el-button> - </el-row> - <div class="main-card"> - <el-row class="cardTop" style="justify-content: space-between"> - <el-col :span="2" class="mainCardBtn"> - <el-button type="primary" :icon="Plus" size="default" @click="toApply()">新作业申请</el-button> - </el-col> - <el-col :span="22" style="display: flex;justify-content: end;align-items: center"> - <div class="top-info"> - <el-icon :size="18" color="#F3001E" style="margin-right: 4px"><BellFilled /></el-icon> - 作业编号 - <div v-if="unchecked != 0"> - <el-tooltip - class="box-item" - effect="light" - content="查看预警详情" - placement="bottom-start" - ><span>123456</span></el-tooltip> - </div> - 可燃气体浓度超过18% - ,请及时处理! - </div> - <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()" /> - </el-col> - </el-row> - <el-table ref="multipleTableRef" stripe border :data="workData" style="width: 100%" :header-cell-style="{ background: '#fafafa' }"> - <el-table-column property="num" label="作业证编号" align="center"/> - <el-table-column property="dep" label="部门" align="center"/> - <el-table-column property="applyer" label="申请人" align="center"/> - <el-table-column property="worker" label="作业人" align="center"/> - <el-table-column property="type" label="作业类型" align="center"/> - <el-table-column property="level" label="作业等级" align="center"/> - <el-table-column property="applyTime" label="申请时间" align="center"/> - <el-table-column property="startTime" label="作业开始时间" align="center"/> - <el-table-column property="endTime" label="作业结束时间" align="center"/> - <el-table-column label="作业状态" align="center"> - <template #default="scope"> - <el-tag>{{ scope.row.status==0?'进行中':scope.row.status==1?'作业中止':scope.row.status==2?'作业结束验收': '作业完成'}}</el-tag> - </template> - </el-table-column> - <el-table-column property="reason" label="中止原因" align="center"/> - <el-table-column label="安全预警" align="center"> - <template #default="scope"> - <el-tag :type="scope.row.warning==0?'success':(scope.row.warning==1||scope.row.warning==2)?'warning':'danger'">{{ scope.row.warning==0?'正常':'报警' }}</el-tag> - </template> - </el-table-column> - <el-table-column property="message" label="报警信息" align="center"> - <template #default="scope"> - <el-button type="text" size="small" v-if="scope.row.message == 1">查看</el-button> - <span v-else>无</span> - </template> - </el-table-column> - <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="FolderChecked" @click="handleReview(scope.row)">验收</el-button> - <el-button link type="primary" size="small" :icon="VideoPlay" @click="openVideo(scope.row)">查看实时监控</el-button> - </template> - </el-table-column> - </el-table> - <div class="pageBtn"> - <el-pagination v-model:currentPage="pageIndex1" v-model:page-size="pageSize1" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize1" @size-change="handleSizeChange1" @current-change="handleCurrentChange1" /> - </div> - </div> - </div> - </div> - <el-dialog v-model="dialogDetails" title="作业申请详情" center> - <fire v-if="dialogType == 1" :details = details></fire> - <space v-else-if="dialogType == 2" :details = details></space> - <hoist v-else-if="dialogType == 3" :details = details></hoist> - <ground v-else-if="dialogType == 4" :details = details></ground> - <broken v-else-if="dialogType == 5" :details = details></broken> - <height v-else-if="dialogType == 6" :details = details></height> - <power v-else-if="dialogType == 7" :details = details></power> - <plate v-else :details = details></plate> - <template #footer> + </div> + </div> + <el-dialog v-model="dialogDetails" title="作业申请详情" center> + <fire v-if="dialogType == 1" :details = details></fire> + <space v-else-if="dialogType == 2" :details = details></space> + <hoist v-else-if="dialogType == 3" :details = details></hoist> + <ground v-else-if="dialogType == 4" :details = details></ground> + <broken v-else-if="dialogType == 5" :details = details></broken> + <height v-else-if="dialogType == 6" :details = details></height> + <power v-else-if="dialogType == 7" :details = details></power> + <plate v-else :details = details></plate> + <template #footer> <span class="dialog-footer"> <el-button type="primary" @click="dialogDetails = false" >确认</el-button > </span> - </template> - </el-dialog> - <el-dialog v-model="dialogReview" title="填报验收意见" center> - <el-form ref="reviewFormRef" :model="reviewForm" :rules="reviewRules" label-width="120px"> - <el-form-item label="填报验收意见:" prop="advice"> - <el-input - v-model="reviewForm.advice" - :autosize="{ minRows: 4, maxRows: 10 }" - type="textarea" - placeholder="请填写验收意见" - /> - </el-form-item> - </el-form> - <template #footer> + </template> + </el-dialog> + <el-dialog v-model="dialogReview" title="填报验收意见" center> + <el-form ref="reviewFormRef" :model="reviewForm" :rules="reviewRules" label-width="120px"> + <el-form-item label="填报验收意见:" prop="advice"> + <el-input + v-model="reviewForm.advice" + :autosize="{ minRows: 4, maxRows: 10 }" + type="textarea" + placeholder="请填写验收意见" + /> + </el-form-item> + </el-form> + <template #footer> <span class="dialog-footer"> <el-button type="primary" @click="submitReview(reviewFormRef)">提交验收</el-button> </span> - </template> - </el-dialog> - <video-detail ref="videoRef"></video-detail> - </div> + </template> + </el-dialog> + <video-detail ref="videoRef"></video-detail> + </div> </template> <script lang="ts"> @@ -280,50 +280,50 @@ // 定义接口来定义对象的类型 interface stateType { - workData: Array<any>; - workTimeList: Array<string>; - multipleSelection: Array<any>; - casProps: {}; - approveInfo: Object; - dialogDetails: boolean; - dialogReview: boolean; - pageIndex1: number; - pageSize1: number; - chosenIndex: null | number; - searchWord: number | null; - searchStatus: number | null; - chartSearch1: object; - chartSearch2: object; - chartSearch3: object; - chartSearch4: object; - searchDep2: number | null; - searchDep: number | null; - searchDate: Array<any>, - totalSize1: number; - details: {}; - workType: Array<type>; - workType1: Array<type>; - dialogType: number | null; - departmentList: Array<any>; - departmentRecursionList: Array<DepartmentState>; - workStatus: Array<status>; - reviewForm: object; - reviewRules: object; - warningData: Array<any>; - isFull:boolean; - themeColor:string + workData: Array<any>; + workTimeList: Array<string>; + multipleSelection: Array<any>; + casProps: {}; + approveInfo: Object; + dialogDetails: boolean; + dialogReview: boolean; + pageIndex1: number; + pageSize1: number; + chosenIndex: null | number; + searchWord: number | null; + searchStatus: number | null; + chartSearch1: object; + chartSearch2: object; + chartSearch3: object; + chartSearch4: object; + searchDep2: number | null; + searchDep: number | null; + searchDate: Array<any>, + totalSize1: number; + details: {}; + workType: Array<type>; + workType1: Array<type>; + dialogType: number | null; + departmentList: Array<any>; + departmentRecursionList: Array<DepartmentState>; + workStatus: Array<status>; + reviewForm: object; + reviewRules: object; + warningData: Array<any>; + isFull:boolean; + themeColor:string } interface type { - id: number; - name: string; + id: number; + name: string; } interface status { name: string value: number } interface DepartmentState { - depId: number; - depName: string; + depId: number; + depName: string; } interface User { name: string; @@ -331,739 +331,738 @@ info: string; } export default defineComponent({ - name: 'specialIndex', - components: { - VideoDetail, - fire: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/fireLog.vue')), - space: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/spaceLog.vue')), - hoist: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/hoistLog.vue')), - ground: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/groundLog.vue')), - broken: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/brokenLog.vue')), - height: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/heightLog.vue')), - power: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/powerLog.vue')), - plate: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/plateLog.vue')) - }, - setup() { - const userInfo = useUserInfo(); - const { userInfos } = storeToRefs(userInfo); - const router = useRouter(); - const reviewFormRef = ref<FormInstance>() - const zyfb = ref("eChartZyfb" + Date.now() + Math.random()) - const slfx = ref("eChartSlfx" + Date.now() + Math.random()) - const zyqs = ref("eChartZyqs" + Date.now() + Math.random()) - const videoRef = ref(); - const state = reactive<stateType>({ - pageIndex1: 1, - pageSize1: 10, - totalSize1: 0, - dialogType: null, - dialogReview: false, - departmentList: [], - departmentRecursionList: [], - chosenIndex: null, - searchWord: null, - searchStatus: null, - chartSearch1: { - searchDep: null, - startTime: '2023-03-08', - endTime: '2023-02-08', - period: 'month' - }, - chartSearch2: { - searchDep: null, - type: 0 - }, - chartSearch3: { - searchDep: null - }, - chartSearch4: { - searchDep: null - }, - searchDep2: null, - searchDep: null, - searchDate: [], - workData: [ - { - num: '111', - dep: '部门1', - applyer: '张凤', - worker: '李羽飞', - type: '动火作业', - level: '一级', - applyTime: '2023-03-08', - startTime: '2023-03-08', - endTime: '2023-03-08', - status: 0, - reason: '分析超时', - warning: 0, - message: 1 - }, - { - num: '222', - dep: '部门2', - applyer: '张凤', - worker: '李羽飞', - type: '动土作业', - level: '一级', - applyTime: '2023-03-08', - startTime: '2023-03-08', - endTime: '2023-03-08', - status: 1, - reason: '分析超时', - warning: 1, - message: 0 - }, - { - num: '333', - dep: '部门3', - applyer: '张凤', - worker: '李羽飞', - type: '动火作业', - level: '一级', - applyTime: '2023-03-08', - startTime: '2023-03-08', - endTime: '2023-03-08', - status: 2, - reason: '分析超时', - warning: 2, - message: 0 - }, - { - num: '222', - dep: '部门2', - applyer: '张凤', - worker: '李羽飞', - type: '动土作业', - level: '一级', - applyTime: '2023-03-08', - startTime: '2023-03-08', - endTime: '2023-03-08', - status: 1, - reason: '分析超时', - warning: 1, - message: 0 - }, - { - num: '333', - dep: '部门3', - applyer: '张凤', - worker: '李羽飞', - type: '动火作业', - level: '一级', - applyTime: '2023-03-08', - startTime: '2023-03-08', - endTime: '2023-03-08', - status: 2, - reason: '分析超时', - warning: 2, - message: 0 - } - ], - isFull: false, - themeColor: '#333', - workTimeList: [], - multipleSelection: [], - approveInfo: { - approvalSteps: [], - operators: [] - }, - casProps: { - expandTrigger: 'hover', - emitPath: false, - value: 'depId', - label: 'depName', - checkStrictly: true - }, - dialogDetails: false, - details: {}, - workType1: [ - { id: 0, name: '所有作业' }, - { id: 1, name: '动火作业' }, - { id: 2, name: '受限空间作业' }, - { id: 3, name: '吊装作业' }, - { id: 4, name: '动土作业' }, - { id: 5, name: '断路作业' }, - { id: 6, name: '高处作业' }, - { id: 7, name: '临时用电作业' }, - { id: 8, name: '盲板抽堵作业' } - ], - workType: [ - { id: 1, name: '动火作业' }, - { id: 2, name: '受限空间作业' }, - { id: 3, name: '吊装作业' }, - { id: 4, name: '动土作业' }, - { id: 5, name: '断路作业' }, - { id: 6, name: '高处作业' }, - { id: 7, name: '临时用电作业' }, - { id: 8, name: '盲板抽堵作业' } - ], - workStatus: [ - { - name: '作业进行中', - value: 0 - }, - { - name: '作业终止', - value: 1 - }, - { - name: '作业结束待验收', - value: 2 - }, - { - name: '作业完成', - value: 3 - } - ], - warningData: [ - { - name: '黄公子', - dep: '有机事业部', - warning: 69, - role: '作业人', - isCard: 1 - }, - { - name: '李飞飞', - dep: '有机事业部', - warning: 51, - role: '监护人', - isCard: 0 - }, - { - name: '黄公子', - dep: '有机事业部', - warning: 69, - role: '作业人', - isCard: 1 - } - ], - reviewForm: { - advice: '' - }, - reviewRules:{ - advice: [{ required: true, message: '请填写验收意见', trigger: 'blur' }] - } + name: 'specialIndex', + components: { + VideoDetail, + fire: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/fireLog.vue')), + space: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/spaceLog.vue')), + hoist: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/hoistLog.vue')), + ground: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/groundLog.vue')), + broken: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/brokenLog.vue')), + height: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/heightLog.vue')), + power: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/powerLog.vue')), + plate: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workTicket/wdsq/components/plateLog.vue')) + }, + setup() { + const userInfo = useUserInfo(); + const { userInfos } = storeToRefs(userInfo); + const router = useRouter(); + const reviewFormRef = ref<FormInstance>() + const zyfb = ref("eChartZyfb" + Date.now() + Math.random()) + const slfx = ref("eChartSlfx" + Date.now() + Math.random()) + const zyqs = ref("eChartZyqs" + Date.now() + Math.random()) + const videoRef = ref(); + const state = reactive<stateType>({ + pageIndex1: 1, + pageSize1: 10, + totalSize1: 0, + dialogType: null, + dialogReview: false, + departmentList: [], + departmentRecursionList: [], + chosenIndex: null, + searchWord: null, + searchStatus: null, + chartSearch1: { + searchDep: null, + startTime: '2023-03-08', + endTime: '2023-02-08', + period: 'month' + }, + chartSearch2: { + searchDep: null, + type: 0 + }, + chartSearch3: { + searchDep: null + }, + chartSearch4: { + searchDep: null + }, + searchDep2: null, + searchDep: null, + searchDate: [], + workData: [ + { + num: '111', + dep: '部门1', + applyer: '张凤', + worker: '李羽飞', + type: '动火作业', + level: '一级', + applyTime: '2023-03-08', + startTime: '2023-03-08', + endTime: '2023-03-08', + status: 0, + reason: '分析超时', + warning: 0, + message: 1 + }, + { + num: '222', + dep: '部门2', + applyer: '张凤', + worker: '李羽飞', + type: '动土作业', + level: '一级', + applyTime: '2023-03-08', + startTime: '2023-03-08', + endTime: '2023-03-08', + status: 1, + reason: '分析超时', + warning: 1, + message: 0 + }, + { + num: '333', + dep: '部门3', + applyer: '张凤', + worker: '李羽飞', + type: '动火作业', + level: '一级', + applyTime: '2023-03-08', + startTime: '2023-03-08', + endTime: '2023-03-08', + status: 2, + reason: '分析超时', + warning: 2, + message: 0 + }, + { + num: '222', + dep: '部门2', + applyer: '张凤', + worker: '李羽飞', + type: '动土作业', + level: '一级', + applyTime: '2023-03-08', + startTime: '2023-03-08', + endTime: '2023-03-08', + status: 1, + reason: '分析超时', + warning: 1, + message: 0 + }, + { + num: '333', + dep: '部门3', + applyer: '张凤', + worker: '李羽飞', + type: '动火作业', + level: '一级', + applyTime: '2023-03-08', + startTime: '2023-03-08', + endTime: '2023-03-08', + status: 2, + reason: '分析超时', + warning: 2, + message: 0 + } + ], + isFull: false, + themeColor: '#333', + workTimeList: [], + multipleSelection: [], + approveInfo: { + approvalSteps: [], + operators: [] + }, + casProps: { + expandTrigger: 'hover', + emitPath: false, + value: 'depId', + label: 'depName', + checkStrictly: true + }, + dialogDetails: false, + details: {}, + workType1: [ + { id: 0, name: '所有作业' }, + { id: 1, name: '动火作业' }, + { id: 2, name: '受限空间作业' }, + { id: 3, name: '吊装作业' }, + { id: 4, name: '动土作业' }, + { id: 5, name: '断路作业' }, + { id: 6, name: '高处作业' }, + { id: 7, name: '临时用电作业' }, + { id: 8, name: '盲板抽堵作业' } + ], + workType: [ + { id: 1, name: '动火作业' }, + { id: 2, name: '受限空间作业' }, + { id: 3, name: '吊装作业' }, + { id: 4, name: '动土作业' }, + { id: 5, name: '断路作业' }, + { id: 6, name: '高处作业' }, + { id: 7, name: '临时用电作业' }, + { id: 8, name: '盲板抽堵作业' } + ], + workStatus: [ + { + name: '作业进行中', + value: 0 + }, + { + name: '作业终止', + value: 1 + }, + { + name: '作业结束待验收', + value: 2 + }, + { + name: '作业完成', + value: 3 + } + ], + warningData: [ + { + name: '黄公子', + dep: '有机事业部', + warning: 69, + role: '作业人', + isCard: 1 + }, + { + name: '李飞飞', + dep: '有机事业部', + warning: 51, + role: '监护人', + isCard: 0 + }, + { + name: '黄公子', + dep: '有机事业部', + warning: 69, + role: '作业人', + isCard: 1 + } + ], + reviewForm: { + advice: '' + }, + reviewRules:{ + advice: [{ required: true, message: '请填写验收意见', trigger: 'blur' }] + } + }); + // 页面载入时执行方法 + onMounted(() => { + getListByPage(); + getAllDepartment(); + initZyfb() + initSlfx() + initZyqs() + }); + const toFullscreen =()=>{ + const element = document.getElementById('bigScreen') + if (!screenfull.isEnabled) { + ElMessage.warning('暂不不支持全屏'); + return false; + } + screenfull.toggle(element); + state.isFull = !state.isFull + if(state.isFull == true){ + state.themeColor = '#11FEEE' + }else{ + state.themeColor = '#333' + } + initZyfb() + initSlfx() + initZyqs() + } + const getTypePie = async ()=>{ + let res = await specialIndexApi().analyseType(state.chartSearch1.startTime,state.chartSearch1.endTime,state.chartSearch1.searchDep); + if (res.data.code === '200') { + console.log(res.data,'666666666') + } else { + ElMessage({ + type: 'warning', + message: res.data.msg }); - // 页面载入时执行方法 - onMounted(() => { - getListByPage(); - getAllDepartment(); - initZyfb() - initSlfx() - initZyqs() - }); - const toFullscreen =()=>{ - const element = document.getElementById('bigScreen') - if (!screenfull.isEnabled) { - ElMessage.warning('暂不不支持全屏'); - return false; - } - screenfull.toggle(element); - state.isFull = !state.isFull - if(state.isFull == true){ - state.themeColor = '#11FEEE' - }else{ - state.themeColor = '#333' - } - initZyfb() - initSlfx() - initZyqs() } - const getTypePie = async ()=>{ - let res = await specialIndexApi().analyseType(state.chartSearch1.startTime,state.chartSearch1.endTime,state.chartSearch1.searchDep); - if (res.data.code === '200') { - console.log(res.data,'666666666') - } else { - ElMessage({ - type: 'warning', - message: res.data.msg - }); - } - } - type EChartsOption = echarts.EChartsOption - const initZyfb =()=>{ - let dom = document.getElementById(zyfb.value); - let myChart = echarts.init(dom); - let option: EChartsOption; - option = { - tooltip: { - trigger: 'item' + } + type EChartsOption = echarts.EChartsOption + const initZyfb =()=>{ + let dom = document.getElementById(zyfb.value); + let myChart = echarts.init(dom); + let option: EChartsOption; + option = { + tooltip: { + trigger: 'item' + }, + legend: { + orient: 'vertical', + left: 'left', + top: 'center', + textStyle: { + // 设置默认的文字颜色 + color: state.themeColor, + fontSize: 12 }, - legend: { - orient: 'vertical', - left: 'left', - top: 'center', - textStyle: { - // 设置默认的文字颜色 - color: state.themeColor, - fontSize: 12 - }, + itemStyle: { + borderWidth: 0 // 设置图例边框宽度为0 + } + }, + series: [ + { + name: 'Access From', + type: 'pie', + radius: ['40%', '70%'], + avoidLabelOverlap: false, itemStyle: { - borderWidth: 0 // 设置图例边框宽度为0 - } - }, - series: [ - { - name: 'Access From', - type: 'pie', - radius: ['40%', '70%'], - avoidLabelOverlap: false, - itemStyle: { - borderRadius: 1, - borderColor: '#fff', - borderWidth: 2 - }, + borderRadius: 1, + borderColor: '#fff', + borderWidth: 2 + }, + label: { + show: false, + position: 'center' + }, + emphasis: { label: { - show: false, - position: 'center' - }, - emphasis: { - label: { - show: true, - fontSize: 40, - fontWeight: 'bold' - } - }, - labelLine: { - show: true - }, - data: [ - { value: 1048, name: '动火作业' }, - { value: 735, name: '受限空间作业' }, - { value: 580, name: '吊装作业' }, - { value: 484, name: '动土作业' }, - { value: 735, name: '断路作业' }, - { value: 580, name: '高处作业' }, - { value: 484, name: '临时用电作业' }, - { value: 300, name: '盲板抽堵作业' } - ] - } - ] - } - - option && myChart.setOption(option); - window.addEventListener("resize",function (){ - myChart.resize(); - }); - } - const initSlfx =()=>{ - let dom = document.getElementById(slfx.value); - let myChart = echarts.init(dom); - let option: EChartsOption; - option = { - tooltip: { - trigger: 'axis', - axisPointer: { - type: 'shadow' - } - }, - grid: { - left: '3%', - right: '4%', - bottom: '3%', - containLabel: true - }, - xAxis: [ - { - type: 'category', - data: ['事业部1', '事业部2', '事业部3', '事业部4', '事业部5', '事业部6', '事业部7'], - axisTick: { - alignWithLabel: true - }, - axisLabel: { - color: state.themeColor + show: true, + fontSize: 40, + fontWeight: 'bold' } - } - ], - yAxis: [ - { - type: 'value' - } - ], - series: [ - { - name: 'Direct', - type: 'bar', - barWidth: '60%', - data: [10, 52, 200, 334, 390, 330, 220] - } - ] - } - - option && myChart.setOption(option); - window.addEventListener("resize",function (){ - myChart.resize(); - }); + }, + labelLine: { + show: true + }, + data: [ + { value: 1048, name: '动火作业' }, + { value: 735, name: '受限空间作业' }, + { value: 580, name: '吊装作业' }, + { value: 484, name: '动土作业' }, + { value: 735, name: '断路作业' }, + { value: 580, name: '高处作业' }, + { value: 484, name: '临时用电作业' }, + { value: 300, name: '盲板抽堵作业' } + ] + } + ] } - const initZyqs =()=>{ - let dom = document.getElementById(zyqs.value); - let myChart = echarts.init(dom); - let option: EChartsOption; - option = { - xAxis: { + + option && myChart.setOption(option); + window.addEventListener("resize",function (){ + myChart.resize(); + }); + } + const initSlfx =()=>{ + let dom = document.getElementById(slfx.value); + let myChart = echarts.init(dom); + let option: EChartsOption; + option = { + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { type: 'category', - data: ['四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月', '一月', '二月', '三月'], + data: ['事业部1', '事业部2', '事业部3', '事业部4', '事业部5', '事业部6', '事业部7'], + axisTick: { + alignWithLabel: true + }, axisLabel: { color: state.themeColor } - }, - yAxis: { + } + ], + yAxis: [ + { type: 'value' - }, - grid: { - top: '8%', - bottom: '8%' - }, - series: [ - { - data: [150, 230, 224, 218, 135, 147, 230, 224, 218, 135, 147, 260], - type: 'line' - } - ] - } + } + ], + series: [ + { + name: 'Direct', + type: 'bar', + barWidth: '60%', + data: [10, 52, 200, 334, 390, 330, 220] + } + ] + } - option && myChart.setOption(option); - window.addEventListener("resize",function (){ - myChart.resize(); + option && myChart.setOption(option); + window.addEventListener("resize",function (){ + myChart.resize(); + }); + } + const initZyqs =()=>{ + let dom = document.getElementById(zyqs.value); + let myChart = echarts.init(dom); + let option: EChartsOption; + option = { + xAxis: { + type: 'category', + data: ['四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月', '一月', '二月', '三月'], + axisLabel: { + color: state.themeColor + } + }, + yAxis: { + type: 'value' + }, + grid: { + top: '8%', + bottom: '8%' + }, + series: [ + { + data: [150, 230, 224, 218, 135, 147, 230, 224, 218, 135, 147, 260], + type: 'line' + } + ] + } + + option && myChart.setOption(option); + window.addEventListener("resize",function (){ + myChart.resize(); + }); + } + // 刷新 + const reLoadData = async () => { + getListByPage(); + }; + + // 填写表单 + const toApply = () => { + router.push({ + path: 'zysq' + }); + }; + + // 获取部门列表 + const getAllDepartment = async () => { + let res = await teamManageApi().getAllDepartment(); + if (res.data.code === '200') { + state.departmentList = JSON.parse(JSON.stringify(res.data.data)) + // recursion(state.departmentList); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg }); } - // 刷新 - const reLoadData = async () => { - getListByPage(); - }; + }; - // 填写表单 - const toApply = () => { - router.push({ - path: 'zysq' - }); - }; - - // 获取部门列表 - const getAllDepartment = async () => { - let res = await teamManageApi().getAllDepartment(); - if (res.data.code === '200') { - state.departmentList = JSON.parse(JSON.stringify(res.data.data)) - // recursion(state.departmentList); - } else { - ElMessage({ - type: 'warning', - message: res.data.msg - }); - } - }; - - // 分页获取列表 - const getListByPage = async () => { - const dateRange = JSON.parse(JSON.stringify(state.searchDate)) - if(dateRange[1]){dateRange[1] = dateRange[1].replace('00:00:00','23:59:59')} - const data = { pageSize: state.pageSize1, pageIndex: state.pageIndex1, searchParams: { workType: state.searchWord, applyDepId: state.searchDep,applyStartTime: dateRange[0],applyEndTime: dateRange[1]} }; - let res = await workApplyApi().getApplyList(data); - if (res.data.code === '200') { - state.workData = JSON.parse(JSON.stringify(res.data.data)); - state.workData = state.workData.map((item) => { - if (item.operators == null || item.operators == []) { - item.operators = []; - } else { - item.operators = Array.from(item.operators, ({ operatorUname }) => operatorUname); - } - return item; - }); - state.totalSize1 = res.data.total; - } else { - ElMessage({ - type: 'warning', - message: res.data.msg - }); - } - }; - - // 表格数据格式化 - const toNames = (row, column, cellValue, index) => { - if (row.list == []) { - return []; - } else { - const nameList = []; - for (let i = 0; i < row.list.length; i++) { - for (let t = 0; t < state.workTimeList.length; t++) { - if (row.list[i] == state.workTimeList[t].id) { - nameList.push(state.workTimeList[t].name); - } - } - } - return nameList.join(); - } - }; - - // 关键词查询记录 - const searchRecord = async () => { - if (state.searchWord == null && state.searchStatus == null && state.searchDep == null && state.searchDate == []) { - ElMessage({ - type: 'warning', - message: '请输入查询关键词' - }); - } else { - getListByPage(); - } - }; - // 重置搜索 - const clearSearch = async () => { - state.searchWord = null; - state.searchDep = null; - state.searchDate = [] - getListByPage(); - }; - - const handleSizeChange1 = (val: number) => { - state.pageSize1 = val; - getListByPage(); - }; - const handleCurrentChange1 = (val: number) => { - state.pageIndex1 = val; - getListByPage(); - }; - - // 查看记录 - const viewRecord = (row: any) => { - state.dialogType = row.workType - state.details = JSON.parse(JSON.stringify(row)); - if(state.details.workDetail.otherSpecialWork == '' || !state.details.workDetail.otherSpecialWork){ - state.details.workDetail.otherSpecialWork=[] - } - else { - const a = state.details.workDetail.otherSpecialWork - state.details.workDetail.otherSpecialWork = a.split(',').map((item) => { - return state.workType.find((i: { id: number }) => i.id === Number(item))?.name; - }); - } - if(state.details.workDetail.involvedDepIds == '' || !state.details.workDetail.involvedDepIds){ - state.details.workDetail.involvedDepIds=[] - } - else { - const a = state.details.workDetail.involvedDepIds - state.details.workDetail.involvedDepIds = a.split(',').map((item) => { - return state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(item))?.depName; - }); - } - if(state.details.workDetail.csDepId){ - state.details.workDetail.csDepId = state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(state.details.workDetail.csDepId))?.depName; - } - if(state.details.workDetail.operationDepId){ - state.details.workDetail.operationDepId = state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(state.details.workDetail.operationDepId))?.depName; - } - if(state.details.workDetail.gbPath){ - state.details.workDetail.gbPath = state.details.workDetail.gbPath.split(',') - } - if(state.details.workDetail.bcPath){ - state.details.workDetail.bcPath = state.details.workDetail.bcPath.split(',') - } - if(state.details.workDetail.bpLocationMapPath){ - state.details.workDetail.bpLocationMapPath = state.details.workDetail.bpLocationMapPath.split(',') - } - state.dialogDetails = true; - }; - - const handleReview = (row)=>{ - state.dialogReview = true - } - const openVideo = ()=>{ - videoRef.value.openDialog() - } - const submitReview = async (formEl: FormInstance | undefined) => { - if (!formEl) return - await formEl.validate((valid, fields) => { - if (valid) { - console.log('submit!') + // 分页获取列表 + const getListByPage = async () => { + const dateRange = JSON.parse(JSON.stringify(state.searchDate)) + if(dateRange[1]){dateRange[1] = dateRange[1].replace('00:00:00','23:59:59')} + const data = { pageSize: state.pageSize1, pageIndex: state.pageIndex1, searchParams: { workType: state.searchWord, applyDepId: state.searchDep,applyStartTime: dateRange[0],applyEndTime: dateRange[1]} }; + let res = await workApplyApi().getApplyList(data); + if (res.data.code === '200') { + state.workData = JSON.parse(JSON.stringify(res.data.data)); + state.workData = state.workData.map((item) => { + if (item.operators == null || item.operators == []) { + item.operators = []; } else { - console.log('error submit!', fields) + item.operators = Array.from(item.operators, ({ operatorUname }) => operatorUname); } - }) + return item; + }); + state.totalSize1 = res.data.total; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); } + }; - // 折线图 - const renderMenu = async (value: string) => { - Session.set('projectId', value); - userInfos.value.projectId = value; - await initBackEndControlRoutes(); - }; + // 表格数据格式化 + const toNames = (row, column, cellValue, index) => { + if (row.list == []) { + return []; + } else { + const nameList = []; + for (let i = 0; i < row.list.length; i++) { + for (let t = 0; t < state.workTimeList.length; t++) { + if (row.list[i] == state.workTimeList[t].id) { + nameList.push(state.workTimeList[t].name); + } + } + } + return nameList.join(); + } + }; - return { - View, - Edit, - Delete, - Refresh, - Plus, - Finished, - Download, - FolderChecked, - VideoPlay, - reviewFormRef, - videoRef, - zyfb, - slfx, - zyqs, - toFullscreen, - handleReview, - openVideo, - submitReview, - reLoadData, - toApply, - toNames, - searchRecord, - clearSearch, - viewRecord, - getListByPage, - handleSizeChange1, - handleCurrentChange1, - ...toRefs(state) - }; + // 关键词查询记录 + const searchRecord = async () => { + if (state.searchWord == null && state.searchStatus == null && state.searchDep == null && state.searchDate == []) { + ElMessage({ + type: 'warning', + message: '请输入查询关键词' + }); + } else { + getListByPage(); + } + }; + // 重置搜索 + const clearSearch = async () => { + state.searchWord = null; + state.searchDep = null; + state.searchDate = [] + getListByPage(); + }; + + const handleSizeChange1 = (val: number) => { + state.pageSize1 = val; + getListByPage(); + }; + const handleCurrentChange1 = (val: number) => { + state.pageIndex1 = val; + getListByPage(); + }; + + // 查看记录 + const viewRecord = (row: any) => { + state.dialogType = row.workType + state.details = JSON.parse(JSON.stringify(row)); + if(state.details.workDetail.otherSpecialWork == '' || !state.details.workDetail.otherSpecialWork){ + state.details.workDetail.otherSpecialWork=[] + } + else { + const a = state.details.workDetail.otherSpecialWork + state.details.workDetail.otherSpecialWork = a.split(',').map((item) => { + return state.workType.find((i: { id: number }) => i.id === Number(item))?.name; + }); + } + if(state.details.workDetail.involvedDepIds == '' || !state.details.workDetail.involvedDepIds){ + state.details.workDetail.involvedDepIds=[] + } + else { + const a = state.details.workDetail.involvedDepIds + state.details.workDetail.involvedDepIds = a.split(',').map((item) => { + return state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(item))?.depName; + }); + } + if(state.details.workDetail.csDepId){ + state.details.workDetail.csDepId = state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(state.details.workDetail.csDepId))?.depName; + } + if(state.details.workDetail.operationDepId){ + state.details.workDetail.operationDepId = state.departmentRecursionList.find((i: { depId: number }) => i.depId === Number(state.details.workDetail.operationDepId))?.depName; + } + if(state.details.workDetail.gbPath){ + state.details.workDetail.gbPath = state.details.workDetail.gbPath.split(',') + } + if(state.details.workDetail.bcPath){ + state.details.workDetail.bcPath = state.details.workDetail.bcPath.split(',') + } + if(state.details.workDetail.bpLocationMapPath){ + state.details.workDetail.bpLocationMapPath = state.details.workDetail.bpLocationMapPath.split(',') + } + state.dialogDetails = true; + }; + + const handleReview = (row)=>{ + state.dialogReview = true } + const openVideo = ()=>{ + videoRef.value.openDialog() + } + const submitReview = async (formEl: FormInstance | undefined) => { + if (!formEl) return + await formEl.validate((valid, fields) => { + if (valid) { + console.log('submit!') + } else { + console.log('error submit!', fields) + } + }) + } + + // 折线图 + const renderMenu = async (value: string) => { + Session.set('projectId', value); + userInfos.value.projectId = value; + await initBackEndControlRoutes(); + }; + + return { + View, + Edit, + Delete, + Refresh, + Plus, + Finished, + Download, + FolderChecked, + VideoPlay, + reviewFormRef, + videoRef, + zyfb, + slfx, + zyqs, + toFullscreen, + handleReview, + openVideo, + submitReview, + reLoadData, + toApply, + toNames, + searchRecord, + clearSearch, + viewRecord, + getListByPage, + handleSizeChange1, + handleCurrentChange1, + ...toRefs(state) + }; + } }); </script> <style scoped lang="scss"> $homeNavLengh: 8; .home-container { - height: calc(100vh - 144px); - position: relative; - box-sizing: border-box; - overflow: hidden; - overflow-y: scroll; - scrollbar-width: none; /* firefox */ - -ms-overflow-style: none; /* IE 10+ */ + height: calc(100vh - 144px); + position: relative; + box-sizing: border-box; + overflow: hidden; + overflow-y: scroll; + scrollbar-width: none; /* firefox */ + -ms-overflow-style: none; /* IE 10+ */ - &::-webkit-scrollbar { - display: none; /* Chrome Safari */ - } - .full{ - position:fixed; - height: 34px; - line-height: 34px; - top: 80px; - right: 20px; - z-index: 99999; + &::-webkit-scrollbar { + display: none; /* Chrome Safari */ + } + .full{ + position:fixed; + height: 34px; + line-height: 34px; + top: 80px; + right: 20px; + z-index: 99999; + } + + .demo-tabs { + width: 100%; + height: 100%; + + &::v-deep(.el-tabs__content) { + height: calc(100% - 60px); } - .demo-tabs { - width: 100%; - height: 100%; - - &::v-deep(.el-tabs__content) { - height: calc(100% - 60px); - } - - .el-tab-pane { - height: 100%; - } + .el-tab-pane { + height: 100%; } - .topChart{ - width: 100%; - display: flex; - justify-content: space-between; - align-items: flex-start; - margin-bottom: 20px; - height: 40%; + } + .topChart{ + width: 100%; + display: flex; + justify-content: space-between; + align-items: flex-start; + margin-bottom: 20px; + height: 40%; + &:last-of-type{ + margin-bottom: 0; + } + + .chart-item{ + width: calc(50% - 10px); + height: 100%; + margin-right: 10px; + position: relative; + background: #fff; + padding: 20px; + &:last-of-type{ - margin-bottom: 0; + margin-right: 0; } - .chart-item{ - width: calc(50% - 10px); - height: 100%; - margin-right: 10px; - position: relative; - background: #fff; - padding: 20px; - - &:last-of-type{ - margin-right: 0; + .chart-tit{ + width: 100%; + height: 15%; + display: flex; + align-items: flex-start; + justify-content: space-between; + .tit{ + font-size: 1.33rem; + font-weight: bolder; + white-space: nowrap; } - - .chart-tit{ - width: 100%; - height: 15%; + .filter-part{ display: flex; - align-items: flex-start; - justify-content: space-between; - .tit{ - font-size: 1.33rem; - font-weight: bolder; - white-space: nowrap; + align-items: center; + justify-content: right; + :deep(.el-cascader){ + width: 35% !important; } - .filter-part{ - display: flex; - align-items: center; - justify-content: right; - :deep(.el-cascader){ - width: 35% !important; - } - .el-select{ - width: 35% !important; - margin-left: 10px; - } - .el-switch{ - width: 25% !important; + .el-select{ + width: 35% !important; + margin-left: 10px; + } + .el-switch{ + width: 25% !important; - :deep(.el-switch__core){ - width: 100% !important; - } - } - } - .filter-part2{ - :deep(.el-cascader){ + :deep(.el-switch__core){ width: 100% !important; } } - } - .chart{ - width: 100%; - height: 85%; - .el-table{ - height: 90% !important; - :deep(.el-table__inner-wrapper){ - height: 100% !important; - .el-table__header-wrapper { - height: 20% !important; - .el-table__header{ + .filter-part2{ + :deep(.el-cascader){ + width: 100% !important; + } + } + + } + .chart{ + width: 100%; + height: 85%; + .el-table{ + height: 90% !important; + :deep(.el-table__inner-wrapper){ + height: 100% !important; + .el-table__header-wrapper { + height: 20% !important; + .el-table__header{ + height: 100% !important; + th{ height: 100% !important; - th{ - height: 100% !important; - padding: 0 0 !important; - .cell{ - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } + padding: 0 0 !important; + .cell{ + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } } } - .el-table__body-wrapper { - height: 80% !important; - .el-scrollbar__view{ + } + .el-table__body-wrapper { + height: 80% !important; + .el-scrollbar__view{ + height: 100% !important; + .el-table__body{ height: 100% !important; - .el-table__body{ + tbody{ height: 100% !important; - tbody{ - height: 100% !important; - .el-table__row{ + .el-table__row{ + height: 25% !important; + td{ height: 25% !important; - td{ - height: 25% !important; - padding: 0 0 !important; - .left-info{ - display: flex; - align-items: center; - } - .cell{ - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - .el-button{ - padding: 0 !important; - } + padding: 0 0 !important; + .left-info{ + display: flex; + align-items: center; + } + .cell{ + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + .el-button{ + padding: 0 !important; } } } @@ -1073,314 +1072,315 @@ } } } - .el-radio-group{ - width: 20%; - display: flex; - flex-flow: column nowrap; - align-items: flex-start; - position: absolute; - right: 10px; - top: 50%; - transform: translateY(-30%); + } + .el-radio-group{ + width: 20%; + display: flex; + flex-flow: column nowrap; + align-items: flex-start; + position: absolute; + right: 10px; + top: 50%; + transform: translateY(-30%); - .el-radio{ - width: 100%; - margin-bottom: 4px; - } + .el-radio{ + width: 100%; + margin-bottom: 4px; } - :deep(.active-ring-info){ - .active-ring-name{ - font-size: 1.5rem !important; - text-align: center; - } + } + :deep(.active-ring-info){ + .active-ring-name{ + font-size: 1.5rem !important; + text-align: center; } } } - .homeCard { + } + .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; + } + + .top-info { + display: flex; + font-size: 14px; + font-weight: bolder; + align-items: center; + padding: 4px 10px; + background: #ffeb87; + border-radius: 2px; + border: 1px solid #ffae00; + margin-right: 20px; + + & > div { + vertical-align: middle; + white-space: nowrap; + span { + font-size: 18px; + color: #f3001e; + margin: 0 2px; + cursor: pointer; + + &:hover{ + text-decoration: underline; + } + } + } + } + } + .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; + } + } + } + } + .stepItem { + display: flex; + align-items: flex-start; + margin-top: 30px; + margin-left: 30px; + padding-bottom: 30px; + padding-left: 40px; + border-left: 1px solid #a0cfff; + position: relative; + &:first-of-type { + margin-top: 30px; + } + &:first-of-type { + margin-bottom: 0; + border-left: none; + } + .stepNum { + position: absolute; + width: 40px; + height: 40px; + border-radius: 20px; + box-sizing: border-box; + font-size: 18px; + color: #333; + border: 1px solid #a0cfff; + line-height: 38px; + text-align: center; + left: -20px; + top: -30px; + background: #d9ecff; + } + .stepCard { + width: 100%; + margin-top: -30px; + + .box-card { width: 100%; - padding: 20px; - box-sizing: border-box; - background: #fff; - border-radius: 4px; - .main-card { + .card-header { + display: flex; + justify-content: space-between; + align-items: center; + + span { + font-weight: bold; + margin-left: 10px; + } + } + + .text { + width: 100%; + font-size: 14px; + margin-bottom: 10px; + padding-left: 10px; + + span { + font-weight: bolder; + color: #409eff; + } + + &:last-of-type { + margin-bottom: 0; + } + } + .approveUnit { + width: 100%; + font-size: 14px; + margin-bottom: 20px; + padding: 10px 15px; + border: 1px solid #fff; + background: #ecf8ff; + border-radius: 6px; + .item-tit { width: 100%; - height: 100%; - .cardTop { + display: flex; + color: #409eff; + align-items: flex-start; + justify-content: space-between; + padding-bottom: 10px; + border-bottom: 1px solid #a0cfff; + + & > span { + flex: 1; + &:last-of-type{ + text-align: center; + } + } + & > div { + flex: 1; + text-align: center; + } + } + .item-cont { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + padding: 10px 0; + border-bottom: 1px solid #c6e2ff; + + & > span { + flex: 1; + &:last-of-type{ + text-align: center; + } + } + & > div { + flex: 1; + text-align: center; + + & > div { + text-align: left; + width: 100%; display: flex; + justify-content: center; align-items: center; - justify-content: space-between; - margin-bottom: 20px; - .mainCardBtn { - margin: 0; - } - - .top-info { - display: flex; - font-size: 14px; - font-weight: bolder; - align-items: center; - padding: 4px 10px; - background: #ffeb87; - border-radius: 2px; - border: 1px solid #ffae00; - margin-right: 20px; - - & > div { - vertical-align: middle; - white-space: nowrap; - span { - font-size: 18px; - color: #f3001e; - margin: 0 2px; - cursor: pointer; - - &:hover{ - text-decoration: underline; - } + span { + width: 45%; + &:first-of-type { + width: 30%; } } } } - .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 { + border-bottom: 0; } + } } - } - .stepItem { - display: flex; - align-items: flex-start; - margin-top: 30px; - margin-left: 30px; - padding-bottom: 30px; - padding-left: 40px; - border-left: 1px solid #a0cfff; - position: relative; - &:first-of-type { - margin-top: 30px; - } - &:first-of-type { - margin-bottom: 0; - border-left: none; - } - .stepNum { - position: absolute; - width: 40px; - height: 40px; - border-radius: 20px; - box-sizing: border-box; - font-size: 18px; - color: #333; - border: 1px solid #a0cfff; - line-height: 38px; - text-align: center; - left: -20px; - top: -30px; - background: #d9ecff; - } - .stepCard { + .approveItem { + width: 100%; + font-size: 14px; + margin-bottom: 20px; + padding: 10px 15px; + background: #ecf8ff; + border: 1px solid #fff; + border-radius: 6px; + .item-tit { width: 100%; - margin-top: -30px; + display: flex; + color: #409eff; + align-items: flex-start; + justify-content: space-between; + padding-bottom: 10px; + border-bottom: 1px solid #a0cfff; - .box-card { - width: 100%; - - .card-header { - display: flex; - justify-content: space-between; - align-items: center; - - span { - font-weight: bold; - margin-left: 10px; - } - } - - .text { - width: 100%; - font-size: 14px; - margin-bottom: 10px; - padding-left: 10px; - - span { - font-weight: bolder; - color: #409eff; - } - - &:last-of-type { - margin-bottom: 0; - } - } - .approveUnit { - width: 100%; - font-size: 14px; - margin-bottom: 20px; - padding: 10px 15px; - border: 1px solid #fff; - background: #ecf8ff; - border-radius: 6px; - .item-tit { - width: 100%; - display: flex; - color: #409eff; - align-items: flex-start; - justify-content: space-between; - padding-bottom: 10px; - border-bottom: 1px solid #a0cfff; - - & > span { - flex: 1; - &:last-of-type{ - text-align: center; - } - } - & > div { - flex: 1; - text-align: center; - } - } - .item-cont { - width: 100%; - display: flex; - align-items: center; - justify-content: space-between; - padding: 10px 0; - border-bottom: 1px solid #c6e2ff; - - & > span { - flex: 1; - &:last-of-type{ - text-align: center; - } - } - & > div { - flex: 1; - text-align: center; - - & > div { - text-align: left; - width: 100%; - display: flex; - justify-content: center; - align-items: center; - span { - width: 45%; - &:first-of-type { - width: 30%; - } - } - } - } - &:last-of-type { - border-bottom: 0; - } - } - } - .approveItem { - width: 100%; - font-size: 14px; - margin-bottom: 20px; - padding: 10px 15px; - background: #ecf8ff; - border: 1px solid #fff; - border-radius: 6px; - .item-tit { - width: 100%; - display: flex; - color: #409eff; - align-items: flex-start; - justify-content: space-between; - padding-bottom: 10px; - border-bottom: 1px solid #a0cfff; - - & > span { - flex: 1; - } - & > div { - flex: 2; - text-align: center; - } - } - .item-cont { - width: 100%; - display: flex; - align-items: center; - justify-content: space-between; - padding: 10px 0; - border-bottom: 1px solid #c6e2ff; - - & > span { - flex: 1; - } - & > div { - flex: 2; - text-align: center; - - & > div { - text-align: left; - width: 100%; - display: flex; - justify-content: center; - align-items: flex-start; - margin-bottom: 10px; - span { - width: 50%; - &:first-of-type { - width: 25%; - } - } - } - } - &:last-of-type { - border-bottom: 0; - } - } - } + & > span { + flex: 1; } - } - &:hover .card-header { - color: #0098f5; - } - &:hover .stepNum { - border: 2px solid #0098f5; - color: #0098f5; - } - } - .el-row { - display: flex; - align-items: center; - margin-bottom: 10px; - &:last-child { - margin-bottom: 0; - } - .grid-content { - align-items: center; - min-height: 36px; - } - - .topInfo { + & > div { + flex: 2; + text-align: center; + } + } + .item-cont { width: 100%; display: flex; align-items: center; - font-size: 16px; - font-weight: bold; + justify-content: space-between; + padding: 10px 0; + border-bottom: 1px solid #c6e2ff; - & > div { - white-space: nowrap; - margin-right: 20px; + & > span { + flex: 1; } + & > div { + flex: 2; + text-align: center; + + & > div { + text-align: left; + width: 100%; + display: flex; + justify-content: center; + align-items: flex-start; + margin-bottom: 10px; + span { + width: 50%; + &:first-of-type { + width: 25%; + } + } + } + } + &:last-of-type { + border-bottom: 0; + } + } } + } } + &:hover .card-header { + color: #0098f5; + } + &:hover .stepNum { + border: 2px solid #0098f5; + color: #0098f5; + } + } + .el-row { + display: flex; + align-items: center; + margin-bottom: 10px; + &:last-child { + margin-bottom: 0; + } + .grid-content { + align-items: center; + min-height: 36px; + } + + .topInfo { + width: 100%; + display: flex; + align-items: center; + font-size: 16px; + font-weight: bold; + + & > div { + white-space: nowrap; + margin-right: 20px; + } + } + } } .container{ @@ -1576,18 +1576,18 @@ } } .el-card { - border: 0; + border: 0; } .el-input{ - width: 100% !important; + width: 100% !important; } ::v-deep(.el-date-editor){ - width: 100%; + width: 100%; } .el-select{ - width: 100%; + width: 100%; } :deep(.el-cascader){ - width: 100% !important; + width: 100% !important; } </style> -- Gitblit v1.9.2