<template>
  <div>
    <!-- 头部标签 -->
    <van-sticky>
      <header class="header-wrap">
        办公控制台
      </header>
    </van-sticky>
    <van-notice-bar left-icon="volume-o" :scrollable="true" color="#a09c9c" background="#D5EAFF">
      <van-swipe class="notice-swipe" :show-indicators="false" width="100vw">
        <van-swipe-item>危险源系统正式上线</van-swipe-item>
        <van-swipe-item>汛期安全防护会议计划本周日召开</van-swipe-item>
      </van-swipe>
    </van-notice-bar>
    <van-swipe :autoplay="6000">
      <van-swipe-item v-for="(item, index) in images" :key="index">
        <img style="width:100%;height:200px" :src="item.url" />
      </van-swipe-item>
    </van-swipe>
    <div class="con">
      <van-cell-group inset v-if="finalRiskList.length > 0">
        <van-cell value="风险评估管理" />
        <van-grid :column-num="4">
          <van-grid-item @click="dangerJump(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-for="(item, index) in riskList" :key="index">
                  <van-cell :value="item.menuName" />
                  <van-grid :column-num="5">
                  <van-grid-item
                      @click="dangerJump(it.path)"
                      v-for="it in item.children"
                      :key="it.key"
                      :icon="it.icon"
                      :text="it.menuName"
                  />
                  </van-grid>
          </van-cell-group> -->
    </div>
    <!-- tanBar -->
    <tab-bar :index="1"></tab-bar>
  </div>
</template>

<script>
import tabBar from "@/components/TabBar";
import { getFun, postFun } from '@/service/table'
export default {
  components: {
    tabBar
  },
  data() {
    return {
      value: '',
      /** 
       *  总公司：任务台账；
       *  区域负责人：任务管理，任务审批，任务台账
       *  评估负责人： 执行管理，风险评估，任务审批，任务台账
       *  组员： 风险评估，任务台账
       */
      riskList2: [
        {
          path: "/taskLedger",
          imgUrl: require("@/assets/workbench/work-approval.png"),
          text: "任务台账",
        },
        {
          path: "/riskManage",
          imgUrl: require("@/assets/workbench/risk-report.png"),
          text: "任务管理",
        },
        {
          path: "/taskManage",
          imgUrl: require("@/assets/workbench/plane-approval.png"),
          text: "任务审批",
        },
        {
          path: "/riskExecution",
          imgUrl: require("@/assets/workbench/rectification-notice.png"),
          text: "执行管理",
        },
        {
          path: "/riskAssess",
          imgUrl: require("@/assets/workbench/risk-confirm.png"),
          text: "风险评估",
        },

        {
          path: "/riskApprove",
          imgUrl: require("@/assets/workbench/risk-account.png"),
          text: "风险审批",
        },
        {
          path: "/riskLedger",
          imgUrl: require("@/assets/workbench/danger-account.png"),
          text: "风险台账",
        },
        // {
        //     path: "/riskView",
        //     imgUrl: require("@/assets/workbench/quarter_record.png"),
        //     text: "四色图",
        // },
      ],
      riskList: [ {
          key:"1",
          path: "/taskLedger",
          imgUrl: require("@/assets/workbench/work-approval.png"),
          text: "任务台账",
        },
        {
          key:"2",
          path: "/riskManage",
          imgUrl: require("@/assets/workbench/risk-report.png"),
          text: "任务管理",
        },
        {
          key:"3",
          path: "/taskManage",
          imgUrl: require("@/assets/workbench/plane-approval.png"),
          text: "任务审批",
        },
        {
          key:"4",
          path: "/riskExecution",
          imgUrl: require("@/assets/workbench/rectification-notice.png"),
          text: "执行管理",
        },
        {
          key:"5",
          path: "/riskAssess",
          imgUrl: require("@/assets/workbench/risk-confirm.png"),
          text: "风险评估",
        },

        {
          key:"6",
          path: "/riskApprove",
          imgUrl: require("@/assets/workbench/risk-account.png"),
          text: "风险审批",
        },
        {
          key:"7",
          path: "/riskLedger",
          imgUrl: require("@/assets/workbench/danger-account.png"),
          text: "风险台账",
        },],
      finalRiskList:[],
      images: [
        {
          url: require('@/assets/workbench/u47.png'),
        },
        {
          url: require('@/assets/workbench/u51.png'),
        },
        {
          url: require('@/assets/workbench/u55.png'),
        },
      ]
    };
  },
  created() {

  },
  mounted() {
    // this.getMenuList();
    this.workBenchList();
  },
  methods: {

    //查询角色菜单列表
    getMenuList() {
      getFun('/menu/roleMenuTreeselect').then((res) => {
        this.riskList = res.list
        this.riskList.forEach((item, index) => {
          item.children.forEach((i, k) => {
            let data = this.riskList2.find((y) => y.text == i.menuName)
            if (data) {
              i.icon = data.imgUrl
            }
          })
        });
        console.log('this.riskList==>>', this.riskList)
      }).catch((err) => {
        console.log('err==>>', err)
      })
    },
    workBenchList() {
      getFun(`/menu/getMenu`).then(res => {
        if (res.code == 200) {
          this.powerObj = res.data;
          if (this.powerObj.风险评估管理) {
            this.finalRiskList = [
              ...this.riskList
            ].filter((x) =>
              [...this.powerObj.风险评估管理].some(
                (y) => (`/${y.path}`) == x.path
              )
            );
          } else {
            this.finalRiskList = [];
          }
          console.log(this.finalRiskList)
        } else {
          this.powerObj = {}
        }

      });
    },
    onSearch() {

    },
    createdClick() {
      this.$router.push('/create-task')
    },
    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);
        }
      }
    },
  }
};
</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;
  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;
  }
}

.notice-swipe {
  height: 40px;
  line-height: 40px;
  color: #a09c9c;
}

.van-swipe-item {
  width: 100%;
}

.my-swipe .van-swipe-item {
  width: 100%;
  height: 300px;

  img {
    width: 100%;
    height: 100%;
  }
}
</style>
