AttributeList.vue 668 B

12345678910111213141516171819202122232425262728293031
  1. <template>
  2. <div>
  3. <template v-for="attr in data.attrs" :key="attr.field">
  4. <div class="attr" v-if="!attrField || attrField == attr.field">
  5. {{attr.name}}{{data[attr.field] || 0}}
  6. </div>
  7. </template>
  8. </div>
  9. </template>
  10. <script setup>
  11. let props = defineProps({
  12. data:{type:Object,require: true},
  13. attrField:{type:String,require: true},
  14. })
  15. </script>
  16. <style lang="scss" scoped>
  17. .attr{
  18. background-color: #FFFFFF50;
  19. color: #0E3836;
  20. font-weight: 600;
  21. height: 29px;
  22. border-radius: 10px;
  23. line-height: 19px;
  24. text-align: right;
  25. margin: 5px 5px 0px 0px;
  26. padding: 5px;
  27. box-sizing: border-box;
  28. }
  29. </style>