wxservice-web/src/views/hospital-service/shareholder/ShareholdersEquity.vue

<template>
  <window-size class="gdbj">
    <div v-for="(val, catagory) in benefits">
      <div class="catagory-title">
        {{catagory}}
      </div>
      <div v-for="item in val">
        <div class="catagory-item">
          {{item.label}}
        </div>
      </div>
    </div>
  </window-size>
</template>

<script setup>

const benefits = {
  '◆ 门诊福利': [
    { id: 1001, label: '专享挂号费2元', url: '' },
    { id: 1002, label: '知名专家挂号费5折', url: '' },
    { id: 1003, label: '门诊B超、CT、核磁8折', url: '' },
    { id: 1004, label: '中药95折', url: '' },
    { id: 1005, label: '康复理疗8折', url: '' },
    { id: 1006, label: '口腔免费拍片', url: '' },
    { id: 1007, label: '种植牙减免1000元', url: '' },
    { id: 1008, label: '视光配镜7折', url: '' },
    { id: 1009, label: '产检、产后康复套餐8折', url: '' },
  ],
  '◆ 体检福利': [
    { id: 2001, label: '体检5折', url: '' },
    { id: 2002, label: '股东亲友6折', url: '' },
  ],
  '◆ 住院福利': [
    { id: 3001, label: '住院包', url: '' },
    { id: 3002, label: '入院绿色通道', url: '' },
    { id: 3003, label: '免费陪诊服务', url: '' },
    { id: 3004, label: '工会福利', url: '' },
  ]
}

</script>

<style scoped>
.gdbj {
  background-image: url('https://staticweb.hnthyy.cn/images/gdbj.jpg');
  background-repeat: no-repeat;
  background-size: 100% 100%
}

.catagory-title {
  background-color: #343434;
  color: #ffc85a;
  font-size: 18px;
  font-weight: bold;
  line-height: 36px;
  padding-left: 12px;
}

.catagory-item {
  padding-left: 28px;
  line-height: 30px;
  font-size: 16px;
  font-weight: bold;
}
</style>