From e67159e11629f5abe02b174b438b1d947a98b4a1 Mon Sep 17 00:00:00 2001 From: hyf-github-user <1348977728@qq.com> Date: Mon, 4 Nov 2024 10:59:09 +0800 Subject: [PATCH 1/3] init headshots --- src/components/headshots/ConfigPanel.vue | 94 +++++ src/components/headshots/DetailPanel.vue | 23 ++ src/components/headshots/OperationPanel.vue | 77 ++++ src/components/headshots/RecentPanel.vue | 131 +++++++ src/components/headshots/VideoPlayer.vue | 40 ++ .../headshots/config/CustomSelector.vue | 58 +++ .../headshots/config/EndImageUrlInput.vue | 123 +++++++ .../headshots/config/EnhancementSelector.vue | 58 +++ .../headshots/config/ExtendFromInput.vue | 66 ++++ .../headshots/config/LoopSelector.vue | 58 +++ .../headshots/config/PromptInput.vue | 71 ++++ .../headshots/config/StartImageUrlInput.vue | 127 +++++++ .../headshots/config/UploadVideo.vue | 139 +++++++ src/components/headshots/task/Preview.vue | 342 ++++++++++++++++++ src/models/headshots.ts | 61 ++++ src/pages/headshots/Index.vue | 198 ++++++++++ src/store/headshots/actions.ts | 159 ++++++++ src/store/headshots/index.ts | 14 + src/store/headshots/models.ts | 22 ++ src/store/headshots/mutations.ts | 71 ++++ src/store/headshots/persist.ts | 1 + src/store/headshots/state.ts | 18 + 22 files changed, 1951 insertions(+) create mode 100644 src/components/headshots/ConfigPanel.vue create mode 100644 src/components/headshots/DetailPanel.vue create mode 100644 src/components/headshots/OperationPanel.vue create mode 100644 src/components/headshots/RecentPanel.vue create mode 100644 src/components/headshots/VideoPlayer.vue create mode 100644 src/components/headshots/config/CustomSelector.vue create mode 100644 src/components/headshots/config/EndImageUrlInput.vue create mode 100644 src/components/headshots/config/EnhancementSelector.vue create mode 100644 src/components/headshots/config/ExtendFromInput.vue create mode 100644 src/components/headshots/config/LoopSelector.vue create mode 100644 src/components/headshots/config/PromptInput.vue create mode 100644 src/components/headshots/config/StartImageUrlInput.vue create mode 100644 src/components/headshots/config/UploadVideo.vue create mode 100644 src/components/headshots/task/Preview.vue create mode 100644 src/models/headshots.ts create mode 100644 src/pages/headshots/Index.vue create mode 100644 src/store/headshots/actions.ts create mode 100644 src/store/headshots/index.ts create mode 100644 src/store/headshots/models.ts create mode 100644 src/store/headshots/mutations.ts create mode 100644 src/store/headshots/persist.ts create mode 100644 src/store/headshots/state.ts diff --git a/src/components/headshots/ConfigPanel.vue b/src/components/headshots/ConfigPanel.vue new file mode 100644 index 00000000..f2b082e2 --- /dev/null +++ b/src/components/headshots/ConfigPanel.vue @@ -0,0 +1,94 @@ + + + + + diff --git a/src/components/headshots/DetailPanel.vue b/src/components/headshots/DetailPanel.vue new file mode 100644 index 00000000..fae99a5f --- /dev/null +++ b/src/components/headshots/DetailPanel.vue @@ -0,0 +1,23 @@ + + + diff --git a/src/components/headshots/OperationPanel.vue b/src/components/headshots/OperationPanel.vue new file mode 100644 index 00000000..66b8633a --- /dev/null +++ b/src/components/headshots/OperationPanel.vue @@ -0,0 +1,77 @@ + + + + + diff --git a/src/components/headshots/RecentPanel.vue b/src/components/headshots/RecentPanel.vue new file mode 100644 index 00000000..9de228a3 --- /dev/null +++ b/src/components/headshots/RecentPanel.vue @@ -0,0 +1,131 @@ + + + + + diff --git a/src/components/headshots/VideoPlayer.vue b/src/components/headshots/VideoPlayer.vue new file mode 100644 index 00000000..bad7c29c --- /dev/null +++ b/src/components/headshots/VideoPlayer.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/src/components/headshots/config/CustomSelector.vue b/src/components/headshots/config/CustomSelector.vue new file mode 100644 index 00000000..6db2b46a --- /dev/null +++ b/src/components/headshots/config/CustomSelector.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/components/headshots/config/EndImageUrlInput.vue b/src/components/headshots/config/EndImageUrlInput.vue new file mode 100644 index 00000000..878e0e80 --- /dev/null +++ b/src/components/headshots/config/EndImageUrlInput.vue @@ -0,0 +1,123 @@ + + + + + diff --git a/src/components/headshots/config/EnhancementSelector.vue b/src/components/headshots/config/EnhancementSelector.vue new file mode 100644 index 00000000..1c6d79fe --- /dev/null +++ b/src/components/headshots/config/EnhancementSelector.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/components/headshots/config/ExtendFromInput.vue b/src/components/headshots/config/ExtendFromInput.vue new file mode 100644 index 00000000..867d55a2 --- /dev/null +++ b/src/components/headshots/config/ExtendFromInput.vue @@ -0,0 +1,66 @@ + + + + + diff --git a/src/components/headshots/config/LoopSelector.vue b/src/components/headshots/config/LoopSelector.vue new file mode 100644 index 00000000..4aa1ec6b --- /dev/null +++ b/src/components/headshots/config/LoopSelector.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/components/headshots/config/PromptInput.vue b/src/components/headshots/config/PromptInput.vue new file mode 100644 index 00000000..8aa74b89 --- /dev/null +++ b/src/components/headshots/config/PromptInput.vue @@ -0,0 +1,71 @@ + + + + + diff --git a/src/components/headshots/config/StartImageUrlInput.vue b/src/components/headshots/config/StartImageUrlInput.vue new file mode 100644 index 00000000..f9db2aa8 --- /dev/null +++ b/src/components/headshots/config/StartImageUrlInput.vue @@ -0,0 +1,127 @@ + + + + + diff --git a/src/components/headshots/config/UploadVideo.vue b/src/components/headshots/config/UploadVideo.vue new file mode 100644 index 00000000..f06dae58 --- /dev/null +++ b/src/components/headshots/config/UploadVideo.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/src/components/headshots/task/Preview.vue b/src/components/headshots/task/Preview.vue new file mode 100644 index 00000000..1a027bac --- /dev/null +++ b/src/components/headshots/task/Preview.vue @@ -0,0 +1,342 @@ + + + + + + + diff --git a/src/models/headshots.ts b/src/models/headshots.ts new file mode 100644 index 00000000..62d8324a --- /dev/null +++ b/src/models/headshots.ts @@ -0,0 +1,61 @@ +export interface ILumaConfig { + action?: string; + video_id?: string; + prompt?: string; + video_url?: string; + start_image_url?: string; + end_image_url?: string; + enhancement?: boolean; + loop?: boolean; + thumbnail_url?: string; + custom?: boolean; +} + +export interface ILumaGenerateRequest { + action?: string; + video_id?: string; + prompt?: string; + video_url?: string; + start_image_url?: string; + end_image_url?: string; + enhancement?: boolean; + loop?: boolean; + callback_url?: string; +} + +export interface ILumaGenerateResponse { + success: boolean; + task_id: string; + video_id: string; + prompt: string; + video_url: string; + video_height: number; + video_width: number; + state: string; + thumbnail_url: string; + thumbnail_width: number; + thumbnail_height: number; + trace_id: string; + data?: { + video_id?: string; + state?: string; + }; + error: { + code?: string; + message?: string; + }; +} + +export interface ILumaTask { + id: string; + created_at?: string; + request?: ILumaGenerateRequest; + response?: ILumaGenerateResponse; +} + +export type ILumaTaskResponse = ILumaTask; + +export interface ILumaTasksResponse { + count: number; + items: ILumaTask[]; +} diff --git a/src/pages/headshots/Index.vue b/src/pages/headshots/Index.vue new file mode 100644 index 00000000..a4b41703 --- /dev/null +++ b/src/pages/headshots/Index.vue @@ -0,0 +1,198 @@ + + + + + diff --git a/src/store/headshots/actions.ts b/src/store/headshots/actions.ts new file mode 100644 index 00000000..90ece3ce --- /dev/null +++ b/src/store/headshots/actions.ts @@ -0,0 +1,159 @@ +import { applicationOperator, lumaOperator, serviceOperator } from '@/operators'; +import { ILumaState } from './models'; +import { ActionContext } from 'vuex'; +import { IRootState } from '../common/models'; +import { IApplication, ICredential, ILumaConfig, ILumaTask, IService, IApplicationType } from '@/models'; +import { Status } from '@/models/common'; +import { LUMA_SERVICE_ID } from '@/constants'; + +export const resetAll = ({ commit }: ActionContext): void => { + commit('resetAll'); +}; + +export const setCredential = async ({ commit }: any, payload: ICredential): Promise => { + console.debug('set credential', payload); + commit('setCredential', payload); +}; + +export const setConfig = ({ commit }: any, payload: ILumaConfig) => { + commit('setConfig', payload); +}; + +export const setService = async ({ commit }: any, payload: IService): Promise => { + console.debug('set service', payload); + commit('setService', payload); +}; + +export const setApplication = ({ commit }: any, payload: IApplication[]) => { + commit('setApplication', payload); +}; + +export const getApplications = async ({ + commit, + state, + rootState +}: ActionContext): Promise => { + console.debug('start to get applications for luma'); + return new Promise((resolve, reject) => { + state.status.getApplications = Status.Request; + applicationOperator + .getAll({ + user_id: rootState?.user?.id, + service_id: LUMA_SERVICE_ID + }) + .then((response) => { + console.debug('get applications success', response?.data); + state.status.getApplications = Status.Success; + // check if there is any application with 'Period' type + const application = response.data.items?.find((application) => application?.type === IApplicationType.PERIOD); + const application2 = response.data.items?.find((application) => application?.type === IApplicationType.USAGE); + if (application && application?.remaining_amount) { + console.debug('set application with Period', application); + commit('setApplication', application); + const credential = application?.credentials?.find( + (credential) => credential?.host === window.location.origin + ); + console.debug('set credential with Period', application); + commit('setCredential', credential); + } else if (application2) { + console.debug('set application with Usage', application2); + commit('setApplication', application2); + const credential = application2?.credentials?.find( + (credential) => credential?.host === window.location.origin + ); + console.debug('set credential with Usage', application); + commit('setCredential', credential); + } else { + console.debug('set application with null', response.data.items?.[0]); + commit('setApplication', response.data.items?.[0]); + } + resolve(response.data.items); + console.debug('save application success', response.data.items[0]); + }) + .catch((error) => { + state.status.getApplications = Status.Error; + reject(error); + }); + }); +}; + +export const setTasks = ({ commit }: any, payload: any) => { + commit('setTasks', payload); +}; + +export const setTasksItems = ({ commit }: any, payload: ILumaTask[]) => { + commit('setTasksItems', payload); +}; + +export const setTasksTotal = ({ commit }: any, payload: number) => { + commit('setTasksTotal', payload); +}; + +export const setTasksActive = ({ commit }: any, payload: ILumaTask) => { + commit('setTasksActive', payload); +}; + +export const getService = async ({ commit, state }: ActionContext): Promise => { + return new Promise((resolve, reject) => { + console.debug('start to get service for luma'); + state.status.getService = Status.Request; + serviceOperator + .get(LUMA_SERVICE_ID) + .then((response) => { + state.status.getService = Status.Success; + commit('setService', response.data); + resolve(response.data); + }) + .catch((error) => { + state.status.getService = Status.Error; + reject(error); + }); + }); +}; + +export const getTasks = async ( + { commit, state, rootState }: ActionContext, + { offset, limit }: { offset?: number; limit?: number } +): Promise => { + return new Promise((resolve, reject) => { + console.debug('start to get tasks', offset, limit); + const credential = state.credential; + const token = credential?.token; + if (!token) { + return reject('no token'); + } + lumaOperator + .tasks( + { + userId: rootState?.user?.id + }, + { + token + } + ) + .then((response) => { + console.debug('get imagine tasks success', response.data.items); + commit('setTasksItems', response.data.items); + commit('setTasksTotal', response.data.count); + resolve(response.data.items); + }) + .catch((error) => { + return reject(error); + }); + }); +}; + +export default { + setService, + getService, + resetAll, + setCredential, + setConfig, + setApplication, + getApplications, + setTasks, + setTasksItems, + setTasksTotal, + setTasksActive, + getTasks +}; diff --git a/src/store/headshots/index.ts b/src/store/headshots/index.ts new file mode 100644 index 00000000..af67341b --- /dev/null +++ b/src/store/headshots/index.ts @@ -0,0 +1,14 @@ +import { Module } from 'vuex'; +import { ILumaState } from './models'; +import actions from './actions'; +import mutations from './mutations'; +import state from './state'; + +export const luma: Module = { + namespaced: true, + state, + mutations, + actions +}; + +export default luma; diff --git a/src/store/headshots/models.ts b/src/store/headshots/models.ts new file mode 100644 index 00000000..c1fd9565 --- /dev/null +++ b/src/store/headshots/models.ts @@ -0,0 +1,22 @@ +import { IApplication, ICredential, IService, Status } from '@/models'; +import { ILumaConfig, ILumaTask } from '@/models'; + +export interface ILumaState { + application: IApplication | undefined; + applications: IApplication[] | undefined; + service: IService | undefined; + credential: ICredential | undefined; + config: ILumaConfig | undefined; + tasks: + | { + items: ILumaTask[] | undefined; + total: number | undefined; + active: ILumaTask | undefined; + } + | undefined; + status: { + getService: Status; + getApplications: Status; + getTasks: Status; + }; +} diff --git a/src/store/headshots/mutations.ts b/src/store/headshots/mutations.ts new file mode 100644 index 00000000..de64be47 --- /dev/null +++ b/src/store/headshots/mutations.ts @@ -0,0 +1,71 @@ +import { IApplication, ICredential, ILumaConfig, ILumaTask, IService } from '@/models'; +import { ILumaState } from './models'; + +export const resetAll = (state: ILumaState): void => { + state.service = undefined; + state.application = undefined; + state.config = undefined; + state.credential = undefined; + state.tasks = undefined; +}; + +export const setService = (state: ILumaState, payload: IService): void => { + state.service = payload; +}; + +export const setCredential = (state: ILumaState, payload: ICredential): void => { + state.credential = payload; +}; + +export const setApplication = (state: ILumaState, payload: IApplication): void => { + state.application = payload; +}; + +export const setApplications = (state: ILumaState, payload: IApplication[]): void => { + state.applications = payload; +}; + +export const setConfig = (state: ILumaState, payload: ILumaConfig): void => { + state.config = payload; +}; + +export const setTasksItems = (state: ILumaState, payload: ILumaTask[]): void => { + const newPayload = { + ...state.tasks, + items: payload + } as typeof state.tasks; + state.tasks = newPayload; +}; + +export const setTasksTotal = (state: ILumaState, payload: number): void => { + const newPayload = { + ...state.tasks, + total: payload + } as typeof state.tasks; + state.tasks = newPayload; +}; + +export const setTasksActive = (state: ILumaState, payload: ILumaTask): void => { + const newPayload = { + ...state.tasks, + active: payload + } as typeof state.tasks; + state.tasks = newPayload; +}; + +export const setTasks = (state: ILumaState, payload: any): void => { + state.tasks = payload; +}; + +export default { + setTasks, + setApplication, + setApplications, + setConfig, + setCredential, + setService, + setTasksActive, + setTasksItems, + setTasksTotal, + resetAll +}; diff --git a/src/store/headshots/persist.ts b/src/store/headshots/persist.ts new file mode 100644 index 00000000..a8e18ab4 --- /dev/null +++ b/src/store/headshots/persist.ts @@ -0,0 +1 @@ +export default ['luma.credential', 'luma.application', 'luma.tasks']; diff --git a/src/store/headshots/state.ts b/src/store/headshots/state.ts new file mode 100644 index 00000000..c50d9bc1 --- /dev/null +++ b/src/store/headshots/state.ts @@ -0,0 +1,18 @@ +import { ILumaState } from './models'; +import { Status } from '@/models'; + +export default (): ILumaState => { + return { + service: undefined, + application: undefined, + applications: undefined, + tasks: undefined, + credential: undefined, + config: undefined, + status: { + getService: Status.None, + getApplications: Status.None, + getTasks: Status.None + } + }; +}; From ffd09b78bc2094ef2623d662576ef32fa3e49645 Mon Sep 17 00:00:00 2001 From: hyf-github-user <1348977728@qq.com> Date: Mon, 4 Nov 2024 13:01:05 +0800 Subject: [PATCH 2/3] add headshots ux --- src/components/common/Navigator.vue | 19 +- src/components/headshots/ConfigPanel.vue | 49 ++--- src/components/headshots/ImageGallery.vue | 102 +++++++++ src/components/headshots/OperationPanel.vue | 2 +- src/components/headshots/RecentPanel.vue | 6 +- src/components/headshots/VideoPlayer.vue | 40 ---- .../headshots/config/CustomSelector.vue | 58 ----- .../headshots/config/ElementsSelector.vue | 202 ++++++++++++++++++ .../headshots/config/EnhancementSelector.vue | 58 ----- .../headshots/config/ExtendFromInput.vue | 66 ------ ...ndImageUrlInput.vue => ImageUrlsInput.vue} | 38 ++-- .../headshots/config/LoopSelector.vue | 58 ----- .../headshots/config/ModeSelector.vue | 83 +++++++ .../headshots/config/PromptInput.vue | 71 ------ .../headshots/config/StartImageUrlInput.vue | 127 ----------- .../headshots/config/UploadVideo.vue | 139 ------------ src/components/headshots/task/Preview.vue | 85 ++------ src/constants/headshots.ts | 1 + src/constants/index.ts | 1 + src/i18n/index.ts | 1 + src/i18n/zh-CN/common.json | 4 + src/i18n/zh-CN/headshots.json | 195 +++++++++++++++++ src/layouts/Headshots.vue | 80 +++++++ src/models/headshots.ts | 79 ++++--- src/models/index.ts | 1 + src/models/site.ts | 1 + src/operators/headshots.ts | 93 ++++++++ src/operators/index.ts | 1 + src/pages/headshots/Index.vue | 56 ++--- src/pages/site/Index.vue | 10 +- src/plugins/font-awesome.ts | 2 + src/router/constants.ts | 3 + src/router/headshots.ts | 16 ++ src/router/index.ts | 2 + src/store/common/models.ts | 2 + src/store/headshots/actions.ts | 34 +-- src/store/headshots/index.ts | 6 +- src/store/headshots/models.ts | 10 +- src/store/headshots/mutations.ts | 24 +-- src/store/headshots/persist.ts | 2 +- src/store/headshots/state.ts | 4 +- src/store/index.ts | 4 + 42 files changed, 982 insertions(+), 853 deletions(-) create mode 100644 src/components/headshots/ImageGallery.vue delete mode 100644 src/components/headshots/VideoPlayer.vue delete mode 100644 src/components/headshots/config/CustomSelector.vue create mode 100644 src/components/headshots/config/ElementsSelector.vue delete mode 100644 src/components/headshots/config/EnhancementSelector.vue delete mode 100644 src/components/headshots/config/ExtendFromInput.vue rename src/components/headshots/config/{EndImageUrlInput.vue => ImageUrlsInput.vue} (69%) delete mode 100644 src/components/headshots/config/LoopSelector.vue create mode 100644 src/components/headshots/config/ModeSelector.vue delete mode 100644 src/components/headshots/config/PromptInput.vue delete mode 100644 src/components/headshots/config/StartImageUrlInput.vue delete mode 100644 src/components/headshots/config/UploadVideo.vue create mode 100644 src/constants/headshots.ts create mode 100644 src/i18n/zh-CN/headshots.json create mode 100644 src/layouts/Headshots.vue create mode 100644 src/operators/headshots.ts create mode 100644 src/router/headshots.ts diff --git a/src/components/common/Navigator.vue b/src/components/common/Navigator.vue index fb353515..7cdd4e55 100644 --- a/src/components/common/Navigator.vue +++ b/src/components/common/Navigator.vue @@ -111,6 +111,8 @@ import { ROUTE_QRART_HISTORY, ROUTE_LUMA_INDEX, ROUTE_LUMA_HISTORY, + ROUTE_HEADSHOTS_INDEX, + ROUTE_HEADSHOTS_HISTORY, ROUTE_SUNO_INDEX, ROUTE_SUNO_HISTORY, ROUTE_SITE_INDEX @@ -147,6 +149,7 @@ export default defineComponent({ computed: { links() { const result = []; + // Add chat's leftmost icon if (this.$store?.state?.site?.features?.chat?.enabled) { result.push({ route: { @@ -157,6 +160,7 @@ export default defineComponent({ routes: [ROUTE_CHAT_CONVERSATION, ROUTE_CHAT_CONVERSATION_NEW] }); } + // Add midjourney's leftmost icon if (this.$store?.state?.site?.features?.midjourney?.enabled) { result.push({ route: { @@ -167,7 +171,7 @@ export default defineComponent({ routes: [ROUTE_MIDJOURNEY_INDEX] }); } - + // Add chatdoc's leftmost icon /* if (this.$store?.state?.site?.features?.chatdoc?.enabled) { result.push({ @@ -180,7 +184,7 @@ export default defineComponent({ }); } */ - + // Add qrart's leftmost icon if (this.$store?.state?.site?.features?.qrart?.enabled) { result.push({ route: { @@ -213,6 +217,17 @@ export default defineComponent({ routes: [ROUTE_LUMA_INDEX, ROUTE_LUMA_HISTORY] }); } + // Add headshots's leftmost icon + if (this.$store?.state?.site?.features?.headshots?.enabled) { + result.push({ + route: { + name: ROUTE_HEADSHOTS_INDEX + }, + displayName: this.$t('common.nav.headshots'), + icon: 'fa-solid fa-id-card', + routes: [ROUTE_HEADSHOTS_INDEX, ROUTE_HEADSHOTS_HISTORY] + }); + } if (this.direction === 'row') { result.push({ diff --git a/src/components/headshots/ConfigPanel.vue b/src/components/headshots/ConfigPanel.vue index f2b082e2..4e75e58d 100644 --- a/src/components/headshots/ConfigPanel.vue +++ b/src/components/headshots/ConfigPanel.vue @@ -1,28 +1,13 @@ @@ -49,8 +49,8 @@ export default defineComponent({ tasks() { // reverse the order of the tasks.items return { - ...this.$store.state.luma?.tasks, - items: this.$store.state.luma?.tasks?.items?.slice().reverse() + ...this.$store.state.headshots?.tasks, + items: this.$store.state.headshots?.tasks?.items?.slice().reverse() }; } } diff --git a/src/components/headshots/VideoPlayer.vue b/src/components/headshots/VideoPlayer.vue deleted file mode 100644 index bad7c29c..00000000 --- a/src/components/headshots/VideoPlayer.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/CustomSelector.vue b/src/components/headshots/config/CustomSelector.vue deleted file mode 100644 index 6db2b46a..00000000 --- a/src/components/headshots/config/CustomSelector.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/ElementsSelector.vue b/src/components/headshots/config/ElementsSelector.vue new file mode 100644 index 00000000..467a3a11 --- /dev/null +++ b/src/components/headshots/config/ElementsSelector.vue @@ -0,0 +1,202 @@ + + + + + diff --git a/src/components/headshots/config/EnhancementSelector.vue b/src/components/headshots/config/EnhancementSelector.vue deleted file mode 100644 index 1c6d79fe..00000000 --- a/src/components/headshots/config/EnhancementSelector.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/ExtendFromInput.vue b/src/components/headshots/config/ExtendFromInput.vue deleted file mode 100644 index 867d55a2..00000000 --- a/src/components/headshots/config/ExtendFromInput.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/EndImageUrlInput.vue b/src/components/headshots/config/ImageUrlsInput.vue similarity index 69% rename from src/components/headshots/config/EndImageUrlInput.vue rename to src/components/headshots/config/ImageUrlsInput.vue index 878e0e80..733b1ed4 100644 --- a/src/components/headshots/config/EndImageUrlInput.vue +++ b/src/components/headshots/config/ImageUrlsInput.vue @@ -1,6 +1,6 @@ @@ -36,7 +36,7 @@ interface IData { } export default defineComponent({ - name: 'ContentInput', + name: 'ImageUrlsInput', components: { ElUpload, ElButton, @@ -60,13 +60,13 @@ export default defineComponent({ }, value: { get() { - return this.$store.state.luma?.config?.end_image_url; + return this.$store.state.headshots?.config?.image_urls; }, set(val: string) { - const url = this.urls?.[0]; - this.$store.commit('luma/setConfig', { - ...this.$store.state.luma?.config, - end_image_url: url + const url = this.urls; + this.$store.commit('headshots/setConfig', { + ...this.$store.state.headshots?.config, + image_urls: url }); } } @@ -75,24 +75,24 @@ export default defineComponent({ if (!this.value) { this.value = undefined; } - this.onSetEndImageUrl(); + this.onSetImageUrls(); }, methods: { onExceed() { - ElMessage.warning(this.$t('luma.message.uploadEndImageExceed')); + ElMessage.warning(this.$t('headshots.message.uploadImageExceed')); }, onError() { - ElMessage.error(this.$t('luma.message.uploadEndImageError')); + ElMessage.error(this.$t('headshots.message.uploadImageError')); }, - onSetEndImageUrl() { - const url = this.urls?.[0]; - this.$store.commit('luma/setConfig', { - ...this.$store.state.luma?.config, - end_image_url: url + onSetImageUrls() { + const urls = this.urls; + this.$store.commit('headshots/setConfig', { + ...this.$store.state.headshots?.config, + image_urls: urls }); }, async onSuccess() { - this.onSetEndImageUrl(); + this.onSetImageUrls(); } } }); diff --git a/src/components/headshots/config/LoopSelector.vue b/src/components/headshots/config/LoopSelector.vue deleted file mode 100644 index 4aa1ec6b..00000000 --- a/src/components/headshots/config/LoopSelector.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/ModeSelector.vue b/src/components/headshots/config/ModeSelector.vue new file mode 100644 index 00000000..0fbbab59 --- /dev/null +++ b/src/components/headshots/config/ModeSelector.vue @@ -0,0 +1,83 @@ + + + + + + + diff --git a/src/components/headshots/config/PromptInput.vue b/src/components/headshots/config/PromptInput.vue deleted file mode 100644 index 8aa74b89..00000000 --- a/src/components/headshots/config/PromptInput.vue +++ /dev/null @@ -1,71 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/StartImageUrlInput.vue b/src/components/headshots/config/StartImageUrlInput.vue deleted file mode 100644 index f9db2aa8..00000000 --- a/src/components/headshots/config/StartImageUrlInput.vue +++ /dev/null @@ -1,127 +0,0 @@ - - - - - diff --git a/src/components/headshots/config/UploadVideo.vue b/src/components/headshots/config/UploadVideo.vue deleted file mode 100644 index f06dae58..00000000 --- a/src/components/headshots/config/UploadVideo.vue +++ /dev/null @@ -1,139 +0,0 @@ - - - - - diff --git a/src/components/headshots/task/Preview.vue b/src/components/headshots/task/Preview.vue index 1a027bac..ac952f51 100644 --- a/src/components/headshots/task/Preview.vue +++ b/src/components/headshots/task/Preview.vue @@ -5,52 +5,35 @@
- {{ $t('luma.name.lumaBot') }} + {{ $t('headshots.name.headshotsBot') }} {{ $dayjs.format('' + new Date(parseFloat(modelValue?.created_at || '') * 1000)) }}
-

- {{ modelValue?.request?.prompt }} - - ({{ $t('luma.status.pending') }}) - + {{ modelValue?.request?.template }} + - ({{ $t('headshots.status.pending') }}) +

- -
-
- - - {{ $t('luma.button.extend') }} - - - - - {{ $t('luma.button.download') }} - - +

- {{ $t('luma.name.taskId') }}: + {{ $t('headshots.name.taskId') }}: {{ modelValue?.id }}

@@ -61,45 +44,38 @@

- {{ $t('luma.name.taskId') }}: + {{ $t('headshots.name.taskId') }}: {{ modelValue?.id }}

- {{ $t('luma.name.failureReason') }}: + {{ $t('headshots.name.failureReason') }}: {{ modelValue?.response?.error?.message }}

- {{ $t('luma.name.traceId') }}: + {{ $t('headshots.name.traceId') }}: {{ modelValue?.response?.trace_id }}

-
+

- {{ $t('luma.name.taskId') }}: + {{ $t('headshots.name.taskId') }}: {{ modelValue?.id }}

@@ -111,11 +87,11 @@ + + diff --git a/src/models/headshots.ts b/src/models/headshots.ts index 62d8324a..bbe66fc2 100644 --- a/src/models/headshots.ts +++ b/src/models/headshots.ts @@ -1,61 +1,54 @@ -export interface ILumaConfig { - action?: string; - video_id?: string; - prompt?: string; - video_url?: string; - start_image_url?: string; - end_image_url?: string; - enhancement?: boolean; - loop?: boolean; - thumbnail_url?: string; - custom?: boolean; +export interface Picture { + id?: string; + audio_url?: string; + created_at?: string; +} +// Submitted payload +export interface IHeadshotsConfig { + mode?: string; + template?: string; + image_urls?: string[]; +} +export interface IHeadshotsGenerateRequest { + mode?: string; + template?: string; + image_urls?: string[]; } -export interface ILumaGenerateRequest { - action?: string; - video_id?: string; - prompt?: string; - video_url?: string; - start_image_url?: string; - end_image_url?: string; - enhancement?: boolean; - loop?: boolean; - callback_url?: string; +export interface IHeadshotsPicture { + id?: string; + image_url?: string; + template?: number; } -export interface ILumaGenerateResponse { - success: boolean; +export interface IHeadshotsGenerateResponse { + success?: boolean; task_id: string; - video_id: string; - prompt: string; - video_url: string; - video_height: number; - video_width: number; - state: string; - thumbnail_url: string; - thumbnail_width: number; - thumbnail_height: number; trace_id: string; - data?: { - video_id?: string; - state?: string; - }; - error: { + error?: { code?: string; message?: string; }; + data?: IHeadshotsPicture[]; } -export interface ILumaTask { +export interface IHeadshotsTask { + map(arg0: (song: any) => any): any; id: string; + _id: string; + api_id?: string; + application_id?: string; created_at?: string; - request?: ILumaGenerateRequest; - response?: ILumaGenerateResponse; + credential_id?: string; + trace_id?: string; + user_id?: string; + request?: IHeadshotsGenerateRequest; + response?: IHeadshotsGenerateResponse; } -export type ILumaTaskResponse = ILumaTask; +export type IHeadshotsTaskResponse = IHeadshotsTask; -export interface ILumaTasksResponse { +export interface IHeadshotsTasksResponse { count: number; - items: ILumaTask[]; + items: IHeadshotsTask[]; } diff --git a/src/models/index.ts b/src/models/index.ts index 7c61cd7a..6bee3255 100644 --- a/src/models/index.ts +++ b/src/models/index.ts @@ -13,6 +13,7 @@ export * from './service'; export * from './credential'; export * from './qrart'; export * from './luma'; +export * from './headshots'; export * from './suno'; export * from './site'; export * from './exchange'; diff --git a/src/models/site.ts b/src/models/site.ts index 03364077..3a95baf2 100644 --- a/src/models/site.ts +++ b/src/models/site.ts @@ -4,6 +4,7 @@ export interface ISiteFeatures { chatdoc?: any; qrart?: any; luma?: any; + headshots?: any; suno?: any; support?: any; } diff --git a/src/operators/headshots.ts b/src/operators/headshots.ts new file mode 100644 index 00000000..58347b91 --- /dev/null +++ b/src/operators/headshots.ts @@ -0,0 +1,93 @@ +import axios, { AxiosResponse } from 'axios'; +import { + IHeadshotsGenerateRequest, + IHeadshotsGenerateResponse, + IHeadshotsTaskResponse, + IHeadshotsTasksResponse +} from '@/models'; +import { BASE_URL_API } from '@/constants'; + +class HeadshotsOperator { + async task(id: string, options: { token: string }): Promise> { + return await axios.post( + `/luma/tasks`, + { + action: 'retrieve', + id: id + }, + { + headers: { + accept: 'application/json', + 'content-type': 'application/json', + authorization: `Bearer ${options.token}`, + 'x-record-exempt': 'true' + }, + baseURL: BASE_URL_API + } + ); + } + + async tasks( + filter: { ids?: string[]; applicationId?: string; userId?: string; limit?: number; offset?: number }, + options: { token: string } + ): Promise> { + return await axios.post( + `/luma/tasks`, + { + action: 'retrieve_batch', + ...(filter.ids + ? { + ids: filter.ids + } + : {}), + ...(filter.applicationId + ? { + application_id: filter.applicationId + } + : {}), + ...(filter.userId + ? { + user_id: filter.userId + } + : {}), + ...(filter.limit !== undefined + ? { + limit: filter.limit + } + : {}), + ...(filter.offset !== undefined + ? { + offset: filter.offset + } + : {}) + }, + { + headers: { + accept: 'application/json', + 'content-type': 'application/json', + authorization: `Bearer ${options.token}`, + 'x-record-exempt': 'true' + }, + baseURL: BASE_URL_API + } + ); + } + + async generate( + data: IHeadshotsGenerateRequest, + options: { + token: string; + } + ): Promise> { + return await axios.post('/luma/videos', data, { + headers: { + authorization: `Bearer ${options.token}`, + 'content-type': 'application/json', + accept: 'application/x-ndjson' + }, + baseURL: BASE_URL_API + }); + } +} + +export const headshotsOperator = new HeadshotsOperator(); diff --git a/src/operators/index.ts b/src/operators/index.ts index 2c69b3ae..db63e6c3 100644 --- a/src/operators/index.ts +++ b/src/operators/index.ts @@ -13,6 +13,7 @@ export * from './service'; export * from './credential'; export * from './qrart'; export * from './luma'; +export * from './headshots'; export * from './site'; export * from './suno'; export * from './exchange'; diff --git a/src/pages/headshots/Index.vue b/src/pages/headshots/Index.vue index a4b41703..0394fc31 100644 --- a/src/pages/headshots/Index.vue +++ b/src/pages/headshots/Index.vue @@ -1,7 +1,7 @@