pageheader2

This commit is contained in:
wkj 2024-01-24 18:06:50 +08:00
parent bd681dddef
commit 0aac7f3645
15 changed files with 218 additions and 13 deletions

View File

@ -1,9 +1,9 @@
export default OakComponent({
isList: false,
data: {
slideWidth: 0,
slideLeft: 0,
slideShow: false,
slideWidth: 0, //小程序使用
slideLeft: 0, //小程序使用
slideShow: false, //小程序使用
commonAction: [
'create',
'update',

View File

@ -63,7 +63,7 @@ export default OakComponent({
let currentUrl = event.currentTarget.dataset.src;
let urlList = event.currentTarget.dataset.list;
wx.previewImage({
current: currentUrl,
current: currentUrl, // 当前显示图片的http链接
urls: urlList, // 需要预览的图片http链接列表
});
},

View File

@ -90,7 +90,7 @@ export default OakComponent({
attribute: {},
options: [],
inputType: '',
timeStartStr: '',
timeStartStr: '', // 小程序选择时间显示
timeEndStr: '',
selectedLabel: '',
minDateMp: new Date(1980, 1, 1).getTime(),

View File

@ -1,8 +1,7 @@
import React, { useState } from 'react';
import styles from './index.module.less';
import { Space, Checkbox, Divider, Modal, Image } from 'antd';
import { Space, Checkbox, Divider, Image } from 'antd';
import { EyeOutlined, } from '@ant-design/icons';
const { confirm } = Modal;
function MaskView(props) {
const { selected, onClick, setVisibleTrue } = props;
return (<div className={selected ? styles['mask-checked'] : styles.mask} onClick={onClick}>

20
es/components/pageHeader2/index.d.ts vendored Normal file
View File

@ -0,0 +1,20 @@
/// <reference types="react" />
import { EntityDict } from 'oak-domain/lib/types/Entity';
import { EntityDict as BaseEntityDict } from 'oak-domain/lib/base-app-domain';
import { ReactComponentProps } from '../../types/Page';
declare const _default: <ED2 extends EntityDict & BaseEntityDict, T2 extends keyof ED2>(props: ReactComponentProps<ED2, T2, false, {
style?: import("react").CSSProperties | undefined;
className?: string | undefined;
showHeader?: boolean | undefined;
showBack?: boolean | undefined;
onBack?: (() => void) | undefined;
backIcon?: React.ReactNode;
delta?: number | undefined;
title?: React.ReactNode;
subTitle?: React.ReactNode;
tags?: React.ReactNode;
extra?: React.ReactNode;
children?: React.ReactNode;
content: React.ReactNode;
}>) => React.ReactElement;
export default _default;

View File

@ -0,0 +1,8 @@
export default OakComponent({
isList: false,
methods: {
goBack(delta) {
this.navigateBack(delta);
},
},
});

View File

@ -0,0 +1,97 @@
.oak-new-pageHeader {
display: flex;
flex-direction: column;
height: 100%;
&-header {
margin: 0;
font-size: 0;
height: auto;
line-height: inherit;
min-height: inherit;
position: relative;
padding: 10px 20px;
color: #000;
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
&-left {
display: flex;
align-items: center;
margin: 0;
overflow: hidden;
}
&-back {
outline: none;
cursor: pointer;
transition: color .3s;
color: #000;
border: 0px;
background: transparent;
padding: 0px;
line-height: inherit;
display: inline-block;
}
&-backIcon {
width: 16px;
height: 16px;
font-size: 16px;
}
&-title {
display: inline-block;
vertical-align: middle;
font-size: 16px;
font-weight: 700;
margin-right: 20px;
overflow: hidden;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
height: 30px;
line-height: 30px;
}
&-subTitle {
font-size: 12px;
display: inline-block;
vertical-align: middle;
margin-right: 20px;
}
&-back {
margin-right: 24px;
}
&-extra {
display: flex;
align-items: center;
}
}
&-content {
display: flex;
flex-direction: column;
margin: 12px 12px 12px 12px;
padding: 16px 32px;
}
&-body {
display: flex;
flex-direction: column;
margin: 0px 12px 12px 12px;
background: var(--oak-bg-color-container);
box-shadow: 0 2px 3px #0000001a;
border-radius: 3px;
padding: 30px 32px;
}
}

25
es/components/pageHeader2/web.d.ts vendored Normal file
View File

@ -0,0 +1,25 @@
import React from 'react';
import { WebComponentProps } from '../../types/Page';
import { EntityDict } from 'oak-domain/lib/types/Entity';
import { EntityDict as BaseEntityDict } from 'oak-domain/lib/base-app-domain';
import './index.less';
type PageHeaderProps = {
style?: React.CSSProperties;
className?: string;
showHeader?: boolean;
showBack?: boolean;
onBack?: () => void;
backIcon?: React.ReactNode;
delta?: number;
title?: React.ReactNode;
subTitle?: React.ReactNode;
tags?: React.ReactNode;
extra?: React.ReactNode;
children?: React.ReactNode;
content?: React.ReactNode;
};
type ED = EntityDict & BaseEntityDict;
export default function Render(props: WebComponentProps<ED, keyof ED, false, PageHeaderProps, {
goBack: (delta?: number) => void;
}>): React.JSX.Element;
export {};

View File

@ -0,0 +1,56 @@
import React from 'react';
import { Button } from 'antd';
import { ArrowLeftOutlined } from '@ant-design/icons';
import classNames from 'classnames';
import './index.less';
export default function Render(props) {
const { style, className, showHeader = true, showBack = false, onBack, backIcon, delta, title, subTitle, extra, tags, children, content,
// contentStyle,
// contentClassName,
// bodyStyle,
// bodyClassName,
} = props.data;
const { t, goBack } = props.methods;
const prefixCls = 'oak-new';
return (<div style={style} className={classNames(`${prefixCls}-pageHeader`, className)}>
{showHeader && (title || showBack || subTitle || tags || extra) && (<div className={`${prefixCls}-pageHeader-header`}>
<div className={`${prefixCls}-pageHeader-header-left`}>
{showBack && (<Button type="text" className={`${prefixCls}-pageHeader-header-back`} onClick={() => {
if (typeof onBack === 'function') {
onBack();
return;
}
goBack(delta);
}}>
{backIcon || (<ArrowLeftOutlined className={`${prefixCls}-pageHeader-header-backIcon`}/>)}
</Button>)}
{title && (<span className={`${prefixCls}-pageHeader-header-title`}>
{title}
</span>)}
{subTitle && (<span className={`${prefixCls}-pageHeader-header-subTitle`}>
{subTitle}
</span>)}
{tags}
</div>
<div className={`${prefixCls}-pageHeader-header-extra`}>
{extra}
</div>
</div>)}
{content ? (<div
// style={contentStyle}
className={classNames(`${prefixCls}-pageHeader-content`
// contentClassName
)}>
{content}
</div>) : null}
<div
// style={bodyStyle}
className={classNames(`${prefixCls}-pageHeader-body`
// bodyClassName
)}>
{children}
</div>
</div>);
}

View File

@ -9,7 +9,7 @@ export default OakComponent({
multiple: false,
entityId: '',
entityIds: [],
pickerRender: {},
pickerRender: {}, // OakAbsRefAttrPickerRender
onChange: (() => undefined),
},
formData() {

View File

@ -5,7 +5,7 @@ export default OakComponent({
return this.props.entity;
},
properties: {
helps: {},
helps: {}, // Record<string, string>;
entity: '',
attributes: [],
layout: 'horizontal',

View File

@ -322,7 +322,7 @@ export class Cache extends Feature {
opers.forEach((oper) => {
const { entity, operation } = oper;
this.cacheStore.operate(entity, operation, this.context, {
checkerTypes: ['logical'],
checkerTypes: ['logical'], // 这里不能检查data不然在数据没填完前会有大量异常
dontCollect: true,
dontCreateOper: true,
dontCreateModi: true,

View File

@ -1,7 +1,7 @@
import React from 'react';
export const keys = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
export const values = {
xs: 576,
xs: 576, //小于576
sm: 576,
md: 768,
lg: 992,

View File

@ -325,7 +325,7 @@ class Cache extends Feature_1.Feature {
opers.forEach((oper) => {
const { entity, operation } = oper;
this.cacheStore.operate(entity, operation, this.context, {
checkerTypes: ['logical'],
checkerTypes: ['logical'], // 这里不能检查data不然在数据没填完前会有大量异常
dontCollect: true,
dontCreateOper: true,
dontCreateModi: true,

View File

@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
exports.keys = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
exports.values = {
xs: 576,
xs: 576, //小于576
sm: 576,
md: 768,
lg: 992,