refactor(admin-web): unify page headers with shared title card
Introduce .page-title-card style and migrate Images, Knowledge, KolDashboard, KolManage, KolProfile views to the shared header layout. Add subtitle copy for KOL dashboard and manage views. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -352,22 +352,13 @@ async function confirmDeleteImage(image: ImageAssetItem) {
|
||||
|
||||
<template>
|
||||
<div class="images-page">
|
||||
<div class="images-page__hero">
|
||||
<h2>{{ t("images.title") }}</h2>
|
||||
<p>{{ t("images.description") }}</p>
|
||||
</div>
|
||||
|
||||
<div class="images-main-card">
|
||||
<div class="images-toolbar">
|
||||
<div class="images-toolbar__left">
|
||||
<a-input-search
|
||||
v-model:value="searchKeyword"
|
||||
:placeholder="t('images.searchPlaceholder')"
|
||||
style="width: 300px"
|
||||
allow-clear
|
||||
/>
|
||||
<section class="page-title-card">
|
||||
<div class="page-title-card__header">
|
||||
<div class="page-title-card__copy">
|
||||
<h2>{{ t("images.title") }}</h2>
|
||||
<p>{{ t("images.description") }}</p>
|
||||
</div>
|
||||
<div class="images-toolbar__right">
|
||||
<div class="page-title-card__actions">
|
||||
<a-button type="primary" :disabled="imageUploadBusy" @click="triggerUpload">
|
||||
<template #icon><UploadOutlined /></template>
|
||||
{{ t("images.uploadBtn") }}
|
||||
@@ -383,6 +374,19 @@ async function confirmDeleteImage(image: ImageAssetItem) {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="images-main-card">
|
||||
<div class="images-toolbar">
|
||||
<div class="images-toolbar__left">
|
||||
<a-input-search
|
||||
v-model:value="searchKeyword"
|
||||
:placeholder="t('images.searchPlaceholder')"
|
||||
style="width: 300px"
|
||||
allow-clear
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="images-layout-inner">
|
||||
<aside class="images-sidebar">
|
||||
@@ -579,19 +583,6 @@ async function confirmDeleteImage(image: ImageAssetItem) {
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.images-page__hero h2 {
|
||||
margin: 0;
|
||||
color: #111827;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.images-page__hero p {
|
||||
margin: 0;
|
||||
color: #6b7280;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.images-main-card {
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
|
||||
Reference in New Issue
Block a user