@@ -10,7 +10,7 @@
:application="application"
:api-id="channel.apiId"
class="mb-4"
- @apply="onFetchApplications"
+ @apply="onGetApplications"
/>
@@ -42,10 +42,7 @@ import {
IApplication,
IMidjourneyChannel,
MidjourneyImagineAction,
- IMidjourneyPreset,
MIDJOURNEY_CHANNEL_FAST,
- MIDJOURNEY_CHANNEL_TURBO,
- MIDJOURNEY_CHANNEL_RELAX,
applicationOperator,
midjourneyOperator,
IMidjourneyImagineTask,
@@ -56,18 +53,14 @@ import ApiStatus from '@/components/common/ApiStatus.vue';
import TaskBriefList from '@/components/midjourney/tasks/TaskBriefList.vue';
import FinalPrompt from '@/components/midjourney/FinalPrompt.vue';
import { ERROR_CODE_DUPLICATION } from '@/constants/errorCode';
+import { Status } from '@/store/common/models';
interface IData {
channel: IMidjourneyChannel;
- preset: IMidjourneyPreset;
prompt: string;
elements: string[];
ignore: string;
- initializing: boolean;
- applied: boolean | undefined;
- applications: IApplication[];
references: string[];
- task: IMidjourneyImagineTask | undefined;
}
const CALLBACK_URL = 'https://webhook.zhishuyun.com/midjourney';
@@ -88,22 +81,26 @@ export default defineComponent({
},
data(): IData {
return {
- applications: [],
channel: MIDJOURNEY_CHANNEL_FAST,
- preset: this.$store.state.midjourney.preset || {},
prompt: '',
elements: [],
ignore: '',
- initializing: false,
- applied: undefined,
- task: undefined,
references: []
};
},
computed: {
+ preset() {
+ return this.$store.state.midjourney.preset;
+ },
+ initializing() {
+ return this.$store.state.midjourney.getApplicationsStatus === Status.Request;
+ },
+ applications() {
+ return this.$store.state.midjourney.applications;
+ },
application() {
if (this.applications && this.applications.length > 0) {
- return this.applications.filter((item) => item.api_id === this.channel.apiId)[0];
+ return this.applications.filter((item: IApplication) => item.api_id === this.channel.apiId)[0];
}
return undefined;
},
@@ -151,8 +148,8 @@ export default defineComponent({
return this.prompt || this.references?.length > 0 ? content : '';
}
},
- mounted() {
- this.onFetchApplications();
+ async mounted() {
+ await this.onGetApplications();
},
methods: {
onApply() {
@@ -172,16 +169,10 @@ export default defineComponent({
});
},
async onSelectChannel() {
- await this.onFetchApplications();
+ await this.onGetApplications();
},
- async onFetchApplications() {
- this.initializing = true;
- const { data: applications } = await applicationOperator.getAll({
- user_id: this.$store.state.user.id,
- api_id: [MIDJOURNEY_CHANNEL_FAST.apiId, MIDJOURNEY_CHANNEL_RELAX.apiId, MIDJOURNEY_CHANNEL_TURBO.apiId]
- });
- this.initializing = false;
- this.applications = applications?.items;
+ async onGetApplications() {
+ await this.$store.dispatch('midjourney/getApplications');
},
async onStartTask(request: IMidjourneyImagineRequest) {
const token = this.application?.credential?.token;
diff --git a/src/store/index.ts b/src/store/index.ts
index 4809475..911b266 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -10,7 +10,18 @@ const store = createStore({
midjourney,
chat
},
- plugins: [createPersistedState()]
+ plugins: [
+ createPersistedState({
+ paths: [
+ 'token',
+ 'user',
+ 'chat.applications',
+ 'chat.conversations',
+ 'midjourney.applications',
+ 'midjourney.imagineTasks'
+ ]
+ })
+ ]
});
export default store;
diff --git a/src/store/midjourney/actions.ts b/src/store/midjourney/actions.ts
index 4cf1e70..73f3599 100644
--- a/src/store/midjourney/actions.ts
+++ b/src/store/midjourney/actions.ts
@@ -1,4 +1,18 @@
-import { IApplication, IMidjourneyPreset } from '@/operators';
+import {
+ IApplication,
+ IMidjourneyImagineTask,
+ IMidjourneyPreset,
+ MIDJOURNEY_CHANNEL_FAST,
+ MIDJOURNEY_CHANNEL_RELAX,
+ MIDJOURNEY_CHANNEL_TURBO,
+ apiUsageOperator,
+ applicationOperator,
+ midjourneyOperator
+} from '@/operators';
+import { IMidjourneyState } from './models';
+import { ActionContext } from 'vuex';
+import { log } from '@/utils/log';
+import { IRootState, Status } from '../common/models';
export const setPreset = ({ commit }: any, payload: IMidjourneyPreset) => {
commit('setPreset', payload);
@@ -8,7 +22,61 @@ export const setApplications = ({ commit }: any, payload: IApplication[]) => {
commit('setApplications', payload);
};
+export const getApplications = async ({
+ commit,
+ rootState
+}: ActionContext): Promise => {
+ log(getApplications, 'start to get application for midjourney');
+ commit('setGetApplicationsStatus', Status.Request);
+ const { data: applications } = await applicationOperator.getAll({
+ user_id: rootState.user.id,
+ api_id: [MIDJOURNEY_CHANNEL_FAST.apiId, MIDJOURNEY_CHANNEL_RELAX.apiId, MIDJOURNEY_CHANNEL_TURBO.apiId]
+ });
+ log(getApplications, 'get application for midjourney success', applications);
+ commit('setGetApplicationsStatus', Status.Success);
+ commit('setApplications', applications?.items);
+ return applications.items;
+};
+
+export const setImagineTasks = ({ commit }: any, payload: IMidjourneyImagineTask[]) => {
+ commit('setImagineTasks', payload);
+};
+
+export const getImagineTasks = async (
+ { commit, state, rootState }: ActionContext,
+ { offset, limit }: { offset?: number; limit?: number }
+): Promise => {
+ log(getImagineTasks, 'start to get imagine tasks', offset, limit);
+ commit('setGetImagineTasksStatus', Status.Request);
+ const {
+ data: { items: apiUsages, count }
+ } = await apiUsageOperator.getAll({
+ user_id: rootState.user.id,
+ // @ts-ignore
+ application_id: state.applications?.map((application: IApplication) => application.id),
+ offset,
+ limit,
+ ordering: '-created_at'
+ });
+ log(getImagineTasks, 'get imagine api usage success', apiUsages);
+ let tasks = (await midjourneyOperator.tasks(apiUsages.map((apiUsage) => apiUsage.metadata?.task_id as string))).data;
+ tasks = tasks.map((task: IMidjourneyImagineTask) => {
+ const apiUsage = apiUsages.filter((apiUsage) => apiUsage.metadata?.task_id === task?.id)[0];
+ return {
+ ...task,
+ created_at: apiUsage.created_at
+ };
+ });
+ commit('setImagineTasksTotal', count);
+ commit('setGetImagineTasksStatus', Status.Success);
+ commit('setImagineTasks', tasks);
+ return tasks;
+};
+
export default {
setPreset,
- setApplications
+ setApplications,
+ getApplications,
+ setImagineTasks,
+ getImagineTasks
};
diff --git a/src/store/midjourney/index.ts b/src/store/midjourney/index.ts
index b4988df..5485cb0 100644
--- a/src/store/midjourney/index.ts
+++ b/src/store/midjourney/index.ts
@@ -2,15 +2,11 @@ import { Module } from 'vuex';
import { IMidjourneyState } from './models';
import actions from './actions';
import mutations from './mutations';
+import state from './state';
export const midjourney: Module = {
namespaced: true,
- state(): IMidjourneyState {
- return {
- applications: undefined,
- preset: {}
- };
- },
+ state,
mutations,
actions
};
diff --git a/src/store/midjourney/models.ts b/src/store/midjourney/models.ts
index bb6fcc5..1522328 100644
--- a/src/store/midjourney/models.ts
+++ b/src/store/midjourney/models.ts
@@ -1,6 +1,11 @@
-import { IApplication, IMidjourneyPreset } from '@/operators';
+import { IApplication, IMidjourneyImagineTask, IMidjourneyPreset } from '@/operators';
+import { Status } from '../common/models';
export interface IMidjourneyState {
applications: IApplication[] | undefined;
+ getApplicationsStatus: Status | undefined;
+ imagineTasks: IMidjourneyImagineTask[] | undefined;
+ getImagineTasksStatus: Status | undefined;
+ imagineTasksTotal: number | undefined;
preset: IMidjourneyPreset;
}
diff --git a/src/store/midjourney/mutations.ts b/src/store/midjourney/mutations.ts
index 8bd645d..69afe6c 100644
--- a/src/store/midjourney/mutations.ts
+++ b/src/store/midjourney/mutations.ts
@@ -1,5 +1,6 @@
import { IApplication } from '@/operators';
import { IMidjourneyState } from './models';
+import { Status } from '../common/models';
export const setApplications = (state: IMidjourneyState, payload: IApplication[]): void => {
state.applications = payload;
@@ -9,7 +10,27 @@ export const setPreset = (state: IMidjourneyState, payload: any): void => {
state.preset = payload;
};
+export const setGetApplicationsStatus = (state: IMidjourneyState, payload: Status): void => {
+ state.getApplicationsStatus = payload;
+};
+
+export const setImagineTasks = (state: IMidjourneyState, payload: any): void => {
+ state.imagineTasks = payload;
+};
+
+export const setGetImagineTasksStatus = (state: IMidjourneyState, payload: Status): void => {
+ state.getImagineTasksStatus = payload;
+};
+
+export const setImagineTasksTotal = (state: IMidjourneyState, payload: number): void => {
+ state.imagineTasksTotal = payload;
+};
+
export default {
setApplications,
- setPreset
+ setPreset,
+ setGetApplicationsStatus,
+ setImagineTasks,
+ setGetImagineTasksStatus,
+ setImagineTasksTotal
};
diff --git a/src/store/midjourney/state.ts b/src/store/midjourney/state.ts
new file mode 100644
index 0000000..5210c11
--- /dev/null
+++ b/src/store/midjourney/state.ts
@@ -0,0 +1,12 @@
+import { IMidjourneyState } from './models';
+
+export default (): IMidjourneyState => {
+ return {
+ applications: undefined,
+ getApplicationsStatus: undefined,
+ imagineTasks: undefined,
+ getImagineTasksStatus: undefined,
+ imagineTasksTotal: undefined,
+ preset: {}
+ };
+};