vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新Company页面的UI为FUI风格

Browse Source
This commit is contained in:
zzlgreat
2025-12-22 15:57:07 +08:00
parent 22c5c166bf
commit 82e4fab55c
1 changed files with 83 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
src/views/Community/components/SearchFilters/CompactSearchBox.js
View File

@@ -524,90 +524,92 @@ const CompactSearchBox = ({
</div> </div>
</Flex> </Flex>
{/* 第二行：筛选条件 */} {/* 第二行：筛选条件 - 主线模式下隐藏（主线模式有自己的筛选器） */}
<Flex justify="space-between" align="center"> {mode !== 'mainline' && (
{/* 左侧筛选 */} <Flex justify="space-between" align="center">
<Space size={isMobile ? 4 : 8}> {/* 左侧筛选 */}
{/* 行业筛选 */} <Space size={isMobile ? 4 : 8}>
<Cascader {/* 行业筛选 */}
value={industryValue} <Cascader
onChange={handleIndustryChange} value={industryValue}
onFocus={handleCascaderFocus} onChange={handleIndustryChange}
options={industryData || []} onFocus={handleCascaderFocus}
placeholder={ options={industryData || []}
<span style={{ display: 'flex', alignItems: 'center', gap: 4 }}> placeholder={
<FilterOutlined style={{ fontSize: 12 }} />
{isMobile ? '行业' : '行业筛选'}
</span>
}
changeOnSelect
showSearch={{
filter: (inputValue, path) =>
path.some(option =>
option.label.toLowerCase().includes(inputValue.toLowerCase())
)
}}
allowClear
expandTrigger="hover"
displayRender={(labels) => labels[labels.length - 1] || (isMobile ? '行业' : '行业筛选')}
disabled={industryLoading}
style={{ minWidth: isMobile ? 70 : 80 }}
suffixIcon={null}
className="transparent-cascader"
/>
{/* 事件等级 */}
<AntSelect
mode="multiple"
value={importance}
onChange={handleImportanceChange}
style={{ minWidth: isMobile ? 100 : 120 }}
placeholder={
<span style={{ display: 'flex', alignItems: 'center', gap: 4 }}>
<ThunderboltOutlined style={{ fontSize: 12 }} />
{isMobile ? '等级' : '事件等级'}
</span>
}
maxTagCount={0}
maxTagPlaceholder={(omittedValues) => isMobile ? `${omittedValues.length}项` : `已选 ${omittedValues.length} 项`}
className="bracket-select"
>
{IMPORTANCE_OPTIONS.map(opt => (
<Option key={opt.value} value={opt.value}>{opt.label}</Option>
))}
</AntSelect>
</Space>
{/* 右侧排序和重置 */}
<Space size={isMobile ? 4 : 8}>
{/* 排序 */}
<AntSelect
value={sort}
onChange={handleSortChange}
style={{ minWidth: isMobile ? 55 : 120 }}
className="bracket-select"
>
{SORT_OPTIONS.map(opt => (
<Option key={opt.value} value={opt.value}>
<span style={{ display: 'flex', alignItems: 'center', gap: 4 }}> <span style={{ display: 'flex', alignItems: 'center', gap: 4 }}>
<SortAscendingOutlined style={{ fontSize: 12 }} /> <FilterOutlined style={{ fontSize: 12 }} />
{isMobile ? opt.mobileLabel : opt.label} {isMobile ? '行业' : '行业筛选'}
</span> </span>
</Option> }
))} changeOnSelect
</AntSelect> showSearch={{
filter: (inputValue, path) =>
path.some(option =>
option.label.toLowerCase().includes(inputValue.toLowerCase())
)
}}
allowClear
expandTrigger="hover"
displayRender={(labels) => labels[labels.length - 1] || (isMobile ? '行业' : '行业筛选')}
disabled={industryLoading}
style={{ minWidth: isMobile ? 70 : 80 }}
suffixIcon={null}
className="transparent-cascader"
/>
{/* 重置按钮 */} {/* 事件等级 */}
<Button <AntSelect
icon={<ReloadOutlined />} mode="multiple"
onClick={handleReset} value={importance}
type="text" onChange={handleImportanceChange}
style={{ color: PROFESSIONAL_COLORS.text.secondary }} style={{ minWidth: isMobile ? 100 : 120 }}
> placeholder={
{!isMobile && '重置筛选'} <span style={{ display: 'flex', alignItems: 'center', gap: 4 }}>
</Button> <ThunderboltOutlined style={{ fontSize: 12 }} />
</Space> {isMobile ? '等级' : '事件等级'}
</Flex> </span>
}
maxTagCount={0}
maxTagPlaceholder={(omittedValues) => isMobile ? `${omittedValues.length}项` : `已选 ${omittedValues.length} 项`}
className="bracket-select"
>
{IMPORTANCE_OPTIONS.map(opt => (
<Option key={opt.value} value={opt.value}>{opt.label}</Option>
))}
</AntSelect>
</Space>
{/* 右侧排序和重置 */}
<Space size={isMobile ? 4 : 8}>
{/* 排序 */}
<AntSelect
value={sort}
onChange={handleSortChange}
style={{ minWidth: isMobile ? 55 : 120 }}
className="bracket-select"
>
{SORT_OPTIONS.map(opt => (
<Option key={opt.value} value={opt.value}>
<span style={{ display: 'flex', alignItems: 'center', gap: 4 }}>
<SortAscendingOutlined style={{ fontSize: 12 }} />
{isMobile ? opt.mobileLabel : opt.label}
</span>
</Option>
))}
</AntSelect>
{/* 重置按钮 */}
<Button
icon={<ReloadOutlined />}
onClick={handleReset}
type="text"
style={{ color: PROFESSIONAL_COLORS.text.secondary }}
>
{!isMobile && '重置筛选'}
</Button>
</Space>
</Flex>
)}
</div> </div>
); );
}; };