web/src/components/work-desktop/CommonUse.vue

<template>
  <div class="work-common">
    <div class="common-title">
      <span>常用功能</span>
      <span class="set"><i class="icon-set"></i> 设置</span>
    </div>
  </div>
</template>

<script>
// import { Popover } from 'element-ui'
export default {
  name: 'work-common',
  computed: {},
  components: {
    // [Popover.name]: Popover
  },
  data () {
    return {

    }
  },
  created () {},
  mounted () {},
  methods: {
  }
}
</script>

<style lang="scss" scoped>
.work-common{
  margin-top: 20px;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0px 0px 18px 0px rgba(0,0,0,0.02);
  .common-title{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    font-size: 18px;
    color: #1d1d1d;
    line-height: 28px;
    &::after{
      position: absolute;
      content: '';
      width: 3px;
      height: 24px;
      background: #2cb7ca;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
    }
    .set{
      display: flex;
      align-items: center;
      color: #2cb7ca;
      font-size: 14px;
      cursor: pointer;
    }
    .icon-set{
      display: inline-block;
      width: 18px;
      height: 18px;
      margin-right: 6px;
      background: url('~@/assets/images/icon/icon-set.png') no-repeat center center;
      background-size: contain;
    }
  }
}
</style>