<!-- -->
<template>
  <div
    :class="{
      footer: true,
      isChStyle: navbarStyle == '2',
      isRedStyle: navbarStyle == '3',
      isSDCS: navbarStyle == '4',
      isSMGZ: navbarStyle == '5',
      isJYYCC: navbarStyle == '6',
      isYLGDYW: navbarStyle == '7',
    }"
  >
    <span>贵州省文化和旅游厅博物馆处版权所有</span>
    <span>中国知网提供技术支持</span>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "Footer",
  computed: {
    ...mapGetters(["curPath", "navbarStyle"]),
  },
  curPath: {
    handler: function (value) {
      if (value.params.themeType) {
        this.$store.commit("app/CHANGE_NAV_COLOR", value.params.themeType);
      } else {
        this.$store.commit("app/CHANGE_NAV_COLOR", "1");
      }
    },
    immediate: true,
  },
};
</script>

<style lang="scss" scoped>
.footer {
  display: flex;
  height: 200px;
  padding: 0 24px;
  justify-content: center;
  align-items: center;
  background-color: #2069c4;
  color: #fff;
  // position: fixed;
  // bottom: 0;
  // left: 0;
  // right: 0;

  span {
    margin-right: 16px;
  }
}

.isChStyle {
  background-color: #892325 !important;
}
.isRedStyle {
  background-color: #a30e0c !important;
}

.isSDCS {
  background-color: #6c0c0d !important;
}

.isSMGZ {
  background-color: #00173a !important;
}

.isJYYCC {
  background-color: #343b66 !important;
}

.isYLGDYW {
  background-color: #212040 !important;
}
</style>
