@cqsjjb/jjb-react-admin-component 3.0.24 → 3.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/FormilyDescriptions/index.js +34 -6
  2. package/FormilyDescriptions/index.mjs +117 -73
  3. package/package.json +1 -1
package/FormilyDescriptions/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
  import React from 'react';
3
3
  import { tools } from '@cqsjjb/jjb-common-lib';
4
- import { FilePdfOutlined, LinkOutlined } from '@ant-design/icons';
5
- import { Modal, Descriptions, Empty, Image, Tooltip, Tag, Spin } from 'antd';
4
+ import { FilePdfOutlined, LinkOutlined, PlayCircleOutlined } from '@ant-design/icons';
5
+ import { Modal, Descriptions, Empty, Image, Tooltip, Tag, Spin, Table } from 'antd';
6
6
  const formilyItemMargin = new Map([['small', 8], ['middle', 12], ['default', 16]]);
7
7
  export default function FormilyDescriptions(props) {
8
8
  const [regions, setRegions] = React.useState([]);
@@ -34,6 +34,7 @@ export default function FormilyDescriptions(props) {
34
34
  return {
35
35
  key: childIndex,
36
36
  label: child.name,
37
+ span: child.formType === 'Table' ? props.column : 1,
37
38
  children: /*#__PURE__*/React.createElement(ItemRender, _extends({
38
39
  data: child
39
40
  }, props))
@@ -56,6 +57,7 @@ export default function FormilyDescriptions(props) {
56
57
  }));
57
58
  }
58
59
  function ItemRender(props) {
60
+ const [type, setType] = React.useState(undefined);
59
61
  const [open, setOpen] = React.useState(false);
60
62
  const [previewUrl, setPreviewUrl] = React.useState('');
61
63
  const {
@@ -64,7 +66,15 @@ function ItemRender(props) {
64
66
  imageHeight,
65
67
  imagePreview
66
68
  } = props;
67
- return /*#__PURE__*/React.createElement(React.Fragment, null, tools.isArray(data.value) ? tools.isStringArray(data.value) || tools.isNumberArray(data.value) ? data.value.join('、') : tools.isObjectArray(data.value) ? /*#__PURE__*/React.createElement("div", null, data.value.map((next, nextIndex) => {
69
+ return /*#__PURE__*/React.createElement(React.Fragment, null, tools.isArray(data.value) ? tools.isStringArray(data.value) || tools.isNumberArray(data.value) ? data.value.join('、') : tools.isObjectArray(data.value) ? data.formType === 'Table' ? /*#__PURE__*/React.createElement("div", {
70
+ style: {
71
+ width: '100%'
72
+ }
73
+ }, /*#__PURE__*/React.createElement(Table, {
74
+ columns: data.enumList,
75
+ dataSource: data.value,
76
+ pagination: false
77
+ })) : /*#__PURE__*/React.createElement("div", null, data.value.map((next, nextIndex) => {
68
78
  if (next.url) {
69
79
  if (next.isImage) {
70
80
  return /*#__PURE__*/React.createElement("span", {
@@ -91,10 +101,23 @@ function ItemRender(props) {
91
101
  alignItems: 'center'
92
102
  },
93
103
  onClick: () => {
104
+ setType('pdf');
105
+ setOpen(true);
106
+ setPreviewUrl(next.url);
107
+ }
108
+ }, /*#__PURE__*/React.createElement(FilePdfOutlined, null), "\u70B9\u51FB\u67E5\u770B") : /\.(mp4|ogg|mkv|webm)$/.test(next.url) ? /*#__PURE__*/React.createElement("a", {
109
+ key: nextIndex,
110
+ style: {
111
+ gap: 4,
112
+ display: 'flex',
113
+ alignItems: 'center'
114
+ },
115
+ onClick: () => {
116
+ setType('video');
94
117
  setOpen(true);
95
118
  setPreviewUrl(next.url);
96
119
  }
97
- }, /*#__PURE__*/React.createElement(FilePdfOutlined, null), "\u70B9\u51FB\u67E5\u770B") : /*#__PURE__*/React.createElement("a", {
120
+ }, /*#__PURE__*/React.createElement(PlayCircleOutlined, null), "\u70B9\u51FB\u67E5\u770B") : /*#__PURE__*/React.createElement("a", {
98
121
  key: nextIndex,
99
122
  href: next.url,
100
123
  style: {
@@ -114,15 +137,20 @@ function ItemRender(props) {
114
137
  renderItemText: props.renderItemText
115
138
  }), /*#__PURE__*/React.createElement(Modal, {
116
139
  destroyOnClose: true,
117
- title: "\u67E5\u770BPDF",
140
+ title: "\u67E5\u770B\u6587\u4EF6",
118
141
  open: open,
119
142
  width: 1100,
120
143
  footer: false,
121
144
  onCancel: () => setOpen(false)
122
- }, /*#__PURE__*/React.createElement("embed", {
145
+ }, type === 'pdf' && /*#__PURE__*/React.createElement("embed", {
123
146
  src: previewUrl,
124
147
  width: "100%",
125
148
  height: 600
149
+ }), type === 'video' && /*#__PURE__*/React.createElement("video", {
150
+ controls: true,
151
+ src: previewUrl,
152
+ width: "100%",
153
+ height: "350"
126
154
  })));
127
155
  }
128
156
  function generateValue(data, prefix = []) {
package/FormilyDescriptions/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  import React from 'react';
2
2
 
3
3
  import { tools } from '@cqsjjb/jjb-common-lib';
4
- import { FilePdfOutlined, LinkOutlined } from '@ant-design/icons';
5
- import { Modal, Descriptions, Empty, Image, Tooltip, Tag, Spin } from 'antd';
4
+ import { FilePdfOutlined, LinkOutlined, PlayCircleOutlined } from '@ant-design/icons';
5
+ import { Modal, Descriptions, Empty, Image, Tooltip, Tag, Spin, Table } from 'antd';
6
6
 
7
7
  const formilyItemMargin = new Map([
8
8
  [ 'small', 8 ],
@@ -44,6 +44,9 @@ export default function FormilyDescriptions(props) {
44
44
  return {
45
45
  key: childIndex,
46
46
  label: child.name,
47
+ span: child.formType === 'Table'
48
+ ? props.column
49
+ : 1,
47
50
  children: (
48
51
  <ItemRender data={child} {...props} />
49
52
  )
@@ -71,6 +74,7 @@ export default function FormilyDescriptions(props) {
71
74
  }
72
75
 
73
76
  function ItemRender(props) {
77
+ const [ type, setType ] = React.useState(undefined);
74
78
  const [ open, setOpen ] = React.useState(false);
75
79
  const [ previewUrl, setPreviewUrl ] = React.useState('');
76
80
 
@@ -87,73 +91,103 @@ function ItemRender(props) {
87
91
  ? (tools.isStringArray(data.value) || tools.isNumberArray(data.value))
88
92
  ? data.value.join('、')
89
93
  : tools.isObjectArray(data.value)
90
- ? (
91
- <div>
92
- {data.value.map((next, nextIndex) => {
93
- if (next.url) {
94
- if (next.isImage) {
95
- return (
96
- <span
97
- key={nextIndex}
98
- style={{
99
- display: 'inline-block',
100
- marginRight: 4,
101
- marginBottom: 4
102
- }}
103
- >
104
- <Image
105
- src={next.url}
106
- width={imageWidth || 64}
107
- height={imageHeight || 64}
108
- preview={imagePreview}
109
- />
110
- </span>
111
- );
94
+ ? data.formType === 'Table'
95
+ ? (
96
+ <div style={{ width: '100%' }}>
97
+ <Table
98
+ columns={data.enumList}
99
+ dataSource={data.value}
100
+ pagination={false}
101
+ />
102
+ </div>
103
+ )
104
+ : (
105
+ <div>
106
+ {data.value.map((next, nextIndex) => {
107
+ if (next.url) {
108
+ if (next.isImage) {
109
+ return (
110
+ <span
111
+ key={nextIndex}
112
+ style={{
113
+ display: 'inline-block',
114
+ marginRight: 4,
115
+ marginBottom: 4
116
+ }}
117
+ >
118
+ <Image
119
+ src={next.url}
120
+ width={imageWidth || 64}
121
+ height={imageHeight || 64}
122
+ preview={imagePreview}
123
+ />
124
+ </span>
125
+ );
126
+ } else {
127
+ return (
128
+ <Tooltip title={next.url}>
129
+ {/\.pdf$/.test(next.url)
130
+ ? (
131
+ <a
132
+ key={nextIndex}
133
+ style={{
134
+ gap: 4,
135
+ display: 'flex',
136
+ alignItems: 'center'
137
+ }}
138
+ onClick={() => {
139
+ setType('pdf');
140
+ setOpen(true);
141
+ setPreviewUrl(next.url);
142
+ }}
143
+ >
144
+ <FilePdfOutlined />
145
+ 点击查看
146
+ </a>
147
+ )
148
+ : /\.(mp4|ogg|mkv|webm)$/.test(next.url)
149
+ ? (
150
+ <a
151
+ key={nextIndex}
152
+ style={{
153
+ gap: 4,
154
+ display: 'flex',
155
+ alignItems: 'center'
156
+ }}
157
+ onClick={() => {
158
+ setType('video');
159
+ setOpen(true);
160
+ setPreviewUrl(next.url);
161
+ }}
162
+ >
163
+ <PlayCircleOutlined />
164
+ 点击查看
165
+ </a>
166
+ )
167
+ : (
168
+ <a
169
+ key={nextIndex}
170
+ href={next.url}
171
+ style={{
172
+ gap: 4,
173
+ display: 'flex',
174
+ alignItems: 'center'
175
+ }}
176
+ target="_blank"
177
+ >
178
+ <LinkOutlined />
179
+ 点击下载
180
+ </a>
181
+ )}
182
+ </Tooltip>
183
+ );
184
+ }
112
185
  } else {
113
- return (
114
- <Tooltip title={next.url}>
115
- {/\.pdf$/.test(next.url)
116
- ? (
117
- <a
118
- key={nextIndex}
119
- style={{
120
- gap: 4,
121
- display: 'flex',
122
- alignItems: 'center'
123
- }}
124
- onClick={() => {
125
- setOpen(true);
126
- setPreviewUrl(next.url);
127
- }}
128
- >
129
- <FilePdfOutlined />
130
- 点击查看
131
- </a>
132
- )
133
- : (
134
- <a
135
- key={nextIndex}
136
- href={next.url}
137
- style={{
138
- gap: 4,
139
- display: 'flex',
140
- alignItems: 'center'
141
- }}
142
- target="_blank"
143
- >
144
- <LinkOutlined />
145
- 点击下载
146
- </a>
147
- )}
148
- </Tooltip>
149
- );
186
+ return tools.textPlaceholder(next.name);
150
187
  }
151
- } else {
152
- return tools.textPlaceholder(next.name);
153
- }
154
- })}
155
- </div>
156
- )
188
+ })}
189
+ </div>
190
+ )
157
191
  : tools.textPlaceholder()
158
192
  : (
159
193
  <RenderText
@@ -164,17 +198,27 @@ function ItemRender(props) {
164
198
  )}
165
199
  <Modal
166
200
  destroyOnClose
167
- title="查看PDF"
201
+ title="查看文件"
168
202
  open={open}
169
203
  width={1100}
170
204
  footer={false}
171
205
  onCancel={() => setOpen(false)}
172
206
  >
173
- <embed
174
- src={previewUrl}
175
- width="100%"
176
- height={600}
177
- />
207
+ {type === 'pdf' && (
208
+ <embed
209
+ src={previewUrl}
210
+ width="100%"
211
+ height={600}
212
+ />
213
+ )}
214
+ {type === 'video' && (
215
+ <video
216
+ controls
217
+ src={previewUrl}
218
+ width="100%"
219
+ height="350"
220
+ />
221
+ )}
178
222
  </Modal>
179
223
  </React.Fragment>
180
224
  );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cqsjjb/jjb-react-admin-component",
3
- "version": "3.0.24",
3
+ "version": "3.0.26",
4
4
  "description": "jjb-react-admin-组件库@new",
5
5
  "main": "index.js",
6
6
  "author": "jjb-front-team",