1<template> 2 <span> 3 <b-link 4 v-if="value === 'export'" 5 class="align-bottom btn-icon-only py-0 btn-link" 6 :download="download" 7 :href="href" 8 :title="title" 9 > 10 <slot name="icon"> 11 {{ $t('global.action.export') }} 12 </slot> 13 <span v-if="btnIconOnly" class="sr-only">{{ title }}</span> 14 </b-link> 15 <b-link 16 v-else-if=" 17 value === 'download' && downloadInNewTab && downloadLocation !== '' 18 " 19 class="align-bottom btn-icon-only py-0 btn-link" 20 target="_blank" 21 :href="downloadLocation" 22 :title="title" 23 > 24 <slot name="icon" /> 25 <span class="sr-only"> 26 {{ $t('global.action.download') }} 27 </span> 28 </b-link> 29 <b-link 30 v-else-if="value === 'download' && downloadLocation !== ''" 31 class="align-bottom btn-icon-only py-0 btn-link" 32 :download="exportName" 33 :href="downloadLocation" 34 :title="title" 35 > 36 <slot name="icon" /> 37 <span class="sr-only"> 38 {{ $t('global.action.download') }} 39 </span> 40 </b-link> 41 <b-button 42 v-else-if="showButton" 43 variant="link" 44 :class="{ 'btn-icon-only': btnIconOnly }" 45 :disabled="!enabled" 46 :title="btnIconOnly ? title : !title" 47 @click="$emit('click-table-action', value)" 48 > 49 <slot name="icon"> 50 {{ title }} 51 </slot> 52 <span v-if="btnIconOnly" class="sr-only">{{ title }}</span> 53 </b-button> 54 </span> 55</template> 56 57<script> 58import { omit } from 'lodash'; 59 60export default { 61 name: 'TableRowAction', 62 props: { 63 value: { 64 type: String, 65 required: true, 66 }, 67 enabled: { 68 type: Boolean, 69 default: true, 70 }, 71 title: { 72 type: String, 73 default: null, 74 }, 75 rowData: { 76 type: Object, 77 default: () => {}, 78 }, 79 exportName: { 80 type: String, 81 default: 'export', 82 }, 83 downloadLocation: { 84 type: String, 85 default: '', 86 }, 87 btnIconOnly: { 88 type: Boolean, 89 default: true, 90 }, 91 downloadInNewTab: { 92 type: Boolean, 93 default: false, 94 }, 95 showButton: { 96 type: Boolean, 97 default: true, 98 }, 99 }, 100 computed: { 101 dataForExport() { 102 return JSON.stringify(omit(this.rowData, 'actions')); 103 }, 104 download() { 105 return `${this.exportName}.json`; 106 }, 107 href() { 108 return `data:text/json;charset=utf-8,${this.dataForExport}`; 109 }, 110 }, 111}; 112</script> 113