<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;
              }
            });
          });
        })
        .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 = [];
          }
        } 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>
