@windward/integrations 0.0.1

package/pages/admin/importCourse.vue

@@ -0,0 +1,390 @@
+<template>
+    <div>
+        <v-tabs v-model="tab" class="mb-5">
+            <v-tabs-slider></v-tabs-slider>
+
+            <v-tab>
+                {{ $t('windward.integrations.pages.import_course.title') }}
+            </v-tab>
+
+            <v-tab>
+                {{
+                    $t(
+                        'windward.integrations.components.integration.job.recent_jobs_title'
+                    )
+                }}
+            </v-tab>
+        </v-tabs>
+        <v-tabs-items v-model="tab">
+            <v-tab-item>
+                <h1>
+                    {{ $t('windward.integrations.pages.import_course.title') }}
+                </h1>
+
+                <div v-if="!organizationIntegrations.length">
+                    {{
+                        $t(
+                            'windward.integrations.pages.import_course.no_vendors'
+                        )
+                    }}
+                </div>
+                <div v-if="organizationIntegrations.length">
+                    <v-select
+                        v-model="selected.integrationId"
+                        :items="organizationIntegrations"
+                        :loading="loading.integration"
+                        item-text="vendor.name"
+                        item-value="id"
+                        :label="
+                            $t(
+                                'windward.integrations.pages.import_course.select_vendor'
+                            )
+                        "
+                        @change="onSelectIntegration"
+                    ></v-select>
+
+                    <v-autocomplete
+                        v-model="selected.remoteOrgId"
+                        :items="remoteOrganizations"
+                        :loading="loading.org"
+                        item-value="id"
+                        item-text="name"
+                        :label="
+                            $t(
+                                'windward.integrations.pages.import_course.select_remote_organization'
+                            )
+                        "
+                        :disabled="!selected.integrationId"
+                        @change="onSelectRemoteOrg"
+                    >
+                        <template #selection="{ item }">
+                            {{ item.name }} - ({{ item.base_url }})
+                        </template>
+                        <template #item="{ item }">
+                            {{ item.name }} - ({{ item.base_url }})
+                        </template>
+                    </v-autocomplete>
+
+                    <v-autocomplete
+                        v-model="selected.remoteCourseId"
+                        :items="remoteCourses"
+                        :loading="loading.course"
+                        item-text="name"
+                        item-value="id"
+                        :label="
+                            $t(
+                                'windward.integrations.pages.import_course.select_remote_course'
+                            )
+                        "
+                        :disabled="!selected.remoteOrgId"
+                        @change="onSelectRemoteCourse"
+                    >
+                        <template #selection="{ item }">
+                            {{ item.name }} - ({{
+                                $t(
+                                    'windward.integrations.components.integration.driver.id'
+                                )
+                            }}: {{ item.id }})
+                        </template>
+                        <template #item="{ item }">
+                            {{ item.name }} - ({{
+                                $t(
+                                    'windward.integrations.components.integration.driver.id'
+                                )
+                            }}: {{ item.id }})
+                        </template>
+                    </v-autocomplete>
+
+                    <v-switch
+                        v-model="allowSelectContent"
+                        :label="
+                            $t(
+                                'windward.integrations.pages.import_course.select_remote_content'
+                            )
+                        "
+                        :disabled="!selected.remoteCourseId"
+                        @change="onToggleRemoteContent"
+                    ></v-switch>
+
+                    <v-switch
+                        v-model="sendEmail"
+                        :label="
+                            $t(
+                                'windward.integrations.pages.import_course.notify'
+                            )
+                        "
+                        :disabled="!selected.remoteCourseId"
+                    ></v-switch>
+
+                    <v-btn color="primary" @click="onImport">
+                        {{
+                            $t(
+                                'windward.integrations.pages.import_course.start_import'
+                            )
+                        }}
+                    </v-btn>
+
+                    <v-divider v-if="allowSelectContent" class="mt-5 mb-5" />
+
+                    <v-progress-circular
+                        v-if="allowSelectContent && loading.content"
+                        size="64"
+                        indeterminate
+                    >
+                    </v-progress-circular>
+                    <v-treeview
+                        v-if="allowSelectContent && !loading.content"
+                        v-model="selected.remoteContentIds"
+                        selectable
+                        selected-color="primary"
+                        selection-type="independent"
+                        :items="remoteContent"
+                    >
+                    </v-treeview>
+                </div>
+            </v-tab-item>
+            <v-tab-item>
+                <h1>
+                    {{
+                        $t(
+                            'windward.integrations.components.integration.job.recent_jobs_title'
+                        )
+                    }}
+                </h1>
+                <IntegrationJobTable
+                    ref="integrationJobTable"
+                    :channel="'integrations.organizations.' + organization.id"
+                    :event="'.Windward\\Integrations\\App\\Events\\RemoteCourseImportProgressEvent'"
+                ></IntegrationJobTable>
+            </v-tab-item>
+        </v-tabs-items>
+    </div>
+</template>
+
+<script>
+import _ from 'lodash'
+import { mapGetters } from 'vuex'
+import Course from '~/models/Course'
+import Organization from '../../models/Organization'
+import OrganizationIntegration from '../../models/OrganizationIntegration'
+import RemoteOrganization from '../../models/RemoteOrganization'
+import RemoteCourse from '../../models/RemoteCourse'
+import RemoteContent from '../../models/RemoteContent'
+import IntegrationJobTable from '../../components/Integration/JobTable.vue'
+
+export default {
+    name: 'PluginIntegrationsAdminImportCoursePage',
+    components: { IntegrationJobTable },
+    layout: 'authenticated',
+    meta: {
+        privilege: {
+            'plugin.windward.integrations.course': {
+                writable: true,
+            },
+        },
+    },
+    data() {
+        return {
+            tab: 0,
+            selected: {
+                integrationId: null,
+                remoteOrgId: null,
+                remoteCourseId: null,
+                remoteContentIds: [],
+            },
+            loading: {
+                integration: false,
+                org: false,
+                course: false,
+                content: false,
+            },
+            allowSelectContent: false,
+            organizationIntegrations: [],
+            remoteOrganizations: [],
+            remoteCourses: [],
+            remoteContent: [],
+            // vendorCache used to store remote datasets so rapid switching the <v-select> doesn't poll the api every time
+            vendorCache: {},
+            sendEmail: false,
+        }
+    },
+    async fetch() {
+        this.loading.integration = true
+        this.organizationIntegrations = await new Organization({
+            id: this.organization.id,
+        })
+            .integrations()
+            .with(['vendor'])
+            .where('enabled', true)
+            .get()
+        this.loading.integration = false
+    },
+    computed: {
+        ...mapGetters({
+            organization: 'organization/get',
+        }),
+    },
+    methods: {
+        async onImport() {
+            // Check to see if we're import individual content
+            if (this.selected.remoteContentIds.length) {
+                //
+            }
+
+            this.$dialog.success(
+                this.$t(
+                    'windward.integrations.pages.import_course.import_started'
+                )
+            )
+
+            await new Course({
+                // Name required by model but not actually used on the api
+                name: this.selected.remoteCourseId,
+                remote_content_ids: this.selected.remoteContentIds,
+                options: {
+                    send_email: this.sendEmail,
+                },
+            })
+                .for(
+                    new OrganizationIntegration({
+                        id: this.selected.integrationId,
+                    }),
+                    new RemoteOrganization({
+                        id: this.selected.remoteOrgId,
+                    }),
+                    new RemoteCourse({
+                        id: this.selected.remoteCourseId,
+                    })
+                )
+                .save()
+
+            // If the jobs table is already loaded, force a re-load to catch the new job we just kicked off
+            // This way a users new job will appear instantly so they can see it worked even if it says "not started"
+            if (!_.isEmpty(this.$refs.integrationJobTable)) {
+                this.$refs.integrationJobTable.loadJobs()
+            }
+
+            // Switch to the jobs tab
+            this.tab = 1
+        },
+        async onToggleRemoteContent() {
+            this.loading.content = true
+            if (this.allowSelectContent) {
+                try {
+                    this.remoteContent = await new RemoteContent()
+                        .custom(
+                            new OrganizationIntegration({
+                                id: this.selected.integrationId,
+                            }),
+                            new RemoteOrganization({
+                                id: this.selected.remoteOrgId,
+                            }),
+                            new RemoteCourse({
+                                id: this.selected.remoteCourseId,
+                            }),
+                            new RemoteContent()
+                        )
+                        .get()
+                } catch (e) {
+                    if (e.response.status === 404) {
+                        console.error(e)
+                        this.$dialog.error(
+                            this.$t(
+                                'windward.integrations.shared.error.load_remote_content_failed'
+                            )
+                        )
+                    }
+                }
+            } else {
+                this.remoteContent = []
+                this.selected.remoteContentIds = []
+            }
+            this.loading.content = false
+        },
+        onSelectRemoteCourse() {
+            // Reset the remote content if we change the course
+            this.allowSelectContent = false
+            this.remoteContent = []
+            this.selected.remoteContentIds = []
+        },
+        async onSelectRemoteOrg() {
+            // Clear data since we're changing org
+            this.remoteCourses = []
+            this.remoteContent = []
+            this.selected.remoteCourseId = null
+            this.selected.remoteContentIds = []
+
+            this.loading.course = true
+            try {
+                this.remoteCourses = await new RemoteCourse()
+                    .custom(
+                        new OrganizationIntegration({
+                            id: this.selected.integrationId,
+                        }),
+                        new RemoteOrganization({
+                            id: this.selected.remoteOrgId,
+                        }),
+                        new RemoteCourse()
+                    )
+                    .get()
+            } catch (e) {
+                if (e.response.status === 404) {
+                    console.error(e)
+                    this.$dialog.error(
+                        this.$t(
+                            'windward.integrations.shared.error.load_remote_course_failed'
+                        )
+                    )
+                }
+            }
+            this.loading.course = false
+        },
+        async onSelectIntegration() {
+            this.loading.org = true
+            // Clear out the remote data since we changed vendors
+            this.remoteOrganizations = []
+            this.remoteCourses = []
+            this.remoteContent = []
+
+            this.selected.remoteOrgId = null
+            this.selected.remoteCourseId = null
+            this.selected.remoteContentIds = []
+
+            // Check the vendor cache
+            const cachedOrgs = _.get(
+                this.vendorCache,
+                `${this.selected.integrationId}.remoteOrganizations`,
+                null
+            )
+
+            // Check to see if we already cached the org list for this vendor
+            if (cachedOrgs) {
+                this.remoteOrganizations = cachedOrgs
+            } else {
+                try {
+                    this.remoteOrganizations =
+                        await new OrganizationIntegration({
+                            id: this.selected.integrationId,
+                        })
+                            .remoteOrganizations()
+                            .get()
+
+                    this.vendorCache[this.selected.integrationId] = {
+                        remoteOrganizations: this.remoteOrganizations,
+                    }
+                } catch (e) {
+                    if (e.response.status === 404) {
+                        console.error(e)
+                        this.$dialog.error(
+                            this.$t(
+                                'windward.integrations.shared.error.load_remote_organization_failed'
+                            )
+                        )
+                    }
+                }
+            }
+            this.loading.org = false
+        },
+    },
+}
+</script>

package/pages/admin/vendors.vue

@@ -0,0 +1,241 @@
+<template>
+    <div>
+        <v-row justify="center" align="center">
+            <v-col cols="12">
+                <div class="d-flex mb-5">
+                    <h1 class="mr-auto flex-grow-1">
+                        {{
+                            $t(
+                                'windward.integrations.components.navigation.integrations.title'
+                            )
+                        }}
+                    </h1>
+                </div>
+            </v-col>
+        </v-row>
+        <v-row>
+            <v-col cols="12">
+                <v-simple-table>
+                    <template #default>
+                        <thead>
+                            <tr>
+                                <th class="text-left">
+                                    {{
+                                        $t(
+                                            'windward.integrations.pages.vendor.vendor_name'
+                                        )
+                                    }}
+                                </th>
+                                <th class="text-left">
+                                    {{
+                                        $t(
+                                            'windward.integrations.pages.vendor.configured'
+                                        )
+                                    }}
+                                </th>
+                                <th class="text-left">
+                                    {{
+                                        $t(
+                                            'windward.integrations.pages.vendor.enabled'
+                                        )
+                                    }}
+                                </th>
+                                <th class="text-left">
+                                    {{ $t('shared.forms.actions') }}
+                                </th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr
+                                v-for="item in filteredIntegrations"
+                                :key="item.id"
+                            >
+                                <td>{{ item.name }}</td>
+                                <td>
+                                    <v-icon
+                                        :color="
+                                            item.organizationIntegration
+                                                ? 'success'
+                                                : 'error'
+                                        "
+                                        >{{
+                                            item.organizationIntegration
+                                                ? 'mdi-check'
+                                                : 'mdi-close'
+                                        }}
+                                    </v-icon>
+                                    <span
+                                        v-if="!item.organizationIntegration"
+                                        class="sr-only"
+                                        >{{
+                                            $t(
+                                                'windward.integrations.pages.vendor.vendor_disabled'
+                                            )
+                                        }}</span
+                                    >
+                                </td>
+                                <td>
+                                    <v-icon
+                                        :color="
+                                            item.organizationIntegration &&
+                                            item.organizationIntegration.enabled
+                                                ? 'success'
+                                                : 'error'
+                                        "
+                                        >{{
+                                            item.organizationIntegration &&
+                                            item.organizationIntegration.enabled
+                                                ? 'mdi-check'
+                                                : 'mdi-close'
+                                        }}
+                                    </v-icon>
+                                    <span
+                                        v-if="
+                                            !item.organizationIntegration ||
+                                            !item.organizationIntegration
+                                                .enabled
+                                        "
+                                        class="sr-only"
+                                        >{{
+                                            $t(
+                                                'windward.integrations.pages.vendor.organization_integration_disabled'
+                                            )
+                                        }}</span
+                                    >
+                                </td>
+                                <td>
+                                    <v-btn
+                                        color="primary"
+                                        outlined
+                                        @click="onManageIntegration(item)"
+                                    >
+                                        <v-icon>mdi-pencil</v-icon>
+                                        <span class="sr-only">
+                                            {{
+                                                $t(
+                                                    'windward.integrations.pages.vendor.manage'
+                                                )
+                                            }}
+                                        </span>
+                                    </v-btn>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </template>
+                </v-simple-table>
+
+                <Dialog v-model="manageDialog" :trigger="false" action-save>
+                    <template #title>{{
+                        $t(
+                            'windward.integrations.components.integration.driver.' +
+                                activeVendor.product_code +
+                                '.manage_dialog_title'
+                        )
+                    }}</template>
+                    <template #form="{ on, attrs }">
+                        <component
+                            :is="activeManageDriver"
+                            :vendor="activeVendor"
+                            v-bind="attrs"
+                            v-on="on"
+                            @update:integration="onUpdateIntegration"
+                        ></component>
+                    </template>
+                </Dialog>
+            </v-col>
+        </v-row>
+    </div>
+</template>
+
+<script>
+import _ from 'lodash'
+import { mapGetters } from 'vuex'
+
+import Dialog from '~/components/Dialog.vue'
+import Organization from '../../models/Organization'
+import IntegrationJobTable from '../../components/Integration/JobTable.vue'
+
+export default {
+    name: 'PluginIntegrationsAdminVendorsPage',
+    components: { Dialog, IntegrationJobTable },
+    layout: 'authenticated',
+    meta: {
+        privilege: {
+            'plugin.windward.integrations.organization.integration': {
+                readable: true,
+            },
+        },
+    },
+    data() {
+        return {
+            Pusher: null,
+            Echo: null,
+            vendors: [],
+            organizationIntegrations: [],
+            manageDialog: false,
+            activeVendor: null,
+            activeManageDriver: null,
+        }
+    },
+    async fetch() {
+        await this.$Integration.load()
+        this.vendors = this.$Integration.getVendors()
+    },
+    computed: {
+        ...mapGetters({
+            organization: 'organization/get',
+        }),
+        filteredIntegrations() {
+            const integrations = []
+
+            for (const vendor of this.vendors) {
+                const vendorItem = _.cloneDeep(vendor)
+                vendorItem.organizationIntegration = null
+
+                for (const org of this.organizationIntegrations) {
+                    if (org.integration_vendor_id === vendor.id) {
+                        vendorItem.organizationIntegration = org
+                    }
+                }
+
+                integrations.push(vendorItem)
+            }
+
+            return integrations
+        },
+    },
+    mounted() {
+        this.load()
+    },
+    methods: {
+        async load() {
+            try {
+                this.organizationIntegrations = await new Organization({
+                    id: this.organization.id,
+                })
+                    .integrations()
+                    .get()
+            } catch (e) {
+                console.error('Could not load organization integrations', e)
+            }
+        },
+        onUpdateIntegration(newIntegration) {
+            const integration = this.organizationIntegrations.find(
+                (i) => i.id === newIntegration.id
+            )
+
+            if (_.isEmpty(integration)) {
+                this.organizationIntegrations.push(newIntegration)
+            } else {
+                integration.enabled = newIntegration.enabled
+            }
+        },
+        onManageIntegration(vendor) {
+            this.activeManageDriver =
+                this.$Integration.getVendorManageComponent(vendor.id)
+            this.activeVendor = vendor
+            this.manageDialog = true
+        },
+    },
+}
+</script>

package/pages/course/importContent.vue

@@ -0,0 +1,25 @@
+<template>
+    <div>
+        <h1>Import Content</h1>
+        <p>Not Implemented</p>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'PluginIntegrationsImportContentPage',
+    layout: 'authenticated',
+    meta: {
+        privilege: {
+            'plugin.windward.integrations.organization.integration': {
+                readable: true,
+            },
+        },
+    },
+    data() {
+        return {}
+    },
+    async fetch() {},
+    computed: {},
+}
+</script>