优化导游语种组件

src/components/search/GuideLanguageSelect.jsx

@@ -1,53 +1,40 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { Select } from 'antd';
 import { observer } from 'mobx-react';
 
-class GuideLanguageSelect extends Component {
+// 导游语种列表
-  constructor(props) {
+export const languageOptions = [
-    super(props);
+  { value: '', label: '所有语种' },
-  }
+  { value: '102001', label: '英语' },
+  { value: '102002', label: '普通话' },
+  { value: '102003', label: '日语' },
+  { value: '102004', label: '韩语' },
+  { value: '102005', label: '德语' },
+  { value: '102006', label: '法语' },
+  { value: '102007', label: '意大利语' },
+  { value: '102008', label: '西班牙语' },
+  { value: '102009', label: '俄语' },
+  { value: '102010', label: '粤语' },
+  { value: '102011', label: '印尼语' },
+  { value: '102012', label: '泰国语' },
+  { value: '102013', label: '葡萄牙语' }
+];
 
-  render() {
+export const GuideLanguageSelect = ({ value, onChange, ...props }) => {
-    const { store, value, onChange, ...extProps } = this.props;
+  return (
-    
+    <div>
-    // 导游语种列表
+      <Select
-    const languageOptions = [
+        style={{ width: '100%' }}
-      { value: '', label: 'all' },
+        defaultValue={['']}
-      { value: '102001', label: '英语' },
+        placeholder="选择导游语种"
-      { value: '102002', label: '普通话' },
+        value={value}
-      { value: '102003', label: '日语' },
+        onChange={onChange}
-      { value: '102004', label: '韩语' },
+        allowClear={true}
-      { value: '102005', label: '德语' },
+        options={languageOptions}
-      { value: '102006', label: '法语' },
+        {...props}
-      { value: '102007', label: '意大利语' },
+      />
-      { value: '102008', label: '西班牙语' },
+    </div>
-      { value: '102009', label: '俄语' },
+  );
-      { value: '102010', label: '粤语' },
+};
-      { value: '102011', label: '印尼语' },
-      { value: '102012', label: '泰国语' },
-      { value: '102013', label: '葡萄牙语' }
-    ];
-
-    return (
-      <div>
-        <Select
-          style={{ width: '100%' }}
-          defaultValue={['']}
-          placeholder="选择导游语种"
-          value={value}
-          onChange={onChange}
-          allowClear={true}
-          {...extProps}
-        >
-          {languageOptions.map((ele) => (
-            <Select.Option key={ele.value} value={ele.value}>
-              {ele.label}
-            </Select.Option>
-          ))}
-        </Select>
-      </div>
-    );
-  }
-}
 
 export default observer(GuideLanguageSelect);

src/views/HostCaseReport.jsx

@@ -7,7 +7,7 @@ import SearchForm from '../components/search/SearchForm';
 import useHostCaseStore from '../zustand/HostCase';
 import { useShallow } from 'zustand/shallow';
 import { exportDoc } from '../components/TemplateLetter2025/Index';
-import { VSDataTag } from './../components/Data';
+import { RenderVSDataCell } from './../components/Data';
 import ExportDocxBtn from '../components/TemplateLetter2025/ExportDocxBtn';
 
 const sorter = (a, b, key) => parseInt(a[key]) - parseInt(b[key]);
@@ -27,52 +27,46 @@ const HostCaseReport = ({ ...props }) => {
     await getCaseReport(formVal);
   };
 
-  const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData }) => {
-    if (showDiffData) {
-      return <VSDataTag data1={data1} data2={data2} dataSuffix={dataSuffix} />;
-    }
-    return <div>{data1}{dataSuffix}</div>;
-  };
 
   const summaryCols = [
     { title: '接团数', dataIndex: 'group_count', width: '6rem',
       sorter: (a, b) => sorter(a,b, 'group_count'),
-      render: (text, r) => <DataRenderCell data1={r.group_count} data2={r.diff?.group_count} showDiffData={searchValuesToSub.DateDiff1} />,
+      render: (text, r) => <RenderVSDataCell data1={r.group_count} data2={r.diff?.group_count} showDiffData={searchValuesToSub.DateDiff1} />,
      },
     // { title: 'feedback团数', dataIndex: 'feedbak_group', width: '6rem' },
     { title: '东道主团数', dataIndex: 'group_count_dongdaozhu', width1: '8rem',
       sorter: (a, b) => sorter(a,b, 'group_count_dongdaozhu'),
-      render: (text, r) => <DataRenderCell data1={r.group_count_dongdaozhu} data2={r.diff?.group_count_dongdaozhu} showDiffData={searchValuesToSub.DateDiff1} />,
+      render: (text, r) => <RenderVSDataCell data1={r.group_count_dongdaozhu} data2={r.diff?.group_count_dongdaozhu} showDiffData={searchValuesToSub.DateDiff1} />,
      },
     { title: '东道主个数', dataIndex: 'case_count_dongdaozhu', width1: '8rem',
       sorter: (a, b) => sorter(a,b, 'case_count_dongdaozhu'),
-      render: (text, r) => <DataRenderCell data1={r.case_count_dongdaozhu} data2={r.diff?.case_count_dongdaozhu} showDiffData={searchValuesToSub.DateDiff1} />,
+      render: (text, r) => <RenderVSDataCell data1={r.case_count_dongdaozhu} data2={r.diff?.case_count_dongdaozhu} showDiffData={searchValuesToSub.DateDiff1} />,
      },
     { title: '东道主实施比例', dataIndex: 'dongdaozhu_rate',
-      render: (text, r) => <DataRenderCell data1={parseFloat(r.dongdaozhu_rate)} data2={parseFloat(r.diff?.dongdaozhu_rate)} dataSuffix='%' showDiffData={searchValuesToSub.DateDiff1} />,
+      render: (text, r) => <RenderVSDataCell data1={parseFloat(r.dongdaozhu_rate)} data2={parseFloat(r.diff?.dongdaozhu_rate)} dataSuffix='%' showDiffData={searchValuesToSub.DateDiff1} />,
      },
     {
       title: '各类型个数',
       children: [
         { title: 'Live There', dataIndex: 'live_there_count',
           sorter: (a, b) => sorter(a, b, 'live_there_count'),
-          render: (text, r) => <DataRenderCell data1={r.live_there_count} data2={r.diff?.live_there_count} showDiffData={searchValuesToSub.DateDiff1} />,
+          render: (text, r) => <RenderVSDataCell data1={r.live_there_count} data2={r.diff?.live_there_count} showDiffData={searchValuesToSub.DateDiff1} />,
          },
         { title: '动机圆梦', dataIndex: 'dream_fulfillment_count',
           sorter: (a, b) => sorter(a, b, 'dream_fulfillment_count'),
-          render: (text, r) => <DataRenderCell data1={r.dream_fulfillment_count} data2={r.diff?.dream_fulfillment_count} showDiffData={searchValuesToSub.DateDiff1} />,
+          render: (text, r) => <RenderVSDataCell data1={r.dream_fulfillment_count} data2={r.diff?.dream_fulfillment_count} showDiffData={searchValuesToSub.DateDiff1} />,
          },
         { title: '仪式感创造', dataIndex: 'ceremony_creation_count',
           sorter: (a, b) => sorter(a, b, 'ceremony_creation_count'),
-          render: (text, r) => <DataRenderCell data1={r.ceremony_creation_count} data2={r.diff?.ceremony_creation_count} showDiffData={searchValuesToSub.DateDiff1} />,
+          render: (text, r) => <RenderVSDataCell data1={r.ceremony_creation_count} data2={r.diff?.ceremony_creation_count} showDiffData={searchValuesToSub.DateDiff1} />,
          },
         { title: '遗憾弥补', dataIndex: 'regret_compensation_count',
           sorter: (a, b) => sorter(a, b, 'regret_compensation_count'),
-          render: (text, r) => <DataRenderCell data1={r.regret_compensation_count} data2={r.diff?.regret_compensation_count} showDiffData={searchValuesToSub.DateDiff1} />,
+          render: (text, r) => <RenderVSDataCell data1={r.regret_compensation_count} data2={r.diff?.regret_compensation_count} showDiffData={searchValuesToSub.DateDiff1} />,
          },
         { title: '力挽狂澜', dataIndex: 'rescue_mission_count',
           sorter: (a, b) => sorter(a, b, 'rescue_mission_count'),
-          render: (text, r) => <DataRenderCell data1={r.rescue_mission_count} data2={r.diff?.rescue_mission_count} showDiffData={searchValuesToSub.DateDiff1} />,
+          render: (text, r) => <RenderVSDataCell data1={r.rescue_mission_count} data2={r.diff?.rescue_mission_count} showDiffData={searchValuesToSub.DateDiff1} />,
          },
       ],
     },
@@ -98,7 +92,7 @@ const HostCaseReport = ({ ...props }) => {
                 },
                 shows: ['years', 'agency','DepartmentList', 'guide_lgc'],
                 fieldProps: {
-                  DepartmentList: { show_all: false },
+                  DepartmentList: { show_all: false, mode: 'multiple' },
                   dates: { hide_vs: true },
                   years: { hide_vs: false },
                   agency: { rules: [{ required: true, message: '请选择地接社' }] },