导出模块
This commit is contained in:
@@ -22,7 +22,9 @@ import {
|
||||
import { supabase } from "@/config/supabase";
|
||||
import { useNavigate, useParams, useSearchParams } from "react-router-dom";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
import SectionList from '@/components/SectionList'
|
||||
import SectionList from '@/components/SectionList'
|
||||
import ChatAIDrawer from '@/components/ChatAi';
|
||||
|
||||
const { Title } = Typography;
|
||||
|
||||
// 添加货币符号映射
|
||||
@@ -105,11 +107,11 @@ const QuotationForm = () => {
|
||||
},
|
||||
[currentCurrency]
|
||||
);
|
||||
useEffect(()=>{
|
||||
console.log(currentCurrency,'currency');
|
||||
|
||||
},[currentCurrency])
|
||||
// 处理表单值变化
|
||||
useEffect(() => {
|
||||
console.log(currentCurrency, 'currency');
|
||||
|
||||
}, [currentCurrency])
|
||||
// 处理表单值变化
|
||||
const handleValuesChange = (changedValues, allValues) => {
|
||||
setFormValues(allValues);
|
||||
if (changedValues.currency) {
|
||||
@@ -241,14 +243,14 @@ const QuotationForm = () => {
|
||||
|
||||
const newSections = [...sections, newSection];
|
||||
form.setFieldValue("sections", newSections);
|
||||
|
||||
|
||||
// 更新 formValues 以触发重新计算
|
||||
const currentFormValues = form.getFieldsValue();
|
||||
setFormValues({
|
||||
...currentFormValues,
|
||||
sections: newSections,
|
||||
});
|
||||
|
||||
|
||||
setTemplateModalVisible(false);
|
||||
message.success("套用模版成功");
|
||||
};
|
||||
@@ -275,119 +277,7 @@ const QuotationForm = () => {
|
||||
setTemplateModalVisible(false);
|
||||
};
|
||||
|
||||
// 添加模板选择弹窗内容渲染方法
|
||||
const renderTemplateModalContent = () => (
|
||||
<div className="space-y-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
{availableSections.map((section) => (
|
||||
<div
|
||||
key={section.id}
|
||||
className="group relative bg-white dark:bg-gray-800 rounded-lg shadow-sm
|
||||
border border-gray-200 dark:border-gray-700 hover:shadow-lg
|
||||
transition-all duration-300 cursor-pointer"
|
||||
onClick={() => handleUseTemplate(section)}
|
||||
>
|
||||
<div className="p-6">
|
||||
{/* 标题和项目数量 */}
|
||||
<div className="text-center mb-4">
|
||||
<h3
|
||||
className="text-lg font-medium text-gray-900 dark:text-gray-100
|
||||
group-hover:text-blue-500 transition-colors"
|
||||
>
|
||||
{section.attributes.name}
|
||||
</h3>
|
||||
<div className="text-sm text-gray-500 dark:text-gray-400 mt-1">
|
||||
{section.attributes.items?.length || 0} 个项目
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 项目列表预览 */}
|
||||
<div className="space-y-2 mt-4 border-t dark:border-gray-700 pt-4">
|
||||
{(section.attributes.items || [])
|
||||
.slice(0, 3)
|
||||
.map((item, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex justify-between items-center"
|
||||
>
|
||||
<span className="text-sm text-gray-600 dark:text-gray-300 truncate flex-1">
|
||||
{item.name}
|
||||
</span>
|
||||
<span className="text-sm text-gray-500 dark:text-gray-400 ml-2">
|
||||
{formatCurrency(item.price)}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
{(section.attributes.items || []).length > 3 && (
|
||||
<div className="text-sm text-gray-500 dark:text-gray-400 text-center">
|
||||
还有 {section.attributes.items.length - 3} 个项目...
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 小节总金额 */}
|
||||
<div className="mt-4 pt-4 border-t dark:border-gray-700 flex justify-between items-center">
|
||||
<span className="text-sm text-gray-600 dark:text-gray-300">
|
||||
总金额
|
||||
</span>
|
||||
<span className="text-base font-medium text-blue-500">
|
||||
{formatCurrency(
|
||||
(section.attributes.items || []).reduce(
|
||||
(sum, item) =>
|
||||
sum + (item.price * (item.quantity || 1) || 0),
|
||||
0
|
||||
)
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 悬边框效果 */}
|
||||
<div
|
||||
className="absolute inset-0 border-2 border-transparent
|
||||
group-hover:border-blue-500 rounded-lg transition-colors duration-300"
|
||||
/>
|
||||
|
||||
{/* 选择指示器 */}
|
||||
<div
|
||||
className="absolute top-3 right-3 opacity-0 group-hover:opacity-100
|
||||
transition-opacity duration-300"
|
||||
>
|
||||
<Button
|
||||
type="primary"
|
||||
size="small"
|
||||
className="flex items-center gap-1"
|
||||
icon={<PlusOutlined />}
|
||||
>
|
||||
套用
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{availableSections.length === 0 && (
|
||||
<div className="text-center py-8">
|
||||
<div className="text-gray-500 dark:text-gray-400">暂无可用模版</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Divider className="dark:border-gray-700" />
|
||||
|
||||
<div className="flex justify-center">
|
||||
<Button
|
||||
type="dashed"
|
||||
icon={<PlusOutlined />}
|
||||
onClick={handleCreateCustom}
|
||||
className="w-1/3 border-2 hover:border-blue-400 hover:text-blue-500
|
||||
dark:border-gray-600 dark:text-gray-400 dark:hover:text-blue-400
|
||||
transition-all duration-300"
|
||||
>
|
||||
自定义小节
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
|
||||
const fetchTemplateData = async () => {
|
||||
try {
|
||||
@@ -444,7 +334,7 @@ const QuotationForm = () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const beforeTaxAmount = calculateTotalAmount(values.sections);
|
||||
|
||||
|
||||
const quotationData = {
|
||||
type: "quota",
|
||||
attributes: {
|
||||
@@ -533,7 +423,25 @@ const QuotationForm = () => {
|
||||
}
|
||||
}, [id, templateId]);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const handleExport = (data) => {
|
||||
const _data={
|
||||
...data,
|
||||
key: uuidv4(),
|
||||
}
|
||||
const newSections = [...formValues.sections, _data];
|
||||
console.log(newSections,'newSections');
|
||||
|
||||
form.setFieldValue('sections', newSections);
|
||||
const currentFormValues = form.getFieldsValue();
|
||||
setFormValues({
|
||||
...currentFormValues,
|
||||
sections: newSections
|
||||
});
|
||||
message.success('已添加新的服务项目');
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-gradient-to-b from-gray-50 to-white dark:from-gray-800 dark:to-gray-900/90 min-h-screen p-2">
|
||||
@@ -561,15 +469,23 @@ const QuotationForm = () => {
|
||||
返回
|
||||
</Button>
|
||||
{!isView && (
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<SaveOutlined />}
|
||||
onClick={() => form.submit()}
|
||||
loading={loading}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
<>
|
||||
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<SaveOutlined />}
|
||||
onClick={() => form.submit()}
|
||||
loading={loading}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
|
||||
<Button onClick={() => setOpen(true)}>
|
||||
AI 助手
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
|
||||
</Space>
|
||||
</div>
|
||||
}
|
||||
@@ -655,6 +571,7 @@ const QuotationForm = () => {
|
||||
}
|
||||
bordered={false}
|
||||
>
|
||||
|
||||
<SectionList
|
||||
type="quotation"
|
||||
form={form}
|
||||
@@ -667,7 +584,11 @@ const QuotationForm = () => {
|
||||
</Card>
|
||||
</Form>
|
||||
</Card>
|
||||
|
||||
<ChatAIDrawer
|
||||
open={open}
|
||||
onClose={() => setOpen(false)}
|
||||
onExport={handleExport}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user