<!-- e:\JavaProject\DCS\dcs\src\components\dcs\EqFooter.vue -->
<template>
  <div class="eqData_footer">
    <div class="flex-row">
      <div class="flex-col items-center self-start" v-hasPermi="['dcs:eqHome:index']" @click="$router.push({name: 'eqHome'})">
        <img class="footer_image" :src="footTab1">
        <span class="footTab_text">主页</span>
      </div>
      <div class="flex-col items-center self-start" v-hasPermi="['dcs:eqData:index']" @click="$router.push({name: 'eqDataTable'})">
        <img class="footer_image" :src="footTab2">
        <span class="footTab_text">数据</span>
      </div>
      <div class="flex-col items-center self-start" v-hasPermi="['dcs:eqSetting:index']" @click="$router.push({name: 'eqSetting'})">
        <img class="footer_image" :src="footTab3">
        <span class="footTab_text">设置</span>
      </div>
    </div>
  </div>
</template>

<script>
import config from '@/myConfig/config';
import footTab1 from '@/assets/dcs/eqName/footTab1.svg'; // 主页图标
import footTab2 from '@/assets/dcs/eqName/footTab2.svg'; // 设备图标
import footTab3 from '@/assets/dcs/eqName/footTab3.svg'; // 控制图标

export default {
  name: 'EqFooter',
  data() {
    return {
      footTab1, // 主页图标
      footTab2, // 设备图标
      footTab3, // 控制图标
    };
  },
};
</script>

<style scoped lang="scss">
.eqData_footer {
      background-image: url('~@/assets/dcs/eqName/footTab.svg');
      background-size: 100% 100%;
      background-repeat: no-repeat;
      background-position: bottom;
      margin: 48px auto 0;
      ;
      display: flex;
      /* 使用flex布局 */
      justify-content: center;
      /* 水平居中对齐子元素 */
      width: 961.5px;
      height: 52px;
      flex-shrink: 0;

      .footer_image {
          width: 157px;
          height: 58px;
          margin-top: -31px;
      }

      .footTab_text {
          font-size: 14.08px;
          font-family: PingFang SC;
          line-height: 12.96px;
          color: #ffffff;
      }

  }

</style>
