@cainiaofe/cn-ui-m
Version:
51 lines (50 loc) • 3.51 kB
JavaScript
// 不暴露出去使用，仅作为内部组件测试使用
import * as React from 'react';
import { CnRangeTimePickerPro, CnDemoBlock, CnDemoPage, CnFilter, CnFilterItem, CnForm, CnFormField, formilyCore, } from "../../..";
var onFieldChange = formilyCore.onFieldChange;
export var 表单自测模型 = function () {
var _a = React.useState(['12:00:00', '13:00:00']), val = _a[0], setVal = _a[1];
var defaultValue = ['12:00:00', '13:00:00'];
return (React.createElement(CnDemoPage, { title: "\u8868\u5355\u81EA\u6D4B\u6A21\u578B" },
React.createElement(CnDemoBlock, { title: "\u975E\u53D7\u63A7", padding: 0 },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", onChange: function (value, valueStr) {
console.log(value, valueStr);
}, hasClear: true })),
React.createElement(CnDemoBlock, { title: "\u53D7\u63A7\u6A21\u5F0F", padding: 0 },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", value: val, onChange: function (value, valueStr) {
console.log(value, valueStr);
setVal(value);
}, hasClear: true })),
React.createElement(CnDemoBlock, { title: "\u9ED8\u8BA4\u503C", padding: 0 },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", defaultValue: defaultValue, onChange: function (value, valueStr) {
console.log(value, valueStr);
}, hasClear: true })),
React.createElement(CnDemoBlock, { title: "\u53EA\u8BFB\u6A21\u5F0F", padding: 16 },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", value: defaultValue, readOnly: true })),
React.createElement(CnDemoBlock, { title: "\u8868\u5355\u4E2D\u4F7F\u7528", padding: 0 },
React.createElement(CnForm, { formProps: {
values: {
gentle2: '2023-03-10',
},
effects: function () {
onFieldChange('*', function (fieldState) {
console.log(fieldState.path.toString(), fieldState.value);
});
},
} },
React.createElement(CnFormField, { title: "\u8F93\u5165", name: "gentle" },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", onChange: function (value, valueStr) {
console.log(value, valueStr);
}, hasClear: true })))),
React.createElement(CnDemoBlock, { title: "\u7B5B\u9009\u5668\u4E2D\u4F7F\u7528", padding: 0 },
React.createElement(CnFilter, { formProps: {
values: {
// orderType: '天猫',
},
}, onSubmit: function (values) { return console.log('onSubmit', values); }, onReset: function () { return console.log('onReset'); }, onChange: function (values) { return console.log('onChange', values); }, onSearch: function (values) { return console.log('onSearch', values); } },
React.createElement(CnFilterItem, { title: "\u65E5\u671F\u533A\u95F4", name: "timeRange", style: { maxWidth: 150 } },
React.createElement(CnRangeTimePickerPro, { format: "HH:mm", onChange: function (value, valueStr) {
console.log(value, valueStr);
}, hasClear: true }))))));
};
export default { title: 'demo/CnTimePickerPro' };