From 01f62968de39cacddaed903bb936cc5163573fc4 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期五, 23 十二月 2022 14:51:37 +0800
Subject: [PATCH] 更改列表显示
---
src/views/specialWorkManage/workTicket/myJobApply/index.vue | 742 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 737 insertions(+), 5 deletions(-)
diff --git a/src/views/specialWorkManage/workTicket/myJobApply/index.vue b/src/views/specialWorkManage/workTicket/myJobApply/index.vue
index 34cd1a0..244da37 100644
--- a/src/views/specialWorkManage/workTicket/myJobApply/index.vue
+++ b/src/views/specialWorkManage/workTicket/myJobApply/index.vue
@@ -1,13 +1,745 @@
<template>
-
+ <div class="home-container">
+<!-- <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">-->
+<!-- <el-tab-pane label="申请中" name="1">-->
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <span>作业类型：</span>
+ <el-col :span="10">
+ <div class="grid-content topInfo">
+ <el-select v-model="searchWord">
+ <el-option
+ v-for="item in workType"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ />
+ </el-select>
+ <el-button type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="24" class="mainCardBtn">
+<!-- <el-button type="primary" size="default" @click="toApply()">申请</el-button>-->
+ <!-- <el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
+ <!-- <el-button type="success" size="default">设置分类</el-button>-->
+ </el-col>
+ </el-row>
+ <el-table ref="multipleTableRef" :data="applyData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }">
+ <el-table-column property="workPermitNo" label="作业申请单号" width="180" />
+ <el-table-column property="applyUname" label="申请人" />
+ <el-table-column property="operatorCompanys" label="施工单位" />
+ <el-table-column property="operatorUnames" label="作业人" />
+ <el-table-column property="workTypeDesc" label="作业类型" />
+ <el-table-column property="workLevelDesc" label="作业等级" />
+ <el-table-column property="applyTime" label="申请时间" width="180" />
+ <el-table-column label="申请状态" align="center" width="180">
+ <template slot-scope="scope">
+ <el-tag :type="scope.row.status==2?'success':(scope.row.status==8||scope.row.status==9)?'warning':'danger'">{{ scope.row.statusDesc }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column fixed="right" label="操作" align="center" width="250">
+ <template slot-scope="scope">
+ <el-button link type="text" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="text" @click="viewStatus(scope.row)">进度</el-button>
+ <el-button link type="text" @click="deleteRecordBtn(scope.row)">取消</el-button>
+ <el-button :disabled="scope.row.status == 7 ? false : true" link type="text" @click="downLoadRecord(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]" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize1" @size-change="handleSizeChange1" @current-change="handleCurrentChange1" />
+ </div>
+ </div>
+ </div>
+ </div>
+ <el-dialog :visible.sync="dialogDetails" title="作业申请详情" center>
+ <fire v-if="dialogType == 1" :details = details></fire>
+ <space v-if="dialogType == 2" :details = details></space>
+ <hoist v-if="dialogType == 3" :details = details></hoist>
+ <ground v-if="dialogType == 4" :details = details></ground>
+ <broken v-if="dialogType == 5" :details = details></broken>
+ <height v-if="dialogType == 6" :details = details></height>
+ <power v-if="dialogType == 7" :details = details></power>
+ <plate v-if="dialogType == 8" :details = details></plate>
+ <template #footer>
+ <div class="dialog-footer" align="right">
+ <el-button type="primary" @click="dialogDetails = false"
+ >确认</el-button
+ >
+ </div>
+ </template>
+ </el-dialog>
+ <el-dialog :visible.sync="dialogStatus" title="作业申请进度" width="60%">
+ <el-form style="margin-bottom: 40px">
+ <el-form-item label="作业人" v-if="approveInfo.operatorUnames">
+ <el-input v-model="approveInfo.operatorUnames" readonly type="textarea" />
+ </el-form-item>
+ <el-form-item label="作业人" v-else>
+ <el-input placeholder="无" readonly type="textarea" />
+ </el-form-item>
+ </el-form>
+ <div style="display: flex; flex-direction: column-reverse">
+ <div v-for="(item, index) in approveInfo.approvalSteps" class="stepItem">
+ <div class="stepNum">{{ item.stepSerial }}</div>
+ <div class="stepCard">
+ <el-card class="box-card" shadow="always">
+ <div class="text">
+ 审批结果：<span>{{ item.approvalResultDesc }}</span>
+ </div>
+ <div class="text">
+ 审批层级：<span>{{ item.typeDesc }}</span>
+ </div>
+ <div class="text" v-if="item.auditTypeDesc">
+ 审批类型：<span>{{ item.auditTypeDesc }}</span>
+ </div>
+ <div class="text" v-show="item.startApprovalTime != null">
+ 开始时间：<span>{{ item.startApprovalTime }}</span>
+ </div>
+ <div class="approveUnit">
+ <div class="item-tit"><span>审批人</span><span>审批状态</span></div>
+ <div class="item-cont" v-for="i in item.stepUnits">
+ <span>{{ i.approvalUname }}</span
+ ><span>{{ i.resultDesc }}</span>
+ </div>
+ </div>
+ <div class="approveItem" v-if="item.stepItems && item.stepItems.length>0">
+ <div class="item-tit">
+ <span>审批项目</span>
+<!-- <span>类型</span>-->
+ <div>措施标准</div>
+ </div>
+ <div class="item-cont" v-for="i in item.stepItems">
+ <span>{{ i.itemName }}</span>
+<!-- <span>{{ i.typeDesc }}</span>-->
+ <div v-if="i.measure">
+ <div>
+ <span>作业类型：</span><span>{{ i.measure.workTypeDesc }}</span>
+ </div>
+ <div>
+ <span>措施内容：</span><span>{{ i.measure.context }}</span>
+ </div>
+ </div>
+ <div v-if="i.stand">
+ <div>
+ <span>标题名称：</span><span>{{ i.stand.title }}</span>
+ </div>
+ <div>
+ <span>标准内容：</span><span>{{ i.stand.typeDesc }}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="text" v-show="item.expFinishApprovalTime != null">
+ 期望结束时间：<span>{{ item.expFinishApprovalTime }}</span>
+ </div>
+ <div class="text" v-show="item.finishApprovalTime != null">
+ 结束时间：<span>{{ item.finishApprovalTime }}</span>
+ </div>
+ </el-card>
+ </div>
+ </div>
+ </div>
+ </el-dialog>
+ <el-dialog :visible.sync="deleteDialog" title="提示" width="30%" center>
+ <span>您确定要取消该条申请吗？</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+<!-- </el-tab-pane>-->
+<!-- <el-tab-pane label="已通过" name="2">-->
+<!-- <div style="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-table ref="multipleTableRef" :data="passedData" style="width: 100%" height="calc(100% - 48px)" :header-cell-style="{ background: '#fafafa' }" @selection-change="handleSelectionChange">-->
+<!-- <el-table-column type="selection" width="55" />-->
+<!-- <el-table-column type="index" label="编号" width="200" />-->
+<!-- <el-table-column property="level" label="作业证等级" width="180" sortable />-->
+<!-- <el-table-column property="applyDate" label="申请日期" sortable />-->
+<!-- <el-table-column property="name" label="申请人" width="180" />-->
+<!-- <el-table-column property="department" label="申请部门" width="180" />-->
+<!-- <el-table-column label="申请状态" width="180">-->
+<!-- <template slot-scope="scope">-->
+<!-- <el-tag type="success">{{ scope.row.status }}</el-tag>-->
+<!-- </template>-->
+<!-- </el-table-column>-->
+<!-- </el-table>-->
+<!-- <div class="pageBtn">-->
+<!-- <el-pagination v-model:currentPage="pageIndex2" v-model:page-size="pageSize2" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize2" @size-change="handleSizeChange2" @current-change="handleCurrentChange2" />-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </el-tab-pane>-->
+<!-- </el-tabs>-->
+ </div>
</template>
<script>
-export default {
- name: "index"
-}
+import fire from './components/fireLog'
+import space from './components/spaceLog'
+import hoist from './components/hoistLog'
+import broken from './components/groundLog'
+import ground from './components/brokenLog'
+import height from './components/heightLog'
+import power from './components/powerLog'
+import plate from './components/plateLog'
+import {workApplyApi} from "../../../../api/workApply";
+import Cookies from 'js-cookie';
+import axios from 'axios';
+export default{
+ name: 'myApply',
+ components: {
+ fire,
+ space,
+ hoist,
+ ground,
+ broken,
+ height,
+ power,
+ plate
+ },
+ data(){
+ return{
+ pageIndex1: 1,
+ pageSize1: 10,
+ totalSize1: 0,
+ dialogType: null,
+ activeName: '1',
+ departmentList: [],
+ departmentRecursionList: [],
+ chosenIndex: null,
+ searchWord: '',
+ applyData: [],
+ workTimeList: [],
+ multipleSelection: [],
+ approveInfo: {
+ approvalSteps: [],
+ operators: []
+ },
+ dialogDetails: false,
+ dialogStatus: false,
+ deleteDialog: false,
+ addRecord: {},
+ details: {},
+ statusInfo: {},
+ deleteId: null,
+ deleteArr: [],
+ 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: '盲板抽堵作业' }
+ ]
+ }
+ },
+ created(){
+ this.getListByPage()
+ },
+ methods:{
+ async getListByPage() {
+ const data = { pageSize: this.pageSize1, pageIndex: this.pageIndex1, searchParams: { workType: this.searchWord } };
+ let res = await workApplyApi().getApplyListPage(data);
+ if (res.data.code === '200') {
+ this.applyData = JSON.parse(JSON.stringify(res.data.data));
+ this.applyData = this.applyData.map((item) => {
+ if (item.operators == null || item.operators == []) {
+ item.operators = [];
+ } else {
+ item.operators = Array.from(item.operators, ({ operatorUname }) => operatorUname);
+ }
+ return item;
+ });
+ this.totalSize1 = res.data.total;
+ } else {
+ this.$message({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ },
+
+ 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 < this.workTimeList.length; t++) {
+ if (row.list[i] == this.workTimeList[t].id) {
+ nameList.push(this.workTimeList[t].name);
+ }
+ }
+ }
+ return nameList.join();
+ }
+ },
+
+ reLoadData() {
+ this.getListByPage();
+ },
+
+ // 导出方法
+ downLoadRecord(row) {
+ if(row.status == 7){
+ axios.post(process.env.BASE_API + `/work/apply/printing`,{applyWorkId: row.workApplyId},{headers:{'Content-Type': 'application/json','Authorization': `${Cookies.get('token')}`},responseType: 'blob'}).then(res=>{
+ if (res) {
+ const link = document.createElement('a')
+ let blob = new Blob([res.data],{type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'})
+ link.style.display = "none";
+ link.href = URL.createObjectURL(blob); // 创建URL
+ link.setAttribute("download", row.workTypeDesc + row.workPermitNo + "作业证.docx");
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ } else {
+ this.$message({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ })
+ }else{
+ this.$message({
+ type: 'warning',
+ message: '该作业申请未完成审批流程，不可导出'
+ });
+ }
+ },
+
+ // 填写表单
+ toApply() {
+ this.$router.push({
+ path: 'workApply'
+ });
+ },
+
+ handleClick(tab, event) {
+ console.log(tab, event);
+ },
+
+ recursion(value) {
+ for (let i of value) {
+ if (i.children.length !== 0) {
+ this.departmentRecursionList.push(i);
+ this.recursion(i.children);
+ } else {
+ this.departmentRecursionList.push(i);
+ }
+ }
+ },
+
+ searchRecord() {
+ if (this.searchWord == '') {
+ this.$message({
+ type: 'warning',
+ message: '请输入查询关键词'
+ });
+ } else {
+ this.getListByPage();
+ }
+ },
+
+ clearSearch() {
+ this.searchWord = '';
+ this.getListByPage();
+ },
+
+ viewStatus(row) {
+ this.getStatus({ workApplyId: row.workApplyId });
+ this.dialogStatus = true;
+ },
+
+ async getStatus (data) {
+ let res = await workApplyApi().getStatus(data);
+ if (res.data.code === '200') {
+ this.approveInfo = JSON.parse(JSON.stringify(res.data.data));
+ // this.approveInfo.operators = this.approveInfo.operators.map(item => {
+ // return item.operatorUname
+ // }).join('、')
+ } else {
+ this.$message({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ },
+
+ deleteRecordBtn(row) {
+ this.deleteId = row.workApplyId;
+ this.deleteDialog = true;
+ },
+
+ async deleteRecord(data) {
+ let res = await workApplyApi().cancelApply(data);
+ if (res.data.code === '200') {
+ this.$message({
+ type: 'success',
+ message: res.data.msg
+ });
+ await this.getListByPage();
+ } else {
+ this.$message({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ },
+
+ conFirmDelete() {
+ this.deleteRecord({ workApplyId: this.deleteId });
+ this.deleteDialog = false;
+ },
+
+ viewRecord(row) {
+ this.dialogType = row.workType
+ this.details = JSON.parse(JSON.stringify(row));
+ this.details.operators = this.details.operators.join('、')
+ // if(!this.details.workDetail.otherSpecialWork || this.details.workDetail.otherSpecialWork == ''){
+ // this.details.workDetail.otherSpecialWork = ''
+ // }
+ // else {
+ // const a = this.details.workDetail.otherSpecialWork
+ // this.details.workDetail.otherSpecialWork = a.split(',').map((item) => {
+ // return this.workType.find((i) => i.id === Number(item)).name;
+ // }).join('、');
+ // }
+ if(this.details.workDetail.involvedDepIds == '' || !this.details.workDetail.involvedDepIds){
+ this.details.workDetail.involvedDepIds = ''
+ }
+ else {
+ const a = this.details.workDetail.involvedDepIds
+ this.details.workDetail.involvedDepIds = a.split(',').map((item) => {
+ return this.departmentRecursionList.find((i) => i.depId === Number(item)).depName;
+ }).join('、');
+ }
+ if(this.details.workDetail.gbPath){
+ this.details.workDetail.gbPath = this.details.workDetail.gbPath.split(',')
+ }
+ if(this.details.workDetail.bcPath){
+ this.details.workDetail.bcPath = this.details.workDetail.bcPath.split(',')
+ }
+ if(this.details.workDetail.bpLocationMapPath){
+ this.details.workDetail.bpLocationMapPath = this.details.workDetail.bpLocationMapPath.split(',')
+ }
+ this.dialogDetails = true;
+ },
+
+ handleSizeChange1(val) {
+ this.pageSize1 = val;
+ this.getListByPage();
+ },
+
+
+ handleCurrentChange1(val) {
+ this.pageIndex1 = val;
+ this.getListByPage();
+ }
+ },
+};
</script>
-<style scoped>
+<style scoped lang="scss">
+$homeNavLengh: 8;
+.home-container {
+ height: calc(100vh - 144px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .demo-tabs {
+ width: 100%;
+ height: 100%;
+ //&::v-deep(.el-tabs__content) {
+ // height: calc(100% - 60px);
+ //}
+
+ .el-tab-pane {
+ height: 100%;
+ }
+ }
+ .homeCard {
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card {
+ width: 100%;
+ height: 100%;
+ .cardTop {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn {
+ margin: 0;
+ }
+ }
+ .pageBtn {
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type {
+ height: calc(100% - 100px);
+ }
+ }
+ .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%;
+
+ .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;
+ }
+ }
+ }
+ }
+ }
+ &:hover .card-header {
+ color: #0098f5;
+ }
+ &:hover .stepNum {
+ border: 2px solid #0098f5;
+ color: #0098f5;
+ }
+ }
+ .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;
+ }
+ }
+ }
+ .el-card {
+ border: 0;
+ }
+}
</style>
--
Gitblit v1.9.2