拆分平台配置页 Agiso 与 khhao 区块
This commit is contained in:
yml
@@ -0,0 +1,184 @@
|
||||
<script setup lang="ts">
|
||||
import type { AdminAgisoObservedShopItem } from '@/types/admin'
|
||||
import { formatAdminDateTime } from '@/utils/admin-time'
|
||||
|
||||
import type { EditableDefaults, EditableShop } from '@/composables/admin/platform-shops/types'
|
||||
|
||||
type Props = {
|
||||
agisoFilePath: string
|
||||
defaults: EditableDefaults
|
||||
shops: EditableShop[]
|
||||
observedShops: AdminAgisoObservedShopItem[]
|
||||
saving: boolean
|
||||
isShopExpanded: (id: string) => boolean
|
||||
toggleShop: (id: string) => void
|
||||
expandAllShops: () => void
|
||||
collapseAllShops: () => void
|
||||
describeShop: (shop: EditableShop) => string
|
||||
removeShop: (id: string) => void
|
||||
importObservedShop: (item: AdminAgisoObservedShopItem) => void
|
||||
saveAgisoConfigs: () => void | Promise<void>
|
||||
}
|
||||
|
||||
defineProps<Props>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="meta-card">
|
||||
<div class="meta-line">
|
||||
<span class="meta-label">配置文件</span>
|
||||
<code>{{ agisoFilePath || '-' }}</code>
|
||||
</div>
|
||||
<div class="meta-line">
|
||||
<span class="meta-label">职责</span>
|
||||
<span>管理 Agiso 默认消息模板、店铺 AccessToken 以及店铺级模板覆盖。该区域不处理 khhao 登录与拉单。</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="table-card">
|
||||
<div class="section-title-row">
|
||||
<div>
|
||||
<h3>默认消息模板</h3>
|
||||
<p>Agiso 店铺未单独配置时，统一使用这里的领取消息与自动发货消息模板。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-grid">
|
||||
<label class="field-block field-wide">
|
||||
<span>默认领取链接消息模板</span>
|
||||
<textarea
|
||||
v-model="defaults.messageTemplate"
|
||||
class="text-area"
|
||||
placeholder="例如：您的订单 {platformOrderId} 已创建领取链接，请尽快打开并完成领取：{claimUrl}"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="field-block field-wide">
|
||||
<span>默认自动发货消息模板</span>
|
||||
<textarea
|
||||
v-model="defaults.autoDeliveryMessageTemplate"
|
||||
class="text-area"
|
||||
placeholder="例如：您的订单 {platformOrderId} 已完成自动发货，请注意查收。"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="table-card">
|
||||
<div class="section-title-row">
|
||||
<div>
|
||||
<h3>Agiso 店铺列表</h3>
|
||||
<p>每家店铺可单独配置 AccessToken 和模板覆盖。建议先用“近期识别到的店铺”导入，再补 AccessToken。</p>
|
||||
</div>
|
||||
<div class="section-actions">
|
||||
<el-button :disabled="shops.length === 0" text @click="expandAllShops">全部展开</el-button>
|
||||
<el-button :disabled="shops.length === 0" text @click="collapseAllShops">全部折叠</el-button>
|
||||
<el-button :loading="saving" round type="primary" @click="saveAgisoConfigs">保存 Agiso 配置</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="shops.length === 0" class="empty-inline">当前还没有 Agiso 店铺配置，先新增一条。</div>
|
||||
|
||||
<div v-for="shop in shops" :key="shop.id" class="shop-card">
|
||||
<button type="button" class="shop-summary" @click="toggleShop(shop.id)">
|
||||
<div class="shop-summary-main">
|
||||
<strong>{{ shop.shopName || shop.shopId || '未命名店铺' }}</strong>
|
||||
<span class="cell-subtle">ID: {{ shop.shopId || '未填写' }}</span>
|
||||
</div>
|
||||
<div class="shop-summary-side">
|
||||
<span class="shop-status" :class="{ 'is-disabled': !shop.enabled }">
|
||||
{{ shop.enabled ? '已启用' : '已停用' }}
|
||||
</span>
|
||||
<span class="shop-summary-copy">{{ describeShop(shop) }}</span>
|
||||
<span class="shop-toggle">{{ isShopExpanded(shop.id) ? '收起' : '展开' }}</span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<div v-if="isShopExpanded(shop.id)" class="shop-body">
|
||||
<div class="form-grid">
|
||||
<label class="field-block">
|
||||
<span>店铺 ID</span>
|
||||
<input v-model="shop.shopId" class="text-input" placeholder="例如 693760716" />
|
||||
</label>
|
||||
|
||||
<label class="field-block">
|
||||
<span>店铺名称</span>
|
||||
<input v-model="shop.shopName" class="text-input" placeholder="例如 大锤商行" />
|
||||
</label>
|
||||
|
||||
<label class="field-block field-wide">
|
||||
<span>AccessToken</span>
|
||||
<input v-model="shop.accessToken" class="text-input" placeholder="AldsIdle..." />
|
||||
</label>
|
||||
|
||||
<label class="field-block field-wide">
|
||||
<span>领取链接消息模板</span>
|
||||
<textarea
|
||||
v-model="shop.messageTemplate"
|
||||
class="text-area"
|
||||
placeholder="留空则沿用默认领取链接模板"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="field-block field-wide">
|
||||
<span>自动发货消息模板</span>
|
||||
<textarea
|
||||
v-model="shop.autoDeliveryMessageTemplate"
|
||||
class="text-area"
|
||||
placeholder="留空则沿用默认自动发货模板"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="shop-actions">
|
||||
<label class="checkbox-line">
|
||||
<input v-model="shop.enabled" type="checkbox" />
|
||||
<span>启用店铺级覆盖</span>
|
||||
</label>
|
||||
<el-button link type="danger" @click="removeShop(shop.id)">删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="table-card">
|
||||
<div class="section-title-row">
|
||||
<div>
|
||||
<h3>近期识别到的 Agiso 店铺</h3>
|
||||
<p>从 webhook 自动识别出的店铺，可一键导入到上方店铺列表。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>店铺</th>
|
||||
<th>Webhook 次数</th>
|
||||
<th>最近出现时间</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="item in observedShops" :key="item.shopId">
|
||||
<td>
|
||||
<div class="cell-stack">
|
||||
<strong>{{ item.displayShopName || item.shopId }}</strong>
|
||||
<span class="cell-subtle">ID: {{ item.shopId }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>{{ item.webhookEventCount }}</td>
|
||||
<td>{{ formatAdminDateTime(item.latestSeenAt) }}</td>
|
||||
<td>{{ item.configured ? '已配置' : '未配置' }}</td>
|
||||
<td>
|
||||
<el-button v-if="!item.configured" link type="primary" @click="importObservedShop(item)">导入到店铺</el-button>
|
||||
<span v-else class="cell-subtle">已存在</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="observedShops.length === 0">
|
||||
<td colspan="5" class="empty-inline">最近还没有识别到可用店铺。</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
</template>
|
||||
Reference in New Issue
Block a user