github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-02-12 20:25:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

script[setup]: system-scope (#18406)

Browse Source
This commit is contained in:
Rijk van Zanten
2023-05-02 17:24:37 -04:00
committed by GitHub
parent e01702a2ac
commit daf509061b
1 changed files with 102 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

212
app/src/interfaces/_system/system-scope/system-scope.vue
View File

@@ -12,122 +12,114 @@
</div>
</template>
<script lang="ts">
import { useI18n } from 'vue-i18n';
import { computed, defineComponent, ref, watch } from 'vue';
import DrawerCollection from '@/views/private/components/drawer-collection.vue';
<script setup lang="ts">
import api from '@/api';
import { userName } from '@/utils/user-name';
import { unexpectedError } from '@/utils/unexpected-error';
import { userName } from '@/utils/user-name';
import DrawerCollection from '@/views/private/components/drawer-collection.vue';
import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n';
export default defineComponent({
components: {
DrawerCollection,
},
props: {
value: {
type: String,
default: null,
const props = defineProps<{
value: string | null;
}>();
const emit = defineEmits<{
(e: 'input', value: string | null): void;
}>();
const { t } = useI18n();
const collection = ref<string | null>(null);
const itemName = ref<string | null>(null);
const loading = ref(false);
const isItem = computed(
() => props.value !== null && (props.value.startsWith('role_') || props.value.startsWith('user_'))
);
watch(() => props.value, loadItemName);
loadItemName();
const options = computed(() => {
let options: any[] = [
{
text: t('global') + ': ' + t('all_users'),
value: 'all',
},
},
emits: ['input'],
setup(props, { emit }) {
const { t } = useI18n();
{
text: t('user') + ': ' + t('select'),
value: 'directus_users',
},
{
text: t('role') + ': ' + t('select'),
value: 'directus_roles',
},
];
const collection = ref<string | null>(null);
const itemName = ref<string | null>(null);
const loading = ref(false);
if (isItem.value) {
const [type, id] = props.value.split('_');
const isItem = computed(
() => props.value !== null && (props.value.startsWith('role_') || props.value.startsWith('user_'))
);
options = [
{
text: t(type) + ': ' + (itemName.value || id),
value: props.value,
},
{ divider: true },
...options,
];
}
watch(() => props.value, loadItemName);
loadItemName();
const options = computed(() => {
let options: any[] = [
{
text: t('global') + ': ' + t('all_users'),
value: 'all',
},
{
text: t('user') + ': ' + t('select'),
value: 'directus_users',
},
{
text: t('role') + ': ' + t('select'),
value: 'directus_roles',
},
];
if (isItem.value) {
const [type, id] = props.value.split('_');
options = [
{
text: t(type) + ': ' + (itemName.value || id),
value: props.value,
},
{ divider: true },
...options,
];
}
return options;
});
return { options, collection, onSelect, onSelectItem, loading };
function onSelect(value: string) {
if (value === 'all') {
collection.value = null;
return emit('input', 'all');
}
collection.value = value;
}
function onSelectItem(value: string[]) {
if (collection.value === 'directus_users') return emit('input', 'user_' + value[0]);
if (collection.value === 'directus_roles') return emit('input', 'role_' + value[0]);
}
async function loadItemName() {
if (!isItem.value) {
itemName.value = null;
return;
}
loading.value = true;
const [endpoint, id] = props.value.split('_');
try {
if (endpoint === 'role') {
const result = await api.get('/roles/' + id, {
params: {
fields: ['id', 'name'],
},
});
itemName.value = result.data.data.name;
} else if (endpoint === 'user') {
const result = await api.get('/users/' + id, {
params: {
fields: ['id', 'first_name', 'last_name', 'email'],
},
});
itemName.value = userName(result.data.data);
}
} catch (error: any) {
unexpectedError(error);
} finally {
loading.value = false;
}
}
},
return options;
});
function onSelect(value: string) {
if (value === 'all') {
collection.value = null;
return emit('input', 'all');
}
collection.value = value;
}
function onSelectItem(value: string[]) {
if (collection.value === 'directus_users') return emit('input', 'user_' + value[0]);
if (collection.value === 'directus_roles') return emit('input', 'role_' + value[0]);
}
async function loadItemName() {
if (!isItem.value) {
itemName.value = null;
return;
}
loading.value = true;
const [endpoint, id] = props.value.split('_');
try {
if (endpoint === 'role') {
const result = await api.get('/roles/' + id, {
params: {
fields: ['id', 'name'],
},
});
itemName.value = result.data.data.name;
} else if (endpoint === 'user') {
const result = await api.get('/users/' + id, {
params: {
fields: ['id', 'first_name', 'last_name', 'email'],
},
});
itemName.value = userName(result.data.data);
}
} catch (error: any) {
unexpectedError(error);
} finally {
loading.value = false;
}
}
</script>