sdz/shihezi-admin
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix:精选描述

Browse Source
This commit is contained in:
yy
2025-04-24 18:37:17 +08:00
parent e420f518b5
commit 6ce4e857ab
3 changed files with 399 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

268
src/pages/Application/Preproducts/edit.tsx
View File

@@ -1,128 +1,140 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { import {
ModalForm, ModalForm,
ProForm, ProForm,
ProFormDigit, ProFormDigit,
ProFormRadio, ProFormRadio,
ProFormSelect, ProFormSelect,
ProFormText, ProFormText,
} from '@ant-design/pro-components'; } from '@ant-design/pro-components';
import { Form } from 'antd'; import { Form,Input } from 'antd';
import { DictValueEnumObj } from '@/components/DictTag'; import { DictValueEnumObj } from '@/components/DictTag';
export type ListFormProps = { export type ListFormProps = {
onCancel: (flag?: boolean, formVals?: unknown) => void; onCancel: (flag?: boolean, formVals?: unknown) => void;
onSubmit: (values: API.ApplicationProducts.Product) => Promise<void>; onSubmit: (values: API.ApplicationProducts.Product) => Promise<void>;
open: boolean; open: boolean;
values?: Partial<API.ApplicationProducts.Product>; values?: Partial<API.ApplicationProducts.Product>;
// jobGroupOptions: DictOptionType[]; // jobGroupOptions: DictOptionType[];
companyLabelEnum?: DictValueEnumObj; companyLabelEnum?: DictValueEnumObj;
companyNatureEnum?: DictValueEnumObj; companyNatureEnum?: DictValueEnumObj;
enableStatusEnum?: DictValueEnumObj; enableStatusEnum?: DictValueEnumObj;
}; };
const waitTime = (time: number = 100) => { const waitTime = (time: number = 100) => {
return new Promise((resolve) => { return new Promise((resolve) => {
setTimeout(() => { setTimeout(() => {
resolve(true); resolve(true);
}, time); }, time);
}); });
}; };
const listEdit: React.FC<ListFormProps> = (props) => { const listEdit: React.FC<ListFormProps> = (props) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const [colorHex, setColorHex] = useState('#3b82f6'); const [colorHex, setColorHex] = useState('#3b82f6');
const { companyNatureEnum, companyLabelEnum, enableStatusEnum } = props; const { companyNatureEnum, companyLabelEnum, enableStatusEnum } = props;
useEffect(() => { useEffect(() => {
form.resetFields(); form.resetFields();
if (props.values) { if (props.values) {
form.setFieldsValue({ form.setFieldsValue({
...props.values, ...props.values,
status: String(props.values.status), status: String(props.values.status),
}); });
setColorHex(props.values.backgroudColor); setColorHex(props.values.backgroudColor);
} }
}, [form, props]); }, [form, props]);
const handleCancel = () => { const handleCancel = () => {
props.onCancel(); props.onCancel();
form.resetFields(); form.resetFields();
}; };
const handleFinish = async (values: Record<string, any>) => { const handleFinish = async (values: Record<string, any>) => {
// console.log(colorHex, values.backgroudColor); // console.log(colorHex, values.backgroudColor);
if (typeof colorHex === 'string') { if (typeof colorHex === 'string') {
values.backgroudColor = colorHex; values.backgroudColor = colorHex;
} else { } else {
values.backgroudColor = values.backgroudColor.toHexString(); values.backgroudColor = values.backgroudColor.toHexString();
} }
props.onSubmit(values as API.ApplicationProducts.Product); props.onSubmit(values as API.ApplicationProducts.Product);
}; };
return ( return (
<ModalForm<{ <ModalForm<{
name: string; name: string;
company: string; company: string;
}> }>
title={`${props.values ? '编辑' : '新增'}企业`} title={`${props.values ? '编辑' : '新增'}企业`}
form={form} form={form}
autoFocusFirstInput autoFocusFirstInput
open={props.open} open={props.open}
modalProps={{ modalProps={{
destroyOnClose: true, destroyOnClose: true,
onCancel: () => handleCancel(), onCancel: () => handleCancel(),
}} }}
submitTimeout={2000} submitTimeout={2000}
onFinish={handleFinish} onFinish={handleFinish}
initialValues={{ initialValues={{
cardOrder: 0, cardOrder: 0,
status: '0', status: '0',
}} }}
> >
<ProFormDigit label="InputNumber" name="companyCardId" disabled hidden={true} /> <ProFormDigit label="InputNumber" name="companyCardId" disabled hidden={true} />
<ProForm.Group> <ProForm.Group>
<ProFormText width="md" name="name" label="卡片名称" placeholder="请输入卡片名称" /> <ProFormText width="md" name="name" label="卡片名称" placeholder="请输入卡片名称" />
<ProFormSelect <ProFormSelect
width="md" width="md"
name="backgroudColor" name="backgroudColor"
label="卡片背景色" label="卡片背景色"
valueType="color" valueType="color"
disabledAlpha disabledAlpha
placeholder="请选择单位规模" placeholder="请选择单位规模"
fieldProps={{ fieldProps={{
value: colorHex, value: colorHex,
onChange: (e) => setColorHex(e), onChange: (e) => setColorHex(e),
}} }}
/> />
{/*<span>HEX: {colorHex.}</span>*/} {/*<span>HEX: {colorHex.}</span>*/}
</ProForm.Group> </ProForm.Group>
<ProForm.Group> <ProForm.Group>
<ProFormSelect <ProFormSelect
width="md" width="md"
name="companyNature" name="companyNature"
label="企业性质" label="企业性质"
valueEnum={companyNatureEnum} valueEnum={companyNatureEnum}
placeholder="请选择企业性质" placeholder="请选择企业性质"
/> />
<ProFormSelect <ProFormSelect
width="md" width="md"
name="targ" name="targ"
label="企业标签" label="企业标签"
valueEnum={companyLabelEnum} valueEnum={companyLabelEnum}
placeholder="请选择企业标签" placeholder="请选择企业标签"
/> />
</ProForm.Group> </ProForm.Group>
<ProForm.Group> <ProForm.Group>
<ProFormDigit width="md" label="排序" name="cardOrder" min={0} /> <ProFormDigit width="md" label="排序" name="cardOrder" min={0} />
<ProFormRadio.Group <ProFormRadio.Group
valueEnum={enableStatusEnum} valueEnum={enableStatusEnum}
name="status" name="status"
label="启用状态" label="启用状态"
width="md" width="md"
/> />
</ProForm.Group> </ProForm.Group>
</ModalForm> <ProForm.Item
); name="description"
}; label="精选描述"
>
export default listEdit; <Input.TextArea
placeholder="请输入卡片精选描述（最多200字）"
maxLength={200}
showCount
rows={4}
style={{ resize: 'none' }}
/>
</ProForm.Item>
</ModalForm>
);
};
export default listEdit;

454
src/pages/Application/Preproducts/index.tsx
View File

@@ -1,221 +1,233 @@
import React, { Fragment, useEffect, useRef, useState } from 'react'; import React, { Fragment, useEffect, useRef, useState } from 'react';
import { useAccess } from '@umijs/max'; import { useAccess } from '@umijs/max';
import { Button, FormInstance, message, Modal, Switch } from 'antd'; import { Button, FormInstance, message, Modal, Switch, Tooltip } from 'antd';
import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components'; import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
import { DeleteOutlined, FormOutlined, PieChartFilled, PlusOutlined } from '@ant-design/icons'; import { DeleteOutlined, FormOutlined, PieChartFilled, PlusOutlined } from '@ant-design/icons';
import EditCompanyListRow from './edit'; import EditCompanyListRow from './edit';
import { delCmsCompanyList } from '@/services/company/list'; import { delCmsCompanyList } from '@/services/company/list';
import { getDictValueEnum } from '@/services/system/dict'; import { getDictValueEnum } from '@/services/system/dict';
import { import {
addCmsCardList, addCmsCardList,
delCmsCardList, delCmsCardList,
getCmsCardList, getCmsCardList,
putCmsCardList, putCmsCardList,
} from '@/services/application/preproducts'; } from '@/services/application/preproducts';
const handleRemoveOne = async (companyCardId: string) => { const handleRemoveOne = async (companyCardId: string) => {
const hide = message.loading('正在删除'); const hide = message.loading('正在删除');
if (!companyCardId) return true; if (!companyCardId) return true;
try { try {
const resp = await delCmsCompanyList(companyCardId); const resp = await delCmsCompanyList(companyCardId);
hide(); hide();
if (resp.code === 200) { if (resp.code === 200) {
message.success('删除成功，即将刷新'); message.success('删除成功，即将刷新');
} else { } else {
message.error(resp.msg); message.error(resp.msg);
} }
return true; return true;
} catch (error) { } catch (error) {
hide(); hide();
message.error('删除失败，请重试'); message.error('删除失败，请重试');
return false; return false;
} }
}; };
function ManagementList() { function ManagementList() {
const access = useAccess(); const access = useAccess();
const formTableRef = useRef<FormInstance>(); const formTableRef = useRef<FormInstance>();
const actionRef = useRef<ActionType>(); const actionRef = useRef<ActionType>();
const [currentRow, setCurrentRow] = useState<API.ApplicationProducts.Product>(); const [currentRow, setCurrentRow] = useState<API.ApplicationProducts.Product>();
const [modalVisible, setModalVisible] = useState<boolean>(false); const [modalVisible, setModalVisible] = useState<boolean>(false);
const [companyNatureEnum, setCompanyNatureEnum] = useState<any>([]); const [companyNatureEnum, setCompanyNatureEnum] = useState<any>([]);
const [companyLabelEnum, setCompanyLabelEnum] = useState<any>([]); const [companyLabelEnum, setCompanyLabelEnum] = useState<any>([]);
const [enableStatusEnum, setEnableStatusEnum] = useState<any>([]); const [enableStatusEnum, setEnableStatusEnum] = useState<any>([]);
useEffect(() => { useEffect(() => {
getDictValueEnum('company_nature', true, true).then((data) => { getDictValueEnum('company_nature', true, true).then((data) => {
setCompanyNatureEnum(data); setCompanyNatureEnum(data);
}); });
getDictValueEnum('company_label', true, true).then((data) => { getDictValueEnum('company_label', true, true).then((data) => {
setCompanyLabelEnum(data); setCompanyLabelEnum(data);
}); });
getDictValueEnum('enable_status', true).then((data) => { getDictValueEnum('enable_status', true).then((data) => {
setEnableStatusEnum(data); setEnableStatusEnum(data);
}); });
}, []); }, []);
const changeStatus = async (record: API.ApplicationProducts.Product) => { const changeStatus = async (record: API.ApplicationProducts.Product) => {
let resData = await putCmsCardList({ let resData = await putCmsCardList({
companyCardId: record.companyCardId, companyCardId: record.companyCardId,
status: record.status === 1 ? 0 : 1, status: record.status === 1 ? 0 : 1,
}); });
if (resData.code === 200) { if (resData.code === 200) {
message.success('修改成功'); message.success('修改成功');
if (actionRef.current) { if (actionRef.current) {
actionRef.current.reload(); actionRef.current.reload();
} }
} }
}; };
const columns: ProColumns<API.ApplicationProducts.Product>[] = [ const columns: ProColumns<API.ApplicationProducts.Product>[] = [
{ {
title: '卡片名称', title: '卡片名称',
dataIndex: 'name', dataIndex: 'name',
valueType: 'text', valueType: 'text',
align: 'center', align: 'center',
}, },
{ {
title: '卡片颜色', title: '卡片颜色',
dataIndex: 'backgroudColor', dataIndex: 'backgroudColor',
valueType: 'text', valueType: 'text',
align: 'center', align: 'center',
render: (text, _) => <PieChartFilled style={{ color: text }} />, render: (text, _) => <PieChartFilled style={{ color: text }} />,
}, },
{ {
title: '排序', title: '排序',
dataIndex: 'cardOrder', dataIndex: 'cardOrder',
valueType: 'text', valueType: 'text',
align: 'center', align: 'center',
}, },
{ {
title: '启用状态', title: '启用状态',
dataIndex: 'status', dataIndex: 'status',
valueType: 'select', valueType: 'select',
align: 'center', align: 'center',
valueEnum: enableStatusEnum, valueEnum: enableStatusEnum,
render: (text, record) => ( render: (text, record) => (
<Switch checked={record.status === 1} onChange={changeStatus.bind(null, record)} /> <Switch checked={record.status === 1} onChange={changeStatus.bind(null, record)} />
), ),
}, },
{ {
title: '操作', title: '精选描述',
hideInSearch: true, dataIndex: 'description',
align: 'center', ellipsis: true,
dataIndex: 'companyCardId', render: (text) => (
width: 300, <Tooltip title={text} placement="topLeft">
render: (companyCardId, record) => [ <span>{text || '-'}</span>
<Button </Tooltip>
type="link" ),
size="small" hideInSearch: true,
key="edit" },
icon={<FormOutlined />} {
hidden={!access.hasPerms('area:business:List.update')} title: '操作',
onClick={() => { hideInSearch: true,
setModalVisible(true); align: 'center',
setCurrentRow(record); dataIndex: 'companyCardId',
}} width: 300,
> render: (companyCardId, record) => [
编辑 <Button
</Button>, type="link"
<Button size="small"
type="link" key="edit"
size="small" icon={<FormOutlined />}
danger hidden={!access.hasPerms('area:business:List.update')}
key="batchRemove" onClick={() => {
icon={<DeleteOutlined />} setModalVisible(true);
hidden={!access.hasPerms('area:subway:List')} setCurrentRow(record);
onClick={async () => { }}
Modal.confirm({ >
title: '删除', 编辑
content: '确定删除该项吗？', </Button>,
okText: '确认', <Button
cancelText: '取消', type="link"
onOk: async () => { size="small"
const success = await delCmsCardList(companyCardId as string); danger
if (success) { key="batchRemove"
if (actionRef.current) { icon={<DeleteOutlined />}
actionRef.current.reload(); hidden={!access.hasPerms('area:subway:List')}
} onClick={async () => {
} Modal.confirm({
}, title: '删除',
}); content: '确定删除该项吗？',
}} okText: '确认',
> cancelText: '取消',
删除 onOk: async () => {
</Button>, const success = await delCmsCardList(companyCardId as string);
], if (success) {
}, if (actionRef.current) {
]; actionRef.current.reload();
return ( }
<Fragment> }
<div style={{ width: '100%', float: 'right' }}> },
<ProTable<API.ApplicationProducts.Product> });
// params 是需要自带的参数 }}
// 这个参数优先级更高，会覆盖查询表单的参数 >
actionRef={actionRef} 删除
formRef={formTableRef} </Button>,
rowKey="companyCardId" ],
key="index" },
columns={columns}
request={(params) => ];
getCmsCardList({ ...params } as API.ApplicationProducts.Params).then((res) => { return (
return { <Fragment>
data: res.rows, <div style={{ width: '100%', float: 'right' }}>
total: res.total, <ProTable<API.ApplicationProducts.Product>
success: true, // params 是需要自带的参数
}; // 这个参数优先级更高，会覆盖查询表单的参数
}) actionRef={actionRef}
} formRef={formTableRef}
toolBarRender={() => [ rowKey="companyCardId"
<Button key="index"
type="primary" columns={columns}
key="add" request={(params) =>
hidden={!access.hasPerms('manage:List:add')} getCmsCardList({ ...params } as API.ApplicationProducts.Params).then((res) => {
onClick={async () => { return {
setCurrentRow(undefined); data: res.rows,
setModalVisible(true); total: res.total,
}} success: true,
> };
<PlusOutlined /> 新建 })
</Button>, }
]} toolBarRender={() => [
/> <Button
</div> type="primary"
<EditCompanyListRow key="add"
open={modalVisible} hidden={!access.hasPerms('manage:List:add')}
onSubmit={async (values) => { onClick={async () => {
let resData; setCurrentRow(undefined);
if (values.companyCardId) { setModalVisible(true);
resData = await putCmsCardList(values); }}
} else { >
resData = await addCmsCardList(values); <PlusOutlined /> 新建
} </Button>,
if (resData.code === 200) { ]}
setModalVisible(false); />
setCurrentRow(undefined); </div>
if (values.companyCardId) { <EditCompanyListRow
message.success('修改成功'); open={modalVisible}
} else { onSubmit={async (values) => {
message.success('新增成功'); let resData;
} if (values.companyCardId) {
if (actionRef.current) { resData = await putCmsCardList(values);
actionRef.current.reload(); } else {
} resData = await addCmsCardList(values);
} }
}} if (resData.code === 200) {
onCancel={() => { setModalVisible(false);
setModalVisible(false); setCurrentRow(undefined);
setCurrentRow(undefined); if (values.companyCardId) {
}} message.success('修改成功');
values={currentRow} } else {
companyLabelEnum={companyLabelEnum} message.success('新增成功');
companyNatureEnum={companyNatureEnum} }
enableStatusEnum={enableStatusEnum} if (actionRef.current) {
></EditCompanyListRow> actionRef.current.reload();
</Fragment> }
); }
} }}
onCancel={() => {
export default ManagementList; setModalVisible(false);
setCurrentRow(undefined);
}}
values={currentRow}
companyLabelEnum={companyLabelEnum}
companyNatureEnum={companyNatureEnum}
enableStatusEnum={enableStatusEnum}
></EditCompanyListRow>
</Fragment>
);
}
export default ManagementList;

51
src/types/application/preproducts.d.ts vendored
View File

@@ -1,25 +1,26 @@
declare namespace API.ApplicationProducts { declare namespace API.ApplicationProducts {
export interface result { export interface result {
total: number; total: number;
rows: Product[]; rows: Product[];
code: number; code: number;
msg: string; msg: string;
} }
export interface Product { export interface Product {
createTime: string; createTime: string;
companyCardId: number; companyCardId?: number;
name: string; name: string;
companyNature: string; description?:string;
backgroudColor: string; companyNature: string;
status: number; backgroudColor: string;
} status: number;
}
export interface Params {
companyCardId?: number; export interface Params {
name?: string; companyCardId?: number;
companyNature?: string; name?: string;
backgroudColor?: string; companyNature?: string;
status?: number; backgroudColor?: string;
} status?: number;
} }
}