kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(float): inline panel warnings, drop add-button type picker, mirror reference more-button defaults

Browse Source
This commit is contained in:
kate522
2026-09-26 21:01:55 +08:00
parent 6f2adfaef1
commit eb14c4afd3
5 changed files with 106 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/admin/src/components/floating/FloatBtnItemPanel.vue
+11 -23
View File
@@ -5,6 +5,9 @@
<i class="fa fas fa-arrows-alt-v" />
</button>
<strong class="float-btn-panel__title">{{ meta.title }}</strong>
<span v-if="meta.warn" class="float-btn-panel__warn">
<i class="fa fas fa-info-circle" /> {{ meta.warn }}
</span>
<template v-if="modelValue.type !== 'more'">
<n-tag v-if="modelValue.pc_s" size="small" type="info" :bordered="false">PC</n-tag>
<n-tag v-if="modelValue.m_s" size="small" type="warning" :bordered="false">移动</n-tag>
@@ -14,10 +17,6 @@
<i class="fa fas float-btn-panel__arrow" :class="expanded ? 'fa-angle-up' : 'fa-angle-down'" />
</div>
<div v-if="meta.warn" class="float-btn-panel__warn">
<i class="fa fas fa-info-circle" /> {{ meta.warn }}
</div>
<div v-show="expanded" class="float-btn-panel__body">
<div class="float-btn-panel__subtitle">{{ meta.panel }}</div>
@@ -35,23 +34,9 @@
<n-input :value="modelValue.desc" @update:value="patch({ desc: $event })" />
</n-form-item>
<template v-if="modelValue.type === 'add'">
<n-form-item label="选择按钮">
<div class="float-btn-panel__block">
<n-select
:value="modelValue.btns"
:options="ADD_BTN_OPTIONS"
multiple
placeholder="请选择按钮"
@update:value="patch({ btns: $event })"
/>
<div class="float-btn-panel__desc">选择并排序按钮，未开启的功能不会显示</div>
</div>
</n-form-item>
<n-form-item label="按钮图标">
<FaIconPicker v-model="addIcon" placeholder="选择图标" />
</n-form-item>
</template>
<n-form-item v-if="modelValue.type === 'add'" label="按钮图标">
<FaIconPicker v-model="addIcon" placeholder="选择图标" />
</n-form-item>
<n-form-item v-if="modelValue.type === 'service_qq'" label="QQ号码">
<n-input :value="modelValue.qq" placeholder="仅填写数字" @update:value="patch({ qq: $event })" />
@@ -76,7 +61,7 @@ import FaIconPicker from '@/components/form/FaIconPicker.vue'
import AksMediaField from '@/components/form/AksMediaField.vue'
import FloatBtnCommonFields from './FloatBtnCommonFields.vue'
import FloatMoreButtonsEditor from './FloatMoreButtonsEditor.vue'
import { ADD_BTN_OPTIONS, FLOAT_BTN_META } from './floating-defaults.js'
import { FLOAT_BTN_META } from './floating-defaults.js'
const props = defineProps({
modelValue: { type: Object, required: true },
@@ -135,9 +120,12 @@ function patch(partial) {
}
.float-btn-panel__warn {
padding: 0 14px 10px 48px;
font-size: 12px;
color: #f0a020;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
min-width: 0;
}
.float-btn-panel__body {
assets/admin/src/components/floating/floating-defaults.js
+30 -7
View File
@@ -16,9 +16,32 @@ export const FLOAT_BTN_META = {
more: { title: '更多按钮', panel: '添加更多自定义按钮' },
}
/** 发布按钮可选项。 */
export const ADD_BTN_OPTIONS = [{ label: '文章投稿', value: 'post' }]
const themeUri = (window.aksrtAdminData?.themeUri || '').replace(/\/$/, '')
/** 「更多按钮」出厂默认项（对齐参考主题 float_btn.more 默认值）。 */
export function giftMoreButton() {
return {
desc: '本站同款主题模板',
icon: 'zibsvg-gift-color',
link: { url: '', target: '' },
hover: `<a href="https://www.zibll.com/" target="_blank">
<div class="flex c-red">
<img class="flex0" alt="zibll子比主题" src="${themeUri}/assets/img/logo.png" height="30">
<div class="flex1 ml10">
<dt>本站同款主题模板</dt>
<div class="px12 mt10 muted-color">zibll子比主题是一款漂亮优雅的网站主题模板，功能强大，配置简单。</div>
<div class="but mt10 p2-10 c-blue btn-block px12">查看详情</div>
</div>
</div>
</a>`,
hover_width: 240,
pc_s: true,
m_s: true,
color: { color: '', bg: 'rgba(255, 111, 6, 0.2)' },
}
}
/** 「添加按钮」新增项默认值（参考主题 group 字段默认值）。 */
export function defaultMoreButton() {
return {
desc: '',
@@ -26,17 +49,17 @@ export function defaultMoreButton() {
link: { url: '', target: '' },
hover: '',
hover_width: 200,
pc_s: false,
m_s: false,
color: { color: '', bg: 'rgba(255, 111, 6, 0.2)' },
pc_s: true,
m_s: true,
color: { color: '', bg: '' },
}
}
export function defaultItems() {
return [
{ type: 'more', buttons: [defaultMoreButton()] },
{ type: 'more', buttons: [giftMoreButton()] },
{ type: 'pay_vip', pc_s: true, m_s: true, color: { color: '#f2c97d', bg: 'rgba(62,62,67,0.9)' } },
{ type: 'add', pc_s: true, m_s: false, color: emptyColor(), btns: ['post'], icon: 'fa fas fa-pencil-alt' },
{ type: 'add', pc_s: true, m_s: false, color: emptyColor(), icon: 'fa fas fa-pencil-alt' },
{ type: 'service_qq', pc_s: false, m_s: false, color: emptyColor(), qq: '' },
{ type: 'service_wechat', pc_s: true, m_s: true, color: emptyColor(), wechat_img: '' },
{ type: 'theme_mode', pc_s: false, m_s: false, color: emptyColor() },