item-component.tsx
2.95 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
/*
* @Author: zhuqin zq627501913@163.com
* @Date: 2022-05-30 17:40:47
* @LastEditors: yantao 821714016@qq.com
* @LastEditTime: 2022-07-11 11:47:15
* @FilePath: \qx-apaas-fe\src\pages\app-view\custom\item-component.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import React, { useEffect, useState } from 'react';
import { getCustomSchema, getCustomData } from '@/pages/editor/custom/service';
import { Empty } from 'antd';
interface ItemComponentProps {
component: any;
id?: string;
appCode: string;
customCode: string;
taskData: any;
}
const ItemComponent: React.FC<ItemComponentProps> = (props) => {
const [config, setConfig] = useState({});
const [dataSource, setData] = useState([]);
const [isLoading, setIsLoading] = useState(true);
const [nullFlag, setNullFlag] = useState(false);
const { appCode, customCode } = props;
const current = props.component;
const _key = current.widget || current.key;
// TODO:
const ViewComponent = () => <></>;
useEffect(() => {
if (!current.code) return;
getCustomSchema(appCode, customCode, current.code).then((data) => {
setConfig(data || {});
});
getCustomData(appCode, customCode, current.code)
.then((data) => {
setData(data || []);
setIsLoading(false);
setNullFlag(false);
})
.catch((e) => {
if (e?.msg === '暂无操作权限') {
setNullFlag(true);
} else {
setNullFlag(false);
}
});
}, []);
return (
<div
className={`qx-item-custom qx-item-custom-production ${
current.widget === 'VIEW' ? 'qx-page-comp--view-card' : ''
}`}
>
<div className={'qx-item-custom-view'}>
{nullFlag ? (
<>
<Empty
image={require('/public/img/none-jurisdiction.png')}
style={{
margin: 0,
padding: 0,
height: '100%',
minHeight: '120px',
width: '100%',
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
}}
imageStyle={{
height: 200,
marginBottom: 0,
}}
description={
<span style={{ fontSize: '16px', color: '#999' }}>
暂无权限
</span>
}
></Empty>
</>
) : (
<>
{ViewComponent && (
<ViewComponent
item={current}
config={config || {}}
dataSoure={dataSource || []}
isLoading={isLoading}
taskData={props.taskData || {}}
/>
)}
</>
)}
</div>
</div>
);
};
export default ItemComponent;