<template>
    <div>
        
        <!-- 头部标签 -->
        <van-sticky>
            <header class="header-wrap">
                首开集团安全风险和隐患排查治理体系
                <van-icon
                    :name="require('../../assets/sq.png')"
                    class="iconColorRight"
                    size="0.5rem"
                    @click="$router.push('/scan')"
                />
            </header>
        </van-sticky>
        <!-- 内容 -->
        <div class="con">
            <!-- 风控分级管控 -->
            <van-cell-group inset v-if="finalRiskList.length > 0">
                <van-cell value="风险分级管控" />
                <van-grid :column-num="5">
                    <van-grid-item
                        @click="riskJump(item.path)"
                        v-for="item in finalRiskList"
                        :key="item.key"
                        :icon="item.imgUrl"
                        :text="item.text"
                    />
                </van-grid>
            </van-cell-group>

            <!-- 隐患排查治理 -->
            <van-cell-group inset v-if="finalDangerList.length > 0">
                <van-cell value="隐患排查治理" />
                <van-grid :column-num="5">
                    <van-grid-item
                        @click="dangerJump(item.path)"
                        v-for="item in finalDangerList"
                        :key="item.key"
                        :icon="item.imgUrl"
                        :text="item.text"
                    />
                </van-grid>
            </van-cell-group>

            <!-- 安全监督检查 -->
            <van-cell-group inset v-if="finalSafetyCheckList.length > 0">
                <van-cell value="安全监督检查" />
                <van-grid :column-num="5">
                    <van-grid-item
                        @click="jump(item.path)"
                        v-for="item in finalSafetyCheckList"
                        :key="item.key"
                        :icon="item.imgUrl"
                        :text="item.text"
                    />
                </van-grid>
            </van-cell-group>

            <!-- 教育培训签到 -->
            <van-cell-group inset v-if="finalSafeEducationList.length > 0">
                <van-cell value="教育培训签到" />
                <van-grid :column-num="5">
                    <van-grid-item
                        @click="jump(item.path)"
                        v-for="item in finalSafeEducationList"
                        :key="item.key"
                        :icon="item.imgUrl"
                        :text="item.text"
                    />
                </van-grid>
            </van-cell-group>

             <!-- 预警提醒记录 -->
            <van-cell-group inset v-if="finalAlertReminderRecord.length > 0">
                <van-cell value="预警提醒记录" />
                <van-grid :column-num="5">
                    <van-grid-item
                        @click="jump(item.path)"
                        v-for="item in finalAlertReminderRecord"
                        :key="item.key"
                        :icon="item.imgUrl"
                        :text="item.text"
                    />
                </van-grid>
            </van-cell-group>
        </div>

        <!-- tanBar -->
        <tab-bar :index="1"></tab-bar>
    </div>
</template>

<script>
let scan = null;
import tabBar from "@/components/TabBar";
import { postWork } from "@/service/workbench";
export default {
    components: {
        tabBar,
    },
    data() {
        return {
            searchVal: "",
            newsCenterList: [
                // 消息中心的图标
                {
                    key: "1",
                    imgUrl: require("@/assets/workbench/notice.png"),
                    text: "通知公告",
                },
                {
                    key: "2",
                    imgUrl: require("@/assets/workbench/wait-do.png"),
                    text: "待办事项",
                },
                {
                    key: "3",
                    imgUrl: require("@/assets/workbench/news.png"),
                    text: "消息提醒",
                },
                {
                    key: "4",
                    imgUrl: require("@/assets/workbench/set-up.png"),
                    text: "我的设置",
                },
            ],
            riskList: [
                // 风控分级管控
                {
                    key: "1",
                    path: "/risk-add",
                    imgUrl: require("@/assets/workbench/risk-report.png"),
                    text: "风险上报",
                },
                {
                    key: "12",
                    // path: "/danger",
                    path: "/insert-risk",
                    imgUrl: require("@/assets/workbench/risk-confirm.png"),
                    text: "我的上报",
                },
                {
                    key: "3",
                    path: "/risk-confirme",
                    imgUrl: require("@/assets/workbench/risk-confirm.png"),
                    text: "风险确认",
                },
                {
                    key: "4",
                    path: "/risk-account",
                    imgUrl: require("@/assets/workbench/risk-account.png"),
                    text: "风险台账",
                },
            ],
            dangerList: [
                // 隐患排查治理
                {
                    key: "1",
                    // path: "/danger",
                    path: "/add-danger",
                    imgUrl: require("@/assets/workbench/danger-report.png"),
                    text: "隐患上报",
                },
                {
                    key: "11",
                    // path: "/danger",
                    path: "/insert-danger",
                    imgUrl: require("@/assets/workbench/risk-confirm.png"),
                    text: "我的上报",
                },
                {
                    key: "3",
                    path: "/confirme-danger",
                    imgUrl: require("@/assets/workbench/danger-confirm.png"),
                    text: "隐患确认",
                },
                {
                    key: "4",
                    path: "/change-danger",
                    imgUrl: require("@/assets/workbench/danger-rectification.png"),
                    text: "隐患整改",
                },
                {
                    key: "5",
                    path: "/review-danger",
                    imgUrl: require("@/assets/workbench/danger-acceptance.png"),
                    text: "隐患复查",
                },
                {
                    key: "6",
                    path: "/stand-book",
                    imgUrl: require("@/assets/workbench/danger-account.png"),
                    text: "隐患台账",
                },
                {
                    key: "7",
                    path: "/major-danger",
                    imgUrl: require("@/assets/workbench/retification-acceptance.png"),
                    text: "重大隐患",
                },
                {
                    key: "8",
                    path: "/delay-approval",
                    imgUrl: require("@/assets/workbench/inspect-plane.png"),
                    text: "延期审批",
                },
                {
                    key: "9",
                    path: "/supervise-danger",
                    imgUrl: require("@/assets/workbench/retification-acceptance.png"),
                    text: "企业级督办",
                },
                {
                    key: "10",
                    path: "/manager-danger",
                    imgUrl: require("@/assets/workbench/inspect-plane.png"),
                    text: "项目级督办",
                },
                {
                    key: "12",
                    path: "/my-delay",
                    imgUrl: require("@/assets/workbench/inspect-plane.png"),
                    text: "我的延期",
                },
            ],
            safetyCheckList: [
                // 安全监督检查
                {
                    key: "1",
                    path: "",
                    imgUrl: require("@/assets/workbench/inspect-plane.png"),
                    text: "检查计划",
                },
                {
                    key: "2",
                    path: "",
                    imgUrl: require("@/assets/workbench/plane-approval.png"),
                    text: "计划审批",
                },
                {
                    key: "3",
                    path: "/checked",
                    imgUrl: require("@/assets/workbench/check-implement.png"),
                    text: "检查执行",
                },
                {
                    key: "4",
                    path: "/notice",
                    imgUrl: require("@/assets/workbench/rectification-notice.png"),
                    text: "整改通知",
                },
                {
                    key: "5",
                    path: "",
                    imgUrl: require("@/assets/workbench/issue-rectification.png"),
                    text: "问题整改",
                },
                {
                    key: "6",
                    path: "/correct",
                    imgUrl: require("@/assets/workbench/retification-acceptance.png"),
                    text: "整改验收",
                },
                {
                    key: "7",
                    path: "",
                    imgUrl: require("@/assets/workbench/ehcek-record.png"),
                    text: "检查记录",
                },
                {
                    key: "8",
                    path: "/checked-confirm",
                    imgUrl: require("@/assets/workbench/ehcek-record.png"),
                    text: "整改确认",
                }
            ],
            safeEducationList:[
                 // 安全教育培训
                 {
                    key: "1",
                    path: "/scan",
                    imgUrl: require("@/assets/workbench/inspect-plane.png"),
                    text: "培训签到",
                },
            ],
            alertReminderRecord:[
                 // 预警提醒记录
                {
                    key: "1",
                    path: "/warning",
                    imgUrl: require("@/assets/workbench/warn-tip.png"),
                    text: "预警提醒",
                },   
                {
                    key: "2",
                    path: "/warningNote",
                    imgUrl: require("@/assets/workbench/warn-record.png"),
                    text: "预警记录",
                },
            ],

            // 后台给的数据权限对象
            powerObj: {},

            finalNewsCenterList: [],
            finalRiskList: [],
            finalDangerList: [],
            finalSafetyCheckList: [],
            finalSafeEducationList: [],
            finalAlertReminderRecord: []
        };
    },
    created() {
        //  根据权限显示对应的图标
        this.getWorkList();
    },
    async mounted() {
        // await this.startRecognize();
        // await this.startScan();
    },
    methods: {
        myClick(data) {},
        jump(path) {
            if (path) {
                this.$router.push(path);
            }
        },
        dangerJump(path) {
            if (path) {
                if(path=='/add-danger'){
                    sessionStorage.removeItem('obj')
                    this.$router.push({name:'add-danger',params:{isWorkbenchTo:1}});
                }else{
                    this.$router.push(path);
                }
            }
        },
        riskJump(path) {
            if (path) {
                this.$router.push(path);
            }
        },
        // 搜索事件
        onSearch(val) {
            this.postList(this.searchValue);
        },
        // 请求工作台列表
        getWorkList() {
            postWork("/mobile/menu").then((res) => {
                if (res.code == 0) {
                    this.powerObj = res.data;
                    if (this.powerObj.风险分级管控) {
                        // 对两个数组进行比较 拿到需要的数据 赋值给新数组 （赋值给新数组是为了解决页面闪屏问题）
                        this.finalRiskList = [...this.riskList].filter((x) =>
                            [...this.powerObj.风险分级管控].some(
                                (y) => y.menuName === x.text
                            )
                        );

                        // 如果有隐患上报权限 则在添加一个 上报退回的权限
                        this.powerObj.风险分级管控.map((item) => {
                            if (item.menuName == "风险上报") {
                                let obj = {
                                    key: "2",
                                    path: "/risk-return",
                                    imgUrl: require("@/assets/workbench/plane-approval.png"),
                                    text: "上报退回",
                                };
                                this.finalRiskList.splice(1, 0, obj);
                            }
                        });
                    } else {
                        this.finalRiskList = [];
                    }
                    // 隐患排查治理
                    if (this.powerObj.隐患排查治理) {
                        this.finalDangerList = [...this.dangerList].filter(
                            (x) =>
                                [...this.powerObj.隐患排查治理].some(
                                    (y) => y.menuName === x.text
                                )
                        );
                        // 如果有隐患上报权限 则在添加一个 上报退回的权限
                        this.powerObj.隐患排查治理.map((item) => {
                            if (item.menuName == "隐患上报") {
                                let obj = {
                                    key: "2",
                                    path: "/report-return",
                                    imgUrl: require("@/assets/workbench/rectification-notice.png"),
                                    text: "上报退回",
                                };
                                this.finalDangerList.splice(1, 0, obj);

                                 // 先加上个隐患巡查
                                let obj2 = {
                                    key: "13",
                                    path: "/danger-patrol",
                                    imgUrl: require("@/assets/workbench/danger-account.png"),
                                    text: "隐患巡查",
                                };
                                this.finalDangerList.splice(1, 0, obj2);
                            }
                        });
                    } else {
                        this.finalDangerList = [];
                    }
                    // this.finalDangerList  = this.dangerList
                    // 安全监督检查
                    if (this.powerObj.安全监督检查) {
                        this.finalSafetyCheckList = [
                            ...this.safetyCheckList,
                        ].filter((x) =>
                            [...this.powerObj.安全监督检查].some(
                                (y) => y.menuName === x.text
                            )
                        );
                    } else {
                        this.finalSafetyCheckList = [];
                    }

                    // 安全教育培训
                    if (this.powerObj.安全教育培训) {
                        this.finalSafeEducationList = [
                            ...this.safeEducationList,
                        ].filter((x) =>
                            [...this.powerObj.安全教育培训].some(
                                (y) => y.menuName === x.text
                            )
                        );
                    } else {
                        this.finalSafetyCheckList = [];
                    }
                    
                    // 预警提醒记录 
                    if (this.powerObj.预警提醒记录) {
                        this.finalAlertReminderRecord = [
                            ...this.alertReminderRecord,
                        ].filter((x) =>
                            [...this.powerObj.预警提醒记录].some(
                                (y) => y.menuName === x.text
                            )
                        );
                    } else {
                        this.finalAlertReminderRecord = [];
                    }

                    // 消息
                    this.finalNewsCenterList = this.newsCenterList;
                } else {
                    this.powerObj = [];
                }
            });
        },
    }
};
</script>
<style lang="less" scoped>
/* @import url(); 引入css类 */
.header-wrap {
    width: 100%;
    height: 50px;
    background-color: #2980f7;
    font-size: 17px;
    line-height: 50px;
    color: white;
    font-weight: none;
    text-align: center;
}
.con {
    // height: calc(100% - 110px);
    // height: 100%;
    padding: 10px 0 50px 0;
    background-color: #f0f1f5;
    /deep/ .van-grid-item__content--center {
        // padding-left: 0px;
        // padding-right: 0px;
        padding: 0.22667rem 0px;
    }
    /deep/ .van-icon__image {
        width: auto;
        height: 1rem;
    }
}
.van-cell-group--inset {
    margin: 0 10px 10px;
}
/deep/ .van-cell::after {
    border: none;
}
/deep/ [class*="van-hairline"]::after {
    border: none;
}
.notice-swipe {
    height: 40px;
    line-height: 40px;
}
header .iconColorRight {
    color: white;
    float: right;
    position: relative;
    top: 32%;
    right: 5%;
    transform: scale(2);
    .van-icon__image {
        width: 0.35rem;
        height: 0.35rem;
    }
}
</style>
