zz-gw/components/Footer.vue

<template>
  <div id="lxfs">
    <footer class="site-footer">
      <div class="site-footer__upper">
        <div class="container">
          <div class="row">
            <div class="col-lg-3">
              <div class="footer-widget footer-widget__about">
                <img
                  src="/assets/images/resources/logo-dark.png"
                  width="119"
                  alt=""
                  class="footer-widget__logo"
                />
                <p class="footer-widget__contact">联系电话</p>
                <p class="footer-widget__contact">
                  <a href="tel:400-661-7777">400-661-7777</a>
                </p>
                <!-- /.footer-widget__contact -->
              </div>
              <!-- /.footer-widget -->
            </div>
            <!-- /.col-lg-2 -->
            <div
              class="col-lg-6 d-flex justify-content-between footer-widget__links-wrap"
            >
              <div class="footer-widget">
                <h3 class="footer-widget__title">上班时间</h3>
                <!-- /.footer-widget__title -->
                <ul class="footer-widget__links list-unstyled">
                  <li>周一 - 周五</li>
                  <li>9:00 - 18:00</li>
                </ul>
                <!-- /.footer-widget__links -->
              </div>
              <!-- /.footer-widget -->
              <div class="footer-widget">
                <h3 class="footer-widget__title">公司地址</h3>
                <!-- /.footer-widget__title -->
                <ul class="footer-widget__links list-unstyled">
                  <li>福建省福州高新区乌龙江中大道7#</li>
                  <li>创新园二期20号楼16层</li>
                </ul>
                <!-- /.footer-widget__links -->
              </div>
              <!-- /.footer-widget -->
            </div>
            <!-- /.col-lg-6 -->
          </div>
          <!-- /.row -->
        </div>
        <!-- /.container -->
      </div>
      <!-- /.site-footer__upper -->
      <div class="site-footer__bottom">
        <div class="container">
          <div class="inner-container text-center">
            <p>
              &copy;
              <a href="https://www.miit.gov.cn/" style="color: black;"
                >闽ICP备2021003467号-1</a
              >
            </p>
            <!-- /.site-footer__copy -->
          </div>
          <!-- /.inner-container -->
        </div>
        <!-- /.container -->
      </div>
      <!-- /.site-footer__bottom -->
    </footer>

    <a href="#" data-target="html" class="scroll-to-target scroll-to-top"
      ><i class="fa fa-angle-up"></i
    ></a>
  </div>
</template>

<script>
export default {
  name: "Footer",
  mounted() {
    $(window).on("scroll", function() {
      if ($(".scroll-to-top").length) {
        var strickyScrollPos = 100;
        if ($(window).scrollTop() > strickyScrollPos) {
          $(".scroll-to-top").fadeIn(500);
        } else if ($(this).scrollTop() <= strickyScrollPos) {
          $(".scroll-to-top").fadeOut(500);
        }
      }
    });
  }
};
</script>

<style scoped></style>