root/geo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor brand service and related components

Browse Source 
- Removed ListQuestionVersions method and associated types from BrandService and Queries.
- Updated PromptRuleGenerationService to change task naming and handling.
- Enhanced ScheduleTaskService to support filtering by created date range and keyword.
- Introduced InstantTaskService for managing instant tasks with appropriate filtering and response structures.
- Added InstantTaskHandler for handling API requests related to instant tasks.
- Created InstantTaskTab component for the admin web interface to display and manage instant tasks.
- Updated database migrations to rename source types for articles and generation tasks.
- Adjusted models and repository queries to reflect the removal of question version handling.
This commit is contained in:
liangxu
2026-04-02 21:16:12 +08:00
parent 111498a65f
commit 8958cb44c0
36 changed files with 1378 additions and 358 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/admin-web/src/components/ArticleDetailDrawer.vue
+1 -1
View File
@@ -209,7 +209,7 @@ async function refreshArticleData(): Promise<void> {
<p class="eyebrow">{{ t("article.preview") }}</p>
<h2>{{ displayTitle }}</h2>
<p>
{{ getSourceTypeLabel(detail.source_type) }} ·
{{ getSourceTypeLabel(detail.source_type, detail.generation_mode) }} ·
{{ formatDateTime(detail.created_at) }}
</p>
</div>
apps/admin-web/src/components/CustomArticleTab.vue
+91 -25
View File
@@ -1,6 +1,10 @@
<script setup lang="ts">
import {
LoadingOutlined,
AppstoreOutlined,
ClockCircleOutlined,
EditOutlined,
DeleteOutlined,
} from "@ant-design/icons-vue";
import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
import { message, type TableColumnsType } from "ant-design-vue";
@@ -16,6 +20,7 @@ import {
formatDateTime,
getGenerateStatusMeta,
getPublishStatusMeta,
getSourceTypeLabel,
} from "@/lib/display";
import { formatError } from "@/lib/errors";
import { formatPublishPlatformList } from "@/lib/publish-platforms";
@@ -78,7 +83,7 @@ const articleParams = computed<ArticleListParams>(() => {
const params: ArticleListParams = {
page: page.value,
page_size: pageSize.value,
source_type: "prompt_rule",
source_type: "custom_generation",
};
if (appliedFilters.prompt_rule_id) params.prompt_rule_id = appliedFilters.prompt_rule_id;
if (appliedFilters.publish_status) params.publish_status = appliedFilters.publish_status;
@@ -90,7 +95,7 @@ const articleParams = computed<ArticleListParams>(() => {
});
const listQuery = useQuery({
queryKey: computed(() => ["articles", "list", "prompt_rule", articleParams.value]),
queryKey: computed(() => ["articles", "list", "custom_generation", articleParams.value]),
queryFn: () => articlesApi.list(articleParams.value),
});
@@ -106,14 +111,13 @@ const deleteMutation = useMutation({
});
const columns = computed<TableColumnsType<ArticleListItem>>(() => [
{ title: t("common.title"), dataIndex: "title", key: "title" },
{ title: t("custom.article.titleColumn"), dataIndex: "title", key: "title", width: 340 },
{ title: t("custom.filters.promptRule"), dataIndex: "prompt_rule_name", key: "prompt_rule_name", width: 160 },
{ title: t("custom.schedule.platform"), dataIndex: "platforms", key: "platforms", width: 180 },
{ title: t("common.generateStatus"), dataIndex: "generate_status", key: "generate_status", width: 128 },
{ title: t("common.publishStatus"), dataIndex: "publish_status", key: "publish_status", width: 128 },
{ title: t("common.wordCount"), dataIndex: "word_count", key: "word_count", width: 100 },
{ title: t("common.createdAt"), dataIndex: "created_at", key: "created_at", width: 168 },
{ title: t("common.actions"), key: "actions", width: 140, fixed: "right" },
{ title: t("common.actions"), key: "actions", width: 120, fixed: "right", align: "right" },
]);
function applyFilters(): void {
@@ -148,6 +152,13 @@ function canEditArticle(status: string): boolean {
return status === "completed" || status === "draft";
}
function getDisplayTitle(article: ArticleListItem): string {
if ((article.generate_status === "generating" || article.generate_status === "running") && !article.title) {
return t("custom.article.titleGenerating");
}
return article.title || t("article.untitled");
}
function handleTableChange(nextPage: number, nextPageSize: number): void {
page.value = nextPage;
pageSize.value = nextPageSize;
@@ -273,9 +284,21 @@ onBeforeUnmount(() => {
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'title'">
<a class="custom-article-tab__title-link" @click="openDetail(record)">
{{ record.title || t("article.untitled") }}
</a>
<div class="custom-article-tab__title-cell">
<a class="custom-article-tab__title-link" @click="openDetail(record)">
{{ getDisplayTitle(record) }}
</a>
<div class="custom-article-tab__title-meta">
<span class="custom-article-tab__title-badge">
<AppstoreOutlined />
<span>{{ getSourceTypeLabel(record.source_type, record.generation_mode) }}</span>
</span>
<span class="custom-article-tab__title-time">
<ClockCircleOutlined />
<span>{{ formatDateTime(record.created_at) }}</span>
</span>
</div>
</div>
</template>
<template v-else-if="column.key === 'prompt_rule_name'">
{{ record.prompt_rule_name || "--" }}
@@ -302,28 +325,37 @@ onBeforeUnmount(() => {
<template v-else-if="column.key === 'word_count'">
{{ record.word_count || "--" }}
</template>
<template v-else-if="column.key === 'created_at'">
{{ formatDateTime(record.created_at) }}
</template>
<template v-else-if="column.key === 'actions'">
<a-space :size="4">
<a-button
type="link"
size="small"
:disabled="!canEditArticle(record.generate_status)"
@click="openEditor(record)"
>
{{ t("common.edit") }}
</a-button>
<div class="table-actions-row">
<a-tooltip :title="t('common.edit')">
<span>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
:disabled="!canEditArticle(record.generate_status)"
@click="openEditor(record)"
>
<EditOutlined />
</a-button>
</span>
</a-tooltip>
<a-popconfirm
:title="t('templates.list.deleteConfirm')"
@confirm="deleteMutation.mutate(record.id)"
>
<a-button type="link" size="small" danger>
{{ t("common.delete") }}
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</a-space>
</div>
</template>
</template>
</a-table>
@@ -370,12 +402,46 @@ onBeforeUnmount(() => {
}
.custom-article-tab__title-link {
color: #1677ff;
display: inline-block;
color: #434343;
cursor: pointer;
font-size: 15px;
font-weight: 600;
line-height: 1.6;
}
.custom-article-tab__title-link:hover {
text-decoration: underline;
color: #1677ff;
}
.custom-article-tab__title-cell {
display: flex;
flex-direction: column;
gap: 10px;
padding: 4px 0;
}
.custom-article-tab__title-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px;
font-size: 13px;
}
.custom-article-tab__title-badge {
display: inline-flex;
align-items: center;
gap: 6px;
color: #b45f06;
font-weight: 600;
}
.custom-article-tab__title-time {
display: inline-flex;
align-items: center;
gap: 6px;
color: #a3a3a3;
}
.custom-article-tab__status-tag {
apps/admin-web/src/components/GenerateTaskDrawer.vue
+5 -1
View File
@@ -126,6 +126,7 @@ const instantGenerateMutation = useMutation({
target_platform: serializeTargetPlatforms(form.platformIds),
extra_params: {
task_name: form.name.trim(),
generation_mode: "instant",
enable_web_search: form.enableWebSearch,
generate_count: form.generateCount,
target_platforms: form.platformIds,
@@ -135,7 +136,10 @@ const instantGenerateMutation = useMutation({
onSuccess: async () => {
message.success(t("custom.messages.generateSubmitted"));
emit("update:open", false);
await queryClient.invalidateQueries({ queryKey: ["articles"] });
await Promise.all([
queryClient.invalidateQueries({ queryKey: ["articles"] }),
queryClient.invalidateQueries({ queryKey: ["instantTasks"] }),
]);
},
onError: (error) => message.error(formatError(error)),
});
apps/admin-web/src/components/InstantTaskTab.vue
+328
View File
@@ -0,0 +1,328 @@
<script setup lang="ts">
import { LoadingOutlined, EyeOutlined } from "@ant-design/icons-vue";
import { useQuery } from "@tanstack/vue-query";
import { type TableColumnsType } from "ant-design-vue";
import type { InstantTaskItem, InstantTaskListParams } from "@geo/shared-types";
import type { Dayjs } from "dayjs";
import { computed, onBeforeUnmount, reactive, ref, watch } from "vue";
import { useI18n } from "vue-i18n";
import ArticleDetailDrawer from "@/components/ArticleDetailDrawer.vue";
import { instantTasksApi, promptRulesApi } from "@/lib/api";
import { formatDateTime, getGenerateStatusMeta } from "@/lib/display";
import { formatPublishPlatformList } from "@/lib/publish-platforms";
const { t } = useI18n();
const page = ref(1);
const pageSize = ref(20);
const createdRange = ref<[Dayjs, Dayjs] | null>(null);
const detailOpen = ref(false);
const selectedArticleId = ref<number | null>(null);
const draftFilters = reactive<{
prompt_rule_id?: number;
status?: string;
keyword?: string;
}>({
keyword: "",
});
const appliedFilters = reactive<{
prompt_rule_id?: number;
status?: string;
keyword?: string;
created_from?: string;
created_to?: string;
}>({
keyword: "",
});
const rulesQuery = useQuery({
queryKey: ["promptRules", "simple"],
queryFn: () => promptRulesApi.listSimple(),
});
const promptOptions = computed(() =>
(rulesQuery.data.value ?? []).map((rule) => ({
label: rule.name,
value: rule.id,
})),
);
const statusOptions = computed(() => [
{ label: getGenerateStatusMeta("queued").label, value: "queued" },
{ label: getGenerateStatusMeta("running").label, value: "running" },
{ label: getGenerateStatusMeta("completed").label, value: "completed" },
{ label: getGenerateStatusMeta("failed").label, value: "failed" },
]);
const listParams = computed<InstantTaskListParams>(() => {
const params: InstantTaskListParams = {
page: page.value,
page_size: pageSize.value,
};
if (appliedFilters.prompt_rule_id) params.prompt_rule_id = appliedFilters.prompt_rule_id;
if (appliedFilters.status) params.status = appliedFilters.status;
if (appliedFilters.keyword?.trim()) params.keyword = appliedFilters.keyword.trim();
if (appliedFilters.created_from) params.created_from = appliedFilters.created_from;
if (appliedFilters.created_to) params.created_to = appliedFilters.created_to;
return params;
});
const listQuery = useQuery({
queryKey: computed(() => ["instantTasks", "list", listParams.value]),
queryFn: () => instantTasksApi.list(listParams.value),
});
const columns = computed<TableColumnsType<InstantTaskItem>>(() => [
{ title: t("custom.instant.name"), dataIndex: "name", key: "name", width: 220 },
{ title: t("custom.schedule.rule"), dataIndex: "prompt_rule_name", key: "prompt_rule_name", width: 180 },
{ title: t("custom.instant.executionStatus"), dataIndex: "status", key: "status", width: 140 },
{ title: t("custom.instant.executionTime"), dataIndex: "execution_time", key: "execution_time", width: 170 },
{ title: t("custom.schedule.platform"), dataIndex: "platforms", key: "platforms", width: 220 },
{ title: t("custom.task.generateCount"), dataIndex: "generate_count", key: "generate_count", width: 120 },
{ title: t("custom.instant.createdTime"), dataIndex: "created_at", key: "created_at", width: 170 },
{ title: t("common.actions"), key: "actions", width: 88, fixed: "right", align: "right" },
]);
let pollingTimer: number | null = null;
function applyFilters(): void {
page.value = 1;
appliedFilters.prompt_rule_id = draftFilters.prompt_rule_id;
appliedFilters.status = draftFilters.status;
appliedFilters.keyword = draftFilters.keyword?.trim() || "";
appliedFilters.created_from = createdRange.value?.[0]?.startOf("day").toISOString();
appliedFilters.created_to = createdRange.value?.[1]?.endOf("day").toISOString();
}
function resetFilters(): void {
draftFilters.prompt_rule_id = undefined;
draftFilters.status = undefined;
draftFilters.keyword = "";
createdRange.value = null;
applyFilters();
}
function handleTableChange(nextPage: number, nextPageSize: number): void {
page.value = nextPage;
pageSize.value = nextPageSize;
}
function openArticle(task: InstantTaskItem): void {
if (!task.article_id) {
return;
}
selectedArticleId.value = task.article_id;
detailOpen.value = true;
}
function startPolling(): void {
if (pollingTimer !== null) return;
pollingTimer = window.setInterval(() => {
void listQuery.refetch();
}, 3000);
}
function stopPolling(): void {
if (pollingTimer === null) return;
window.clearInterval(pollingTimer);
pollingTimer = null;
}
watch(
() => listQuery.data.value?.items ?? [],
(items) => {
const hasActive = items.some((item) => item.status === "queued" || item.status === "running");
if (hasActive) {
startPolling();
} else {
stopPolling();
}
},
{ immediate: true },
);
onBeforeUnmount(() => {
stopPolling();
});
</script>
<template>
<div class="task-tab">
<div class="task-tab__filters">
<div class="task-tab__filter">
<label>{{ t("custom.filters.promptRule") }}:</label>
<a-select
v-model:value="draftFilters.prompt_rule_id"
allow-clear
size="large"
:options="promptOptions"
:placeholder="t('custom.task.promptPlaceholder')"
:loading="rulesQuery.isPending.value"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter">
<label>{{ t("custom.filters.status") }}:</label>
<a-select
v-model:value="draftFilters.status"
allow-clear
size="large"
:options="statusOptions"
:placeholder="t('common.selectPlease')"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--range">
<label>{{ t("custom.filters.createdTime") }}:</label>
<a-range-picker
v-model:value="createdRange"
allow-clear
size="large"
format="YYYY-MM-DD"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--keyword">
<label>{{ t("custom.filters.name") }}:</label>
<a-input-search
v-model:value="draftFilters.keyword"
size="large"
:placeholder="t('custom.filters.namePlaceholder')"
@search="applyFilters"
@pressEnter="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--action">
<a-button size="large" @click="resetFilters">{{ t("common.reset") }}</a-button>
</div>
</div>
<a-table
:columns="columns"
:data-source="listQuery.data.value?.items ?? []"
:loading="listQuery.isPending.value"
:pagination="{
current: page,
pageSize,
total: listQuery.data.value?.total ?? 0,
showSizeChanger: true,
}"
row-key="id"
:scroll="{ x: 1280 }"
@change="(p: any) => handleTableChange(p.current, p.pageSize)"
>
<template #emptyText>{{ t("custom.instant.empty") }}</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'prompt_rule_name'">
{{ record.prompt_rule_name || "--" }}
</template>
<template v-else-if="column.key === 'status'">
<a-tag :color="getGenerateStatusMeta(record.status).color">
<span class="task-tab__status">
<LoadingOutlined v-if="record.status === 'queued' || record.status === 'running'" spin />
<span>{{ getGenerateStatusMeta(record.status).label }}</span>
</span>
</a-tag>
</template>
<template v-else-if="column.key === 'execution_time'">
{{ formatDateTime(record.execution_time) }}
</template>
<template v-else-if="column.key === 'platforms'">
{{ formatPublishPlatformList(record.platforms) }}
</template>
<template v-else-if="column.key === 'generate_count'">
{{ record.generate_count || 1 }}
</template>
<template v-else-if="column.key === 'created_at'">
{{ formatDateTime(record.created_at) }}
</template>
<template v-else-if="column.key === 'actions'">
<div class="table-actions-row">
<a-tooltip :title="t('common.preview')">
<span>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-eye"
:disabled="!record.article_id"
@click="openArticle(record)"
>
<EyeOutlined />
</a-button>
</span>
</a-tooltip>
</div>
</template>
</template>
</a-table>
<ArticleDetailDrawer
:open="detailOpen"
:article-id="selectedArticleId"
@close="detailOpen = false"
/>
</div>
</template>
<style scoped>
.task-tab__filters {
display: grid;
grid-template-columns: minmax(180px, 240px) minmax(180px, 240px) minmax(240px, 320px) minmax(240px, 1fr) auto;
gap: 16px;
margin-bottom: 18px;
}
.task-tab__filter {
display: flex;
align-items: center;
gap: 12px;
}
.task-tab__filter label {
flex-shrink: 0;
color: #434343;
font-size: 14px;
white-space: nowrap;
}
.task-tab__filter :deep(.ant-select),
.task-tab__filter :deep(.ant-picker),
.task-tab__filter :deep(.ant-input-search) {
width: 100%;
}
.task-tab__filter--action {
justify-content: flex-end;
}
.task-tab__status {
display: inline-flex;
align-items: center;
gap: 4px;
}
@media (max-width: 1400px) {
.task-tab__filters {
grid-template-columns: repeat(2, minmax(260px, 1fr));
}
.task-tab__filter--action {
justify-content: flex-start;
}
}
@media (max-width: 900px) {
.task-tab__filters {
grid-template-columns: 1fr;
}
}
</style>
apps/admin-web/src/components/PromptRuleTab.vue
+43 -17
View File
@@ -2,6 +2,8 @@
import {
DeleteOutlined,
EditOutlined,
PauseCircleOutlined,
PlayCircleOutlined,
PlusOutlined,
} from "@ant-design/icons-vue";
import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
@@ -59,7 +61,7 @@ const columns = computed<TableColumnsType<PromptRule>>(() => [
{ title: t("custom.promptRule.articleCount"), dataIndex: "article_count", key: "article_count", width: 100 },
{ title: t("custom.promptRule.status"), dataIndex: "status", key: "status", width: 100 },
{ title: t("common.createdAt"), dataIndex: "created_at", key: "created_at", width: 168 },
{ title: t("common.actions"), key: "actions", width: 140, fixed: "right" },
{ title: t("common.actions"), key: "actions", width: 140, fixed: "right", align: "right" },
]);
const groupMutations = {
@@ -252,29 +254,53 @@ watch(selectedGroupId, () => {
{{ formatDateTime(record.created_at) }}
</template>
<template v-else-if="column.key === 'actions'">
<a-space :size="4">
<a-button type="link" size="small" @click="openRuleModal(record)">
{{ t("common.edit") }}
</a-button>
<a-button
type="link"
size="small"
@click="ruleMutations.toggleStatus.mutate({
id: record.id,
status: record.status === 'enabled' ? 'disabled' : 'enabled',
})"
<div class="table-actions-row">
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click="openRuleModal(record)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-tooltip
:title="record.status === 'enabled' ? t('custom.promptRule.disabled') : t('custom.promptRule.enabled')"
>
{{ record.status === "enabled" ? t("custom.promptRule.disabled") : t("custom.promptRule.enabled") }}
</a-button>
<a-button
type="text"
shape="circle"
size="small"
:class="[
'action-btn',
record.status === 'enabled' ? 'action-disable' : 'action-enable',
]"
@click="ruleMutations.toggleStatus.mutate({
id: record.id,
status: record.status === 'enabled' ? 'disabled' : 'enabled',
})"
>
<PauseCircleOutlined v-if="record.status === 'enabled'" />
<PlayCircleOutlined v-else />
</a-button>
</a-tooltip>
<a-popconfirm
:title="t('custom.promptRule.deleteConfirm')"
@confirm="ruleMutations.remove.mutate(record.id)"
>
<a-button type="link" size="small" danger>
{{ t("common.delete") }}
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</a-space>
</div>
</template>
</template>
</a-table>
apps/admin-web/src/components/ScheduleTaskTab.vue
+228 -62
View File
@@ -1,14 +1,20 @@
<script setup lang="ts">
import { PlusOutlined } from "@ant-design/icons-vue";
import {
DeleteOutlined,
EditOutlined,
PauseCircleOutlined,
PlayCircleOutlined,
} from "@ant-design/icons-vue";
import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
import { message, type TableColumnsType } from "ant-design-vue";
import type { ScheduleTask } from "@geo/shared-types";
import { computed, ref } from "vue";
import type { ScheduleTask, ScheduleTaskListParams } from "@geo/shared-types";
import type { Dayjs } from "dayjs";
import { computed, reactive, ref } from "vue";
import { useI18n } from "vue-i18n";
import ScheduleTaskModal from "@/components/ScheduleTaskModal.vue";
import { schedulesApi } from "@/lib/api";
import { formatDateTime } from "@/lib/display";
import { promptRulesApi, schedulesApi } from "@/lib/api";
import { formatCronExecutionTime, formatDateTime } from "@/lib/display";
import { formatError } from "@/lib/errors";
import { formatPublishPlatformSummary } from "@/lib/publish-platforms";
@@ -19,11 +25,55 @@ const modalOpen = ref(false);
const editingTask = ref<ScheduleTask | null>(null);
const page = ref(1);
const pageSize = ref(20);
const createdRange = ref<[Dayjs, Dayjs] | null>(null);
const listParams = computed(() => ({
page: page.value,
page_size: pageSize.value,
}));
const draftFilters = reactive<{
prompt_rule_id?: number;
status?: string;
keyword?: string;
}>({
keyword: "",
});
const appliedFilters = reactive<{
prompt_rule_id?: number;
status?: string;
keyword?: string;
created_from?: string;
created_to?: string;
}>({
keyword: "",
});
const rulesQuery = useQuery({
queryKey: ["promptRules", "simple"],
queryFn: () => promptRulesApi.listSimple(),
});
const promptOptions = computed(() =>
(rulesQuery.data.value ?? []).map((rule) => ({
label: rule.name,
value: rule.id,
})),
);
const statusOptions = computed(() => [
{ label: t("custom.schedule.enabled"), value: "enabled" },
{ label: t("custom.schedule.disabled"), value: "disabled" },
]);
const listParams = computed<ScheduleTaskListParams>(() => {
const params: ScheduleTaskListParams = {
page: page.value,
page_size: pageSize.value,
};
if (appliedFilters.prompt_rule_id) params.prompt_rule_id = appliedFilters.prompt_rule_id;
if (appliedFilters.status) params.status = appliedFilters.status;
if (appliedFilters.keyword?.trim()) params.keyword = appliedFilters.keyword.trim();
if (appliedFilters.created_from) params.created_from = appliedFilters.created_from;
if (appliedFilters.created_to) params.created_to = appliedFilters.created_to;
return params;
});
const listQuery = useQuery({
queryKey: computed(() => ["schedules", "list", listParams.value]),
@@ -31,15 +81,14 @@ const listQuery = useQuery({
});
const columns = computed<TableColumnsType<ScheduleTask>>(() => [
{ title: t("custom.schedule.name"), dataIndex: "name", key: "name", width: 160 },
{ title: t("custom.schedule.rule"), dataIndex: "prompt_rule_name", key: "prompt_rule_name", width: 140 },
{ title: t("custom.schedule.cron"), dataIndex: "cron_expr", key: "cron_expr", width: 140 },
{ title: t("custom.schedule.platform"), dataIndex: "target_platform", key: "target_platform", width: 120 },
{ title: t("custom.schedule.brand"), dataIndex: "brand_name", key: "brand_name", width: 120 },
{ title: t("custom.schedule.nextRun"), dataIndex: "next_run_at", key: "next_run_at", width: 168 },
{ title: t("custom.promptRule.status"), dataIndex: "status", key: "status", width: 100 },
{ title: t("common.createdAt"), dataIndex: "created_at", key: "created_at", width: 168 },
{ title: t("common.actions"), key: "actions", width: 160, fixed: "right" },
{ title: t("custom.schedule.name"), dataIndex: "name", key: "name", width: 220 },
{ title: t("custom.schedule.rule"), dataIndex: "prompt_rule_name", key: "prompt_rule_name", width: 180 },
{ title: t("custom.instant.executionStatus"), dataIndex: "status", key: "status", width: 140 },
{ title: t("custom.instant.executionTime"), dataIndex: "cron_expr", key: "cron_expr", width: 170 },
{ title: t("custom.schedule.platform"), dataIndex: "target_platform", key: "target_platform", width: 220 },
{ title: t("custom.task.generateCount"), dataIndex: "generate_count", key: "generate_count", width: 120 },
{ title: t("custom.instant.createdTime"), dataIndex: "created_at", key: "created_at", width: 170 },
{ title: t("common.actions"), key: "actions", width: 140, fixed: "right", align: "right" },
]);
const removeMutation = useMutation({
@@ -65,6 +114,23 @@ const toggleStatusMutation = useMutation({
onError: (error) => message.error(formatError(error)),
});
function applyFilters(): void {
page.value = 1;
appliedFilters.prompt_rule_id = draftFilters.prompt_rule_id;
appliedFilters.status = draftFilters.status;
appliedFilters.keyword = draftFilters.keyword?.trim() || "";
appliedFilters.created_from = createdRange.value?.[0]?.startOf("day").toISOString();
appliedFilters.created_to = createdRange.value?.[1]?.endOf("day").toISOString();
}
function resetFilters(): void {
draftFilters.prompt_rule_id = undefined;
draftFilters.status = undefined;
draftFilters.keyword = "";
createdRange.value = null;
applyFilters();
}
function openModal(task?: ScheduleTask): void {
editingTask.value = task ?? null;
modalOpen.value = true;
@@ -77,15 +143,58 @@ function handleTableChange(nextPage: number, nextPageSize: number): void {
</script>
<template>
<div class="schedule-task-tab">
<div class="schedule-task-tab__head">
<span class="schedule-task-tab__count">
{{ t("templates.list.count", { count: listQuery.data.value?.total ?? 0 }) }}
</span>
<a-button type="primary" @click="openModal()">
<template #icon><PlusOutlined /></template>
{{ t("common.create") }}
</a-button>
<div class="task-tab">
<div class="task-tab__filters">
<div class="task-tab__filter">
<label>{{ t("custom.filters.promptRule") }}:</label>
<a-select
v-model:value="draftFilters.prompt_rule_id"
allow-clear
size="large"
:options="promptOptions"
:placeholder="t('custom.task.promptPlaceholder')"
:loading="rulesQuery.isPending.value"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter">
<label>{{ t("custom.filters.status") }}:</label>
<a-select
v-model:value="draftFilters.status"
allow-clear
size="large"
:options="statusOptions"
:placeholder="t('common.selectPlease')"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--range">
<label>{{ t("custom.filters.createdTime") }}:</label>
<a-range-picker
v-model:value="createdRange"
allow-clear
size="large"
format="YYYY-MM-DD"
@change="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--keyword">
<label>{{ t("custom.filters.name") }}:</label>
<a-input-search
v-model:value="draftFilters.keyword"
size="large"
:placeholder="t('custom.filters.namePlaceholder')"
@search="applyFilters"
@pressEnter="applyFilters"
/>
</div>
<div class="task-tab__filter task-tab__filter--action">
<a-button size="large" @click="resetFilters">{{ t("common.reset") }}</a-button>
</div>
</div>
<a-table
@@ -99,55 +208,78 @@ function handleTableChange(nextPage: number, nextPageSize: number): void {
showSizeChanger: true,
}"
row-key="id"
size="small"
:scroll="{ x: 1200 }"
:scroll="{ x: 1360 }"
@change="(p: any) => handleTableChange(p.current, p.pageSize)"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'prompt_rule_name'">
{{ record.prompt_rule_name || "--" }}
</template>
<template v-else-if="column.key === 'target_platform'">
{{ formatPublishPlatformSummary(record.target_platform) }}
</template>
<template v-else-if="column.key === 'brand_name'">
{{ record.brand_name || "--" }}
</template>
<template v-else-if="column.key === 'next_run_at'">
{{ record.next_run_at ? formatDateTime(record.next_run_at) : "--" }}
</template>
<template v-else-if="column.key === 'status'">
<a-tag :color="record.status === 'enabled' ? 'green' : 'default'">
{{ record.status === "enabled" ? t("custom.schedule.enabled") : t("custom.schedule.disabled") }}
</a-tag>
</template>
<template v-else-if="column.key === 'cron_expr'">
{{ formatCronExecutionTime(record.cron_expr) }}
</template>
<template v-else-if="column.key === 'target_platform'">
{{ formatPublishPlatformSummary(record.target_platform) }}
</template>
<template v-else-if="column.key === 'generate_count'">
--
</template>
<template v-else-if="column.key === 'created_at'">
{{ formatDateTime(record.created_at) }}
</template>
<template v-else-if="column.key === 'actions'">
<a-space :size="4">
<a-button type="link" size="small" @click="openModal(record)">
{{ t("common.edit") }}
</a-button>
<a-button
type="link"
size="small"
@click="toggleStatusMutation.mutate({
id: record.id,
status: record.status === 'enabled' ? 'disabled' : 'enabled',
})"
<div class="table-actions-row">
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click="openModal(record)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-tooltip
:title="record.status === 'enabled' ? t('custom.schedule.disabled') : t('custom.schedule.enabled')"
>
{{ record.status === "enabled" ? t("custom.schedule.disabled") : t("custom.schedule.enabled") }}
</a-button>
<a-button
type="text"
shape="circle"
size="small"
:class="[
'action-btn',
record.status === 'enabled' ? 'action-disable' : 'action-enable',
]"
@click="toggleStatusMutation.mutate({
id: record.id,
status: record.status === 'enabled' ? 'disabled' : 'enabled',
})"
>
<PauseCircleOutlined v-if="record.status === 'enabled'" />
<PlayCircleOutlined v-else />
</a-button>
</a-tooltip>
<a-popconfirm
:title="t('custom.schedule.deleteConfirm')"
@confirm="removeMutation.mutate(record.id)"
>
<a-button type="link" size="small" danger>
{{ t("common.delete") }}
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</a-space>
</div>
</template>
</template>
</a-table>
@@ -157,15 +289,49 @@ function handleTableChange(nextPage: number, nextPageSize: number): void {
</template>
<style scoped>
.schedule-task-tab__head {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
.task-tab__filters {
display: grid;
grid-template-columns: minmax(180px, 240px) minmax(180px, 240px) minmax(240px, 320px) minmax(240px, 1fr) auto;
gap: 16px;
margin-bottom: 18px;
}
.schedule-task-tab__count {
font-size: 13px;
color: #8c8c8c;
.task-tab__filter {
display: flex;
align-items: center;
gap: 12px;
}
.task-tab__filter label {
flex-shrink: 0;
color: #434343;
font-size: 14px;
white-space: nowrap;
}
.task-tab__filter :deep(.ant-select),
.task-tab__filter :deep(.ant-picker),
.task-tab__filter :deep(.ant-input-search) {
width: 100%;
}
.task-tab__filter--action {
justify-content: flex-end;
}
@media (max-width: 1400px) {
.task-tab__filters {
grid-template-columns: repeat(2, minmax(260px, 1fr));
}
.task-tab__filter--action {
justify-content: flex-start;
}
}
@media (max-width: 900px) {
.task-tab__filters {
grid-template-columns: 1fr;
}
}
</style>
apps/admin-web/src/i18n/messages/en-US.ts
+17
View File
@@ -187,6 +187,7 @@ const enUS = {
status: {
generate: {
draft: "Draft",
queued: "Queued",
generating: "Generating",
running: "Running",
completed: "Completed",
@@ -202,6 +203,9 @@ const enUS = {
},
sourceType: {
template: "Template generation",
custom_generation: "Custom generation",
instant_task: "Instant task",
schedule_task: "Scheduled task",
},
},
templates: {
@@ -568,6 +572,11 @@ const enUS = {
selectPlatform: "Target platform",
submit: "Generate now",
extraParams: "Extra parameters",
name: "Task name",
executionStatus: "Execution status",
executionTime: "Execution time",
createdTime: "Created time",
empty: "No instant tasks yet.",
},
filters: {
promptRule: "Prompt rule",
@@ -575,6 +584,14 @@ const enUS = {
generateStatus: "Generation status",
title: "Title",
generateTime: "Generation time",
status: "Status",
name: "Name",
namePlaceholder: "Search by task name",
createdTime: "Created time",
},
article: {
titleColumn: "Article title",
titleGenerating: "Generating title",
},
messages: {
ruleCreated: "Rule created.",
apps/admin-web/src/i18n/messages/zh-CN.ts
+17
View File
@@ -187,6 +187,7 @@ const zhCN = {
status: {
generate: {
draft: "草稿",
queued: "排队中",
generating: "生成中",
running: "运行中",
completed: "已完成",
@@ -202,6 +203,9 @@ const zhCN = {
},
sourceType: {
template: "模版单次生成",
custom_generation: "自定义生成",
instant_task: "即时任务",
schedule_task: "定时任务",
},
},
templates: {
@@ -577,6 +581,11 @@ const zhCN = {
selectPlatform: "目标平台",
submit: "立即生成",
extraParams: "额外参数",
name: "任务名称",
executionStatus: "执行状态",
executionTime: "执行时间",
createdTime: "创建时间",
empty: "还未创建即时任务，暂无相关数据~",
},
filters: {
promptRule: "Prompt 规则",
@@ -584,6 +593,14 @@ const zhCN = {
generateStatus: "生成状态",
title: "标题",
generateTime: "生成时间",
status: "状态",
name: "名称",
namePlaceholder: "请输入任务名称内搜索",
createdTime: "创建时间",
},
article: {
titleColumn: "文章标题",
titleGenerating: "标题生成中",
},
messages: {
ruleCreated: "规则创建成功",
apps/admin-web/src/layouts/AppShell.vue
+8 -2
View File
@@ -29,7 +29,13 @@ const quotaQuery = useQuery({
});
const userInitial = computed(() => authStore.user?.name?.slice(0, 1).toUpperCase() ?? "A");
const selectedKey = computed(() => String(route.meta.navKey ?? route.path));
const selectedKeys = computed(() => {
if (route.meta.navKey === null) {
return [];
}
return [String(route.meta.navKey ?? route.path)];
});
const pageTitle = computed(() => t(String(route.meta.titleKey ?? "route.workspace.title")));
const localeOptions = computed(() => [
@@ -117,7 +123,7 @@ async function handleLogout(): Promise<void> {
<a-menu
mode="inline"
theme="light"
:selected-keys="[selectedKey]"
:selected-keys="selectedKeys"
class="admin-menu"
>
<template v-for="section in navSections" :key="section.key">
apps/admin-web/src/lib/api.ts
+8 -4
View File
@@ -11,6 +11,8 @@ import type {
CompetitorRequest,
GenerateFromRuleRequest,
GenerateFromRuleResponse,
InstantTaskListParams,
InstantTaskListResponse,
JsonValue,
Keyword,
KeywordRequest,
@@ -27,7 +29,6 @@ import type {
QuotaSummary,
Question,
QuestionRequest,
QuestionVersion,
RecentArticle,
RefreshResponse,
ScheduleTask,
@@ -319,9 +320,6 @@ export const brandsApi = {
removeQuestion(brandId: number, questionId: number) {
return apiClient.remove<null>(`/api/tenant/brands/${brandId}/questions/${questionId}`);
},
listQuestionVersions(brandId: number) {
return apiClient.get<QuestionVersion[]>(`/api/tenant/brands/${brandId}/question-versions`);
},
listCompetitors(brandId: number) {
return apiClient.get<Competitor[]>(`/api/tenant/brands/${brandId}/competitors`);
},
@@ -408,6 +406,12 @@ export const generateApi = {
},
};
export const instantTasksApi = {
list(params?: InstantTaskListParams) {
return apiClient.get<InstantTaskListResponse>("/api/tenant/instant-tasks", { params });
},
};
export function normalizeInputParams(
payload: Record<string, JsonValue>,
articleId?: number,
apps/admin-web/src/lib/display.ts
+31 -1
View File
@@ -4,6 +4,7 @@ import { i18n } from "@/i18n";
const generateStatusMap: Record<string, { label: string; color: string }> = {
draft: { label: "status.generate.draft", color: "default" },
queued: { label: "status.generate.queued", color: "processing" },
generating: { label: "status.generate.generating", color: "processing" },
running: { label: "status.generate.running", color: "processing" },
completed: { label: "status.generate.completed", color: "success" },
@@ -43,16 +44,45 @@ export function getPublishStatusMeta(status?: string | null): { label: string; c
return meta ? { label: i18n.global.t(meta.label), color: meta.color } : { label: status, color: "default" };
}
export function getSourceTypeLabel(sourceType?: string | null): string {
export function getSourceTypeLabel(sourceType?: string | null, generationMode?: string | null): string {
if (!sourceType) {
return "--";
}
if (sourceType === "template") {
return i18n.global.t("status.sourceType.template");
}
if (sourceType === "custom_generation") {
if (generationMode === "schedule") {
return i18n.global.t("status.sourceType.schedule_task");
}
if (generationMode === "instant") {
return i18n.global.t("status.sourceType.instant_task");
}
return i18n.global.t("status.sourceType.custom_generation");
}
return sourceType;
}
export function formatCronExecutionTime(cronExpr?: string | null): string {
if (!cronExpr) {
return "--";
}
const fiveFieldMatch = cronExpr.match(/^(\d{1,2})\s+(\d{1,2})\s+\*\s+\*\s+\*$/);
if (fiveFieldMatch) {
const [, minute, hour] = fiveFieldMatch;
return `${hour.padStart(2, "0")}:${minute.padStart(2, "0")}`;
}
const sixFieldMatch = cronExpr.match(/^(\d{1,2})\s+(\d{1,2})\s+(\d{1,2})\s+\*\s+\*\s+\*$/);
if (sixFieldMatch) {
const [, second, minute, hour] = sixFieldMatch;
return `${hour.padStart(2, "0")}:${minute.padStart(2, "0")}:${second.padStart(2, "0")}`;
}
return cronExpr;
}
export function getTemplateMeta(templateKey: string): {
eyebrow: string;
helper: string;
apps/admin-web/src/router/index.ts
+1 -1
View File
@@ -63,7 +63,7 @@ const router = createRouter({
meta: {
titleKey: "route.articleEditor.title",
descriptionKey: "route.articleEditor.description",
navKey: "/articles/templates",
navKey: null,
},
},
{
apps/admin-web/src/router/meta.d.ts
Vendored
+1 -1
View File
@@ -7,7 +7,7 @@ declare module "vue-router" {
titleKey?: string;
descriptionKey?: string;
requiresAuth?: boolean;
navKey?: string;
navKey?: string | null;
}
}
apps/admin-web/src/styles.css
+73
View File
@@ -54,6 +54,44 @@ html, body, #app {
color: #1a1a1a;
}
.table-actions-row {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 4px;
}
.action-btn.ant-btn {
color: #8c8c8c;
font-size: 14px;
transition: color 0.2s, background-color 0.2s;
}
.action-edit.ant-btn:hover:not(:disabled) {
color: #52c41a;
background: #f6ffed;
}
.action-eye.ant-btn:hover:not(:disabled) {
color: #13c2c2;
background: #e6fffb;
}
.action-enable.ant-btn:hover:not(:disabled) {
color: #52c41a;
background: #f6ffed;
}
.action-disable.ant-btn:hover:not(:disabled) {
color: #fa8c16;
background: #fff7e6;
}
.action-delete.ant-btn:hover:not(:disabled) {
color: #ff4d4f;
background: #fff2f0;
}
/* Component Overrides for Ant Design to match Pro style */
.ant-layout {
min-height: 100vh;
@@ -180,3 +218,38 @@ html, body, #app {
grid-template-columns: 1fr;
}
}
/* Premium Modal Overrides */
.ant-modal-content {
border-radius: 16px !important;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08) !important;
padding: 12px !important;
}
.ant-modal-header {
border-bottom: none !important;
padding: 16px 16px 8px !important;
background: transparent !important;
}
.ant-modal-title {
font-size: 18px !important;
font-weight: 700 !important;
color: #111827 !important;
}
.ant-modal-body {
padding: 12px 16px !important;
}
.ant-modal-footer {
border-top: none !important;
padding: 8px 16px 12px !important;
}
.ant-modal-footer .ant-btn {
border-radius: 8px !important;
height: 38px !important;
padding: 0 20px !important;
font-weight: 500 !important;
}
apps/admin-web/src/views/BrandsView.vue
+95 -89
View File
@@ -2,7 +2,6 @@
import {
DeleteOutlined,
EditOutlined,
FileSearchOutlined,
PlusOutlined,
} from "@ant-design/icons-vue";
import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
@@ -13,6 +12,7 @@ import { computed, reactive, ref, watch } from "vue";
import { useI18n } from "vue-i18n";
import { brandsApi } from "@/lib/api";
import { formatDateTime } from "@/lib/display";
import { formatError } from "@/lib/errors";
const queryClient = useQueryClient();
@@ -21,8 +21,6 @@ const { t } = useI18n();
const activeTab = ref("keywords");
const selectedBrandId = ref<number | null>(null);
const selectedKeywordId = ref<number | null>(null);
const versionsDrawerOpen = ref(false);
const selectedQuestionId = ref<number | null>(null);
const brandModalOpen = ref(false);
const editingBrandId = ref<number | null>(null);
@@ -78,12 +76,6 @@ const filteredQuestionsQuery = useQuery({
queryFn: () => brandsApi.listQuestions(selectedBrandId.value as number, selectedKeywordId.value),
});
const questionVersionsQuery = useQuery({
queryKey: computed(() => ["brands", selectedBrandId.value, "question-versions"]),
enabled: computed(() => Boolean(selectedBrandId.value)),
queryFn: () => brandsApi.listQuestionVersions(selectedBrandId.value as number),
});
const competitorsQuery = useQuery({
queryKey: computed(() => ["brands", selectedBrandId.value, "competitors"]),
enabled: computed(() => Boolean(selectedBrandId.value)),
@@ -192,10 +184,7 @@ const questionMutations = {
onSuccess: async () => {
message.success(t("brands.messages.createQuestion"));
questionModalOpen.value = false;
await Promise.all([
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] }),
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "question-versions"] }),
]);
await queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] });
},
onError: (error) => message.error(formatError(error)),
}),
@@ -207,10 +196,7 @@ const questionMutations = {
onSuccess: async () => {
message.success(t("brands.messages.updateQuestion"));
questionModalOpen.value = false;
await Promise.all([
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] }),
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "question-versions"] }),
]);
await queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] });
},
onError: (error) => message.error(formatError(error)),
}),
@@ -219,10 +205,7 @@ const questionMutations = {
brandsApi.removeQuestion(selectedBrandId.value as number, questionId),
onSuccess: async () => {
message.success(t("brands.messages.deleteQuestion"));
await Promise.all([
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] }),
queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "question-versions"] }),
]);
await queryClient.invalidateQueries({ queryKey: ["brands", selectedBrandId.value, "questions"] });
},
onError: (error) => message.error(formatError(error)),
}),
@@ -273,9 +256,6 @@ const competitorMutations = {
const selectedKeyword = computed(() =>
keywordsQuery.data.value?.find((item) => item.id === selectedKeywordId.value) ?? null,
);
const versionItems = computed(() =>
(questionVersionsQuery.data.value || []).filter((item) => item.question_id === selectedQuestionId.value),
);
const questionColumns = computed<TableColumnsType<Question>>(() => [
{
@@ -287,12 +267,13 @@ const questionColumns = computed<TableColumnsType<Question>>(() => [
title: t("common.createdAt"),
dataIndex: "created_at",
key: "created_at",
width: 160,
width: 180,
},
{
title: t("common.actions"),
key: "actions",
width: 180,
width: 120,
align: "right",
},
]);
@@ -379,11 +360,6 @@ function openCompetitorModal(competitor?: Competitor): void {
competitorModalOpen.value = true;
}
function openVersions(questionId: number): void {
selectedQuestionId.value = questionId;
versionsDrawerOpen.value = true;
}
async function submitBrand(): Promise<void> {
if (!brandForm.name.trim()) {
return;
@@ -474,13 +450,28 @@ async function submitCompetitor(): Promise<void> {
</div>
<div class="brands-view__brand-card-actions">
<a-button size="small" @click.stop="openBrandModal(brand)">
<template #icon><EditOutlined /></template>
</a-button>
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click.stop="openBrandModal(brand)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-popconfirm @confirm="brandMutations.remove.mutate(brand.id)">
<template #title>{{ t("brands.deleteBrand") }}</template>
<a-button size="small" danger @click.stop>
<template #icon><DeleteOutlined /></template>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
@click.stop
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</div>
@@ -497,7 +488,6 @@ async function submitCompetitor(): Promise<void> {
<aside class="brands-view__keywords-panel">
<div class="brands-view__section-head brands-view__section-head--compact">
<div>
<p class="eyebrow">{{ t("brands.sections.keywords") }}</p>
<h3>{{ t("brands.sections.keywords") }}</h3>
</div>
<a-button type="primary" size="small" @click="openKeywordModal()">
@@ -516,13 +506,28 @@ async function submitCompetitor(): Promise<void> {
>
<span>{{ keyword.name }}</span>
<div class="brands-view__keyword-actions">
<a-button size="small" @click.stop="openKeywordModal(keyword)">
<template #icon><EditOutlined /></template>
</a-button>
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click.stop="openKeywordModal(keyword)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-popconfirm @confirm="keywordMutations.remove.mutate(keyword.id)">
<template #title>{{ t("common.delete") }}</template>
<a-button size="small" danger @click.stop>
<template #icon><DeleteOutlined /></template>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
@click.stop
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</div>
@@ -554,24 +559,34 @@ async function submitCompetitor(): Promise<void> {
<template v-if="column.key === 'question_text'">
<div class="brands-view__question-cell">
<strong>{{ record.question_text }}</strong>
<span>{{ record.version_no ? `v${record.version_no}` : "--" }}</span>
</div>
</template>
<template v-else-if="column.key === 'created_at'">
{{ record.created_at }}
<span class="brands-view__datetime">{{ formatDateTime(record.created_at) }}</span>
</template>
<template v-else-if="column.key === 'actions'">
<div class="brands-view__inline-actions">
<a-button size="small" @click="openVersions(record.id)">
<template #icon><FileSearchOutlined /></template>
</a-button>
<a-button size="small" @click="openQuestionModal(record)">
<template #icon><EditOutlined /></template>
</a-button>
<div class="table-actions-row">
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click="openQuestionModal(record)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-popconfirm @confirm="questionMutations.remove.mutate(record.id)">
<template #title>{{ t("common.delete") }}</template>
<a-button size="small" danger>
<template #icon><DeleteOutlined /></template>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</div>
@@ -608,13 +623,27 @@ async function submitCompetitor(): Promise<void> {
</a>
</div>
<div class="brands-view__inline-actions">
<a-button size="small" @click="openCompetitorModal(competitor)">
<template #icon><EditOutlined /></template>
</a-button>
<a-tooltip :title="t('common.edit')">
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
@click="openCompetitorModal(competitor)"
>
<EditOutlined />
</a-button>
</a-tooltip>
<a-popconfirm @confirm="competitorMutations.remove.mutate(competitor.id)">
<template #title>{{ t("common.delete") }}</template>
<a-button size="small" danger>
<template #icon><DeleteOutlined /></template>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</div>
@@ -641,6 +670,7 @@ async function submitCompetitor(): Promise<void> {
<a-modal
v-model:open="brandModalOpen"
:title="editingBrandId ? t('brands.editBrand') : t('brands.newBrand')"
centered
@ok="submitBrand"
>
<a-form layout="vertical">
@@ -659,6 +689,7 @@ async function submitCompetitor(): Promise<void> {
<a-modal
v-model:open="keywordModalOpen"
:title="editingKeywordId ? t('common.edit') : t('brands.actions.newKeyword')"
centered
@ok="submitKeyword"
>
<a-form layout="vertical">
@@ -671,6 +702,7 @@ async function submitCompetitor(): Promise<void> {
<a-modal
v-model:open="questionModalOpen"
:title="editingQuestionId ? t('common.edit') : t('brands.actions.newQuestion')"
centered
@ok="submitQuestion"
>
<a-form layout="vertical">
@@ -689,6 +721,7 @@ async function submitCompetitor(): Promise<void> {
<a-modal
v-model:open="competitorModalOpen"
:title="editingCompetitorId ? t('common.edit') : t('brands.actions.newCompetitor')"
centered
@ok="submitCompetitor"
>
<a-form layout="vertical">
@@ -709,22 +742,6 @@ async function submitCompetitor(): Promise<void> {
</a-form-item>
</a-form>
</a-modal>
<a-drawer
v-model:open="versionsDrawerOpen"
:title="t('brands.sections.versions')"
width="520"
class="brands-view__versions-drawer"
>
<a-list :data-source="versionItems" item-layout="vertical">
<template #renderItem="{ item }">
<a-list-item>
<a-list-item-meta :title="`v${item.version_no}`" :description="item.created_at" />
<p class="brands-view__version-text">{{ item.question_text }}</p>
</a-list-item>
</template>
</a-list>
</a-drawer>
</div>
</template>
@@ -880,7 +897,8 @@ async function submitCompetitor(): Promise<void> {
.brands-view__keyword-actions,
.brands-view__inline-actions {
display: flex;
gap: 8px;
align-items: center;
gap: 4px;
}
.brands-view__keyword-layout {
@@ -922,12 +940,10 @@ async function submitCompetitor(): Promise<void> {
.brands-view__question-cell {
display: flex;
flex-direction: column;
gap: 4px;
}
.brands-view__question-cell span {
color: var(--muted);
font-size: 12px;
.brands-view__datetime {
white-space: nowrap;
}
.brands-view__competitor-grid {
@@ -975,16 +991,6 @@ async function submitCompetitor(): Promise<void> {
font-size: 12px;
}
.brands-view__version-text {
margin: 0;
color: #334155;
line-height: 1.6;
}
.brands-view__versions-drawer :deep(.ant-drawer-body) {
padding: 18px 24px 24px;
}
@media (max-width: 1080px) {
.brands-view__brand-grid,
.brands-view__keyword-layout,
apps/admin-web/src/views/CustomGenerateView.vue
+4
View File
@@ -7,6 +7,7 @@ import { ref } from "vue";
import { useI18n } from "vue-i18n";
import CustomArticleTab from "@/components/CustomArticleTab.vue";
import InstantTaskTab from "@/components/InstantTaskTab.vue";
import PromptRuleTab from "@/components/PromptRuleTab.vue";
import ScheduleTaskTab from "@/components/ScheduleTaskTab.vue";
import InstantGenerateModal from "@/components/InstantGenerateModal.vue";
@@ -56,6 +57,9 @@ function openScheduleModal(): void {
<a-tab-pane key="articles" :tab="t('custom.tabs.articles')">
<CustomArticleTab />
</a-tab-pane>
<a-tab-pane key="instantTasks" :tab="t('custom.tabs.instantTasks')">
<InstantTaskTab />
</a-tab-pane>
<a-tab-pane key="scheduleTasks" :tab="t('custom.tabs.scheduleTasks')">
<ScheduleTaskTab />
</a-tab-pane>
apps/admin-web/src/views/TemplatesView.vue
+24 -16
View File
@@ -172,7 +172,8 @@ const articleColumns = computed<TableColumnsType<ArticleListItem>>(() => [
{
title: t("common.actions"),
key: "actions",
width: 180,
width: 120,
align: "right",
},
]);
@@ -447,24 +448,36 @@ async function handleDelete(articleId: number): Promise<void> {
</template>
<template v-else-if="column.key === 'actions'">
<div class="templates-view__actions">
<div class="table-actions-row">
<a-tooltip
:title="canEditArticle(record.generate_status) ? t('templates.list.edit') : t('templates.list.editDisabled')"
>
<a-button
size="small"
:disabled="!canEditArticle(record.generate_status)"
@click="openEditor(record)"
>
<template #icon><EditOutlined /></template>
</a-button>
<span>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-edit"
:disabled="!canEditArticle(record.generate_status)"
@click="openEditor(record)"
>
<EditOutlined />
</a-button>
</span>
</a-tooltip>
<a-popconfirm
:title="t('templates.list.deleteConfirm')"
@confirm="handleDelete(record.id)"
>
<a-button size="small" danger :loading="deleteMutation.isPending.value">
<template #icon><DeleteOutlined /></template>
<a-button
type="text"
shape="circle"
size="small"
class="action-btn action-delete"
:loading="deleteMutation.isPending.value"
:title="t('common.delete')"
>
<DeleteOutlined />
</a-button>
</a-popconfirm>
</div>
@@ -624,11 +637,6 @@ async function handleDelete(articleId: number): Promise<void> {
font-size: 12px;
}
.templates-view__actions {
display: flex;
gap: 8px;
}
.templates-view__status-tag {
display: inline-flex;
align-items: center;