Skip to content

A
admin
提交 2411238c 作者: 龚洪江
操作

联调：商品联调

上级 7075ed8a
正在显示 包含 901 行增加 和 266 行删除
package.json
...@@ -32,11 +32,11 @@ ...@@ -32,11 +32,11 @@
"query-string": "^8.1.0", "query-string": "^8.1.0",
"react": "^18.1.0", "react": "^18.1.0",
"react-dom": "^18.1.0", "react-dom": "^18.1.0",
"react-quill": "^2.0.0",
"react-redux": "^8.0.5", "react-redux": "^8.0.5",
"react-router-dom": "^6.10.0", "react-router-dom": "^6.10.0",
"react-viewer": "^3.2.2", "react-viewer": "^3.2.2",
"sort-by": "^1.2.0", "sort-by": "^1.2.0",
"wangeditor": "^4.7.15",
"xlsx": "^0.18.5" "xlsx": "^0.18.5"
}, },
"devDependencies": { "devDependencies": {
......
src/api/interface/categoryManage.ts
...@@ -48,6 +48,15 @@ export type categoryListType = InterItemFunction< ...@@ -48,6 +48,15 @@ export type categoryListType = InterItemFunction<
{ directoryId?: number; type?: number }, { directoryId?: number; type?: number },
categoryReposeType[] categoryReposeType[]
>; >;
//目录列表类型-分页
export type directoryPageListType = InterItemFunction<
{ type?: number },
{
id: number;
directoryName: string;
type: number;
}[]
>;
//目录列表类型-不分页 //目录列表类型-不分页
export type directoryListType = InterFunction< export type directoryListType = InterFunction<
{ type: number }, { type: number },
......
src/api/interface/commonType.ts
...@@ -14,4 +14,4 @@ export type BackEndLoginType = InterFunction< ...@@ -14,4 +14,4 @@ export type BackEndLoginType = InterFunction<
} }
>; >;
// 上传图片 // 上传图片
export type uploadOssType = InterFunction<any, NonNullable<unknown>>; export type uploadOssType = InterFunction<any, { filePath: string }>;
src/api/interface/goodsType.ts 0 → 100644
import { UploadFile } from 'antd/es/upload/interface';
// 商城-新增商品
import { InterFunction } from '~/api/interface';
//商品-新增
export type BaseInfoType = {
goodsName: string;
goodsDesc: string;
directoryId: number;
tag: string;
shelfStatus: number;
categoryByOne: number;
categoryByTwo: number;
images: { id: number; imgType: number; imgUrl: string }[];
goodsVideo: string;
};
// 库存规格
export interface specEntity {
id: number;
categoryId: number | string;
goodsSpecName: string;
skuId: number;
specIds: any;
chooseType: number;
must: number;
skuUnitId: number;
customizeInfo?: customizeEntity[];
productSpecList?: customizeEntity[];
industrySpecList?: any;
isCustomProd: boolean;
skuName?: string;
flag: number;
productName?: string;
}
// 自定义规格
export interface customizeEntity {
id: number;
partNo: string;
specName: string;
specImage?: string;
fileList?: UploadFile[];
productSpecCPQVO?: any;
productSpec?: number;
}
export type addGoodsType = InterFunction<
BaseInfoType & {
productSpec: specEntity[];
goodsDetailVO: { goodsDesc: string; productDesc?: string };
otherService: number[];
},
any
>;
//商品-编辑
export type editGoodsType = InterFunction<
BaseInfoType & {
productSpec: specEntity[];
goodsDetailVO: { goodsDesc: string; productDesc?: string };
otherService: number[];
id: number;
},
any
>;
//商品-详情
export type detailGoodsType = InterFunction<
{ goodsInfoId: number },
BaseInfoType & {
goodsSpec: specEntity[];
goodsDetail: { goodsDesc: string; productDesc: string };
otherService: number[];
goodsVideoId: number;
id: number;
}
>;
//商品-其它服务列表
export type otherServiceType = InterFunction<any, { id: number; saleServiceName: string }[]>;
//商品-规格单位
export type skuUnitType = InterFunction<any, { id: number; unitName: string }[]>;
src/api/modules/categoryManage.ts
import axios from '../request'; import axios from '../request';
import { categoryListType, directoryListType, GoodsInfo } from '~/api/interface/categoryManage'; import {
categoryListType,
directoryListType,
directoryPageListType,
GoodsInfo,
} from '~/api/interface/categoryManage';
export class CategoryManageAPI { export class CategoryManageAPI {
// 分类目录 // 分类目录
...@@ -9,17 +14,15 @@ export class CategoryManageAPI { ...@@ -9,17 +14,15 @@ export class CategoryManageAPI {
}); });
}; };
// 分类目录(类型) // 分类目录(类型)
static getDirectoryListClone: directoryListType = (params) => { static directoryListClone: directoryPageListType = (params) => {
return axios.get('/pms/classify/getDirectoryList', { params }); return axios.get('pms/classify/directoryList', {
};
//目录列表不含分页
static getDirectoryList = (params: { type: number }) => {
return axios.get('pms/classify/getDirectoryList', {
params, params,
}); });
}; };
// 分类目录-不分页(类型)
static getDirectoryListClone: directoryListType = (params) => {
return axios.get('/pms/classify/getDirectoryList', { params });
};
// 新增或编辑目录 // 新增或编辑目录
static addOrEditDirectory = ( static addOrEditDirectory = (
data: { id?: number; directoryName: string; type: number; relevance: number }[], data: { id?: number; directoryName: string; type: number; relevance: number }[],
......
src/api/modules/goodsAPI.ts 0 → 100644
import {
addGoodsType,
detailGoodsType,
editGoodsType,
otherServiceType,
skuUnitType,
} from '~/api/interface/goodsType';
import axios from '../request';
class GoodsAPI {
//商品-新增
static addGoods: addGoodsType = (data) => {
return axios.post('/pms/goods/addGoodsInfo', data);
};
//商品-编辑
static editGoods: editGoodsType = (data) => {
return axios.post('/pms/goods/editGoodsInfo', data);
};
//商品-详情
static getGoodsDetail: detailGoodsType = (params) => {
return axios.get('/pms/goods/getGoodsInfoDetail', { params });
};
// 商品-单位
static getSkuUnit: skuUnitType = () => {
return axios.get('/pms/goods/getSkuUnit');
};
// 商品-其它服务列表
static getOtherServiceList: otherServiceType = () => {
return axios.get('/pms/goods/listOtherService');
};
}
export default GoodsAPI;
src/api/modules/produceManageAPI.ts
...@@ -14,7 +14,6 @@ import { ...@@ -14,7 +14,6 @@ import {
ProductSpecListType, ProductSpecListType,
productSpecPriceType, productSpecPriceType,
} from '~/api/interface/produceManageType'; } from '~/api/interface/produceManageType';
import dayjs from 'dayjs';
export class ProduceManageAPI { export class ProduceManageAPI {
// 产品管理-分页列表 // 产品管理-分页列表
......
src/components/EditableCell/index.tsx 0 → 100644
import { Form, InputNumber, Input } from 'antd';
import React from 'react';
// 表格可编辑单元格
interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
editing: boolean;
dataIndex: string;
title: any;
inputType: 'number' | 'text';
record: any;
index: number;
children: React.ReactNode;
}
const EditableCell: React.FC<EditableCellProps> = ({
editing,
dataIndex,
title,
inputType,
record,
index,
children,
...restProps
}) => {
const inputNode =
inputType === 'number' ? <InputNumber /> : <Input placeholder={`请输入${title}`} />;
return (
<td {...restProps}>
{editing ? (
<Form.Item
name={dataIndex + record.id}
style={{ margin: 0 }}
rules={[
{
required: true,
message: `请输入${title}`,
},
]}
>
{inputNode}
</Form.Item>
) : (
children
)}
</td>
);
};
export default EditableCell;
src/components/richText/index.tsx
import ReactQuill from 'react-quill'; import React, { useEffect } from 'react';
import 'react-quill/dist/quill.snow.css'; import E from 'wangeditor';
import { FC, useEffect, useRef } from 'react'; import { message } from 'antd';
// import events from '@/events';
import { CommonAPI } from '~/api';
interface selfProps { let editor: any = null;
richTextHeight: number;
interface PropsType {
onChange: (html?: string) => void;
value: string;
// eslint-disable-next-line react/require-default-props
isDetail?: boolean;
} }
const RichText: FC<selfProps> = ({ richTextHeight }) => { const RichText: React.FC<PropsType> = ({ onChange, value, isDetail }) => {
const quillRef = useRef<any>(); useEffect(() => {
const modules = { // 注：class写法需要在componentDidMount 创建编辑器
toolbar: { editor = new E('.edit');
container: [ editor.config.uploadImgShowBase64 = false;
[{ size: ['small', false, 'large', 'huge'] }], //字体设置 editor.config.zIndex = 1;
// [{ 'header': [1, 2, 3, 4, 5, 6, false] }], //标题字号，不能设置单个字大小 editor.config.height = 550;
['bold', 'italic', 'underline', 'strike'], editor.config.uploadImgMaxLength = 5;
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }], editor.config.uploadImgMaxSize = 1024 * 1024 * 3; // 2M
['link', 'image'], // a链接和图片的显示 editor.config.customUploadImg = async (resultFiles: any, insertImgFn: any) => {
[{ align: [] }], // resultFiles 是 input 中选中的文件列表
[ // insertImgFn 是获取图片 url 后，插入到编辑器的方法
{ const formData = new FormData();
background: [ resultFiles.map(async (item: any) => {
'rgb( 0, 0, 0)', formData.append('uploadFile', item);
'rgb(230, 0, 0)', });
'rgb(255, 153, 0)', const { code, result } = await CommonAPI.uploadOss(formData);
'rgb(255, 255, 0)', if (code === '200') {
'rgb( 0, 138, 0)', insertImgFn(result.filePath);
'rgb( 0, 102, 204)', message.success('上传成功');
'rgb(153, 51, 255)', } else {
'rgb(255, 255, 255)', message.error('上传失败');
'rgb(250, 204, 204)', }
'rgb(255, 235, 204)', };
'rgb(255, 255, 204)', editor.config.onchange = (newHtml: string) => {
'rgb(204, 232, 204)', if (newHtml) {
'rgb(204, 224, 245)', onChange(newHtml);
'rgb(235, 214, 255)', } else {
'rgb(187, 187, 187)', onChange(undefined);
'rgb(240, 102, 102)', }
'rgb(255, 194, 102)', };
'rgb(255, 255, 102)',
'rgb(102, 185, 102)', // 需要展示的菜单
'rgb(102, 163, 224)', editor.config.menus = [
'rgb(194, 133, 255)', 'head',
'rgb(136, 136, 136)', 'bold',
'rgb(161, 0, 0)', 'fontSize',
'rgb(178, 107, 0)', 'fontName',
'rgb(178, 178, 0)', 'italic',
'rgb( 0, 97, 0)', 'underline',
'rgb( 0, 71, 178)', 'strikeThrough',
'rgb(107, 36, 178)', 'indent',
'rgb( 68, 68, 68)', 'lineHeight',
'rgb( 92, 0, 0)', 'foreColor',
'rgb(102, 61, 0)', 'backColor',
'rgb(102, 102, 0)', 'link',
'rgb( 0, 55, 0)', 'list',
'rgb( 0, 41, 102)', 'todo',
'rgb( 61, 20, 10)', 'justify',
], 'quote',
}, 'table',
], 'splitLine',
[ 'undo',
{ 'redo',
color: [ 'image',
'rgb( 0, 0, 0)', ];
'rgb(230, 0, 0)',
'rgb(255, 153, 0)', /** 一定要创建 */
'rgb(255, 255, 0)', editor.create();
'rgb( 0, 138, 0)', // events.addListener('clearEdit', () => {
'rgb( 0, 102, 204)', // editor.txt.html('');
'rgb(153, 51, 255)', // });
'rgb(255, 255, 255)', return () => {
'rgb(250, 204, 204)', // 组件销毁时销毁编辑器 注：class写法需要在componentWillUnmount中调用
'rgb(255, 235, 204)', editor.destroy();
'rgb(255, 255, 204)', };
'rgb(204, 232, 204)',
'rgb(204, 224, 245)', // 这里一定要加上下面的这个注释
'rgb(235, 214, 255)', // eslint-disable-next-line react-hooks/exhaustive-deps
'rgb(187, 187, 187)', }, []);
'rgb(240, 102, 102)',
'rgb(255, 194, 102)',
'rgb(255, 255, 102)',
'rgb(102, 185, 102)',
'rgb(102, 163, 224)',
'rgb(194, 133, 255)',
'rgb(136, 136, 136)',
'rgb(161, 0, 0)',
'rgb(178, 107, 0)',
'rgb(178, 178, 0)',
'rgb( 0, 97, 0)',
'rgb( 0, 71, 178)',
'rgb(107, 36, 178)',
'rgb( 68, 68, 68)',
'rgb( 92, 0, 0)',
'rgb(102, 61, 0)',
'rgb(102, 102, 0)',
'rgb( 0, 55, 0)',
'rgb( 0, 41, 102)',
'rgb( 61, 20, 10)',
],
},
],
['clean'], //清空
['emoji'], //emoji表情，设置了才能显示
['video2'], //我自定义的视频图标，和插件提供的不一样，所以设置为video2
],
// handlers: {
// image: this.imageHandler.bind(this), //点击图片标志会调用的方法
// video2: this.showVideoModal.bind(this),
// },
},
// ImageExtend: {
// loading: true,
// name: 'img',
// action: RES_URL + "connector?isRelativePath=true",
// response: res => FILE_URL + res.info.url
// },
// ImageDrop: true,
// 'emoji-toolbar': true, //是否展示出来
// 'emoji-textarea': false, //我不需要emoji展示在文本框所以设置为false
// 'emoji-shortname': true,
};
useEffect(() => { useEffect(() => {
quillRef.current.editor.container.style.height = richTextHeight + 'px'; if (editor) {
}); editor.txt.html(value);
return <ReactQuill modules={modules} ref={quillRef} />; }
if (isDetail) {
editor.disable();
}
}, [value]);
return <div className='edit' />;
}; };
export default RichText; export default RichText;
src/components/uploader/index.tsx
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { message, Upload, UploadProps } from 'antd'; import { message, Upload, UploadProps } from 'antd';
// import { UploadFile } from "antd/es/upload/interface";
import { CommonAPI } from '~/api'; import { CommonAPI } from '~/api';
import './index.scss'; import './index.scss';
...@@ -26,7 +25,17 @@ export const Uploader: React.FC<PropsType> = (props) => { ...@@ -26,7 +25,17 @@ export const Uploader: React.FC<PropsType> = (props) => {
listType: 'text', listType: 'text',
fileSize: 2, fileSize: 2,
fileLength: 1, fileLength: 1,
fileType: ['image/png', 'image/jpeg', 'image/jpg', 'image/gif', 'image/bmp'], fileType: [
'image/png',
'image/jpeg',
'image/jpg',
'image/gif',
'image/bmp',
'video/mp4',
'video/avi',
'video/mov',
'video/mkv',
],
// eslint-disable-next-line @typescript-eslint/no-empty-function // eslint-disable-next-line @typescript-eslint/no-empty-function
onChange: () => {}, onChange: () => {},
defaultFileList: [], defaultFileList: [],
......
src/pages/mallManage/mallGoods/goodsAddOrEditOrDetail/components/configurePriceModal/index.tsx 0 → 100644
import React, { useEffect, useState } from 'react';
import { Modal, Form, Select, Input, message, Button, ModalProps } from 'antd';
import { InterDataType } from '~/api/interface';
import { cooperationTagType } from '~/api/interface/produceManageType';
import { customizeEntity } from '~/api/interface/goodsType';
//加盟标签返回类型
type cooperationTagResponseType = InterDataType<cooperationTagType>;
interface selfProps {
handleOk: (specPrice: any) => void;
handleCancel: () => void;
customRowData: Partial<customizeEntity>;
tagInfoList: cooperationTagResponseType;
}
const ConfigurePriceModal: React.FC<ModalProps & selfProps> = ({
open,
handleOk,
handleCancel,
customRowData,
tagInfoList,
}) => {
// 选择的列表
const [selectList, setSelectList] = useState<number[]>([]);
// 配置价格Form
const [cfgPriceForm] = Form.useForm<any>();
const deselectEvent = (id: number) => {
const obj: any = {};
obj[id] = undefined;
cfgPriceForm.setFieldsValue(obj);
const numArr: number[] = selectList.filter((i: number) => i !== id);
setSelectList([...numArr]);
};
const levelSelectEvent = (id: number) => {
selectList.push(id);
setSelectList([...selectList]);
};
// 将val转换为label
const transValtoLabel = (id: number) => {
const item = tagInfoList.find((i) => i.id === id);
return item ? item.tagName : id;
};
// 表单验证
const handleSubmit = async () => {
cfgPriceForm
.validateFields()
.then(async (values) => {
const specPrice = Object.keys(values).reduce((pre: any, cur: string) => {
if (Object.keys(customRowData.productSpecCPQVO).length != 0) {
const priceItem: any = customRowData.productSpecCPQVO.specPrice.find(
(i: any) => i.cooperationTag === Number(cur),
);
pre.push({
id: priceItem?.id,
price: values[cur],
cooperationTag: cur,
});
} else {
pre.push({ price: values[cur], cooperationTag: cur });
}
return pre;
}, []);
handleOk([...specPrice]);
})
.catch((err) => {
message.warning(err.errorFields[0].errors[0]).then();
});
};
const handleCancelEvent = () => {
cfgPriceForm.resetFields();
handleCancel();
};
// 价格正则
const priceValidator = (_rule: any, value: any) => {
const regExp = /^[1-9]\d{0,7}(\.\d{1,2})?$|^0(\.\d{1,2})?$/;
const bol: boolean = regExp.test(value);
if (!value) {
return Promise.reject(new Error('请输入定价金额'));
}
if (!bol) {
return Promise.reject(
new Error('金额应为数字,小数最多两位,整数最多八位,不能输入0开头的整数'),
);
}
return Promise.resolve();
};
useEffect(() => {
// 新增规格则清空表单数据
if (Object.keys(customRowData.productSpecCPQVO).length === 0) {
cfgPriceForm.resetFields();
setSelectList([]);
} else {
const ids: number[] = [];
customRowData.productSpecCPQVO.specPrice.map((item: any) => {
cfgPriceForm.setFieldValue(Number(item.tagInfoId), item.price);
if (item.tagInfoId != '0') {
ids.push(Number(item.tagInfoId));
}
setSelectList(ids);
});
}
}, [customRowData]);
return (
<Modal
title='配置价格'
open={open}
onCancel={handleCancelEvent}
zIndex={1009}
footer={[
<Button key={1} type='default' onClick={handleCancelEvent}>
取消
</Button>,
<Button key={2} type='primary' onClick={handleSubmit}>
确认
</Button>,
]}
>
<Form labelCol={{ span: 7 }} wrapperCol={{ span: 14 }} form={cfgPriceForm}>
<Form.Item label='渠道等级'>
<Select
placeholder='请选择渠道等级'
mode='multiple'
filterOption={(input, option) =>
(option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
}
onDeselect={deselectEvent}
onSelect={levelSelectEvent}
value={selectList}
>
{tagInfoList.map((item) => (
<Select.Option key={item.id} value={item.id}>
{item.tagName}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label='市场单价'
name={0}
rules={[{ required: true, validator: priceValidator }]}
>
<Input placeholder='请输入市场单价' maxLength={11} />
</Form.Item>
{selectList.map((item: number) => (
<Form.Item
label={transValtoLabel(item)}
key={item}
name={item}
rules={[{ required: true, validator: priceValidator }]}
>
<Input placeholder='请输入定价金额' maxLength={11} />
</Form.Item>
))}
</Form>
</Modal>
);
};
export default ConfigurePriceModal;
src/pages/mallManage/mallGoods/goodsAddOrEditOrDetail/components/goodsIntroduce/index.tsx
import './index.scss'; import './index.scss';
import RichText from '~/components/richText'; import RichText from '~/components/richText';
const GoodsIntroduce = () => { import { FC } from 'react';
interface selfProps {
getRichText: (html?: string) => void;
}
const GoodsIntroduce: FC<selfProps> = ({ getRichText }) => {
const richTextChange = (html?: string) => {
getRichText(html);
};
return ( return (
<div className='goods-introduce'> <div className='goods-introduce'>
<div className='goods-introduce-title'>产品介绍图</div> <div className='goods-introduce-title'>产品介绍图</div>
<div className='goods-introduce-content'> <div className='goods-introduce-content'>
<RichText richTextHeight={300} /> <RichText value='' onChange={richTextChange} />
</div> </div>
</div> </div>
); );
......
src/pages/mallManage/mallGoods/goodsAddOrEditOrDetail/components/otherInfo/index.tsx
import React, { forwardRef } from 'react'; import React, { useEffect, useState } from 'react';
import { Checkbox, Form, Select, Row, Col } from 'antd'; import { Checkbox, Form } from 'antd';
import './index.scss'; import './index.scss';
import GoodsAPI from '~/api/modules/goodsAPI';
import { detailGoodsType, otherServiceType } from '~/api/interface/goodsType';
import { InterDataType } from '~/api/interface';
//商品返回类型
type goodsDetailType = InterDataType<detailGoodsType>;
const OtherInfo: React.FC<any> = forwardRef(() => { interface selfProps {
otherServiceSelect: (id: number[]) => void;
goodsDetail: goodsDetailType | undefined;
}
//其它服务返回类型
type otherServiceListType = InterDataType<otherServiceType>;
const OtherInfo: React.FC<selfProps> = ({ otherServiceSelect, goodsDetail }) => {
//其它服务
const [otherServiceList, setOtherServiceList] = useState<otherServiceListType>([]);
const otherServiceRadioChange = (e: any) => {
otherServiceSelect(e);
};
//获取其它服务
const getOtherServiceList = () => {
GoodsAPI.getOtherServiceList().then(({ result }) => {
setOtherServiceList(result);
});
};
useEffect(() => {
getOtherServiceList();
});
return ( return (
<div className='other-info'> <div className='other-info'>
<div className='other-info-title'>其它信息</div> <div className='other-info-title'>其它信息</div>
<div className='other-info-form'> <div className='other-info-form'>
<Form> <Form>
<Form.Item label='搭配服务' name='otherService'> <Form.Item label='搭配服务' name='otherService'>
<Checkbox.Group> <Checkbox.Group
<Checkbox>1</Checkbox> onChange={otherServiceRadioChange}
value={goodsDetail?.otherService || []}
>
{otherServiceList.map((item: any, index: number) => (
<Checkbox value={item.id} key={index}>
{item.saleServiceName}
</Checkbox>
))}
</Checkbox.Group> </Checkbox.Group>
</Form.Item> </Form.Item>
<Row>
<Col>
<span>用服务&gt;云享飞：</span>
</Col>
<Col span={8}>
<Form.Item name='shareFlyServiceId'>
<Select
allowClear
placeholder='请选择服务'
showSearch
filterOption={(input, option) =>
(option!.children as unknown as string)
.toLowerCase()
.includes(input.toLowerCase())
}
>
<Select.Option>1</Select.Option>
</Select>
</Form.Item>
</Col>
</Row>
<Row>
<Col>
<span>&nbsp;&nbsp;&nbsp;&nbsp;我要租&gt;云仓：</span>
</Col>
<Col span={8}>
<Form.Item name='repoId'>
<Select
allowClear
placeholder='请选择商品'
showSearch
filterOption={(input, option) =>
(option!.children as unknown as string)
.toLowerCase()
.includes(input.toLowerCase())
}
>
<Select.Option>1</Select.Option>
</Select>
</Form.Item>
</Col>
</Row>
</Form> </Form>
</div> </div>
</div> </div>
); );
}); };
export default OtherInfo; export default OtherInfo;
src/pages/mallManage/mallGoods/goodsAddOrEditOrDetail/components/stockSku/index.tsx
...@@ -3,81 +3,141 @@ import { Table, Button } from 'antd'; ...@@ -3,81 +3,141 @@ import { Table, Button } from 'antd';
import { PlusOutlined } from '@ant-design/icons'; import { PlusOutlined } from '@ant-design/icons';
import './index.scss'; import './index.scss';
import { ColumnsType } from 'antd/es/table'; import { ColumnsType } from 'antd/es/table';
const columns: ColumnsType<any> = [ import { customizeEntity, skuUnitType, specEntity } from '~/api/interface/goodsType';
{ import { InterDataType } from '~/api/interface';
title: '序号', import { categoryListType } from '~/api/interface/categoryManage';
align: 'center',
render: () => <div>--</div>, //分类返回类型
}, type categoryType = InterDataType<categoryListType>['list'];
{
title: `产品类型`, //产品-规格单位返回类型
align: 'center', type unitType = InterDataType<skuUnitType>;
// dataIndex: "goodsTypeId",
render: () => <div>--</div>, interface selfProps {
}, addOrEditSku: (record?: specEntity) => void;
{ specData: specEntity[];
title: '规格名称', categoryList: categoryType;
align: 'center', skuUnitList: unitType;
dataIndex: 'goodsSpecName', }
},
{ const StockSku: React.FC<selfProps> = ({ addOrEditSku, specData, categoryList, skuUnitList }) => {
title: `方案`, const columns: ColumnsType<specEntity> = [
align: 'center', {
dataIndex: 'skuName', title: '序号',
}, align: 'center',
{ render: (_text: string, _record: specEntity, index: number) => index + 1,
title: '选项来源',
align: 'center',
dataIndex: 'specIds',
render: () => <div>--</div>,
},
{
title: '选择方式',
align: 'center',
dataIndex: 'chooseType',
render: () => <div>--</div>,
},
{
title: '是否必选',
align: 'center',
dataIndex: 'must',
render: () => <div>--</div>,
},
{
title: '规格单位',
align: 'center',
dataIndex: 'skuUnitId',
render: () => {
return <div>--</div>;
}, },
}, {
{ title: `产品类型`,
title: '操作', align: 'center',
align: 'center', dataIndex: 'categoryId',
width: '20%', render: (text: string) => <div>{getGoodsTypeName(text)}</div>,
render: () => { },
return ( {
title: '规格名称',
align: 'center',
dataIndex: 'goodsSpecName',
},
{
title: `方案`,
align: 'center',
dataIndex: 'skuName',
},
{
title: '选项来源',
align: 'center',
dataIndex: 'specIds',
render: (_text: string, record) => (
<div> <div>
<Button type='link' style={{ marginRight: '10px' }}> {record.flag !== 1
编辑 ? record.specIds.map((i: any, j: number) => (
</Button> <div key={j}>
<Button type='link'>删除</Button> {i.specName}
{i.partNo && `(${i.partNo})`}
</div>
))
: record.customizeInfo &&
record.customizeInfo.map((i, index: number) => (
<div key={index}>{getSelfSpecName(i)}</div>
))}
</div> </div>
); ),
},
{
title: '选择方式',
align: 'center',
dataIndex: 'chooseType',
render: (text: number) => <div>{text === 0 ? '单选' : '多选'}</div>,
},
{
title: '是否必选',
align: 'center',
dataIndex: 'must',
render: (text: number) => <div>{text ? '必选' : '非必选'}</div>,
},
{
title: '规格单位',
align: 'center',
dataIndex: 'skuUnitId',
render: (text: number) => {
return <div>{getSkuUnitName(text)}</div>;
},
},
{
title: '操作',
align: 'center',
width: '20%',
render: (_text: any, record) => {
return (
<div>
<Button
type='link'
style={{ marginRight: '10px' }}
onClick={() => addOrEditSkuClick(record)}
>
编辑
</Button>
<Button type='link'>删除</Button>
</div>
);
},
}, },
}, ];
]; //添加、编辑规格操作
const StockSku: React.FC<any> = () => { const addOrEditSkuClick = (record?: specEntity) => {
addOrEditSku(record);
};
// 自定义选项来源名称
const getSelfSpecName = (obj: customizeEntity) => {
return `${obj.specName}(${obj.partNo || ''})`;
};
// 行业或产品名称
const getGoodsTypeName = (id: number | string) => {
const obj = categoryList.find((i) => i.id === id);
return obj?.classifyName;
};
// 单位名称
const getSkuUnitName = (id: number) => {
const unitObj = skuUnitList.find((i) => i.id === id);
return unitObj?.unitName;
};
return ( return (
<div className='stock-sku'> <div className='stock-sku'>
<div className='stock-sku-title'>库存规格</div> <div className='stock-sku-title'>库存规格</div>
<div className='stock-sku-content'> <div className='stock-sku-content'>
<div className='stock-sku-operate'> <div className='stock-sku-operate'>
<Button icon={<PlusOutlined />} type='primary'> <Button icon={<PlusOutlined />} type='primary' onClick={() => addOrEditSkuClick()}>
添加规格 添加规格
</Button> </Button>
</div> </div>
<Table size='small' bordered rowKey='id' pagination={false} columns={columns} /> <Table
size='small'
bordered
dataSource={specData}
rowKey='id'
pagination={false}
columns={columns}
/>
</div> </div>
</div> </div>
); );
......
src/pages/mallManage/mallGoods/goodsList/index.tsx
...@@ -59,7 +59,9 @@ const GoodsList = () => { ...@@ -59,7 +59,9 @@ const GoodsList = () => {
align: 'center', align: 'center',
render: () => ( render: () => (
<> <>
<Button type='link'>编辑</Button> <Button type='link' onClick={toEditGoods}>
编辑
</Button>
<Button type='link'>详情</Button> <Button type='link'>详情</Button>
</> </>
), ),
...@@ -74,6 +76,13 @@ const GoodsList = () => { ...@@ -74,6 +76,13 @@ const GoodsList = () => {
const toAddMallGoods = () => { const toAddMallGoods = () => {
navigate({ pathname: '/mallManage/mallGoods/add' }); navigate({ pathname: '/mallManage/mallGoods/add' });
}; };
//编辑商品
const toEditGoods = () => {
navigate({
pathname: '/mallManage/mallGoods/add',
search: `id=${43}`,
});
};
return ( return (
<div className='goods-list'> <div className='goods-list'>
<SearchBox <SearchBox
......
src/pages/mallManage/serviceManage/serviceIntroduce/index.tsx
import { Button } from 'antd'; import { Button } from 'antd';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import './index.scss'; import './index.scss';
import RichText from '~/components/richText';
const ServiceIntroduce = () => { const ServiceIntroduce = () => {
const navigate = useNavigate(); const navigate = useNavigate();
...@@ -19,9 +18,7 @@ const ServiceIntroduce = () => { ...@@ -19,9 +18,7 @@ const ServiceIntroduce = () => {
</Button> </Button>
</div> </div>
<div className='service-introduce-title'></div> <div className='service-introduce-title'></div>
<div className='service-introduce-rich-text'> <div className='service-introduce-rich-text'></div>
<RichText richTextHeight={500} />
</div>
</div> </div>
); );
}; };
......
src/router/router.tsx
...@@ -16,9 +16,6 @@ import { ...@@ -16,9 +16,6 @@ import {
ReconciliationOutlined, ReconciliationOutlined,
SolutionOutlined, SolutionOutlined,
RedEnvelopeOutlined, RedEnvelopeOutlined,
SettingOutlined,
UserOutlined,
SisternodeOutlined,
SendOutlined, SendOutlined,
RocketOutlined, RocketOutlined,
AppstoreAddOutlined, AppstoreAddOutlined,
...@@ -44,7 +41,6 @@ import DivideRules from '~/pages/pointManage/divideRules'; ...@@ -44,7 +41,6 @@ import DivideRules from '~/pages/pointManage/divideRules';
import CustomListView from '~/pages/customManage/customList'; import CustomListView from '~/pages/customManage/customList';
import CustomMoneyView from '~/pages/customManage/customMoney'; import CustomMoneyView from '~/pages/customManage/customMoney';
import CustomMoneyDetail from '~/pages/customManage/customMoney/detail'; import CustomMoneyDetail from '~/pages/customManage/customMoney/detail';
import AccountManageView from '~/pages/systemManage/accountManage';
// 活动 // 活动
const ActivityList = React.lazy(() => import('src/pages/activityManage/activityList')); //活动管理 const ActivityList = React.lazy(() => import('src/pages/activityManage/activityList')); //活动管理
...@@ -294,6 +290,16 @@ export const routerList: Array<RouteObjectType> = [ ...@@ -294,6 +290,16 @@ export const routerList: Array<RouteObjectType> = [
}, },
}, },
{ {
path: '/mallManage/mallGoods/edit',
element: withLoadingComponent(<MallAddOrEditOrDetailView />),
meta: {
id: 10146,
icon: <SmileOutlined />,
title: '商城商品编辑',
hidden: true,
},
},
{
path: '/mallManage/produceList', path: '/mallManage/produceList',
element: withLoadingComponent(<ProduceListView />), element: withLoadingComponent(<ProduceListView />),
meta: { meta: {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论