/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-08-16 08:50:50
|
* @LastEditTime: 2023-02-16 10:06:22
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 底部选择器
|
*/
|
import React from 'react';
|
import { Drawer, Button, List, Picker } from 'dingtalk-design-mobile';
|
import { CloseBoldOutlined } from 'dd-icons';
|
import './index.less';
|
|
/**
|
* visible: bool, // 显隐
|
* onClose: func, // 关闭方法
|
* title: string, // 弹窗标题
|
* body// 自定义内容
|
*/
|
|
const years = new Array(new Date().getFullYear() - (new Date().getFullYear() - 10)).fill(0).map((item, i) => ({ label: String(new Date().getFullYear() - 9 + i) + '年' }))
|
const ModalBottomDownYear = ({
|
visible,
|
title = "",
|
onClose,
|
onOkClick,
|
onCancel,
|
onChange,
|
}) => {
|
return (
|
// <Drawer
|
// size="large"
|
// visible={visible}
|
// title={title}
|
// actions={[{
|
// text: '确定',
|
// type: 'ok',
|
// onClick: () => { onOkClick(); }
|
// }, {
|
// text: '取消',
|
// type: 'cancel',
|
// onClick: () => { onCancel(); }
|
// }]} onVisibleChange={onClose} >
|
// <div className="modalBottomDownYear">
|
// <div className='modalBottomDownYear-head'>
|
// <CloseBoldOutlined />
|
// <div className='modalBottomDownYear-head-text'>确定</div>
|
// </div>
|
// <div className='modalBottomDownYear-main'>
|
// {
|
// years.map((item, idx) => (
|
// <div className='modalBottomDownYear-main-title' key={idx}>{item.label}</div>
|
// ))
|
// }
|
// <div className='modalBottomDownYear-main-focus'></div>
|
// </div>
|
// <div className='modalBottomDownYear-bottom'></div>
|
// </div>
|
// </Drawer>
|
<Picker
|
data={years}
|
cols={1}
|
visible={true}
|
title="季度"
|
okText="确定"
|
value={2022}
|
onChange={(e) => { console.log(e); }}
|
extra="请选择(可选)"
|
>
|
<List.Item arrow="horizontal">标题文字</List.Item>
|
</Picker>
|
);
|
};
|
|
export default ModalBottomDownYear;
|
