workerManInfowindow.vue 1.16 KB
Newer Older
纪泽龙's avatar
纪泽龙 committed
1 2
<template>
  <div class="wrapper">
纪泽龙's avatar
纪泽龙 committed
3
    <div class="content">
4
      <span class="left">姓名: {{ data.nickName }}</span>
纪泽龙's avatar
纪泽龙 committed
5 6 7 8
      <span class="right">时间: {{ data.createTime }}</span>
    </div>

    <div class=""></div>
纪泽龙's avatar
纪泽龙 committed
9 10 11 12
  </div>
</template>

<script>
纪泽龙's avatar
纪泽龙 committed
13
export default {
纪泽龙's avatar
纪泽龙 committed
14 15 16 17 18 19
  props: {
    data: {
      type: Object,
    },
  },
  created() {
纪泽龙's avatar
纪泽龙 committed
20
    // console.log("data", this.data);
纪泽龙's avatar
纪泽龙 committed
21 22
  },
};
纪泽龙's avatar
纪泽龙 committed
23 24 25
</script>

<style  lang="scss" scoped>
纪泽龙's avatar
纪泽龙 committed
26 27
.wrapper {
  // width: 166px;
纪泽龙's avatar
纪泽龙 committed
28
  height: 54px;
29 30 31
  // background: #0d4f88;
  background: rgba(7, 29, 51, 0.9);

纪泽龙's avatar
纪泽龙 committed
32
  font-size: 14px;
纪泽龙's avatar
纪泽龙 committed
33
  color: #fff;
纪泽龙's avatar
纪泽龙 committed
34
  box-sizing: border-box;
纪泽龙's avatar
纪泽龙 committed
35 36
  padding: 7px 7px 7px 8px;
  box-shadow: 0 0 20px -5px #0d4f88;
纪泽龙's avatar
纪泽龙 committed
37
  border-radius: 4px;
纪泽龙's avatar
纪泽龙 committed
38 39 40 41 42 43 44 45 46 47 48 49
  position: relative;
  &:before {
    content: "";
    position: absolute;
    left: -10px;
    top: 5px;
    width: 0px;
    height: 0px;
    /* border: 20px solid red; */
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    /* border-left: 50px solid greenyellow; */
50 51 52
    border-right: 30px solid rgba(7, 29, 51, 0.9);
    box-shadow: 0 0 20px -5px #0d4f88;

纪泽龙's avatar
纪泽龙 committed
53 54 55 56 57 58 59
    z-index: -1;
  }
  .content {
    span {
      word-break: break-all;
      display: block;
    }
纪泽龙's avatar
纪泽龙 committed
60 61 62
  }
}
</style>