style: 年度对比

src/components/LineWithKPI.jsx

@@ -52,15 +52,22 @@ export default observer((props) => {
       },
       legend: {
         custom: true,
-        items: Object.keys(seriesData).map((ele) => ({
+        items: Object.keys(seriesData)
-          id: ele,
+          .map((ele) => ({
-          name: ele,
+            id: ele,
-          value: ele,
+            name: ele,
-          marker: { symbol: ele.includes(' ') ? 'hyphen' : 'circle', style: { fill: colorSets[ele], stroke: colorSets[ele?.split(' ')?.[0]], r: 3, lineWidth: 2, color: colorSets[ele] } },
+            value: ele,
-        })).sort(sortBy('name')),
+            marker: {
+              symbol: ele.includes(' ') ? 'hyphen' : 'circle',
+              style: { fill: colorSets[ele], stroke: colorSets[ele?.split(' ')?.[0]] || '#5B8FF9', r: 3, lineWidth: 2, color: colorSets[ele] },
+            },
+          }))
+          .sort(sortBy('name')),
       },
       tooltip: {
-        customItems: (items) => items.sort(sortBy('name')),
+        // title: dataFieldAlias[config.yField]?.alias,
+        showTitle: true,
+        customItems: (items) => items.sort(sortBy('name')).map((ele) => ({ ...ele, title: `${ele.title} ${dataFieldAlias[config.yField]?.alias}` })),
       },
       // annotations: [
       //   // 低于 0 颜色变化

src/views/Home.jsx

@@ -23,6 +23,7 @@ const topSeries = [
   { key: 'destination', value: 'destination', label: '目的地', graphVisible: true },
   { key: 'GuestGroupType', value: 'GuestGroupType', label: '客群类别', graphVisible: false },
   { key: 'country', value: 'country', label: '国籍', graphVisible: true },
+  { key: 'webcode', value: 'webcode', label: '站点', graphVisible: false },
 ];
 
 const allGroupTypes = [
@@ -228,7 +229,6 @@ export default observer(() => {
           <h3>{showDiff === false ? '走势' : '对比'}</h3>
           <DataFieldRadio value={timeDataField} onChange={handleChangetimeDataField} />
           <Radio.Group options={datePartOptions} optionType="button" onChange={handleChangeDateType} value={dateField} />
-          {showDiff && <Radio.Group options={allGroupTypes} optionType="button" onChange={handleChangeDiffType} value={diffGroupKey} />}
           {searchValues.yearDiff && (
             <Button type="link" size={'small'} onClick={() => setShowDiff(!showDiff)}>
               {showDiff === false ? '显示对比' : '返回总额'}
@@ -241,6 +241,10 @@ export default observer(() => {
           </Spin>
         ) : (
           <Spin spinning={timeDiffData.loading}>
+            <Space gutter={16} size={'small'}>
+              <h3>分类对比</h3>
+              <Radio.Group options={allGroupTypes} optionType="button" onChange={handleChangeDiffType} value={diffGroupKey} />
+            </Space>
             <LineWithKPI
               dataSource={timeDiffData.dataSource}
               showKPI={false}
@@ -283,7 +287,7 @@ export default observer(() => {
         <h3>
           英语区目标客户
           <Spin spinning={topData?.GuestGroupType?.loading || false}>
-            <Table {...targetTableProps} pagination={false} />
+            <Table {...targetTableProps} pagination={false} rowKey={'groupsLabel'} />
           </Spin>
         </h3>
       </section>
@@ -305,7 +309,7 @@ export default observer(() => {
               </Col>
             ) : null
           )}
-          <Col key={'mapG'} flex={'1 0 auto'}>
+          <Col key={'mapG'} flex={'1 0 600px'} >
             <Spin spinning={topData?.country?.loading || false}>
               <div id="topC" style={{ height: '700px' }}>
                 <MapCountry sourceField={'groupsLabel'} valueField={BUConfig.measureField} dataSource={topData?.country?.dataSource || []} />