Skip to content

A
admin-ci-test
提交 276d036c 作者: 龚洪江
操作

功能：服务管理

上级 4cfad1de
正在显示 包含 221 行增加 和 28 行删除
src/api/interface/mallManageType.ts
import { InterFunction, InterListFunction } from '~/api/interface';
import { InterFunction, InterItemFunction, InterListFunction } from '~/api/interface';
// V1.0.1课程视频列表
export type queryCurriculumInfoListType = InterListFunction<
{
......@@ -106,8 +106,64 @@ export type addServiceType = InterFunction<
industryId: number;
serviceIntroduction?: string;
serviceName: string;
shareCard?: string;
video?: string;
},
any
>;
//服务-更新
export type editServiceType = InterFunction<
{
applicationId: number;
coverPlan: string;
displayState: number;
industryId: number;
serviceIntroduction?: string;
serviceName: string;
shareCard?: string;
video?: string;
id: number;
},
any
>;
//服务-列表
export type serviceType = InterItemFunction<
{ applicationId?: number; industryId?: number; serviceName?: string; displayState?: number },
{
applicationName: string;
serviceName: string;
industryName: string;
coverPlan: string;
shareCard: string;
video: string;
},
serviceIntroduction: string;
displayState: number;
applicationId: number;
industryId: number;
id: number;
}[]
>;
//服务-上下架-批量
export type batchUpAndDownWorkServiceType = InterFunction<
{ displayState: number; ids: number[] },
any
>;
//服务-删除-批量
export type deleteServiceType = InterFunction<number[], any>;
//服务-详情
export type serviceDetailType = InterFunction<
{ id: number },
{
applicationName: string;
serviceName: string;
industryName: string;
coverPlan: string;
shareCard: string;
video: string;
serviceIntroduction: string;
displayState: number;
applicationId: number;
industryId: number;
id: number;
}
>;
src/api/modules/mallManage.ts
......@@ -5,8 +5,13 @@ import {
queryCategoryInfoByType,
queryCurriculumInfoListType,
removeCurriculumType,
serviceType,
treeCurriculumSkillType,
updateCurriculumType,
editServiceType,
batchUpAndDownWorkServiceType,
deleteServiceType,
serviceDetailType,
} from '~/api/interface/mallManageType';
export class MallManageAPI {
......@@ -32,4 +37,19 @@ export class MallManageAPI {
// 服务-新增
static addService: addServiceType = (data) =>
axios.post('/pms/backstage/work/addWorkService', data);
//服务-编辑
static editService: editServiceType = (data) =>
axios.post('/pms/backstage/work/updateWorkService', data);
// 服务-列表
static getServiceList: serviceType = (data) =>
axios.post('/pms/backstage/work/queryServiceManagerList', data);
// 服务-上下架
static batchUpAndDownWorkService: batchUpAndDownWorkServiceType = (data) =>
axios.post('/pms/backstage/work/batchUpAndDownWorkService', data);
// 服务-删除-批量
static deleteService: deleteServiceType = (data) =>
axios.post('/pms/backstage/work/deleteWorkService', data);
// 服务-详情
static getServiceDetail: serviceDetailType = (params) =>
axios.get('/pms/backstage/work/queryWorkService', { params });
}
src/components/uploader/index.tsx
......@@ -115,6 +115,8 @@ export const Uploader: React.FC<PropsType> = (props) => {
// 如果有默认文件列表
if (defaultFileList?.length) {
setFileList(defaultFileList);
} else {
setFileList([]);
}
}, [defaultFileList]);
return (
......
src/pages/mallManage/serviceManage/serviceDetail/index.tsx
import { Button, Form } from 'antd';
import { useNavigate } from 'react-router-dom';
import { useNavigate, useSearchParams } from 'react-router-dom';
import './index.scss';
import { MallManageAPI } from '~/api';
import { useState } from 'react';
import { InterDataType } from '~/api/interface';
import { serviceDetailType } from '~/api/interface/mallManageType';
//服务详情-返回类型
type detailType = InterDataType<serviceDetailType>;
const ServiceDetail = () => {
const navigate = useNavigate();
const [searchParams] = useSearchParams();
const [serviceDetail, setServiceDetail] = useState<detailType>();
//服务详情
const getServiceDetail = (id: number) => {
MallManageAPI.getServiceDetail({ id }).then(({ result }) => {
setServiceDetail(result);
});
};
//返回
const backRoute = () => {
navigate(-1);
getServiceDetail(Number(searchParams.get('id')));
};
return (
<div className='service-detail'>
......
src/pages/mallManage/serviceManage/serviceIntroduce/index.tsx
import { Button } from 'antd';
import { useNavigate } from 'react-router-dom';
import { useNavigate, useSearchParams } from 'react-router-dom';
import './index.scss';
import { useEffect, useState } from 'react';
import { MallManageAPI } from '~/api';
import RichText from '~/components/richText';
import { InterDataType } from '~/api/interface';
import { serviceDetailType } from '~/api/interface/mallManageType';
//服务详情-返回类型
type detailType = InterDataType<serviceDetailType>;
const ServiceIntroduce = () => {
const navigate = useNavigate();
const [searchParams] = useSearchParams();
const [serviceDetail, setServiceDetail] = useState<detailType>();
//服务详情
const getServiceDetail = (id: number) => {
MallManageAPI.getServiceDetail({ id }).then(({ result }) => {
setServiceDetail(result);
});
};
const richTextChange = (text?: string) => {};
//返回
const backRoute = () => {
navigate(-1);
};
useEffect(() => {
getServiceDetail(Number(searchParams.get('id')));
});
return (
<div className='service-introduce'>
<div className='service-introduce-operate'>
......@@ -18,7 +37,9 @@ const ServiceIntroduce = () => {
</Button>
</div>
<div className='service-introduce-title'></div>
<div className='service-introduce-rich-text'></div>
<div className='service-introduce-rich-text'>
<RichText value={serviceDetail.serviceIntroduction} onChange={richTextChange} />
</div>
</div>
);
};
......
src/pages/mallManage/serviceManage/serviceList/components/addOrEditServiceModal/index.tsx
import { FC, useState } from 'react';
import { Button, Col, Form, Input, Modal, Row, Select, Upload } from 'antd';
import { FC, useEffect, useState } from 'react';
import { Button, Form, Input, message, Modal, Select } from 'antd';
import { ModalProps } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import { Uploader } from '~/components/uploader';
import { InterDataType, InterReqType } from '~/api/interface';
import { categoryListType } from '~/api/interface/categoryManage';
import { addServiceType } from '~/api/interface/mallManageType';
import { addServiceType, serviceType } from '~/api/interface/mallManageType';
import { MallManageAPI } from '~/api';
//分类返回类型
type categoryType = InterDataType<categoryListType>['list'];
//服务返回类型
type serviceListType = InterDataType<serviceType>['list'];
interface selfProps {
industryCategoryList: categoryType;
applicationCategoryList: categoryType;
handleOk: () => void;
handleCancel: () => void;
currentServiceData: serviceListType[0] | undefined;
}
//新增服务参数类型
type addServiceParametersType = InterReqType<addServiceType>;
......@@ -19,9 +26,11 @@ type addServiceParametersType = InterReqType<addServiceType>;
const AddOrEditServiceModal: FC<ModalProps & selfProps> = ({
open,
title,
onCancel,
handleCancel,
handleOk,
industryCategoryList,
applicationCategoryList,
currentServiceData,
}) => {
const [form] = Form.useForm<addServiceParametersType>();
//封面图文件
......@@ -94,8 +103,72 @@ const AddOrEditServiceModal: FC<ModalProps & selfProps> = ({
});
setVideoFileList(fileList);
};
const onOk = () => {
form.validateFields().then((value: any) => {
MallManageAPI[currentServiceData ? 'editService' : 'addService']({
id: currentServiceData ? currentServiceData.id : undefined,
...value,
}).then(({ code }) => {
if (code === '200') {
message.success(currentServiceData ? '编辑服务成功' : '新增服务成功');
form.resetFields();
handleOk();
}
});
});
};
const onCancel = () => {
form.resetFields();
handleCancel();
};
useEffect(() => {
if (currentServiceData) {
form.setFieldsValue({
serviceName: currentServiceData.serviceName,
applicationId: currentServiceData.applicationId,
industryId: currentServiceData.industryId,
coverPlan: currentServiceData.coverPlan,
shareCard: currentServiceData.shareCard || undefined,
video: currentServiceData.video || undefined,
displayState: currentServiceData.displayState,
});
setCoverPlanFileList([
{
id: Math.random(),
uid: Math.random(),
url: currentServiceData.coverPlan,
name: 'coverPlan',
},
]);
if (currentServiceData.shareCard) {
setShareCardFileList([
{
id: Math.random(),
uid: Math.random(),
url: currentServiceData.shareCard,
name: 'shareCard',
},
]);
}
if (currentServiceData.video) {
setVideoFileList([
{
id: Math.random(),
uid: Math.random(),
url: currentServiceData.video,
name: 'shareCard',
},
]);
}
} else {
setCoverPlanFileList([]);
setVideoFileList([]);
setShareCardFileList([]);
}
}, [currentServiceData]);
return (
<Modal open={open} title={title} onCancel={onCancel}>
<Modal open={open} title={title} onCancel={onCancel} onOk={onOk}>
<Form
labelCol={{ span: 4 }}
wrapperCol={{ span: 16 }}
......@@ -140,31 +213,37 @@ const AddOrEditServiceModal: FC<ModalProps & selfProps> = ({
name='coverPlan'
rules={[{ required: true, message: '请上传封面图' }]}
>
<Uploader listType='picture-card' fileUpload onChange={coverPlanUploadSuccess}>
<Uploader
listType='picture-card'
fileUpload
onChange={coverPlanUploadSuccess}
defaultFileList={coverPlanFileList}
>
<UploadOutlined />
</Uploader>
</Form.Item>
<Form.Item label='分享卡片' name='shareCard'>
<Uploader listType='picture-card' fileUpload onChange={shareCardUploadSuccess}>
<Uploader
listType='picture-card'
fileUpload
onChange={shareCardUploadSuccess}
defaultFileList={shareCardFileList}
>
<UploadOutlined />
</Uploader>
</Form.Item>
<Form.Item label='视频' name='video'>
<Row>
<Col></Col>
<Col>
<Uploader
listType='text'
fileUpload
onChange={videoUploadSuccess}
fileType={['video/mp4', 'video/avi', 'video/wmv', 'video/rmvb']}
>
<Button icon={<UploadOutlined />} size='small' type='primary'>
上传
</Button>
</Uploader>
</Col>
</Row>
<Uploader
listType='text'
fileUpload
onChange={videoUploadSuccess}
fileType={['video/mp4', 'video/avi', 'video/wmv', 'video/rmvb']}
defaultFileList={videoFileList}
>
<Button icon={<UploadOutlined />} size='small' type='primary'>
上传
</Button>
</Uploader>
</Form.Item>
<Form.Item label='展示状态' name='displayState'>
<Select placeholder='请选择展示状态'>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论