提交 7172ae9a 编写于 作者: Mosher's avatar Mosher

update:更新

1、快速分组搜索调整
2、搜索表单按钮位置、按钮样式支持
上级 eea3989e
......@@ -25,7 +25,7 @@ export const AppCodeListConfig:IParam = {
'items':[
{{#each appCodeList.psCodeItems as |codeItem|}}
{{#codeItem}}
{'value': {{#if appCodeList.codeItemValueNumber}}{{value}}{{else}}'{{value}}'{{/if}}, 'text': '{{text}}','codeName': '{{codeName}}','textClass': '{{#if textCls}}{{textCls}}{{else if psSysCss}}{{psSysCss.cssName}}{{/if}}',{{#if psSysImage}}{{#if psSysImage.cssClass}}'cssClass': '{{psSysImage.cssClass}}',{{/if}}{{#if psSysImage.imagePath}}'imagePath': '{{psSysImage.imagePath}}'{{/if}}{{/if}} }{{#unless @last}},{{/unless}}
{'value': {{#if appCodeList.codeItemValueNumber}}{{value}}{{else}}'{{value}}'{{/if}}, 'text': '{{text}}','codeName': '{{codeName}}', {{#if data}}'data': `{{data}}`, {{/if}}'textClass': '{{#if textCls}}{{textCls}}{{else if psSysCss}}{{psSysCss.cssName}}{{/if}}',{{#if psSysImage}}{{#if psSysImage.cssClass}}'cssClass': '{{psSysImage.cssClass}}',{{/if}}{{#if psSysImage.imagePath}}'imagePath': '{{psSysImage.imagePath}}'{{/if}}{{/if}} }{{#unless @last}},{{/unless}}
{{/codeItem}}
{{/each}}
]
......
<script setup lang="ts">
import { IActionParam, IParam } from '@core';
import { IActionParam, IContext, IParam } from '@core';
import { Ref, onBeforeMount } from 'vue';
interface QuickGroupProps {
quickGroupModel: IParam;
context: IContext;
viewParams: IParam;
}
interface FormGroupEmit {
(name: 'onQuickGroupEvent', value: IActionParam): void;
......@@ -24,11 +26,19 @@ const handleClick = ($event: any) => {
});
};
// 代码表服务
const codeListService = App.getCodeListService();
onBeforeMount(() => {
items.value = props.quickGroupModel.codeItems;
//todo
// let res: any = await this.codeListService.getDataItems({ tag: this.quickGroupCodeList.codeName, type: this.quickGroupCodeList.codeListType, data: this.quickGroupCodeList, context: this.context });
// this.quickGroupModel = this.handleDynamicData(JSON.parse(JSON.stringify(res)));
if (codeListService) {
codeListService.getCodeListItems({ tag: props.quickGroupModel.codeListTag, context: props.context, viewParams: props.viewParams }).then((codeListItems: any[]) => {
items.value = codeListItems;
// 默认选中第一项
if (codeListItems.length) {
handleClick(items.value[0]);
}
})
}
});
</script>
......
import { deepCopy, IActionParam, IParam, isExistAndNotEmpty, MainView, MDViewState, ViewUtil } from '@core';
import { IActionParam, IParam, MainView, MDViewState, ViewUtil } from '@core';
/**
* 多数据视图
......@@ -131,13 +131,9 @@ export class MDView extends MainView {
* @memberof MDView
*/
public handleQuickGroupSearch(args: any = {}): void {
const { viewParams } = this.state;
const tempViewParams = deepCopy(viewParams);
if (args && isExistAndNotEmpty(args.data) && typeof args.data === 'string') {
Object.assign(tempViewParams, JSON.parse(args.data));
}
this.state.quickGroupData = JSON.parse(args.data);
const tag = this.getMDCtrl().name;
this.next({ tag: tag, action: 'load', data: tempViewParams });
this.next({ tag: tag, action: 'load', data: null });
}
/**
......@@ -215,16 +211,15 @@ export class MDView extends MainView {
if (searchBar) {
Object.assign(args, searchBar.getData());
}
// 快速搜索
// if (this.view && !this.view.isExpandSearchForm) {
// Object.assign(args, { query: this.view.query });
// }
// 快速分组和快速搜索栏
// if (this.view && this.view.quickGroupData) {
// Object.assign(args, this.view.quickGroupData);
// }
// if (this.view && this.view.quickFormData) {
// Object.assign(args, this.view.quickFormData);
// }
// 快速分组
const { quickGroupData } = this.state;
if (quickGroupData && Object.keys(quickGroupData).length) {
Object.assign(args, quickGroupData);
}
// 自定义查询条件
// const mdCtrl: any = this.getMDCtrl();
// if (mdCtrl && mdCtrl.controlInstance && mdCtrl.controlInstance.customCond) {
......
......@@ -8,5 +8,10 @@ import { FormControlState, IParam } from '@core';
*/
export interface SearchFormControlState extends FormControlState {
/**
* @description 自动搜索
* @type {boolean}
* @memberof SearchFormControlState
*/
autoSearch: boolean;
}
......@@ -24,6 +24,17 @@
}
}
}
&.right-button .search-form-footer {
button {
width: 64px;
}
.reset-button {
margin-top: 8px;
}
.filter-save-button {
margin-top: 8px;
}
}
}
//搜索表单气泡
.search-form-popover {
......
......@@ -60,7 +60,7 @@ const counterData = computed(() => {
</template>
{{#if page.enableQuickGroup}}
<template v-slot:quickGroupSearch>
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" @onQuickGroupEvent="onQuickGroupEvent" />
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" :context="state.context" :viewParams="state.viewParams" @onQuickGroupEvent="onQuickGroupEvent" />
</template>
{{/if}}
{{#page.ctrls}}
......@@ -93,7 +93,7 @@ const counterData = computed(() => {
@ctrlEvent="onCtrlEvent"
></{{codeName}}SearchForm>
</template>
<a-button><filter-outlined /></a-button>
<a-button class="app-search-form__filter-button"><filter-outlined /></a-button>
</a-popover>
</div>
</template>
......@@ -155,5 +155,8 @@ const counterData = computed(() => {
.app-grid-view {
height: 100%;
width: 100%;
.app-search-form__filter-button {
transform: translateX(-2px);
}
}
</style>
\ No newline at end of file
......@@ -60,7 +60,7 @@ const counterData = computed(() => {
</template>
{{#if page.enableQuickGroup}}
<template v-slot:quickGroupSearch>
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" @onQuickGroupEvent="onQuickGroupEvent" />
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" :context="state.context" :viewParams="state.viewParams" @onQuickGroupEvent="onQuickGroupEvent" />
</template>
{{/if}}
{{#page.ctrls}}
......@@ -93,7 +93,7 @@ const counterData = computed(() => {
@ctrlEvent="onCtrlEvent"
></{{codeName}}SearchForm>
</template>
<a-button><filter-outlined /></a-button>
<a-button class="app-search-form__filter-button"><filter-outlined /></a-button>
</a-popover>
</div>
</template>
......@@ -153,5 +153,8 @@ const counterData = computed(() => {
.app-list-view {
height: 100%;
width: 100%;
.app-search-form__filter-button {
transform: translateX(-2px);
}
}
</style>
\ No newline at end of file
......@@ -49,7 +49,7 @@ const { state, grid, onCtrlEvent, onQuickGroupEvent, onQuickSearchEvent } = pick
</template>
{{#if page.enableQuickGroup}}
<template v-slot:quickGroupSearch>
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" @onQuickGroupEvent="onQuickGroupEvent" />
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" :context="state.context" :viewParams="state.viewParams" @onQuickGroupEvent="onQuickGroupEvent" />
</template>
{{/if}}
{{#page.ctrls}}
......
......@@ -59,7 +59,7 @@ const counterData = computed(() => {
</template>
{{#if page.enableQuickGroup}}
<template v-slot:quickGroupSearch>
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" @onQuickGroupEvent="onQuickGroupEvent" />
<AppQuickGroup v-if="state.enableQuickGroup" :quickGroupModel="state.quickGroupPSCodeList" :context="state.context" :viewParams="state.viewParams" @onQuickGroupEvent="onQuickGroupEvent" />
</template>
{{/if}}
{{#page.ctrls}}
......@@ -92,7 +92,7 @@ const counterData = computed(() => {
@ctrlEvent="onCtrlEvent"
></{{codeName}}SearchForm>
</template>
<a-button><filter-outlined /></a-button>
<a-button class="app-search-form__filter-button"><filter-outlined /></a-button>
</a-popover>
</div>
</template>
......@@ -146,3 +146,10 @@ const counterData = computed(() => {
{{/page.ctrls}}
</AppTreeViewLayout>
</template>
<style lang="scss">
.app-tree-view {
.app-search-form__filter-button {
transform: translateX(-2px);
}
}
</style>
\ No newline at end of file
......@@ -49,6 +49,7 @@ export class ControlVO extends ControlVOBase {
// 部件配置对象
export const ctrlState = {
autoSearch: {{ctrl.enableAutoSearch}},
controlCodeName: '{{ctrl.codeName}}',
controlName: '{{ctrl.name}}',
controlService: new EditFormService<ControlVO>(ControlVO, new {{pascalCase ctrl.psAppDataEntity.codeName}}Service() ),
......
......@@ -33,7 +33,7 @@ defineExpose({ name, state, getData });
<template>
<a-form
name="{{ctrl.codeName}}"
class="app-search-form{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}{{#if ctrl.searchButtonPos}} {{ctrl.searchButtonPos}}-button{{/if}}"
class="app-search-form{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}{{#if ctrl.searchButtonPos}} {{lowerCase ctrl.searchButtonPos}}-button{{/if}}"
style="{{#if ctrl.formWidth}}width: {{ctrl.formWidth}}px;{{/if}}"
:model="state.data"
:rules="state.rules">
......@@ -56,7 +56,8 @@ defineExpose({ name, state, getData });
</a-row>
</a-col>
<a-col class='search-form-footer'>
{{#if (eq ctrl.searchButtonStyle 'DEFAULT')}}
{{#if ctrl.enableFilterSave}}
{{#eq ctrl.searchButtonStyle 'DEFAULT'}}
<a-select
allowClear
class="search-form-history"
......@@ -67,6 +68,7 @@ defineExpose({ name, state, getData });
</a-select>
<a-button class='search-button' @click="onSearch" type="primary">搜索</a-button>
<a-button class='reset-button' @click='loadDraft'>重置</a-button>
{{#if ctrl.enableFilterSave}}
<a-popover title="存储自定义查询" v-model:visible='state.showPopover' overlayClassName="search-form-popover">
<template #content>
<a-input />
......@@ -77,8 +79,19 @@ defineExpose({ name, state, getData });
</template>
<a-button><save-outlined /></a-button>
</a-popover>
{{else if (eq ctrl.searchButtonStyle 'SEARCHONLY')}}
{{/if}}
{{/eq}}
{{#eq ctrl.searchButtonStyle 'SEARCHONLY'}}
<a-button class='search-button' type="primary">搜索</a-button>
{{/eq}}
{{else}}
{{#eq ctrl.searchButtonStyle 'DEFAULT'}}
<a-button class='search-button' @click="onSearch" type="primary">搜索</a-button>
<a-button class='reset-button' @click='loadDraft'>重置</a-button>
{{/eq}}
{{#eq ctrl.searchButtonStyle 'SEARCHONLY'}}
<a-button class='search-button' type="primary">搜索</a-button>
{{/eq}}
{{/if}}
</a-col>
</a-row>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册