Browse Source

日期范围增加选当天的操作

main
likunming 2 months ago
parent
commit
f834905298
  1. 20
      io.sc.platform.core.frontend/src/platform/components/date/WDateRange.vue
  2. 6
      io.sc.platform.core.frontend/src/platform/components/utils/FormValidators.ts
  3. 29
      io.sc.platform.core.frontend/src/views/likm/Form.vue
  4. 27
      io.sc.platform.core.frontend/src/views/likm/Grid.vue

20
io.sc.platform.core.frontend/src/platform/components/date/WDateRange.vue

@ -15,7 +15,7 @@
if (dateRangeRef) {
const toValue = dateRangeRef.getFieldValue('to');
if (!Tools.isEmpty(toValue)) {
return date < toValue.replace(/-/g, '/');
return date <= toValue.replace(/-/g, '/');
}
return true;
}
@ -31,7 +31,7 @@
if (dateRangeRef) {
const fromValue = dateRangeRef.getFieldValue('from');
if (!Tools.isEmpty(fromValue)) {
return date > fromValue.replace(/-/g, '/');
return date >= fromValue.replace(/-/g, '/');
}
return true;
}
@ -39,6 +39,11 @@
},
},
]"
@update-value="
(args) => {
modelValue = args.value;
}
"
>
</w-form>
</template>
@ -83,7 +88,7 @@
</template>
<script setup lang="ts">
import { ref, useAttrs, computed, useSlots } from 'vue';
import { ref, useAttrs, computed, useSlots, watch } from 'vue';
import { Tools } from '@/platform';
import { FormFieldProps } from '@/platform/components/form/FormField.ts';
import { FormFieldMethods } from '../form/FormField';
@ -131,6 +136,15 @@ class FieldMethods extends FormFieldMethods {
}
const fieldMethodsClass = new FieldMethods();
watch(
() => modelValue.value,
(newVal, oldVal) => {
if (props.displayMode === 'dual') {
dateRangeRef.value.setData(newVal);
}
},
);
const displayValueComputed = computed(() => {
if (modelValue.value && modelValue.value['from']) {
return modelValue.value['from'] + ' 至 ' + modelValue.value['to'];

6
io.sc.platform.core.frontend/src/platform/components/utils/FormValidators.ts

@ -1,3 +1,5 @@
import { Tools } from '@/platform';
/**
* Form表单元素验证器
*/
@ -30,7 +32,9 @@ export class FormValidators {
public static lengthRange(min: number, max: number, msg: string = '长度不符合要求') {
return (val) => {
const tmp = String(val);
if (tmp === null || tmp === '' || (tmp.length >= min && tmp.length <= max)) {
if (min === 0 && Tools.isEmpty(val)) {
return true;
} else if (!Tools.isEmpty(val) && tmp.length >= min && tmp.length <= max) {
return true;
} else {
return msg + '(' + min + '-' + max + ')';

29
io.sc.platform.core.frontend/src/views/likm/Form.vue

@ -1,5 +1,33 @@
<template>
<div>
<w-form
ref="testFormRef"
:fields="[
{
label: '发起时间',
name: 'startTime',
type: 'w-date-range',
displayMode: 'dual',
},
{
label: 'ddddd',
name: 'ddddd',
type: 'w-text',
},
]"
></w-form>
<br />
<q-btn
label="获取组件值"
@click="
() => {
console.info('=========', testFormRef.getData());
}
"
></q-btn>
<br />
<br />
<br />
<!-- <br />
<br />
<br />
@ -490,6 +518,7 @@ import { ref, reactive, computed } from 'vue';
import { Environment, Formater, $t } from '@/platform';
const mode = ref('criteria');
const testFormRef = ref();
const booleanModelValue = ref(false);
const string1ModelValue = ref('');
const string2ModelValue = ref(`name = '1' and age <> 22 and ( sex = '2' or xl NOT IN ('1','2') or ( not ( birthday = '2024-09-25' and name LIKE '%222%' ) ) )`);

27
io.sc.platform.core.frontend/src/views/likm/Grid.vue

@ -13,15 +13,32 @@
:sort-by="['name']"
:query-form-cols-num="3"
:query-form-fields="[
{ name: 'code', label: $t('code'), type: 'w-text' },
{ name: 'name', label: $t('name'), type: 'w-text' },
{ name: 'enable', label: $t('isEnable'), type: 'w-select', options: Options.yesNo() },
{ name: 'lastModifyDate', label: $t('name'), type: 'w-date-range', displayMode: 'dual', colSpan: 2 },
{ name: 'code', label: $t('code'), type: 'w-text', rules: [FormValidators.lengthRange(0, 3)] },
]"
:toolbar-configure="{ noIcon: false }"
:toolbar-actions="['query', 'refresh', 'separator', 'add', 'clone', 'edit', 'remove', 'separator', 'view', 'separator', 'export']"
:toolbar-actions="[
'query',
'reset',
'separator',
'add',
{
label: 'test',
click: (args) => {
console.info('dddddd=====', args.grid.getQueryForm().getData());
},
},
'edit',
'remove',
'separator',
'view',
'separator',
'export',
]"
:columns="[
{ width: 200, name: 'code', label: $t('code') },
{ width: '100%', name: 'name', label: $t('name') },
{ name: 'lastModifyDate', label: $t('lastModifyDate'), format: Formater.none() },
{ width: 70, name: 'enable', label: $t('status'), align: 'center', format: Formater.enableTag() },
{
width: 200,
@ -128,7 +145,7 @@
</template>
<script setup lang="ts">
import { ref, onActivated } from 'vue';
import { Environment, axios, Options, Formater, SessionManager } from '@/platform';
import { Environment, axios, Options, Formater, SessionManager, FormValidators } from '@/platform';
import SelectUserGrid from './SelectUserGrid.vue';
import SelectMenuTreeGrid from './SelectMenuTreeGrid.vue';

Loading…
Cancel
Save