From 1447b4043a74bba50b9d958c063071b3244e2413 Mon Sep 17 00:00:00 2001 From: "jlj05024111@163.com" Date: Fri, 29 Aug 2025 19:36:41 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=A0=87=E7=AD=BE?= =?UTF-8?q?=E5=A2=99=E6=8F=92=E4=BB=B6=E6=9C=AA=E9=85=8D=E7=BD=AE=E6=8C=87?= =?UTF-8?q?=E5=AE=9A=E9=83=A8=E4=BB=B6=E5=8F=82=E6=95=B0=E6=97=B6=E5=AF=BC?= =?UTF-8?q?=E8=87=B4=E5=88=9D=E6=AC=A1=E5=8A=A0=E8=BD=BD=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=E5=BC=82=E5=B8=B8=EF=BC=9B=E4=BF=AE=E5=A4=8D=E6=90=9C=E7=B4=A2?= =?UTF-8?q?=E6=A0=8F=E6=9C=AA=E9=85=8D=E7=BD=AE=E5=9B=BE=E7=89=87=E6=97=B6?= =?UTF-8?q?=E6=90=9C=E7=B4=A2=E6=A1=86=E6=A0=B7=E5=BC=8F=E5=BC=82=E5=B8=B8?= =?UTF-8?q?=EF=BC=9B=E4=BF=AE=E5=A4=8D=E8=87=AA=E5=AE=9A=E4=B9=89=E8=BE=B9?= =?UTF-8?q?=E6=A1=868=E8=BE=B9=E6=A1=86=E6=A0=B7=E5=BC=8F=E5=AF=BC?= =?UTF-8?q?=E8=87=B4=E8=BD=AE=E6=92=AD=E5=88=97=E8=A1=A8=E9=A1=B9=E9=97=B4?= =?UTF-8?q?=E9=9A=94=E6=A0=B7=E5=BC=8F=E5=BC=82=E5=B8=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 6 +++ README.md | 2 +- docs/.vitepress/config.ts | 2 +- ...age-search-box.md => custom-search-box.md} | 27 ++-------- src/custom-border/custom-dv-8/custom-dv-8.tsx | 9 ++-- .../custom-image-search-box.scss | 54 ------------------- src/custom-image-search-box/index.ts | 16 ------ .../custom-search-box.controller.ts} | 2 +- .../custom-search-box.provider.ts} | 10 ++-- src/custom-search-box/custom-search-box.scss | 35 ++++++++++++ .../custom-search-box.tsx} | 17 +++--- src/custom-search-box/index.ts | 13 +++++ src/index.ts | 4 +- src/screen-dashboard/screen-dashboard.scss | 18 +++---- src/tagged-wall/tagged-wall.controller.ts | 4 +- 15 files changed, 93 insertions(+), 126 deletions(-) rename docs/guide/{custom-image-search-box.md => custom-search-box.md} (53%) delete mode 100644 src/custom-image-search-box/custom-image-search-box.scss delete mode 100644 src/custom-image-search-box/index.ts rename src/{custom-image-search-box/custom-image-search-box.controller.ts => custom-search-box/custom-search-box.controller.ts} (87%) rename src/{custom-image-search-box/custom-image-search-box.provider.ts => custom-search-box/custom-search-box.provider.ts} (64%) create mode 100644 src/custom-search-box/custom-search-box.scss rename src/{custom-image-search-box/custom-image-search-box.tsx => custom-search-box/custom-search-box.tsx} (72%) create mode 100644 src/custom-search-box/index.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 6470328..91b7ace 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,12 @@ - 合并项目util - 更新标签墙文档 +### Fixed + +- 修复标签墙插件未配置指定部件参数时导致初次加载数据异常 +- 修复搜索栏未配置图片时搜索框样式异常 +- 修复自定义边框8边框样式导致轮播列表项间隔样式异常 + ## [0.0.3] - 2024-08-23 ### Added diff --git a/README.md b/README.md index c2d069b..04e48e6 100644 --- a/README.md +++ b/README.md @@ -24,7 +24,7 @@ iBiz数据大屏插件，提供以下核心功能模块： │ ├─ custom-border 自定义边框样式（1-13） │ ├─ custom-button 自定义按钮样式（1-6） │ ├─ custom-decoration 自定义装饰器样式（1-6，11） -│ ├─ custom-image-search-box 图片搜索框 +│ ├─ custom-search-box 搜索框 │ ├─ digital-flop 数字翻牌器 │ ├─ index.ts │ ├─ percent-pond 百分比进度条 diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index c3f3626..c455244 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -89,7 +89,7 @@ export default defineConfig({ }, { text: '图片搜索框', - link: '/guide/custom-image-search-box', + link: '/guide/custom-search-box', }, { text: '水位图', diff --git a/docs/guide/custom-image-search-box.md b/docs/guide/custom-search-box.md similarity index 53% rename from docs/guide/custom-image-search-box.md rename to docs/guide/custom-search-box.md index dddcb06..e8e89ee 100644 --- a/docs/guide/custom-image-search-box.md +++ b/docs/guide/custom-search-box.md @@ -1,6 +1,6 @@ -# 图片搜索框 +# 搜索框 -图片搜索框为输入框编辑器的扩展模式，主要应用于需要自定义背景的搜索框。 +自定义搜索框为输入框编辑器的扩展模式，可同时让所有部件进行搜索。 ## 效果呈现 @@ -12,20 +12,6 @@ ::: details 点我查看代码 -编辑器样式 - -```json -[ - { - "codename": "CUSTOM_IMAGE_SEARCH_BOX", - "pssyspfpluginid": "UsrPFPlugin0815614534", - "repdefault": 0, - "validflag": 1, - "pssyseditorstylename": "自定义图片搜索框", - "pseditortypeid": "RAW" - } -] -``` 编辑器插件 @@ -34,8 +20,8 @@ { "plugintype": "EDITOR_CUSTOMSTYLE", "codename": "UsrPFPlugin0815614534", - "plugintag": "CUSTOM_IMAGE_SEARCH_BOX", - "pssyspfpluginname": "自定义图片搜索框" + "plugintag": "CUSTOM_SEARCH_BOX", + "pssyspfpluginname": "自定义搜索框" } ] ``` @@ -50,9 +36,6 @@ ![配置](../public/img/custom-image-search-box_configStyle.png) -插件自定义图片配置截图 - -![配置](../public/img/custom-image-search-box_config_img.png) ## 成员参数配置 @@ -62,5 +45,5 @@ ## 功能说明 -- 支持自定义图片输入框背景(可不配置自定义图片，输入框背景展示为透明色) - 支持占位提示配置 +- 搜索时可使所有部件进行搜索 diff --git a/src/custom-border/custom-dv-8/custom-dv-8.tsx b/src/custom-border/custom-dv-8/custom-dv-8.tsx index d9c1d29..0c31b20 100644 --- a/src/custom-border/custom-dv-8/custom-dv-8.tsx +++ b/src/custom-border/custom-dv-8/custom-dv-8.tsx @@ -63,12 +63,13 @@ export const CustomDV8 = defineComponent({ }); const pathD = (padding: number) => { + const borderWidth = 0.5; if (props.reverse) { // 当reverse为true时，从左上角开始，逆时针方向绘制 - return `M ${2.5 + padding},${2.5 + padding} L ${2.5 + padding},${height.value - 2.5 - props.offsetY - padding} L ${width.value - 2.5 - padding},${height.value - 2.5 - props.offsetY - padding} L ${width.value - 2.5 - padding},${2.5 + padding} Z`; + return `M ${borderWidth + padding},${borderWidth + padding} L ${borderWidth + padding},${height.value - borderWidth - props.offsetY - padding} L ${width.value - borderWidth - padding},${height.value - borderWidth - props.offsetY - padding} L ${width.value - borderWidth - padding},${borderWidth + padding} Z`; } // 当reverse为false时，从左上角开始，顺时针方向绘制 - return `M ${2.5 + padding},${2.5 + padding} L ${width.value - 2.5 - padding},${2.5 + padding} L ${width.value - 2.5 - padding},${height.value - 2.5 - props.offsetY - padding} L ${2.5 + padding},${height.value - 2.5 - props.offsetY - padding} Z`; + return `M ${borderWidth + padding},${borderWidth + padding} L ${width.value - borderWidth - padding},${borderWidth + padding} L ${width.value - borderWidth - padding},${height.value - borderWidth - props.offsetY - padding} L ${borderWidth + padding},${height.value - borderWidth - props.offsetY - padding} Z`; }; /** @@ -178,7 +179,7 @@ export const CustomDV8 = defineComponent({ const renderBorder = () => { const _width = width.value - props.offsetX; const _height = height.value - props.offsetY; - const padding = 8; + const padding = 2; return ( { - v.component(CustomImageSearchBox.name, CustomImageSearchBox); - registerPortletProvider( - 'EDITOR_CUSTOMSTYLE_CUSTOM_IMAGE_SEARCH_BOX', - () => new CustomImageSearchBoxEditorProvider(), - ); - }, -); diff --git a/src/custom-image-search-box/custom-image-search-box.controller.ts b/src/custom-search-box/custom-search-box.controller.ts similarity index 87% rename from src/custom-image-search-box/custom-image-search-box.controller.ts rename to src/custom-search-box/custom-search-box.controller.ts index b10408c..3117df1 100644 --- a/src/custom-image-search-box/custom-image-search-box.controller.ts +++ b/src/custom-search-box/custom-search-box.controller.ts @@ -8,7 +8,7 @@ import { IDBToolbarPortlet } from '@ibiz/model-core'; * @class RawActivityEditorController * @extends {EditorController} */ -export class CustomImageSearchBoxEditorController extends PortletPartController { +export class CustomSearchBoxEditorController extends PortletPartController { /** * 占位提示 * diff --git a/src/custom-image-search-box/custom-image-search-box.provider.ts b/src/custom-search-box/custom-search-box.provider.ts similarity index 64% rename from src/custom-image-search-box/custom-image-search-box.provider.ts rename to src/custom-search-box/custom-search-box.provider.ts index d0d1e70..5707562 100644 --- a/src/custom-image-search-box/custom-image-search-box.provider.ts +++ b/src/custom-search-box/custom-search-box.provider.ts @@ -5,7 +5,7 @@ import { IPortletProvider, } from '@ibiz-template/runtime'; import { IDBToolbarPortlet } from '@ibiz/model-core'; -import { CustomImageSearchBoxEditorController } from './custom-image-search-box.controller'; +import { CustomSearchBoxEditorController } from './custom-search-box.controller'; /** * 直接内容(活动)编辑器适配器 @@ -14,15 +14,15 @@ import { CustomImageSearchBoxEditorController } from './custom-image-search-box. * @class RawActivityEditorProvider * @implements {EditorProvider} */ -export class CustomImageSearchBoxEditorProvider implements IPortletProvider { - component: string = 'CustomImageSearchBox'; +export class CustomSearchBoxEditorProvider implements IPortletProvider { + component: string = 'CustomSearchBox'; async createController( portletModel: IDBToolbarPortlet, dashboard: IDashboardController, parent?: IPortletContainerController, - ): Promise { - const c = new CustomImageSearchBoxEditorController( + ): Promise { + const c = new CustomSearchBoxEditorController( portletModel, dashboard, parent, diff --git a/src/custom-search-box/custom-search-box.scss b/src/custom-search-box/custom-search-box.scss new file mode 100644 index 0000000..0c47f6b --- /dev/null +++ b/src/custom-search-box/custom-search-box.scss @@ -0,0 +1,35 @@ +/* stylelint-disable selector-class-pattern */ +@include b('custom-search-box') { + width: 100%; + min-width: 200px; + height: 34px; + + @include e('input') { + .el-input__wrapper { + .el-input__suffix::before { + position: absolute; + top: 9px; + right: 37px; + display: block; + width: 4px; + height: 13px; + content: ''; + background-color: var(--ibiz-screen-dashboard-primary-active-color,#00e2f4); + border-radius: 4px; + } + + &.is-focus { + box-shadow: 0 0 0 1px var(--ibiz-screen-dashboard-border-color, var(--el-input-hover-border-color)) inset; + } + + &:hover { + box-shadow: 0 0 0 1px var(--ibiz-screen-dashboard-border-color, var(--el-input-hover-border-color)) inset; + } + } + } + + @include e(search-icon) { + color: var(--ibiz-screen-dashboard-primary-active-color,#2ce8e1); + cursor: pointer; + } + } \ No newline at end of file diff --git a/src/custom-image-search-box/custom-image-search-box.tsx b/src/custom-search-box/custom-search-box.tsx similarity index 72% rename from src/custom-image-search-box/custom-image-search-box.tsx rename to src/custom-search-box/custom-search-box.tsx index 223e5a7..046ac18 100644 --- a/src/custom-image-search-box/custom-image-search-box.tsx +++ b/src/custom-search-box/custom-search-box.tsx @@ -5,15 +5,15 @@ import { getRawProps, useNamespace, } from '@ibiz-template/vue3-util'; -import './custom-image-search-box.scss'; -import { CustomImageSearchBoxEditorController } from './custom-image-search-box.controller'; +import './custom-search-box.scss'; +import { CustomSearchBoxEditorController } from './custom-search-box.controller'; -export const CustomImageSearchBox = defineComponent({ - name: 'CustomImageSearchBox', - props: getRawProps(), +export const CustomSearchBox = defineComponent({ + name: 'CustomSearchBox', + props: getRawProps(), emits: getEditorEmits(), setup(props) { - const ns = useNamespace('custom-image-search-box'); + const ns = useNamespace('custom-search-box'); const c = props.controller; const searchValue = ref(''); @@ -43,8 +43,6 @@ export const CustomImageSearchBox = defineComponent({ }; }, render() { - const data = this.c.model.sysImage?.rawContent; - return (
- {data ? : null} { + v.component(CustomSearchBox.name!, CustomSearchBox); + registerPortletProvider( + 'EDITOR_CUSTOMSTYLE_CUSTOM_SEARCH_BOX', + () => new CustomSearchBoxEditorProvider(), + ); +}); diff --git a/src/index.ts b/src/index.ts index a567cde..ac33ccf 100644 --- a/src/index.ts +++ b/src/index.ts @@ -11,7 +11,7 @@ import { IBizCarouselGrid } from './carousel-grid'; import { IBizPercentPond } from './percent-pond'; import { IBizCustomButton } from './custom-button'; import { IBizWaterLevelPond } from './water-level-pond'; -import { IBizCustomImageSearchBox } from './custom-image-search-box'; +import { IBizCustomSearchBox } from './custom-search-box'; import { IBizTaggedWall } from './tagged-wall'; // 自定义边框 @@ -56,7 +56,7 @@ export default { _app.use(IBizPercentPond); _app.use(IBizCustomButton); _app.use(IBizWaterLevelPond); - _app.use(IBizCustomImageSearchBox); + _app.use(IBizCustomSearchBox); _app.use(IBizTaggedWall); // 自定义边框 diff --git a/src/screen-dashboard/screen-dashboard.scss b/src/screen-dashboard/screen-dashboard.scss index 27279ef..6a00fdd 100644 --- a/src/screen-dashboard/screen-dashboard.scss +++ b/src/screen-dashboard/screen-dashboard.scss @@ -36,12 +36,12 @@ $screen-dashboard: ( } .ibiz-portlet-layout { - --ibiz-portlet-layout-header-bg-color: getCssVar('screen-dashboard', 'bg-color'); - --ibiz-portlet-layout-content-bg-color: getCssVar('screen-dashboard', 'bg-color'); + --ibiz-portlet-layout-header-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; + --ibiz-portlet-layout-content-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; } .ibiz-view { - --ibiz-view-bg-color: getCssVar('screen-dashboard', 'bg-color'); + --ibiz-view-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; } .#{bem(no-data)}{ @@ -53,14 +53,14 @@ $screen-dashboard: ( } .ibiz-control-grid { - --ibiz-control-grid-row-bg-color: getCssVar('screen-dashboard', 'bg-color'); - --ibiz-control-grid-row-bg-color-2: getCssVar('screen-dashboard', 'bg-color'); - --ibiz-control-grid-row-hover-color: getCssVar('screen-dashboard', 'bg-color'); - --ibiz-control-grid-header-bg-color: getCssVar('screen-dashboard', 'bg-color'); + --ibiz-control-grid-row-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; + --ibiz-control-grid-row-bg-color-2: #{getCssVar('screen-dashboard', 'bg-color')}; + --ibiz-control-grid-row-hover-color: #{getCssVar('screen-dashboard', 'bg-color')}; + --ibiz-control-grid-header-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; .el-table { - --el-table-header-bg-color: getCssVar('screen-dashboard', 'bg-color'); - --el-table-current-row-bg-color: getCssVar('screen-dashboard', 'bg-color'); + --el-table-header-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; + --el-table-current-row-bg-color: #{getCssVar('screen-dashboard', 'bg-color')}; } } } diff --git a/src/tagged-wall/tagged-wall.controller.ts b/src/tagged-wall/tagged-wall.controller.ts index f3b09c6..cce6f22 100644 --- a/src/tagged-wall/tagged-wall.controller.ts +++ b/src/tagged-wall/tagged-wall.controller.ts @@ -49,7 +49,9 @@ export class TaggedWallController extends ListController { protected async onCreated(): Promise { await super.onCreated(); - + if (!this.model.controlParam?.ctrlParams) { + return; + } const { ENABLEFONTSIZERANDOM, RANDOMFONTSIZERANGE, -- Gitee