Skip to content

Commit

Permalink
Merge pull request #214 from shashwatbangar/#364ttxy
Browse files Browse the repository at this point in the history
Implemented: Miscellaneous page in job-manager(#364ttxy)
  • Loading branch information
adityasharma7 authored Sep 2, 2022
2 parents 46d82a8 + e7178e1 commit 12e2aaa
Show file tree
Hide file tree
Showing 11 changed files with 252 additions and 6 deletions.
2 changes: 1 addition & 1 deletion src/components/JobConfiguration.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<section>
<ion-item lines="none">
<h1>{{ $t(title) }}</h1>
<ion-badge slot="end" color="dark" v-if="currentJob?.runTime">{{ $t("running") }} {{ timeTillJob(currentJob.runTime) }}</ion-badge>
<ion-badge slot="end" color="dark" v-if="currentJob?.runTime && currentJob.statusId !== 'SERVICE_DRAFT'">{{ $t("running") }} {{ timeTillJob(currentJob.runTime) }}</ion-badge>
</ion-item>

<ion-list>
Expand Down
12 changes: 10 additions & 2 deletions src/components/Menu.vue
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ import {
} from "@ionic/vue";
import { defineComponent, ref } from "vue";
import { mapGetters } from "vuex";
import { pulseOutline, calendarNumberOutline, ticketOutline, albumsOutline, shirtOutline, settings, iceCreamOutline } from "ionicons/icons";
import { pulseOutline, calendarNumberOutline, ticketOutline, albumsOutline, shirtOutline, settings, iceCreamOutline, libraryOutline } from "ionicons/icons";
import { useStore } from "@/store";
export default defineComponent({
name: "Menu",
Expand Down Expand Up @@ -142,6 +142,13 @@ export default defineComponent({
mdIcon: shirtOutline,
dependsOnBaseURL: false
},
{
title: "Miscellaneous",
url: "/miscellaneous",
iosIcon: libraryOutline,
mdIcon: libraryOutline,
dependsOnBaseURL: false
},
{
title: "Settings",
url: "/settings",
Expand All @@ -163,7 +170,8 @@ export default defineComponent({
shirtOutline,
settings,
iceCreamOutline,
store
store,
libraryOutline
};
},
});
Expand Down
2 changes: 2 additions & 0 deletions src/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,8 @@
"Last Shopify Order ID": "Last Shopify Order ID",
"Login": "Login",
"Logout": "Logout",
"Miscellaneous": "Miscellaneous",
"Miscellaneous jobs": "Miscellaneous jobs",
"More options": "More options",
"New broker run": "New broker run",
"New orders": "New orders",
Expand Down
7 changes: 7 additions & 0 deletions src/router/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import PreOrder from '@/views/PreOrder.vue'
import Orders from '@/views/Orders.vue'
import JobDetails from '@/views/JobDetails.vue'
import InitialLoad from '@/views/InitialLoad.vue'
import Miscellaneous from '@/views/Miscellaneous.vue'
import Login from '@/views/Login.vue'
import Settings from "@/views/Settings.vue"
import store from '@/store'
Expand Down Expand Up @@ -74,6 +75,12 @@ const routes: Array<RouteRecordRaw> = [
component: InitialLoad,
beforeEnter: authGuard
},
{
path: '/miscellaneous',
name: 'Miscellaneous',
component: Miscellaneous,
beforeEnter: authGuard
},
{
path: '/login',
name: 'Login',
Expand Down
6 changes: 5 additions & 1 deletion src/store/modules/job/JobState.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,11 @@ export default interface JobState {
history: {
list: any,
total: 0
},
}
miscellaneous: {
list: any,
total: 0
}
current: any;
temporalExp: any;
enumIds: any;
Expand Down
57 changes: 57 additions & 0 deletions src/store/modules/job/actions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -254,6 +254,63 @@ const actions: ActionTree<JobState, RootState> = {
showToast(translate("Something went wrong"));
})
},
async fetchMiscellaneousJobs({ commit, dispatch, state }, payload){
const params = {
"inputFields": {
"enumTypeId": "MISC_SYS_JOB",
"statusId": ["SERVICE_PENDING", "SERVICE_DRAFT"],
"statusId_op": "in",
"systemJobEnumId_op": "not-empty",
"shopId_fld0_value": store.state.user.currentShopifyConfig?.shopId,
"shopId_fld0_grp": "1",
"shopId_fld0_op": "equals",
"shopId_fld1_grp": "2",
"shopId_fld1_op": "empty"
} as any,
"fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "currentRetryCount", "statusId", "productStoreId", "runTimeDataId", "enumName", "shopId", "description" ],
"noConditionFind": "Y",
"viewSize": payload.viewSize,
"viewIndex": payload.viewIndex,
}

if(payload.eComStoreId) {
params.inputFields["productStoreId"] = payload.eComStoreId
} else {
params.inputFields["productStoreId_op"] = "empty"
}

try {
const resp = await JobService.fetchJobInformation(params)
if (resp.status === 200 && !hasError(resp) && resp.data.docs?.length > 0) {
const total = resp.data.count;
let jobs = resp.data.docs.map((job: any) => {
return {
...job,
'status': job?.statusId
}
})
if(payload.viewIndex && payload.viewIndex > 0){
jobs = state.miscellaneous.list.concat(jobs);
}
commit(types.JOB_MISCELLANEOUS_UPDATED, { jobs, total });
const tempExprList = [] as any;
const enumIds = [] as any;
resp.data.docs.map((item: any) => {
enumIds.push(item.systemJobEnumId);
tempExprList.push(item.tempExprId);
})
const tempExpr = [...new Set(tempExprList)];
dispatch('fetchTemporalExpression', tempExpr);
dispatch('fetchJobDescription', enumIds);
} else {
commit(types.JOB_MISCELLANEOUS_UPDATED, { jobs: [], total: 0 });
}
} catch (err) {
commit(types.JOB_MISCELLANEOUS_UPDATED, { jobs: [], total: 0 });
console.error(err);
showToast(translate("Something went wrong"));
}
},
async fetchTemporalExpression({ state, commit }, tempExprIds){
const tempIds = [] as any;
const cachedTempExprId = Object.keys(state.temporalExp);
Expand Down
8 changes: 7 additions & 1 deletion src/store/modules/job/getters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,13 @@ const getters: GetterTree <JobState, RootState> = {
},
getCurrentJob (state) {
return state.current;
}
},
getMiscellaneousJobs (state){
return state.miscellaneous.list;
},
isMiscellaneousJobsScrollable: (state) => {
return state.miscellaneous.list?.length > 0 && state.miscellaneous.list?.length < state.miscellaneous.total
},
}

export default getters;
4 changes: 4 additions & 0 deletions src/store/modules/job/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,10 @@ const jobModule: Module<JobState, RootState> = {
list: [],
total: 0
},
miscellaneous: {
list: [],
total: 0
},
temporalExp: [],
enumIds: {},
current: {},
Expand Down
3 changes: 2 additions & 1 deletion src/store/modules/job/mutation-types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,5 @@ export const JOB_TEMPORAL_EXPRESSION_UPDATED = SN_JOB + '/TEMPORAL_EXPRESSION_UP
export const JOB_DESCRIPTION_UPDATED = SN_JOB + '/DESCRIPTION_UPDATED'
export const JOB_HISTORY_UPDATED = SN_JOB + '/HISTORY_UPDATED'
export const JOB_RUNNING_UPDATED = SN_JOB + '/RUNNING_UPDATED'
export const JOB_CURRENT_UPDATED = SN_JOB + '/CURRENT_UPDATED'
export const JOB_CURRENT_UPDATED = SN_JOB + '/CURRENT_UPDATED'
export const JOB_MISCELLANEOUS_UPDATED = SN_JOB + '/MISCELLANEOUS_UPDATED'
4 changes: 4 additions & 0 deletions src/store/modules/job/mutations.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,10 @@ const mutations: MutationTree <JobState> = {
},
[types.JOB_CURRENT_UPDATED] (state, payload){
state.current = payload
},
[types.JOB_MISCELLANEOUS_UPDATED] (state, payload){
state.miscellaneous.list = payload.jobs;
state.miscellaneous.total = payload.total;
}
}
export default mutations;
153 changes: 153 additions & 0 deletions src/views/Miscellaneous.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,153 @@
<template>
<ion-page>
<ion-header :translucent="true">
<ion-toolbar>
<ion-menu-button slot="start" />
<ion-title>{{ $t("Miscellaneous") }}</ion-title>
</ion-toolbar>
</ion-header>

<ion-content>
<main>
<section>
<ion-list>
<ion-list-header>{{ $t("Miscellaneous jobs") }}</ion-list-header>
<ion-item v-for="job in miscellaneousJobs" :key="job.jobId" @click="viewJobConfiguration(job)" detail button>
<ion-label>{{ job.jobName }}</ion-label>
<ion-note slot="end">{{ getJobRuntime(job) }}</ion-note>
</ion-item>
</ion-list>

<ion-infinite-scroll @ionInfinite="loadMoreMiscellaneousJobs($event)" threshold="100px" :disabled="!isMiscellaneousJobsScrollable">
<ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
</ion-infinite-scroll>
</section>

<aside class="desktop-only" v-if="isDesktop" v-show="currentJob && Object.keys(currentJob).length">
<JobConfiguration :title="currentJobTitle" :status="currentJobStatus" :key="currentJob"/>
</aside>
</main>
</ion-content>
</ion-page>
</template>

<script lang="ts">
import { DateTime } from 'luxon';
import {
IonContent,
IonHeader,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonItem,
IonLabel,
IonList,
IonListHeader,
IonMenuButton,
IonNote,
IonPage,
IonTitle,
IonToolbar,
isPlatform,
} from '@ionic/vue';
import { defineComponent } from 'vue';
import { useRouter } from 'vue-router'
import { mapGetters, useStore } from 'vuex'
import emitter from '@/event-bus';
import JobConfiguration from '@/components/JobConfiguration.vue';
import { isFutureDate } from '@/utils';
export default defineComponent({
name: 'Miscellaneous',
components: {
IonContent,
IonHeader,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonItem,
IonLabel,
IonList,
IonListHeader,
IonMenuButton,
IonNote,
IonPage,
IonTitle,
IonToolbar,
JobConfiguration
},
mounted() {
this.getMiscellaneousJobs();
},
data() {
return {
currentJobTitle: '',
currentJobStatus: '',
isJobDetailAnimationCompleted: false,
isDesktop: isPlatform('desktop')
}
},
computed: {
...mapGetters({
miscellaneousJobs: 'job/getMiscellaneousJobs',
getCurrentEComStore:'user/getCurrentEComStore',
currentJob: 'job/getCurrentJob',
isMiscellaneousJobsScrollable: 'job/isMiscellaneousJobsScrollable'
})
},
methods: {
async viewJobConfiguration(job: any) {
this.currentJob = job
this.currentJobTitle = job.jobName
this.currentJobStatus = job.status
// if job runTime is not a valid date then making runTime as empty
if (job?.runTime && !isFutureDate(job?.runTime)) {
job.runTime = ''
}
await this.store.dispatch('job/updateCurrentJob', { job });
if(!this.isDesktop && job?.jobId) {
this.router.push({name: 'JobDetails', params: { title: this.currentJobTitle, jobId: job?.jobId, category: "miscellaneous"}});
return;
}
if (job && !this.isJobDetailAnimationCompleted) {
emitter.emit('playAnimation');
this.isJobDetailAnimationCompleted = true;
}
},
async getMiscellaneousJobs(viewSize = 20, viewIndex = 0) {
await this.store.dispatch('job/fetchMiscellaneousJobs', {eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex});
},
async loadMoreMiscellaneousJobs (event: any) {
this.getMiscellaneousJobs(
undefined,
Math.ceil(this.miscellaneousJobs.length / (process.env.VUE_APP_VIEW_SIZE as any))
).then(() => {
event.target.complete();
})
},
timeFromNow (time: any) {
const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
return DateTime.local().plus(timeDiff).toRelative();
},
getJobRuntime(job: any) {
return job.statusId !== 'SERVICE_DRAFT' && this.timeFromNow(job.runTime) ? this.timeFromNow(job.runTime) : this.$t('Disabled')
}
},
setup() {
const store = useStore();
const router = useRouter();
return {
router,
store,
};
},
})
</script>

<style scoped>
main > section {
width: 423px;
}
</style>

0 comments on commit 12e2aaa

Please sign in to comment.