提交 03de3d9e 编写于 作者: zhangkang's avatar zhangkang

update:表格值规则

上级 64779705
...@@ -9,11 +9,17 @@ ...@@ -9,11 +9,17 @@
{{#if (eq item.columnType 'DEFGRIDCOLUMN')}} {{#if (eq item.columnType 'DEFGRIDCOLUMN')}}
{{#if item.enableRowEdit}} {{#if item.enableRowEdit}}
<div v-if="state.rowEditState" class="editor-cell"> <div v-if="state.rowEditState" class="editor-cell">
<AppFormItem
name="state"
:error="state.gridEditState.state?.[index]?.message"
:rules="state.rules.state"
>
{{#each ctrl.psDEGridEditItems as | editColumn | }} {{#each ctrl.psDEGridEditItems as | editColumn | }}
{{#if (eq editColumn.codeName item.codeName)}} {{#if (eq editColumn.codeName item.codeName)}}
{{>(lookup . 'editColumn.psEditor.editorType') item=editColumn ctrlType="grid"}} {{>(lookup . 'editColumn.psEditor.editorType') item=editColumn ctrlType="grid"}}
{{/if}} {{/if}}
{{/each}} {{/each}}
</AppFormItem>
</div> </div>
<div v-else class="text-cell"> <div v-else class="text-cell">
<span class="text">\{{text}}</span> <span class="text">\{{text}}</span>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
"vue": "^3.2.23", "vue": "^3.2.23",
"vue-global-api": "^0.4.1", "vue-global-api": "^0.4.1",
"vue-router": "^4.0.12", "vue-router": "^4.0.12",
"async-validator":"^3.3.0",
"moment": "2.24.0" "moment": "2.24.0"
}, },
"devDependencies": { "devDependencies": {
......
...@@ -29,6 +29,14 @@ export interface GridControlState extends MDControlState { ...@@ -29,6 +29,14 @@ export interface GridControlState extends MDControlState {
*/ */
rules: IParam; rules: IParam;
/**
* 表格编辑状态
*
* @type {IParam[]}
* @memberof GridControlState
*/
gridEditState: any;
/** /**
* @description 表格聚合 * @description 表格聚合
* @type {IParam} * @type {IParam}
......
import { deepCopy, GridControlState, IActionParam, IParam, MDControl } from "@core"; import { deepCopy, GridControlState, IActionParam, IParam, MDControl } from "@core";
import { createUUID } from "qx-util"; import { createUUID } from "qx-util";
import schema, { ErrorList, FieldErrorList } from 'async-validator';
/** /**
* @description 表格部件 * @description 表格部件
* @export * @export
...@@ -73,7 +73,7 @@ export class GridControl extends MDControl { ...@@ -73,7 +73,7 @@ export class GridControl extends MDControl {
return false; return false;
} }
return { return {
type:isSingleSelect ? 'radio' : 'checkbox', type: isSingleSelect ? 'radio' : 'checkbox',
columnWidth: 90, columnWidth: 90,
selectedRowKeys: selectedRowKeys.value, selectedRowKeys: selectedRowKeys.value,
checkStrictly: this.props.multiple ? false : true, checkStrictly: this.props.multiple ? false : true,
...@@ -125,6 +125,7 @@ export class GridControl extends MDControl { ...@@ -125,6 +125,7 @@ export class GridControl extends MDControl {
if (items.value[rowIndex][tag] !== data) { if (items.value[rowIndex][tag] !== data) {
items.value[rowIndex][tag] = data; items.value[rowIndex][tag] = data;
items.value[rowIndex]["rowDataState"] = "update"; items.value[rowIndex]["rowDataState"] = "update";
this.validateField(tag, data, rowIndex);
} }
break; break;
default: default:
...@@ -132,6 +133,32 @@ export class GridControl extends MDControl { ...@@ -132,6 +133,32 @@ export class GridControl extends MDControl {
} }
} }
/**
*
*
* @param {string} name
* @param {*} value
* @memberof GridControl
*/
public validateField(name: string, value: any, rowIndex: number): Promise<boolean> {
return new Promise((resolve: any, reject: any) => {
const { rules, gridEditState } = toRefs(this.state);
const fileRule = rules.value[name];
if (!fileRule) {
resolve(true);
return;
}
const validator = new schema({ [name]: fileRule });
validator.validate({ [name]: value }, undefined, (errors: ErrorList, fields: FieldErrorList) => {
const error =errors?.find((item:any)=>{
return item.field === name;
})
gridEditState.value[name][rowIndex] = error;
})
})
}
/** /**
* @description 操作列事件触发 * @description 操作列事件触发
* @param {IActionParam} action * @param {IActionParam} action
...@@ -139,7 +166,7 @@ export class GridControl extends MDControl { ...@@ -139,7 +166,7 @@ export class GridControl extends MDControl {
* @memberof GridControl * @memberof GridControl
*/ */
public onToolbarEvent(action: IActionParam, record: IParam) { public onToolbarEvent(action: IActionParam, record: IParam) {
//todo 界面行为 //todo 界面行为
} }
/** /**
...@@ -201,7 +228,7 @@ export class GridControl extends MDControl { ...@@ -201,7 +228,7 @@ export class GridControl extends MDControl {
/** /**
* @description 处理数据聚合 * @description 处理数据聚合
* *
* @memberof GridControl * @memberof GridControl
*/ */
public async handleDataAgg() { public async handleDataAgg() {
...@@ -246,7 +273,7 @@ export class GridControl extends MDControl { ...@@ -246,7 +273,7 @@ export class GridControl extends MDControl {
/** /**
* @description 远程聚合 * @description 远程聚合
* *
* @memberof GridControl * @memberof GridControl
*/ */
public async remoteAgg(): Promise<IParam[]> { public async remoteAgg(): Promise<IParam[]> {
...@@ -258,7 +285,7 @@ export class GridControl extends MDControl { ...@@ -258,7 +285,7 @@ export class GridControl extends MDControl {
/** /**
* @description 获取聚合值 * @description 获取聚合值
* *
* @param {IParam[]} aggData 聚合数据 * @param {IParam[]} aggData 聚合数据
* @param {string} column 列模型 * @param {string} column 列模型
* @memberof GridControl * @memberof GridControl
...@@ -440,6 +467,8 @@ export class GridControl extends MDControl { ...@@ -440,6 +467,8 @@ export class GridControl extends MDControl {
*/ */
public moduleInstall() { public moduleInstall() {
const superParams = super.moduleInstall(); const superParams = super.moduleInstall();
console.log(this.state);
return { return {
...superParams, ...superParams,
useCustom: this.useCustom(), useCustom: this.useCustom(),
......
...@@ -70,6 +70,13 @@ export const ctrlState = { ...@@ -70,6 +70,13 @@ export const ctrlState = {
{{>(lookup 'UACOLUMNMODEL') item=column}} {{>(lookup 'UACOLUMNMODEL') item=column}}
{{/each}} {{/each}}
], ],
gridEditState:{
{{#each ctrl.psDEGridEditItems as | column |}}
{{#if column.codeName }}
{{column.codeName}}:{},
{{/if}}
{{/each}}
},
columnsModel: [ columnsModel: [
{{#if ctrl.enableGroup}} {{#if ctrl.enableGroup}}
{{#if ctrl.groupPSAppDEField}} {{#if ctrl.groupPSAppDEField}}
...@@ -90,4 +97,18 @@ export const ctrlState = { ...@@ -90,4 +97,18 @@ export const ctrlState = {
], ],
// 是否单选 // 是否单选
isSingleSelect:{{#if ctrl.singleSelect}}{{ctrl.singleSelect}}{{else}}false{{/if}}, isSingleSelect:{{#if ctrl.singleSelect}}{{ctrl.singleSelect}}{{else}}false{{/if}},
rules:{
{{#each ctrl.psDEGridEditItemVRs as | ruleItem |}}
{{#if ruleItem.valueRuleType 'SYSVALUERULE'}}
{{ruleItem.psDEGridEditItemName}}: [
{
trigger: ['change', 'blur'],
{{#eq ruleItem.psSysValueRule.ruleType 'REG'}}
pattern: /{{ruleItem.psSysValueRule.regExCode}}/,
{{/eq}}
message:'{{ruleItem.psSysValueRule.ruleInfo}}'
}],
{{/if}}
{{/each}}
}
}; };
\ No newline at end of file
...@@ -43,58 +43,60 @@ const { useScrollOption, useRowKey, useRowClassName, useCustomRow, useRowSelecti ...@@ -43,58 +43,60 @@ const { useScrollOption, useRowKey, useRowClassName, useCustomRow, useRowSelecti
defineExpose({ state, name: '{{ctrl.name}}', newRow, remove, save, load, refresh, getData }); defineExpose({ state, name: '{{ctrl.name}}', newRow, remove, save, load, refresh, getData });
</script> </script>
<template> <template>
<a-table <a-form name="{{ctrl.name}}" class="app-grid-form" >
bordered <a-table
sticky bordered
class="app-grid{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}" sticky
:rowKey="useRowKey" class="app-grid{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}"
:showHeader="true" :rowKey="useRowKey"
:scroll="useScrollOption" :showHeader="true"
:sortDirections="['ascend', 'descend']" :scroll="useScrollOption"
:data-source="state.items" :sortDirections="['ascend', 'descend']"
:row-selection="useRowSelectionOption" :data-source="state.items"
:columns="state.columnsModel" :row-selection="useRowSelectionOption"
:pagination="state.mdCtrlPaging.pagination" :columns="state.columnsModel"
:customRow="useCustomRow" :pagination="state.mdCtrlPaging.pagination"
:rowClassName="useRowClassName" :customRow="useCustomRow"
@change="onGridChange" :rowClassName="useRowClassName"
@resizeColumn="onResizeColumn" @change="onGridChange"
> @resizeColumn="onResizeColumn"
<template #emptyText> >
<div class="not-data"> <template #emptyText>
<span class="empty-text"> <div class="not-data">
{{#if ctrl.emptyText}} <span class="empty-text">
{{ctrl.emptyText}} {{#if ctrl.emptyText}}
{{else}} {{ctrl.emptyText}}
无数据 {{else}}
{{/if}} 无数据
</span> {{/if}}
{{!-- 快速工具栏 --}} </span>
</div> {{!-- 快速工具栏 --}}
</template> </div>
<template #headerCell="{title, column}"> </template>
{{#each ctrl.psDEGridColumns as | column |}} <template #headerCell="{title, column}">
{{>(lookup 'COLUMNHEADER') item=column ctrl=ctrl}} {{#each ctrl.psDEGridColumns as | column |}}
{{/each}} {{>(lookup 'COLUMNHEADER') item=column ctrl=ctrl}}
</template> {{/each}}
<template #bodyCell="{ column, text, record, index }"> </template>
{{#each ctrl.psDEGridColumns as | column |}} <template #bodyCell="{ column, text, record, index }">
{{>(lookup 'COLUMN') item=column ctrl=ctrl}} {{#each ctrl.psDEGridColumns as | column |}}
{{/each}} {{>(lookup 'COLUMN') item=column ctrl=ctrl}}
</template> {{/each}}
{{#neq ctrl.aggMode 'NONE'}} </template>
<template #summary> {{#neq ctrl.aggMode 'NONE'}}
<a-table-summary> <template #summary>
<a-table-summary-row> <a-table-summary>
<a-table-summary-cell align="center">数据聚合</a-table-summary-cell> <a-table-summary-row>
<a-table-summary-cell v-for="(item, index) in state.gridAgg.aggData" :key="index"> <a-table-summary-cell align="center">数据聚合</a-table-summary-cell>
<span>\{{item}}</span> <a-table-summary-cell v-for="(item, index) in state.gridAgg.aggData" :key="index">
</a-table-summary-cell> <span>\{{item}}</span>
</a-table-summary-row> </a-table-summary-cell>
</a-table-summary> </a-table-summary-row>
</template> </a-table-summary>
{{/neq}} </template>
</a-table> {{/neq}}
</a-table>
</a-form>
</template> </template>
<style lang="scss"> <style lang="scss">
.app-grid { .app-grid {
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册