-
Notifications
You must be signed in to change notification settings - Fork 66
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into docs-device-agent
- Loading branch information
Showing
28 changed files
with
1,478 additions
and
302 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
File renamed without changes
67 changes: 67 additions & 0 deletions
67
frontend/src/pages/team/Broker/components/BrokerAclRule.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,67 @@ | ||
| <template> | ||
| <div class="acl-rule grid grid-cols-6 gap-4"> | ||
| <div class="action col-start-2 flex gap-2.5"> | ||
| <span :class="pubClass" data-el="pub"> | ||
| <CheckIcon v-if="canPublish" class="ff-icon-sm" /> | ||
| <XIcon v-else class="ff-icon-sm" /> | ||
| pub | ||
| </span> | ||
| <span :class="subClass" data-el="sub"> | ||
| <CheckIcon v-if="canSubscribe" class="ff-icon-sm" /> | ||
| <XIcon v-else class="ff-icon-sm" /> | ||
| sub | ||
| </span> | ||
| </div> | ||
| <div class="pattern"> | ||
| {{ acl.pattern }} | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script> | ||
| import { CheckIcon, XIcon } from '@heroicons/vue/outline' | ||
| export default { | ||
| name: 'BrokerAclRule', | ||
| components: { | ||
| CheckIcon, | ||
| XIcon | ||
| }, | ||
| props: { | ||
| acl: { | ||
| required: true, | ||
| type: Object | ||
| } | ||
| }, | ||
| computed: { | ||
| canPublish () { | ||
| return ['publish', 'both'].includes(this.acl.action) | ||
| }, | ||
| canOnlyPublish () { | ||
| return ['publish'].includes(this.acl.action) | ||
| }, | ||
| canSubscribe () { | ||
| return ['subscribe', 'both'].includes(this.acl.action) | ||
| }, | ||
| canOnlySubscribe () { | ||
| return ['subscribe'].includes(this.acl.action) | ||
| }, | ||
| pubClass () { | ||
| return { | ||
| 'text-green-500': this.canPublish, | ||
| 'text-red-500': this.canOnlySubscribe | ||
| } | ||
| }, | ||
| subClass () { | ||
| return { | ||
| 'text-green-500': this.canSubscribe, | ||
| 'text-red-500': this.canOnlyPublish | ||
| } | ||
| } | ||
| } | ||
| } | ||
| </script> | ||
|
|
||
| <style scoped lang="scss"> | ||
| </style> |
177 changes: 177 additions & 0 deletions
177
frontend/src/pages/team/Broker/components/BrokerClient.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,177 @@ | ||
| <template> | ||
| <ff-accordion class="max-w-full w-full broker-client"> | ||
| <template #label> | ||
| <div class="username text-left flex"> | ||
| <text-copier :text="client.username + '@' + team.id" confirmation-type="alert" @click.prevent.stop> | ||
| <span :title="client.username + '@' + team.id" class="title-wrapper"> | ||
| <span class="mt-1 font-bold">{{ client.username }}</span> | ||
| <span class="italic mt-1">@{{ team.id }}</span> | ||
| </span> | ||
| </text-copier> | ||
| </div> | ||
| <div class="rules text-left"> | ||
| <span>{{ client.acls.length }} Rule{{ client.acls.length > 1 ? 's' : '' }}</span> | ||
| </div> | ||
| </template> | ||
| <template #meta> | ||
| <span | ||
| class="edit hover:cursor-pointer" | ||
| data-action="edit-client" | ||
| @click.prevent.stop="$emit('edit-client', client)" | ||
| > | ||
| <PencilIcon | ||
| v-if="hasAMinimumTeamRoleOf(Roles.Owner)" | ||
| class="ff-icon-sm" | ||
| /> | ||
| </span> | ||
| <span | ||
| class="delete hover:cursor-pointer " | ||
| data-action="delete-client" | ||
| @click.prevent.stop="$emit('delete-client',client)" | ||
| > | ||
| <TrashIcon | ||
| v-if="hasAMinimumTeamRoleOf(Roles.Owner)" | ||
| class="ff-icon-sm text-red-500" | ||
| /> | ||
| </span> | ||
| </template> | ||
| <template #content> | ||
| <ul class="acl-list"> | ||
| <li v-for="(acl, $key) in client.acls" :key="$key" class="acl-wrapper" data-el="acl"> | ||
| <BrokerAclRule :acl="acl" /> | ||
| </li> | ||
| </ul> | ||
| </template> | ||
| </ff-accordion> | ||
| </template> | ||
|
|
||
| <script> | ||
| import { PencilIcon, TrashIcon } from '@heroicons/vue/outline' | ||
| import FfAccordion from '../../../../components/Accordion.vue' | ||
| import TextCopier from '../../../../components/TextCopier.vue' | ||
| import permissionsMixin from '../../../../mixins/Permissions.js' | ||
| import { Roles } from '../../../../utils/roles.js' | ||
| import BrokerAclRule from './BrokerAclRule.vue' | ||
| export default { | ||
| name: 'BrokerClient', | ||
| components: { | ||
| BrokerAclRule, | ||
| TextCopier, | ||
| PencilIcon, | ||
| FfAccordion, | ||
| TrashIcon | ||
| }, | ||
| mixins: [permissionsMixin], | ||
| props: { | ||
| client: { | ||
| required: true, | ||
| type: Object | ||
| } | ||
| }, | ||
| emits: ['edit-client', 'delete-client'], | ||
| computed: { | ||
| Roles () { | ||
| return Roles | ||
| } | ||
| } | ||
| } | ||
| </script> | ||
|
|
||
| <style lang="scss"> | ||
| .ff-accordion.broker-client { | ||
| margin-bottom: 0; | ||
| button { | ||
| border: none; | ||
| background: none; | ||
| display: grid; | ||
| grid-template-columns: repeat(6, 1fr); | ||
| gap: 15px; | ||
| padding: 0; | ||
| .username { | ||
| padding: 15px 10px; | ||
| grid-column: span 2; | ||
| overflow: hidden; | ||
| .ff-text-copier { | ||
| @include truncate; | ||
| & > span { | ||
| @include truncate; | ||
| } | ||
| .title-wrapper { | ||
| @include truncate; | ||
| } | ||
| } | ||
| .ff-icon { | ||
| margin-left: 0; | ||
| min-width: 20px; | ||
| } | ||
| } | ||
| .rules { | ||
| padding: 15px 10px; | ||
| } | ||
| .toggle { | ||
| grid-column: span 3; | ||
| text-align: right; | ||
| padding-right: 10px; | ||
| display: flex; | ||
| align-items: center; | ||
| justify-content: flex-end; | ||
| .edit, .delete { | ||
| padding: 24px 15px; | ||
| display: inline-block; | ||
| position: relative; | ||
| align-self: stretch; | ||
| .ff-icon-sm { | ||
| position: absolute; | ||
| top: 50%; | ||
| left: 50%; | ||
| transform: translate(-50%, -50%); | ||
| transition: ease-in-out .3s; | ||
| } | ||
| &:hover { | ||
| .ff-icon-sm { | ||
| width: 20px; | ||
| height: 20px; | ||
| } | ||
| } | ||
| } | ||
| .edit:hover { | ||
| color: $ff-grey-700; | ||
| } | ||
| .delete:hover { | ||
| color: $ff-red-700; | ||
| } | ||
| } | ||
| } | ||
| .ff-accordion--content { | ||
| background: $ff-grey-100; | ||
| .acl-list { | ||
| .acl-wrapper { | ||
| border-bottom: 1px solid $ff-grey-200; | ||
| padding: 15px 10px; | ||
| gap: 10px; | ||
| font-size: 80%; | ||
| &:last-of-type { | ||
| border: none; | ||
| } | ||
| } | ||
| } | ||
| } | ||
| } | ||
| </style> |
Oops, something went wrong.