Я пытаюсь скрыть действие для пользователей без прав администратора. Я использую data-table
, чтобы сделать это. Вот мой код:
<v-data-table
dense
:headers = "stampedDocumentsHeaders"
:items = "filterCutOffAllDocs"
:search = "searchAllDoc"
loading-text = "Loading... Please wait">
<template v-slot:body = "{items}">
<tbody>
<tr v-if = "filterCutOffAllDocs.length == 0">
<td colspan = "8" style = "text-align:center;color:#808080;font-size:18px;padding:10px">NO DATA TO SHOW</td>
</tr>
<tr v-else v-for = "(item, i) in items" :key = "i">
<td style = "text-align:center">{{item.document_control_code}}</td>
<td style = "text-align:center">{{item.document_title}}</td>
<td style = "text-align:center">{{item.request_type}}</td>
<td style = "text-align:center">{{item.nature_of_request}}</td>
<td style = "text-align:center">{{item.status}}</td>
<td style = "text-align:center">{{item.s_date}}</td>
<td style = "text-align:center">{{item.StamperName}}</td>
</tr>
</tbody>
</template>
</v-data-table>
Вот заголовок в моих данных:
headersData: [
{ text: "Code", value: "document_control_code" },
{ text: "Request Type", value: "request_type"} ,
{ text: "Title", value: "document_title" },
{ text: "department", value: "department" },
{ text: "Request Date", value: "request_date" },
{ text: "Due Date", value: "due_date" },
{ text: "Action", value: "action" },
]
Это должно работать так:
data() {
return {
headersData: [
{ text: "Code", value: "document_control_code" },
{ text: "Request Type", value: "request_type"} ,
{ text: "Title", value: "document_title" },
{ text: "department", value: "department" },
{ text: "Request Date", value: "request_date" },
{ text: "Due Date", value: "due_date" },
]
}
},
и в смонтированном ()
mounted() {
if (admin) {
this.headersData.push({ text: "Action", value: "action" });
}
}
Этот работает! Я также обнаружил, что им можно манипулировать с вычисляемым свойством. Большое спасибо за ваш ответ.