headerCommon.vue 1.1 KB
<template>
  <div class="headercommon">
    <h3>丹阳停车运营监控中心</h3>
    <div class="time-wrap">
      <p>{{timedate}}</p>
      <p>{{time}}</p>
    </div>
  </div>
</template>

<script>
import { getNowFormatDate, getNowFormatTime } from '../utils/formatetime'
export default {
  name: 'HelloWorld',
  created() {
  },
  data() {
    return {
      timedate: getNowFormatDate(),
      time: getNowFormatTime()
    }
  }
}
</script>


<style scoped>
  .headercommon {
    width: 100%;
    height: 77px;
    position: relative;

  }
  .headercommon h3{
    width: 1200px;
    margin: 0 auto;
    line-height: 77px;
    background: url("../assets/img/headerbg.svg") no-repeat center center;
    /*background: #f00;*/
    font-size: 27px;
    text-align: center;
    font-weight:800;
    color:rgba(255,255,255,1);
  }
  .time-wrap{
    position: absolute;
    right: 12px;
    top:20px;
    padding-left: 44px;
    background: url("../assets/img/time-wrap.png") no-repeat 0 center;
    text-align: left;
    font-size:16px;
    font-weight:400;
    color:rgba(255,255,255,1);
    line-height:18px;
  }
</style>