From 91ccfa3ebdc7a68b6f632c3e59757ec03b15ac1f Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: 星期五, 02 九月 2022 15:15:01 +0800
Subject: [PATCH] lct

---
 src/views/specialWorkManage/workTicket/myApproval/index.vue |  691 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 686 insertions(+), 5 deletions(-)

diff --git a/src/views/specialWorkManage/workTicket/myApproval/index.vue b/src/views/specialWorkManage/workTicket/myApproval/index.vue
index 34cd1a0..2c3510c 100644
--- a/src/views/specialWorkManage/workTicket/myApproval/index.vue
+++ b/src/views/specialWorkManage/workTicket/myApproval/index.vue
@@ -1,13 +1,694 @@
 <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="12" class="mainCardBtn">
+<!--                                    <el-button type="primary" :icon="Plus" 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-button type="primary" @click="reLoadData()" />-->
+                            </el-row>
+                            <el-table ref="multipleTableRef" :data="applyData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }">
+                                <el-table-column property="applyUname" label="申请人" />
+                                <el-table-column property="depName" label="部门名称" />
+                                <el-table-column property="operators" 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 type="text" @click="viewRecord(scope.row)">查看</el-button>
+                                        <el-button type="text" @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>
+                            </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 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="dialogStatus" title="作业审批进度" center width="60%">
+                    <el-form v-if="approveInfo.operators.length > 0" style="margin-bottom: 40px">
+                        <el-form-item label="申请作业人">
+                            <el-input v-model="approveInfo.operators" 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-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>
+                    <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 ground from './components/groundLog'
+import broken from './components/brokenLog'
+import height from './components/heightLog'
+import power from './components/powerLog'
+import plate from './components/plateLog'
+import {getDepartmentList} from "../../../../api/departmentManage";
+import {workApprovalApi} from "../../../../api/workApproval";
+
+export default{
+    name: 'myApproval',
+    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: '盲板抽堵作业' }
+            ],
+        }
+    },
+    methods:{
+        async getListByPage() {
+            const data = { pageSize: this.pageSize1, pageIndex: this.pageIndex1, searchParams: { workType: this.searchWord } };
+            let res = await workApprovalApi().getApprovalListPage(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
+                });
+            }
+        },
+
+        reLoadData() {
+            this.getListByPage();
+        },
+
+        toApply() {
+            this.$router.push({
+                path: 'workApply'
+            });
+        },
+
+        handleClick(tab, event) {
+            console.log(tab, event);
+        },
+
+        async getAllDepartment() {
+            let res = await getDepartmentList({pageSize:1000,pageIndex:1})
+            if(res.data.code === '200'){
+                this.departmentList = res.data.result.result
+                this.recursion(this.departmentList);
+            }else{
+                this.$message({
+                    message:res.data.message,
+                    type:'warning'
+                })
+            }
+        },
+
+        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 workApprovalApi().getApprovalStatus(data);
+            if (res.data.code === '200') {
+                this.approveInfo = JSON.parse(JSON.stringify(res.data.data));
+                this.approveInfo.operators = Array.from(this.approveInfo.operators, ({ operatorUname }) => operatorUname);
+            } else {
+                this.$message({
+                    type: 'warning',
+                    message: res.data.msg
+                });
+            }
+        },
+
+        deleteRecordBtn(row) {
+            this.deleteId = row.workApplyId;
+            this.deleteDialog = true;
+        },
+
+        async deleteRecord(data) {
+            let res = await workApprovalApi().postAbord(data);
+            if (res.data.code === '200') {
+                this.$message({
+                    type: 'success',
+                    message: res.data.msg
+                });
+                this.getListByPage();
+            } else {
+                this.$message({
+                    type: 'warning',
+                    message: res.data.msg
+                });
+            }
+        },
+
+        conFirmDelete() {
+            this.deleteRecord({ workApplyId: this.deleteId });
+            this.deleteDialog = false;
+        },
+
+        handleSizeChange1(val) {
+            this.pageSize1 = val;
+            this.getListByPage();
+        },
+
+        handleCurrentChange1(val) {
+            this.pageIndex1 = val;
+            this.getListByPage();
+        },
+
+        // 查看记录
+        viewRecord(row) {
+            this.dialogType = row.workType
+            this.details = JSON.parse(JSON.stringify(row));
+            // getApprovalData(this.details.workApplyId)
+            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('、');
+            }
+            this.dialogDetails = true;
+        },
+
+    },
+
+};
 </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