提交 4cfdf202 authored 作者: 钟是志's avatar 钟是志

泸职版本增加自定义表单 增加视频上传组件. 后台接口暂时用的雅职生产

token 获取方式 localstorage('uploadVideoServiceToken')
上级 3face9ee
......@@ -124,6 +124,7 @@ const transLate = {
RangePicker: 'rangePicker',
UploadCom: 'buttonUpload',
ImgUploadCom: 'upload',
VideoUploadCom: 'upload',
Input: 'input',
TableSelect: 'tableSelect', // 表格选择
ChildForm: 'childForm', // 最终保存的数据还有问题
......
......@@ -5,14 +5,10 @@
*/
import React, { Component } from 'react'
import SignatureCanvas from 'react-signature-canvas'
// import Button from '@/components/NewButton';
import { message,Button } from 'antd';
import config from '@/webPublic/one_stop_public/config';
import { queryApiActionPath } from "../utils/queryConfig";
import baseX from 'base-x';
const Bs64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
const base64 = baseX(Bs64);
import reqwest from 'reqwest';
function dataURLtoBlob(toDataURL) {
var arr = toDataURL.split(","),
mime = arr[0].match(/:(.*?);/)[1],
......@@ -37,8 +33,8 @@ export default class index extends Component {
this.state = {
url:value,
}
}
triggerChange = (changedValue) => {
// Should provide an event to pass value to Form.
......@@ -51,14 +47,15 @@ export default class index extends Component {
// Should be a controlled component.
if ('value' in nextProps) {
const value = nextProps.value;
this.setState({url:value});
//
}
}
}
sigCanvas = {clear:()=>{},toDataURL:(param)=>{return ""}};
clear=()=>{
this.sigCanvas.clear();
}
......@@ -70,10 +67,10 @@ export default class index extends Component {
}
trim=()=>{
const formData = new FormData()
const xx=dataURLtoBlob(this.sigCanvas.toDataURL('image/png'))
const xx=dataURLtoBlob(this.sigCanvas.toDataURL('image/png'))
const file = blobToFile(xx,"sign.png")
if(file==null){
return
}
formData.append('file',file,"sign.png")
......@@ -83,12 +80,12 @@ export default class index extends Component {
processData: false,
data: formData,
success: (url) => {
if (!('value' in this.props)) {
this.setState({url:url});
}
this.triggerChange(url);
message.success('保存成功');
},
error: (e) => {
......@@ -101,7 +98,7 @@ export default class index extends Component {
}else{
message.error('保存失败');
}
},
});
//let trimmedCanvas = this.sigCanvas.getTrimmedCanvas();
......@@ -127,9 +124,9 @@ export default class index extends Component {
<Button style={{marginLeft:12}} onClick={this.trim} size="small" type='primary'>保存</Button></>}
</div>
</div>
</div>
)
}
}
}
......@@ -7,12 +7,12 @@ export default class ImgUploadCom extends React.Component {
const value = props.value
this.state = {
url:value
}
}
triggerChange = (changedValue) => {
// Should provide an event to pass value to Form.
const onChange = this.props.onChange;
......@@ -31,7 +31,7 @@ export default class ImgUploadCom extends React.Component {
if (info.file.status === 'done') {
message.success(`图片上传成功`);
if (!('value' in this.props)) {
this.setState({url: info.file.response });
}
......@@ -41,13 +41,13 @@ export default class ImgUploadCom extends React.Component {
}
}
changePos=(obj)=>{
if (!('value' in this.props)) {
this.setState({...obj});
}
this.triggerChange({...obj});
}
render() {
const{json,disabled}=this.props
......@@ -60,6 +60,6 @@ export default class ImgUploadCom extends React.Component {
</Upload.Dragger>
);
}
}
\ No newline at end of file
}
import React from 'react'
import {extend} from 'umi-request';
import queryConfig from "@/utils/queryConfig";
import {Upload, message} from 'antd';
import {isJSON} from "@/webPublic/one_stop_public/copy";
const getToken = () => {
const x = localStorage.getItem('uploadVideoServiceToken');
if(x === "null" || x === "undefined"){
return null;
}
return x;
};
const configService = queryConfig('uploadVideoService');
const token = getToken();
const umiRequest = extend({
// errorHandler, // 默认错误处理
credentials: 'omit', // 默认请求是否带上cookie
mode: 'cors',
});
export default class VideoUploadCom extends React.Component {
constructor(props) {
super(props);
const {value} = props;
let url = value;
if (isJSON(value)) {
url = JSON.parse(value).url;
}
this.state = {
url: url || '',
}
}
triggerChange = (changedValue) => {
// Should provide an event to pass value to Form.
const onChange = this.props.onChange;
if (onChange) {
onChange(changedValue);
}
};
componentWillReceiveProps(nextProps) {
// Should be a controlled component.
if ('value' in nextProps) {
const {value} = nextProps;
if (isJSON(value)) {
this.setState({
url: JSON.parse(value).url,
});
}
}
}
changeUrl = (info, key) => {
if (info.file.status === 'done') {
let filePathThis = info?.file?.response?.data?.filePath;
message.info('视频正在转换中,请稍后');
if (filePathThis) {
setTimeout(() => {
umiRequest(`${configService}/folderApi/findByPath?token=${token}&path=${filePathThis}`, {method: 'GET'}).then((res) => {
if (res && res.data) {
let info = res.data;
const {screenshots, url, createTime, downloadUrl, filePath} = info;
let needInfo = {
screenshots,
url,
createTime,
downloadUrl,
filePath,
};
message.success(`视频上传成功`);
this.triggerChange(JSON.stringify(needInfo));
}
});
}, 5000);
}
} else if (info.file.status === 'error') {
message.error(`视频上传失败`);
}
};
render() {
const {json, disabled} = this.props;
const {url} = this.state;
console.log(url);
return (
<Upload.Dragger disabled={disabled}
accept={'.mp4,.webm,.ogg'}
url={url}
showUploadList={false}
name="file"
action={configService + '/uploadFileApi/upload'}
onChange={this.changeUrl}
multiple={false}
data={{
isConvert: true,
token,
}}
style={{padding: 0}}>
{url ? <video src={url}
controls
style={{
height: json.height,
width: json.width,
}}/> :
<div style={{height: json.height, width: json.width}}>
</div>}
</Upload.Dragger>
);
}
}
......@@ -162,7 +162,7 @@ export default class tableCom extends Component {
});
};
showModal = (fk, title, data, modalProps) => {
const { dispatch } = this.props;
const x = this.props.DataColumn.isShowModal
x[fk]=true
......@@ -322,8 +322,8 @@ export default class tableCom extends Component {
const src =
props.src != null
? props.src.indexOf('http') > -1
? props.src
: config.httpServer + props.src
? props.src
: config.httpServer + props.src
: null;
const pp = { ...props, src: src };
return <img {...pp} />;
......@@ -516,11 +516,11 @@ export default class tableCom extends Component {
let dataColumn =
this.props.fatherCode != null
? bindObj
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
: bindObj;
if (this.props.fatherCode == null && dataColumn == null)
dataColumn = { base52: this.props.uuid };
......@@ -1247,11 +1247,11 @@ export default class tableCom extends Component {
let dataColumn =
this.props.fatherCode != null
? bindObj
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
: bindObj;
if (this.props.fatherCode == null && dataColumn == null)
dataColumn = { base52: this.props.uuid };
......@@ -1637,14 +1637,14 @@ export default class tableCom extends Component {
break;
case 'Cron':
cm = (
<span style={{ paddingRight: get == 'mobile' ? 8 : '' }}>
cm = (
<span style={{ paddingRight: get == 'mobile' ? 8 : '' }}>
{value}
{get === 'mobile' ? <br /> : ''}
{get === 'mobile' ? <br /> : ''}
</span>
);
break;
);
break;
case 'InputNumber':
cm = (
<span>
......@@ -1661,8 +1661,8 @@ export default class tableCom extends Component {
{get === 'mobile' ? <br /> : ''}
</span>
) : (
''
);
''
);
break;
case 'UploadCom':
......@@ -1811,8 +1811,8 @@ export default class tableCom extends Component {
</span>
</>
) : (
''
)}
''
)}
</Col>
<Col
span={json.wrapperSpan}
......@@ -1878,11 +1878,11 @@ export default class tableCom extends Component {
let dataColumn =
this.props.fatherCode != null
? bindObj
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
? {
...bindObj,
base52: `${this.props.fatherCode}.[${this.props.index}].${bindObj.base52}`,
}
: { base52: `${this.props.fatherCode}.[${this.props.index}].${this.props.uuid}` }
: bindObj;
if (this.props.fatherCode == null && dataColumn == null) {
......@@ -1895,7 +1895,7 @@ export default class tableCom extends Component {
var title = json.label || (dataColumn && dataColumn.title);
var initValue;
const objinit = { ...init, ...obj };
if (objinit != null&&Object.keys(objinit).length>0) {
if (this.props.fatherCode != null) {
initValue =
......@@ -1907,11 +1907,11 @@ export default class tableCom extends Component {
}
} else {
if (json.initialValue != null) {
try {
initValue = JSON.parse(json.initialValue);
} catch (e) {
initValue = null;
}
}
......@@ -1996,13 +1996,13 @@ export default class tableCom extends Component {
typeof r == 'string' ? (
<span>{r}</span>
) : (
Object.values(r)
)
Object.values(r)
)
) : typeof r == 'string' ? (
<span style={{ marginLeft: 12 }}>{r}</span>
) : (
',' + Object.values(r)
),
',' + Object.values(r)
),
)
: ''}
</span>
......@@ -2143,35 +2143,35 @@ export default class tableCom extends Component {
cm = (
<ul>
{Array.isArray(files) &&
files.map((f, index2) => {
// if (f.filePath.indexOf('.png') != -1 || f.filePath.indexOf('.jpg') != -1) {
// return (
// <img
// key={index2}
// style={{ width: 100, height: 100 }}
// src={queryApiActionPath() + f.filePath}
// />
// );
// }
if (get === 'web' || !this.props.isPrint) {
return (
<li key={index2}>
<FilePreview path={queryApiActionPath() + f.path} pathName={f.name} />
</li>
);
}
files.map((f, index2) => {
// if (f.filePath.indexOf('.png') != -1 || f.filePath.indexOf('.jpg') != -1) {
// return (
// <img
// key={index2}
// style={{ width: 100, height: 100 }}
// src={queryApiActionPath() + f.filePath}
// />
// );
// }
if (get === 'web' || !this.props.isPrint) {
return (
<li key={index2}>
<a
target="_blank"
key={f.filePath}
href={queryApiActionPath() + f.filePath}
>
{f.fileName}
</a>
<FilePreview path={queryApiActionPath() + f.path} pathName={f.name} />
</li>
);
})}
}
return (
<li key={index2}>
<a
target="_blank"
key={f.filePath}
href={queryApiActionPath() + f.filePath}
>
{f.fileName}
</a>
</li>
);
})}
</ul>
);
}
......@@ -2196,11 +2196,11 @@ export default class tableCom extends Component {
height={json.height}
/>
) : (
<img
src={config.httpServer + obj[dataColumn.base52]}
style={{ width: json.width, height: json.height }}
/>
);
<img
src={config.httpServer + obj[dataColumn.base52]}
style={{ width: json.width, height: json.height }}
/>
);
}
break;
......@@ -2434,7 +2434,7 @@ export default class tableCom extends Component {
}
>
{(json.isMobileLabel != null && json.isMobileLabel) ||
(json.isMobileLabel == null && json.isLabel)
(json.isMobileLabel == null && json.isLabel)
? title
: ''}
</MobileList.Item>
......@@ -2458,7 +2458,7 @@ export default class tableCom extends Component {
);
break;
case 'Input':
cm = getFieldDecorator(dataColumn.base52, {
initialValue: initValue,
......@@ -2931,17 +2931,17 @@ export default class tableCom extends Component {
);
}
break;
case 'Cron':
cm = getFieldDecorator(dataColumn.base52, {
initialValue: initValue,
rules:
json.vlds && json.vlds.length > 0
? json.vlds
: [{ required: required, message: '请输入' + title }],
})(
<CronEditor style={{width:600}}/>
);
break;
case 'Cron':
cm = getFieldDecorator(dataColumn.base52, {
initialValue: initValue,
rules:
json.vlds && json.vlds.length > 0
? json.vlds
: [{ required: required, message: '请输入' + title }],
})(
<CronEditor style={{width:600}}/>
);
break;
case 'LocationCom':
cm = getFieldDecorator(dataColumn.base52, {
initialValue: {},
......@@ -3145,8 +3145,8 @@ export default class tableCom extends Component {
/>
</FormModal>
) : (
''
)}
''
)}
<Card.Header title={<span style={{ fontSize: 14 }}>{title}:</span>} />
<Card.Body>{cm}</Card.Body>
</Card>
......@@ -3226,8 +3226,8 @@ export default class tableCom extends Component {
/>
</FormModal>
) : (
''
)}
''
)}
</Row>
);
} else {
......@@ -3262,8 +3262,8 @@ export default class tableCom extends Component {
/>
</FormModal>
) : (
''
)}
''
)}
<Form.Item
labelCol={{ span: json.labelSpan }}
wrapperCol={{ span: json.wrapperSpan }}
......@@ -3305,8 +3305,8 @@ export default class tableCom extends Component {
/>
</FormModal>
) : (
''
)}
''
)}
{cm}
</>
);
......@@ -3342,8 +3342,8 @@ export default class tableCom extends Component {
/>
</FormModal>
) : (
''
)}
''
)}
{json.isMobileLabel && !isEdit && get == 'mobile' ? (
<MobileItem
isPreview={isPreview}
......@@ -3363,11 +3363,11 @@ export default class tableCom extends Component {
{cm}
</Form.Item>
) : (
<Form.Item>{cm}</Form.Item>
)
<Form.Item>{cm}</Form.Item>
)
) : (
cm
)}
cm
)}
</>
);
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论