| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- import { use } from '../utils';
- import Cell from '../cell';
- import CellGroup from '../cell-group';
- import { inherit } from '../utils/functional';
- // Types
- import { CreateElement, RenderContext } from 'vue/types';
- import { ScopedSlot, DefaultSlots } from '../utils/use/sfc';
- export type PanelProps = {
- icon?: string;
- desc?: string;
- title?: string;
- status?: string;
- };
- export type PanelSlots = DefaultSlots & {
- header?: ScopedSlot;
- footer?: ScopedSlot;
- };
- const [sfc, bem] = use('panel');
- function Panel(
- h: CreateElement,
- props: PanelProps,
- slots: PanelSlots,
- ctx: RenderContext<PanelProps>
- ) {
- const Content = () => [
- slots.header ? (
- slots.header()
- ) : (
- <Cell
- icon={props.icon}
- label={props.desc}
- title={props.title}
- value={props.status}
- class={bem('header')}
- valueClass={bem('header-value')}
- />
- ),
- <div class={bem('content')}>{slots.default && slots.default()}</div>,
- slots.footer && (
- <div class={[bem('footer'), 'van-hairline--top']}>{slots.footer()}</div>
- )
- ];
- return (
- <CellGroup
- class={bem()}
- scopedSlots={{ default: Content }}
- {...inherit(ctx, true)}
- />
- );
- }
- Panel.props = {
- icon: String,
- desc: String,
- title: String,
- status: String
- };
- export default sfc<PanelProps>(Panel);
|