| | |
| | | <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="success" size="small" :icon="View" @click="viewStatus(scope.row)">进度</el-button> |
| | | <el-button link type="success" size="small" :icon="Finished" @click="viewStatus(scope.row)">进度</el-button> |
| | | <el-button link type="warning" size="small" :icon="Delete" @click="deleteRecordBtn(scope.row)">取消</el-button> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业内容"> |
| | | <el-input |
| | | v-model="details.workContent" |
| | | readonly |
| | | type="textarea" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业地址"> |
| | | <el-input |
| | | v-model="details.workLocation" |
| | | readonly |
| | | type="textarea" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业方式"> |
| | | <el-input |
| | | v-model="details.workDetail.hotMethod" |
| | | readonly |
| | | type="textarea" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="关联其他作业"> |
| | | <el-input |
| | | v-model="details.workDetail.otherSpecialWork" |
| | | readonly |
| | | type="textarea" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="期望开始时间"> |
| | | <el-input |
| | | v-model="details.expStartTime" |
| | |
| | | </el-form> |
| | | </el-dialog> |
| | | <el-dialog v-model="dialogStatus" title="作业申请进度"> |
| | | <el-form :model="statusInfo" label-width="120px"> |
| | | <el-form-item label="作业申请单号"> |
| | | <el-form v-if="approveInfo.operators.length>0" style="margin-bottom: 40px"> |
| | | <el-form-item label="申请作业人"> |
| | | <el-input |
| | | v-model="details.workPermitNo" |
| | | v-model="approveInfo.operators" |
| | | readonly |
| | | type="textarea" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="申请人"> |
| | | <el-input |
| | | v-model="details.applyUname" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="部门名称"> |
| | | <el-input |
| | | v-model="details.depName" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业人"> |
| | | <el-input |
| | | v-model="details.operators" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业类型"> |
| | | <el-input |
| | | v-model="details.workTypeDesc" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="作业等级"> |
| | | <el-input |
| | | v-model="details.workLevelDesc" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="期望开始时间"> |
| | | <el-input |
| | | v-model="details.expStartTime" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="期望结束时间"> |
| | | <el-input |
| | | v-model="details.expEndTime" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="申请时间"> |
| | | <el-input |
| | | v-model="details.applyTime" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="当前状态"> |
| | | <el-input |
| | | v-model="details.statusDesc" |
| | | readonly |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button> |
| | | </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-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"> |
| | | <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 !== null"> |
| | | <div><span>作业类型:</span><span>{{i.measure.workTypeDesc}}</span></div> |
| | | <div><span>措施内容:</span><span>{{i.measure.context}}</span></div> |
| | | </div> |
| | | <div v-if="i.stand !== null"> |
| | | <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 v-model="deleteDialog" title="提示" width="30%" center @close="indexClear"> |
| | | <span>您确定要取消该条申请吗?</span> |
| | |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, ref, onMounted } from 'vue'; |
| | | import { toRefs, reactive, defineComponent, ref, onMounted } from 'vue'; |
| | | import { storeToRefs } from 'pinia'; |
| | | import { initBackEndControlRoutes } from '/@/router/backEnd'; |
| | | import { useUserInfo } from '/@/stores/userInfo'; |
| | | import { Session } from '/@/utils/storage'; |
| | | import { useRouter } from 'vue-router'; |
| | | import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'; |
| | | import { Edit, View, Plus, Delete, Refresh, Search, Finished } from '@element-plus/icons-vue'; |
| | | import { ElTable } from 'element-plus'; |
| | | import { FormInstance, FormRules, ElMessage } from 'element-plus'; |
| | | import { workApplyApi } from '/@/api/specialWorkSystem/workApply'; |
| | |
| | | workTimeList: Array<string>; |
| | | multipleSelection: Array<any>; |
| | | deleteArr: Array<any>; |
| | | approveInfo: Object; |
| | | dialogDetails: boolean; |
| | | dialogStatus: boolean; |
| | | deleteDialog: boolean; |
| | |
| | | statusInfo:{} |
| | | } |
| | | |
| | | export default { |
| | | export default defineComponent({ |
| | | name: 'myApply', |
| | | components: {}, |
| | | setup() { |
| | |
| | | applyData: [], |
| | | workTimeList: [], |
| | | multipleSelection: [], |
| | | approveInfo: { |
| | | approvalSteps:[], |
| | | operators: [] |
| | | }, |
| | | dialogDetails: false, |
| | | dialogStatus: false, |
| | | deleteDialog: false, |
| | |
| | | list: []; |
| | | info: string; |
| | | } |
| | | |
| | | // 页面载入时执行方法 |
| | | onMounted(() => { |
| | | getListByPage(); |
| | | }); |
| | | |
| | | // 刷新 |
| | | const reLoadData = async () => { |
| | |
| | | return item; |
| | | }); |
| | | state.totalSize1 = res.data.total |
| | | console.log('0212121') |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | |
| | | const getStatus = async (data: any) => { |
| | | let res = await workApplyApi().getStatus(data); |
| | | if (res.data.code === '200') { |
| | | state.statusInfo = JSON.parse(JSON.stringify(res.data.data)) |
| | | console.log(state.statusInfo,'info') |
| | | state.approveInfo = JSON.parse(JSON.stringify(res.data.data)) |
| | | state.approveInfo.operators = Array.from(state.approveInfo.operators, ({ operatorUname }) => operatorUname); |
| | | console.log(state.approveInfo,'steps') |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | |
| | | // 查看记录 |
| | | const viewRecord = (row) => { |
| | | state.details = JSON.parse(JSON.stringify(row)); |
| | | state.details.workDetail.otherSpecialWork = state.details.workDetail.otherSpecialWork.split(',') |
| | | if(state.details.workDetail.otherSpecialWork == null || state.details.workDetail.otherSpecialWork == []){state.details.workDetail.otherSpecialWork = []} |
| | | else{ |
| | | state.details.workDetail.otherSpecialWork.map(item =>{ |
| | | console.log(item,'item') |
| | | if(item == '1'){ |
| | | item = '动火作业' |
| | | return item |
| | | } else if(item == '2'){ |
| | | item = '受限空间作业' |
| | | return item |
| | | } else if(item == '3'){ |
| | | item = '吊装作业' |
| | | return item |
| | | } else if(item == '4'){ |
| | | item = '动土作业' |
| | | return item |
| | | } else if(item == '5'){ |
| | | item = '断路作业' |
| | | return item |
| | | } else if(item == '6'){ |
| | | item = '高处作业' |
| | | return item |
| | | } else if(item == '7'){ |
| | | item = '临时用电作业' |
| | | return item |
| | | } else { |
| | | item = '盲板抽堵作业' |
| | | return item |
| | | } |
| | | }) |
| | | } |
| | | console.log(state.details.workDetail.otherSpecialWork,'666666') |
| | | state.dialogDetails = true; |
| | | }; |
| | | |
| | |
| | | userInfos.value.projectId = value; |
| | | await initBackEndControlRoutes(); |
| | | }; |
| | | |
| | | // 页面载入时执行方法 |
| | | onMounted(() => { |
| | | getListByPage(); |
| | | }); |
| | | |
| | | return { |
| | | View, |
| | | Edit, |
| | | Delete, |
| | | Refresh, |
| | | Plus, |
| | | Finished, |
| | | reLoadData, |
| | | toApply, |
| | | handleClick, |
| | |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | |
| | | 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; |
| | | } |
| | | &>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: 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: center; |
| | | span{ |
| | | width: 45%; |
| | | &:first-of-type{ |
| | | width: 30%; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | &: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; |
| | |
| | | } |
| | | } |
| | | } |
| | | .el-card{ |
| | | border: 0; |
| | | } |
| | | } |
| | | </style> |