Skip to content

W
web-ci-test
提交 4d2c35a0 作者: 龚洪江
操作

修复：论坛上传视频

上级 4c8b2052
正在显示 包含 116 行增加 和 64 行删除
api/index.tsx
......@@ -79,6 +79,10 @@ export default {
imgOss: () => {
return config.baseUrl + '/pms/upload/imgOss';
},
//文件上传地址
fileUpload: () => {
return config.baseUrl + '/pms/upload/breakpoint';
},
//宣传中心
listBannerImg: (
moduleCode: string,
......
components/uploader/index.tsx
......@@ -44,7 +44,6 @@ export const Uploader: React.FC<PropsType> = (props) => {
listType,
fileList,
beforeUpload: (res) => {
console.log('上传文件-->', res);
const isType = fileType?.includes(res.type);
const isSize = res.size / 1024 / 1024 < (fileSize || 2);
const isLength = fileList.length < (fileLength || 1);
......
pages/forum/api/index.tsx
......@@ -40,6 +40,7 @@ export interface CommentParams {
content: string; //评论内容
dynamicId: number; //动态id
parentId?: number; //父级评论
rootPath: string;
}
export interface ByDynamicResp {
......
pages/forum/components/publishMessage/index.module.scss 0 → 100644
.mediaContent{
display: flex;
align-items: center;
.mediaItemWrap{
position: relative;
.mediaItem{
margin-right: 10px;
margin-bottom: 10px;
}
.mediaDelete{
position: absolute;
right: 0;
top: 0;
transform: translate(0%,-50%);
}
}
}
pages/forum/components/publishMessage/index.tsx
import { PlusOutlined } from '@ant-design/icons';
import { Form, Input, Modal, Upload, Image, Button, Row, Col } from 'antd';
import type { RcFile, UploadProps } from 'antd/es/upload';
import type { UploadProps } from 'antd/es/upload';
import type { UploadFile } from 'antd/es/upload/interface';
import { useContext, useEffect, useState } from 'react';
import gApi from '~/api';
......@@ -8,7 +7,9 @@ import NImage from 'next/image';
import api from './api';
import { useGeolocation } from '~/lib/hooks';
import { UserContext } from '~/lib/userProvider';
import { useToken } from 'antd/es/theme/internal';
import uploadImg from '~/assets/images/upload.png';
import deleteIcon from '~/assets/images/delete-icon.png';
import styles from './index.module.scss';
type Props = {
open: boolean;
......@@ -25,10 +26,6 @@ const normFile = (e: any) => {
};
export default function PublishMessage(props: Props) {
const [confirmLoading, setConfirmLoading] = useState(false);
const [previewOpen, setPreviewOpen] = useState(false);
const [previewImage, setPreviewImage] = useState('');
const [previewTitle, setPreviewTitle] = useState('');
const [fileList, setFileList] = useState<UploadFile[]>([]);
const [showLoading, setShowLoad] = useState(false);
const [form] = Form.useForm();
......@@ -39,22 +36,23 @@ export default function PublishMessage(props: Props) {
useEffect(() => {
setToken(window.localStorage.getItem('token') || '');
}, []);
//预览关闭
const handlePreviewCancel = () => setPreviewOpen(false);
//图片预览
const handlePreview = async (file: UploadFile) => {
if (file.url) {
setPreviewImage(file.url);
setPreviewOpen(true);
setPreviewTitle(file.name || file.url!.substring(file.url!.lastIndexOf('/') + 1));
}
};
//图片上传
const handleChange: UploadProps['onChange'] = (info) => {
console.log('uploadChange', info);
const isType = [
'video/mp4',
'video/avi',
'video/wmv',
'video/rmvb',
'image/png',
'image/jpeg',
'image/jpg',
'image/gif',
'image/bmp',
].includes(info.file.type as string);
if (!isType) {
window.messageApi.error('上传文件类型错误');
return;
}
if (info.file.status === 'uploading') {
let find = fileList.find((item) => {
return item.uid === info.file.uid;
......@@ -64,11 +62,10 @@ export default function PublishMessage(props: Props) {
}
return;
} else if (info.file.status === 'done') {
// Get this url from response in real world.
if (info.file.response.code === '200' && info.file.response.result) {
let fileList1 = fileList.map((item) => {
if (item.uid === info.file.uid) {
info.file.url = info.file.response.result?.[0];
info.file.url = info.file.response.result;
return info.file;
}
return item;
......@@ -85,10 +82,13 @@ export default function PublishMessage(props: Props) {
setFileList([...info.fileList]);
}
};
//删除媒体
const deleteMedia = (file: UploadFile) => {
let list = fileList.filter((v) => v.uid !== file.uid);
setFileList(list || []);
};
//提交
const onFinish = (values: any) => {
console.log(values);
setShowLoad(true);
if (userInfo) {
......@@ -98,9 +98,10 @@ export default function PublishMessage(props: Props) {
lon: position?.position?.lng, //经度
description: values.description, //描述
userId: userInfo.id, //用户id
mediaVO: fileList
.filter((item) => item.url)
.map((item) => ({ type: 0, url: item.url as string })),
mediaVO: fileList.map((item) => ({
type: item.type?.includes('image') ? 0 : 1,
url: item.url as string,
})),
})
.then((res) => {
setShowLoad(false);
......@@ -108,23 +109,26 @@ export default function PublishMessage(props: Props) {
window.messageApi.success('发布成功');
props.onCancel();
props.onOk && props.onOk();
setTimeout(() => {
form.resetFields(['title', 'description']);
form.resetFields();
setFileList([]);
}, 500);
}
});
}
};
//取消
const handleCancel = () => {
form.resetFields();
setFileList([]);
props.onCancel();
};
return (
<Modal
title=''
open={props.open}
onCancel={props.onCancel}
onCancel={handleCancel}
width={500}
confirmLoading={confirmLoading}
footer={null}
okButtonProps={{ style: { height: 37, padding: '0 32px', fontSize: 16 } }}
cancelButtonProps={{ style: { display: 'none' } }}
......@@ -140,34 +144,59 @@ export default function PublishMessage(props: Props) {
style={{ height: 120, resize: 'none' }}
></Input.TextArea>
</Form.Item>
<Form.Item valuePropName='picture' getValueFromEvent={normFile}>
<Upload
name='uploadFile'
action={gApi.imgOss}
listType='picture-card'
fileList={fileList}
onPreview={handlePreview}
onChange={handleChange}
maxCount={1}
headers={{ token: token }}
>
{fileList.length >= 8 ? null : (
<div>
<PlusOutlined />
<div style={{ marginTop: 8 }}>Upload</div>
<Row style={{ marginTop: '10px' }}>
{fileList.length ? (
<Col>
<div className={styles.mediaContent}>
{fileList.map((v, index: number) => (
<div className={styles.mediaItemWrap} key={index}>
<div className={styles.mediaItem}>
{v.type?.includes('image') ? (
<Image
src={v.url}
width={100}
height={100}
alt=''
style={{ verticalAlign: 'top' }}
/>
) : (
<video src={v.url} style={{ width: '100px', height: '100px' }} controls />
)}
</div>
<NImage
src={deleteIcon}
alt=''
className={styles.mediaDelete}
width={20}
height={20}
onClick={() => deleteMedia(v)}
/>
</div>
))}
</div>
)}
</Upload>
<Modal
open={previewOpen}
title={previewTitle}
footer={null}
onCancel={handlePreviewCancel}
bodyStyle={{ textAlign: 'center' }}
>
<Image alt='example' src={previewImage} preview={false} />
</Modal>
</Form.Item>
</Col>
) : (
''
)}
<Col>
<Form.Item valuePropName='picture' getValueFromEvent={normFile}>
<Upload
name='uploadFile'
action={gApi.fileUpload}
listType='picture-card'
onChange={handleChange}
showUploadList={false}
maxCount={1}
headers={{ token: token }}
>
{fileList.length >= 8 ? null : (
<NImage src={uploadImg} alt='' width={100} height={100} />
)}
</Upload>
</Form.Item>
</Col>
</Row>
<Row justify='space-between' align='middle'>
<Col>
<NImage
......
pages/forum/index.page.tsx
......@@ -102,6 +102,7 @@ export default function Forum() {
.comment({
content: values.content,
dynamicId: item.id,
rootPath: item.id.toString(),
})
.then((res) => {
if (res.code === '200') {
......
pages/mall/detail/components/orderForGoods/index.tsx
......@@ -24,12 +24,11 @@ interface PropsBox {
export default function OrderForGoods(props: PropsBox) {
const { setIsorderForGoods, shopDetail, detailData, wareSkuList, discount, mallDetail } = props;
const [value, setValue] = useState(1);
const [value, setValue] = useState(0);
const [areaValue, setAreaValue] = useState<string>();
const [list, setList] = useState<Array<UserAddress> | null>();
const onChange = (e: RadioChangeEvent) => {
console.log('radio checked', e.target.value);
setValue(e.target.value);
};
const onChangeValue = (index: number) => {
......@@ -37,7 +36,7 @@ export default function OrderForGoods(props: PropsBox) {
};
const detailSumbit = () => {
if (!list?.length) return message.warning('暂无地址信息,请前往云享飞添加地址');
if (list?.length && !value && value !== 0) return message.warning('请选择地址');
if (!value) return message.warning('请选择地址');
if (detailData && list && mallDetail) {
const pushList = {
buyNum: mallDetail.buyNum,
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论