Oak-Team
/
oak-frontend-base
13
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases 37 Wiki Activity

编译后

This commit is contained in:
wangwenchen 2023-04-10 19:14:17 +08:00
parent 4e36617676
commit 312acc7e68
16 changed files with 621 additions and 132 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
lib/components/detail/index.d.ts vendored
View File

@ -1,17 +1,18 @@
import { ED, OakAbsAttrDef } from '../../types/AbstractComponent';
import { ReactComponentProps } from '../../types/Page';
export declare type ColSpanType = 1 | 2 | 3 | 4;
declare const _default: <ED2 extends ED, T2 extends keyof ED2>(
props: ReactComponentProps<
ED2,
T2,
false,
{
column: ColumnMapType;
entity: T2;
attributes: OakAbsAttrDef[];
data: Partial<ED2[T2]['Schema']>;
}
>
) => React.ReactElement;
declare type ColumnMapType = {
xxl: ColSpanType;
xl: ColSpanType;
lg: ColSpanType;
md: ColSpanType;
sm: ColSpanType;
xs: ColSpanType;
};
declare const _default: <ED2 extends ED, T2 extends keyof ED2>(props: ReactComponentProps<ED2, T2, false, {
column: ColumnMapType;
entity: T2;
attributes: OakAbsAttrDef[];
data: Partial<ED2[T2]["Schema"]>;
}>) => React.ReactElement;
export default _default;

10
lib/components/list/index.d.ts vendored
View File

@ -1,16 +1,16 @@
/// <reference types="react" />
import { CardDef, OakAbsAttrDef } from '../../types/AbstractComponent';
import { Pagination } from '../../types/Pagination';
declare const _default: (props: import("../..").ReactComponentProps<import("oak-domain/lib/types").EntityDict & import("oak-domain/lib/base-app-domain").EntityDict, string | number, false, {
import { CardDef, ED, OakAbsAttrDef } from '../../types/AbstractComponent';
import { RowWithActions } from '../../types/Page';
declare const _default: (props: import("../../types/Page").ReactComponentProps<import("oak-domain/lib/types").EntityDict & import("oak-domain/lib/base-app-domain").EntityDict, string | number, false, {
entity: string | number;
extraActions: string[];
onAction: Function;
disabledOp: boolean;
attributes: OakAbsAttrDef[];
attributesMb: CardDef;
data: import("oak-domain/lib/types").GeneralEntityShape[];
data: RowWithActions<ED, string | number>[];
loading: boolean;
tablePagination: Pagination;
tablePagination: false | import("antd").TablePaginationConfig | undefined;
rowSelection: import("antd/es/table/interface").TableRowSelection<any[]> | undefined;
scroll: ({
x?: string | number | true | undefined;

4
lib/components/list/web.pc.d.ts vendored
View File

@ -1,5 +1,5 @@
/// <reference types="react" />
import { TableProps, PaginationProps } from 'antd';
import { TableProps } from 'antd';
import { EntityDict } from 'oak-domain/lib/types/Entity';
import { WebComponentProps } from '../../types/Page';
import { EntityDict as BaseEntityDict } from 'oak-domain/lib/base-app-domain';
@ -19,7 +19,7 @@ export default function Render(props: WebComponentProps<EntityDict & BaseEntityD
disabledOp: boolean;
colorDict: ColorDict<EntityDict & BaseEntityDict>;
handleClick?: (id: string, action: string) => void;
tablePagination?: PaginationProps;
tablePagination?: TableProps<any[]>['pagination'];
onAction?: onActionFnDef;
rowSelection?: TableProps<any[]>['rowSelection'];
scroll?: TableProps<any[]>['scroll'];

169
lib/components/refAttr/index.less Normal file
View File

@ -0,0 +1,169 @@
.container {
display: flex;
flex-direction: column;
min-height: 100vh;
background-color: var(--oak-bg-color-page);
padding-bottom: 50rpx;
}
.btn-view {
padding: 20rpx;
padding-bottom: 50rpx;
width: 100vw;
position: fixed;
z-index: 100;
bottom: 0;
box-sizing: border-box;
display: flex;
align-items: center;
background-color: #fff;
.actions-btn-content {
display: flex;
flex: 1;
align-items: center;
justify-content: flex-end;
}
}
.more-container {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.circle-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.circle-text {
margin-top: 16rpx;
color: #888;
}
}
.card {
margin: 20rpx;
margin-bottom: 0rpx;
border-radius: 20rpx;
display: flex;
flex-direction: column;
background-color: #fff;
.title-view {
padding: 20rpx 40rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 0.8px solid rgba(200, 200, 200, 0.2);
.title {
display: flex;
align-items: center;
font-weight: 600;
color: black;
}
}
.card-content {
padding: 40rpx;
display: flex;
flex-direction: column;
}
.text-view {
display: flex;
align-items: center;
justify-content: space-between;
.label {
min-width: 160rpx;
color: #888;
}
.download {
display: flex;
flex-direction: row;
.download-text {
color: var(--oak-color-primary);
}
}
.img-view {
display: flex;
flex-wrap: wrap;
.img {
width: 160rpx;
height: 160rpx;
}
}
}
.state-view {
display: flex;
align-items: center;
}
.badge {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: var(--oak-color-success);
margin-right: 5px;
}
.effective {
background-color: var(--oak-color-success);
}
.interrupted {
background-color: var(--oak-color-error);
}
// .inCharge {
// background-color: var(--oak-color-primary);
// }
.overdue {
background-color: var(--oak-color-warning);
}
}
[class='text-view']:not(:last-child) {
margin-bottom: 16rpx;
}
[class='btn']:not(:last-child) {
margin-right: 20rpx;
}
.draw-container {
width: 500rpx;
background-color: #fff;
.draw-content {
max-height: 500rpx;
overflow-y: scroll;
}
.draw-cell {
color: var(--oak-color-primary);
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
.primary-panel {
margin: 20rpx;
padding: 40rpx;
border-radius: 32rpx;
display: flex;
flex-direction: column;
color: #fff;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 3%), 0 1px 6px -1px rgb(0 0 0 / 2%),
0 2px 4px 0 rgb(0 0 0 / 2%);
background: linear-gradient(120deg, var(--oak-color-primary), #1ca3da);
.panel-title {
font-size: 32rpx;
font-weight: 600;
margin-bottom: 16rpx;
}
.text-view {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.tab-content {
margin-bottom: 160rpx;
min-height: 140rpx;
height: 100%;
display: flex;
flex-direction: column;
font-size: 28rpx;
color: rgba(140, 152, 174, 1);
}
[class='img']:not(:last-child) {
margin-right: 16rpx;
}

33
lib/components/refAttr/index.xml Normal file
View File

@ -0,0 +1,33 @@
<view class="container">
<view wx:if="{{!data && mode !== 'list'}}">
<l-loading show="{{true}}" size="large"></l-loading>
</view>
<view wx:else>
<view wx:if="{{mode === 'select'}}">
<picker mode="{{multiple ? 'multiSelector':'selector'}}" />
</view>
<view wx:if="{{mode === 'radio'}}">
<view wx:if="{{multiple}}">
<l-radio-group wx:for="{{data}}" wx:key="index" wx:for-item="enumItem" current="{{entityId}}" bind:linchange="setValueMp">
<l-radio key="{{enumItem.value}}">{{enumItem.label}}</l-radio>
</l-radio-group>
</view>
<view wx:else>
<l-checkbox-group bind:linchange="onChangeTap" >
<l-checkbox
wx:for-items="{{data}}"
wx:key="{{item.id}}"
key="{{item.id}}"
checked="{{item.isChecked}}"
disabled="{{item.disabled}}"
>
{{item.title}}
</l-checkbox>
</l-checkbox-group>
</view>
</view>
<view wx:if="{{mode === 'list'}}">
</view>
</view>
</view>

32
lib/components/upsert/index.js
View File

@ -69,4 +69,36 @@ exports.default = OakComponent({
});
},
},
methods: {
setValueMp: function (input) {
var _a;
var detail = input.detail, dataset = input.target.dataset;
var attr = dataset.attr;
var value = detail.value;
this.update((_a = {}, _a[attr] = value, _a));
},
setValueMp1: function (input) {
var _a;
var detail = input.detail, dataset = input.target.dataset;
var attr = dataset.attr;
var value = detail.value;
var valueShowed = parseFloat(Number(value).toFixed(1)) * 10;
this.update((_a = {}, _a[attr] = valueShowed, _a));
},
setValueMp2: function (input) {
var _a;
var detail = input.detail, dataset = input.target.dataset;
var attr = dataset.attr;
var value = detail.value;
var valueShowed = parseFloat(Number(value).toFixed(2)) * 100;
this.update((_a = {}, _a[attr] = valueShowed, _a));
},
setEnumValueMp: function (input) {
var _a;
var detail = input.detail, dataset = input.target.dataset;
var attr = dataset.attr;
var value = detail.value;
this.update((_a = {}, _a[attr] = value, _a));
},
},
});

28
lib/components/upsert/index.xml
View File

@ -1,10 +1,5 @@
<view class="col">
<l-form>
<!-- <picker range="{{sourceData}}" range-key="label" value="{{sourceId}}" bind:change="onSourceChange">
<l-input label="来源" value="{{sourceLabel || '选择来源'}}" disabled="{{true}}" l-label-class="label">
<l-icon slot="right" name="right" size="20" />
</l-input>
</picker> -->
<view wx:for="{{renderData}}">
<view wx:if="{{item.type === 'string' || item.type === 'varchar'|| item.type === 'char' || item.type === 'poiName'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" l-form-label-class="textarea" label-width="120rpx" rules="{{[{required:item.required}]}}">
@ -17,29 +12,29 @@
</l-form-item>
</view>
<view wx:if="{{item.type === 'int'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" round-float="{{true}}" bind:linchange="setValueMp" data-attr="{{item.attr}}" />
</l-form-item>
</view>
<view wx:if="{{item.type === 'decimal'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" bind:linchange="setValueMp" data-attr="{{item.attr}}" />
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-input label="{{item.label}}" type="number" placeholder="{{item.placeholder || '请输入'+item.label+'(将保留一位小数)'}}" value="{{item.value / 10}}" hide-label show-row="{{false}}" bind:lininput="setValueMp1" data-attr="{{item.attr}}"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'money'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" bind:linchange="setValueMp1" data-attr="{{item.attr}}" />
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-input label="{{item.label}}" type="number" placeholder="{{item.placeholder || '请输入'+item.label+'(将保留两位小数)'}}" value="{{item.value / 100}}" hide-label show-row="{{false}}" bind:lininput="setValueMp2" data-attr="{{item.attr}}"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'enum'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-radio-group wx:for="{{item.enumeration}}" wx:key="index" wx:for-item="enumItem" current="{{item.value}}" bind:linchange="setValueMp">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-radio-group wx:for="{{item.enumeration}}" wx:key="index" wx:for-item="enumItem" current="{{item.value}}" data-attr="{{item.attr}}" bind:linchange="setValueMp">
<l-radio key="{{enumItem.value}}">{{enumItem.label}}</l-radio>
</l-radio-group>
</l-form-item>
</view>
<view wx:if="{{item.type === 'date' || item.type === 'datetime'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<picker mode="date" value="{{item.value}}" bind:change="onDateChange" start="{{today}}">
<view class="input-content">
<block wx:if="{{item.value}}">
@ -58,10 +53,15 @@
</l-form-item>
</view>
<view wx:if="{{item.type === 'boolean'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-switch checked="{{ item.value }}" active-value="{{ 1 }}" inactive-value="{{ 0 }}" bind:linchange="onChangeMp"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'ref'}}" >
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<refAttr multiple="{{false}}" entityId="{{item.value}}" pickerRender="{{attrRender}}"/>
</l-form-item>
</view>
</view>
</l-form>
</view>

58
lib/types/AbstractComponent.d.ts vendored
View File

@ -29,10 +29,7 @@ export declare type CardDef = {
state?: string | React.ReactNode;
rows: OakAbsAttrDef[];
};
export interface OakAbsRefAttrPickerDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> {
export interface OakAbsRefAttrPickerDef<ED extends EntityDict & BaseEntityDict, T extends keyof ED> {
type: 'ref';
mode: 'select' | 'list' | 'radio';
attr: string;
@ -50,11 +47,9 @@ export interface OakAbsRefAttrPickerDef<
count?: number;
label?: string;
placeholder?: string;
allowNull?: boolean;
}
export interface OakAbsRefAttrPickerRender<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> extends OakAbsRefAttrPickerDef<ED, T> {
export interface OakAbsRefAttrPickerRender<ED extends EntityDict & BaseEntityDict, T extends keyof ED> extends OakAbsRefAttrPickerDef<ED, T> {
required?: boolean;
}
export interface OakAbsGeoAttrUpsertDef {
@ -65,12 +60,9 @@ export interface OakAbsGeoAttrUpsertDef {
poiName?: string;
coordinate?: string;
};
allowNull?: boolean;
}
export interface OakAbsNativeAttrUpsertDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
A extends keyof ED[T]['OpSchema']
> {
export interface OakAbsNativeAttrUpsertDef<ED extends EntityDict & BaseEntityDict, T extends keyof ED, A extends keyof ED[T]['OpSchema']> {
attr: A;
type: Omit<DataType, 'ref' | 'geo'>;
label?: string;
@ -80,20 +72,10 @@ export interface OakAbsNativeAttrUpsertDef<
maxLength?: number;
defaultValue?: any;
required?: boolean;
allowNull?: boolean;
}
export declare type OakAbsAttrUpsertDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
T2 extends keyof ED = keyof ED
> =
| OakAbsGeoAttrUpsertDef
| OakAbsRefAttrPickerDef<ED, T2>
| keyof ED[T]['OpSchema']
| OakAbsNativeAttrUpsertDef<ED, T, keyof ED[T]['OpSchema']>;
import {
DataType,
DataTypeParams,
} from 'oak-domain/lib/types/schema/DataTypes';
export declare type OakAbsAttrUpsertDef<ED extends EntityDict & BaseEntityDict, T extends keyof ED, T2 extends keyof ED = keyof ED> = OakAbsGeoAttrUpsertDef | OakAbsRefAttrPickerDef<ED, T2> | keyof ED[T]['OpSchema'] | OakAbsNativeAttrUpsertDef<ED, T, keyof ED[T]['OpSchema']>;
import { DataType, DataTypeParams } from 'oak-domain/lib/types/schema/DataTypes';
export declare type AttrRender = {
label: string;
value: any;
@ -102,11 +84,7 @@ export declare type AttrRender = {
width?: RenderWidth;
attr: string;
};
export interface OakAbsNativeAttrUpsertRender<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
A extends keyof ED[T]['OpSchema']
> extends Omit<OakAbsNativeAttrUpsertDef<ED, T, A>, 'type'> {
export interface OakAbsNativeAttrUpsertRender<ED extends EntityDict & BaseEntityDict, T extends keyof ED, A extends keyof ED[T]['OpSchema']> extends Omit<OakAbsNativeAttrUpsertDef<ED, T, A>, 'type'> {
value: any;
type: Omit<DataType, 'ref'> | 'coordinate' | 'poiName';
enumeration?: Array<{
@ -116,12 +94,7 @@ export interface OakAbsNativeAttrUpsertRender<
extra?: any;
params: DataTypeParams;
}
export declare type AttrUpsertRender<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> =
| OakAbsNativeAttrUpsertRender<ED, T, keyof ED[T]['OpSchema']>
| OakAbsRefAttrPickerRender<ED, T>;
export declare type AttrUpsertRender<ED extends EntityDict & BaseEntityDict, T extends keyof ED> = OakAbsNativeAttrUpsertRender<ED, T, keyof ED[T]['OpSchema']> | OakAbsRefAttrPickerRender<ED, T>;
export declare type ColumnDefProps = {
width: number;
title: string;
@ -132,18 +105,11 @@ export declare type ColumnDefProps = {
fixed?: 'right' | 'left';
};
export declare type DataTransformer = (data: object) => AttrRender[];
export declare type DataUpsertTransformer<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> = (data: object) => AttrUpsertRender<ED, T>[];
export declare type DataUpsertTransformer<ED extends EntityDict & BaseEntityDict, T extends keyof ED> = (data: object) => AttrUpsertRender<ED, T>[];
export declare type DataConverter = (data: any[]) => Record<string, any>;
export declare type ED = BaseEntityDict & EntityDict;
export declare type CascadeActionProps = {
path: string;
action: string;
};
export declare type onActionFnDef = (
row: any,
action: string,
cascadeAction?: CascadeActionProps
) => void;
export declare type onActionFnDef = (row: any, action: string, cascadeAction?: CascadeActionProps) => void;

4
lib/types/AbstractComponent.js
View File

@ -1,6 +1,2 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
;
;
;
;

19
src/components/refAttr/index.json Normal file
View File

@ -0,0 +1,19 @@
{
"component": true,
"usingComponents": {
"l-button": "@oak-frontend-base/miniprogram_npm/lin-ui/button/index",
"l-list": "@oak-frontend-base/miniprogram_npm/lin-ui/list/index",
"l-input": "@oak-frontend-base/miniprogram_npm/lin-ui/input/index",
"l-icon": "@oak-frontend-base/miniprogram_npm/lin-ui/icon/index",
"l-textarea": "@oak-frontend-base/miniprogram_npm/lin-ui/textarea/index",
"l-form": "@oak-frontend-base/miniprogram_npm/lin-ui/form/index",
"l-form-item": "@oak-frontend-base/miniprogram_npm/lin-ui/form-item/index",
"l-radio-group": "@oak-frontend-base/miniprogram_npm/lin-ui/radio-group/index",
"l-radio": "@oak-frontend-base/miniprogram_npm/lin-ui/radio/index",
"l-checkbox-group": "@oak-frontend-base/miniprogram_npm/lin-ui/checkbox-group/index",
"l-checkbox": "@oak-frontend-base/miniprogram_npm/lin-ui/checkbox/index",
"l-counter": "@oak-frontend-base/miniprogram_npm/lin-ui/counter/index",
"l-loading": "@oak-frontend-base/miniprogram_npm/lin-ui/loading/index",
"l-notice-bar": "@oak-frontend-base/miniprogram_npm/lin-ui/notice-bar/index"
}
}

169
src/components/refAttr/index.less Normal file
View File

@ -0,0 +1,169 @@
.container {
display: flex;
flex-direction: column;
min-height: 100vh;
background-color: var(--oak-bg-color-page);
padding-bottom: 50rpx;
}
.btn-view {
padding: 20rpx;
padding-bottom: 50rpx;
width: 100vw;
position: fixed;
z-index: 100;
bottom: 0;
box-sizing: border-box;
display: flex;
align-items: center;
background-color: #fff;
.actions-btn-content {
display: flex;
flex: 1;
align-items: center;
justify-content: flex-end;
}
}
.more-container {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.circle-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.circle-text {
margin-top: 16rpx;
color: #888;
}
}
.card {
margin: 20rpx;
margin-bottom: 0rpx;
border-radius: 20rpx;
display: flex;
flex-direction: column;
background-color: #fff;
.title-view {
padding: 20rpx 40rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 0.8px solid rgba(200, 200, 200, 0.2);
.title {
display: flex;
align-items: center;
font-weight: 600;
color: black;
}
}
.card-content {
padding: 40rpx;
display: flex;
flex-direction: column;
}
.text-view {
display: flex;
align-items: center;
justify-content: space-between;
.label {
min-width: 160rpx;
color: #888;
}
.download {
display: flex;
flex-direction: row;
.download-text {
color: var(--oak-color-primary);
}
}
.img-view {
display: flex;
flex-wrap: wrap;
.img {
width: 160rpx;
height: 160rpx;
}
}
}
.state-view {
display: flex;
align-items: center;
}
.badge {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: var(--oak-color-success);
margin-right: 5px;
}
.effective {
background-color: var(--oak-color-success);
}
.interrupted {
background-color: var(--oak-color-error);
}
// .inCharge {
// background-color: var(--oak-color-primary);
// }
.overdue {
background-color: var(--oak-color-warning);
}
}
[class='text-view']:not(:last-child) {
margin-bottom: 16rpx;
}
[class='btn']:not(:last-child) {
margin-right: 20rpx;
}
.draw-container {
width: 500rpx;
background-color: #fff;
.draw-content {
max-height: 500rpx;
overflow-y: scroll;
}
.draw-cell {
color: var(--oak-color-primary);
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
.primary-panel {
margin: 20rpx;
padding: 40rpx;
border-radius: 32rpx;
display: flex;
flex-direction: column;
color: #fff;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 3%), 0 1px 6px -1px rgb(0 0 0 / 2%),
0 2px 4px 0 rgb(0 0 0 / 2%);
background: linear-gradient(120deg, var(--oak-color-primary), #1ca3da);
.panel-title {
font-size: 32rpx;
font-weight: 600;
margin-bottom: 16rpx;
}
.text-view {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.tab-content {
margin-bottom: 160rpx;
min-height: 140rpx;
height: 100%;
display: flex;
flex-direction: column;
font-size: 28rpx;
color: rgba(140, 152, 174, 1);
}
[class='img']:not(:last-child) {
margin-right: 16rpx;
}

33
src/components/refAttr/index.xml Normal file
View File

@ -0,0 +1,33 @@
<view class="container">
<view wx:if="{{!data && mode !== 'list'}}">
<l-loading show="{{true}}" size="large"></l-loading>
</view>
<view wx:else>
<view wx:if="{{mode === 'select'}}">
<picker mode="{{multiple ? 'multiSelector':'selector'}}" />
</view>
<view wx:if="{{mode === 'radio'}}">
<view wx:if="{{multiple}}">
<l-radio-group wx:for="{{data}}" wx:key="index" wx:for-item="enumItem" current="{{entityId}}" bind:linchange="setValueMp">
<l-radio key="{{enumItem.value}}">{{enumItem.label}}</l-radio>
</l-radio-group>
</view>
<view wx:else>
<l-checkbox-group bind:linchange="onChangeTap" >
<l-checkbox
wx:for-items="{{data}}"
wx:key="{{item.id}}"
key="{{item.id}}"
checked="{{item.isChecked}}"
disabled="{{item.disabled}}"
>
{{item.title}}
</l-checkbox>
</l-checkbox-group>
</view>
</view>
<view wx:if="{{mode === 'list'}}">
</view>
</view>
</view>

3
src/components/upsert/index.json
View File

@ -11,6 +11,7 @@
"l-radio-group": "@oak-frontend-base/miniprogram_npm/lin-ui/radio-group/index",
"l-radio": "@oak-frontend-base/miniprogram_npm/lin-ui/radio/index",
"l-counter": "@oak-frontend-base/miniprogram_npm/lin-ui/counter/index",
"l-notice-bar": "@oak-frontend-base/miniprogram_npm/lin-ui/notice-bar/index"
"l-notice-bar": "@oak-frontend-base/miniprogram_npm/lin-ui/notice-bar/index",
"refAttr": "../refAttr/index"
}
}

78
src/components/upsert/index.ts
View File

@ -1,7 +1,10 @@
import { AttrUpsertRender, ED, OakAbsAttrUpsertDef, OakAbsRefAttrPickerRender } from '../../types/AbstractComponent';
import {
DataUpsertTransformer,
AttrUpsertRender,
ED,
OakAbsAttrUpsertDef,
OakAbsRefAttrPickerRender,
} from '../../types/AbstractComponent';
import { DataUpsertTransformer } from '../../types/AbstractComponent';
import { ReactComponentProps } from '../../types/Page';
import { analyzeDataUpsertTransformer } from '../../utils/usefulFn';
@ -34,10 +37,14 @@ export default OakComponent({
// 反指
label2 = this.t(`${refEntity}:name`);
} else {
label2 = this.t(`${entity as string}:attr.${attr as string}`);
label2 = this.t(
`${entity as string}:attr.${attr as string}`
);
}
} else {
label2 = this.t(`${entity as string}:attr.${attr as string}`);
label2 = this.t(
`${entity as string}:attr.${attr as string}`
);
}
}
Object.assign(ele, { label: label2 });
@ -70,11 +77,58 @@ export default OakComponent({
});
},
},
}) as <ED2 extends ED, T2 extends keyof ED2, T3 extends keyof ED = keyof ED>(props: ReactComponentProps<ED2, T2, false, {
helps: Record<string, string>;
entity: T2;
attributes: OakAbsAttrUpsertDef<ED2, T2, T3>[];
data: ED2[T2]['Schema'];
layout: 'horizontal' | 'vertical';
mode: 'default' | 'card';
}>) => React.ReactElement;
methods: {
setValueMp(input: WechatMiniprogram.Input) {
const {
detail,
target: { dataset },
} = input;
const { attr } = dataset!;
const { value } = detail;
this.update({ [attr]: value });
},
setValueMp1(input: WechatMiniprogram.Input) {
const {
detail,
target: { dataset },
} = input;
const { attr } = dataset!;
const { value } = detail;
const valueShowed = parseFloat(Number(value).toFixed(1)) * 10;
this.update({ [attr]: valueShowed });
},
setValueMp2(input: WechatMiniprogram.Input) {
const {
detail,
target: { dataset },
} = input;
const { attr } = dataset!;
const { value } = detail;
const valueShowed = parseFloat(Number(value).toFixed(2)) * 100;
this.update({ [attr]: valueShowed });
},
setEnumValueMp(input: WechatMiniprogram.Input) {
const {
detail,
target: { dataset },
} = input;
const { attr } = dataset!;
const { value } = detail;
this.update({ [attr]: value });
},
},
}) as <ED2 extends ED, T2 extends keyof ED2, T3 extends keyof ED = keyof ED>(
props: ReactComponentProps<
ED2,
T2,
false,
{
helps: Record<string, string>;
entity: T2;
attributes: OakAbsAttrUpsertDef<ED2, T2, T3>[];
data: ED2[T2]['Schema'];
layout: 'horizontal' | 'vertical';
mode: 'default' | 'card';
}
>
) => React.ReactElement;

28
src/components/upsert/index.xml
View File

@ -1,10 +1,5 @@
<view class="col">
<l-form>
<!-- <picker range="{{sourceData}}" range-key="label" value="{{sourceId}}" bind:change="onSourceChange">
<l-input label="来源" value="{{sourceLabel || '选择来源'}}" disabled="{{true}}" l-label-class="label">
<l-icon slot="right" name="right" size="20" />
</l-input>
</picker> -->
<view wx:for="{{renderData}}">
<view wx:if="{{item.type === 'string' || item.type === 'varchar'|| item.type === 'char' || item.type === 'poiName'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" l-form-label-class="textarea" label-width="120rpx" rules="{{[{required:item.required}]}}">
@ -17,29 +12,29 @@
</l-form-item>
</view>
<view wx:if="{{item.type === 'int'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" round-float="{{true}}" bind:linchange="setValueMp" data-attr="{{item.attr}}" />
</l-form-item>
</view>
<view wx:if="{{item.type === 'decimal'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" bind:linchange="setValueMp" data-attr="{{item.attr}}" />
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-input label="{{item.label}}" type="number" placeholder="{{item.placeholder || '请输入'+item.label+'(将保留一位小数)'}}" value="{{item.value / 10}}" hide-label show-row="{{false}}" bind:lininput="setValueMp1" data-attr="{{item.attr}}"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'money'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-counter count="{{item.value}}" min="{{item.min}}" max="{{item.max}}" bind:linchange="setValueMp1" data-attr="{{item.attr}}" />
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-input label="{{item.label}}" type="number" placeholder="{{item.placeholder || '请输入'+item.label+'(将保留两位小数)'}}" value="{{item.value / 100}}" hide-label show-row="{{false}}" bind:lininput="setValueMp2" data-attr="{{item.attr}}"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'enum'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-radio-group wx:for="{{item.enumeration}}" wx:key="index" wx:for-item="enumItem" current="{{item.value}}" bind:linchange="setValueMp">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-radio-group wx:for="{{item.enumeration}}" wx:key="index" wx:for-item="enumItem" current="{{item.value}}" data-attr="{{item.attr}}" bind:linchange="setValueMp">
<l-radio key="{{enumItem.value}}">{{enumItem.label}}</l-radio>
</l-radio-group>
</l-form-item>
</view>
<view wx:if="{{item.type === 'date' || item.type === 'datetime'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<picker mode="date" value="{{item.value}}" bind:change="onDateChange" start="{{today}}">
<view class="input-content">
<block wx:if="{{item.value}}">
@ -58,10 +53,15 @@
</l-form-item>
</view>
<view wx:if="{{item.type === 'boolean'}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}">
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<l-switch checked="{{ item.value }}" active-value="{{ 1 }}" inactive-value="{{ 0 }}" bind:linchange="onChangeMp"/>
</l-form-item>
</view>
<view wx:if="{{item.type === 'ref'}}" >
<l-form-item label="{{item.label}}" name="{{item.attr}}" rules="{{[{required:item.required}]}}">
<refAttr multiple="{{false}}" entityId="{{item.value}}" pickerRender="{{attrRender}}"/>
</l-form-item>
</view>
</view>
</l-form>
</view>

58
src/types/AbstractComponent.ts
View File

@ -32,16 +32,16 @@ export type OakAbsAttrDef = string | OakAbsDerivedAttrDef;
export type CardDef = {
// string:path ReactNode自主渲染
title: string | React.ReactNode,
state?: string | React.ReactNode,
title: string | React.ReactNode;
state?: string | React.ReactNode;
rows: OakAbsAttrDef[];
}
};
export interface OakAbsRefAttrPickerDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
T extends keyof ED
> {
type: 'ref',
type: 'ref';
mode: 'select' | 'list' | 'radio';
attr: string;
entity: T;
@ -54,10 +54,11 @@ export interface OakAbsRefAttrPickerDef<
filter?: ED[T]['Selection']['filter'];
sorter?: ED[T]['Selection']['sorter'];
projection?: ED[T]['Selection']['data'];
}>; // 这里主要是为了动态构造filter，当需要先选A再将A作为B的filter条件时经常出现
}>; // 这里主要是为了动态构造filter，当需要先选A再将A作为B的filter条件时经常出现
count?: number;
label?: string;
placeholder?: string;
allowNull?: boolean;
}
export interface OakAbsRefAttrPickerRender<
@ -65,7 +66,7 @@ export interface OakAbsRefAttrPickerRender<
T extends keyof ED
> extends OakAbsRefAttrPickerDef<ED, T> {
required?: boolean;
};
}
export interface OakAbsGeoAttrUpsertDef {
type: 'geo';
@ -75,14 +76,16 @@ export interface OakAbsGeoAttrUpsertDef {
poiName?: string;
coordinate?: string;
};
};
allowNull?: boolean;
}
export interface OakAbsNativeAttrUpsertDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
A extends keyof ED[T]['OpSchema']> {
attr: A,
type: Omit<DataType, 'ref' | 'geo'>,
A extends keyof ED[T]['OpSchema']
> {
attr: A;
type: Omit<DataType, 'ref' | 'geo'>;
label?: string;
placeholder?: string;
max?: number;
@ -90,9 +93,14 @@ export interface OakAbsNativeAttrUpsertDef<
maxLength?: number;
defaultValue?: any;
required?: boolean;
};
allowNull?: boolean;
}
export type OakAbsAttrUpsertDef<ED extends EntityDict & BaseEntityDict, T extends keyof ED, T2 extends keyof ED = keyof ED> =
export type OakAbsAttrUpsertDef<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED,
T2 extends keyof ED = keyof ED
> =
| OakAbsGeoAttrUpsertDef
| OakAbsRefAttrPickerDef<ED, T2>
| keyof ED[T]['OpSchema']
@ -121,9 +129,12 @@ export interface OakAbsNativeAttrUpsertRender<
enumeration?: Array<{ label: string; value: string }>;
extra?: any;
params: DataTypeParams;
};
}
export type AttrUpsertRender<ED extends EntityDict & BaseEntityDict, T extends keyof ED> =
export type AttrUpsertRender<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> =
| OakAbsNativeAttrUpsertRender<ED, T, keyof ED[T]['OpSchema']>
| OakAbsRefAttrPickerRender<ED, T>;
@ -139,16 +150,21 @@ export type ColumnDefProps = {
export type DataTransformer = (data: object) => AttrRender[];
export type DataUpsertTransformer<ED extends EntityDict & BaseEntityDict, T extends keyof ED> = (
data: object
) => AttrUpsertRender<ED, T>[];
export type DataUpsertTransformer<
ED extends EntityDict & BaseEntityDict,
T extends keyof ED
> = (data: object) => AttrUpsertRender<ED, T>[];
export type DataConverter = (data: any[]) => Record<string, any>;
export type ED = BaseEntityDict & EntityDict;
export type CascadeActionProps = {
path: string,
path: string;
action: string;
};
export type onActionFnDef = (
row: any,
action: string,
}
export type onActionFnDef = (row: any, action: string, cascadeAction?: CascadeActionProps) => void
cascadeAction?: CascadeActionProps
) => void;