fix: ensure video items always appear at top of search results

src/web/toManual/js/search.jsx

@@ -1,8 +1,8 @@
-// SPDX-FileCopyrightText: 2022 UnionTech Software Technology Co., Ltd.
+// SPDX-FileCopyrightText: 2022-2026 UnionTech Software Technology Co., Ltd.
 //
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-import React, { Component, useEffect, useRef } from 'react';
+import React, { Component, useRef } from 'react';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import Scrollbar from './scrollbar.jsx';
@@ -201,17 +201,6 @@ function VideoItems(props) {
     }
   }
 
-  useEffect(() => {
-    const adjustOtherElements = () => {
-      const componentHeight = videoItemsRef.current.offsetHeight + 20;
-      setTimeout(function () {
-        document.getElementsByClassName("items")[0].style.marginTop = `${componentHeight}px`;
-      }, 50);
-    };
-
-    adjustOtherElements(); // 调整其他元素的位置  
-  }, []);
-
   function handleHover() {
     console.log("hover....current:", videoItemsRef.current, "   ", videoItemsRef.current.offsetHeight);
   }
@@ -250,24 +239,36 @@ export default class SearchPage extends Component {
     if (this.context.mismatch) {
       c = <Mismatch keyword={this.props.match.params.keyword} />;
     } else {
-      c = this.context.searchResult.map(result => (
-        result.file === "video-guide" ? <VideoItems
+      // Separate video-guide results to always render first
+      const videoResults = [];
+      const otherResults = [];
+      this.context.searchResult.forEach(result => {
+        if (result.file === "video-guide") {
+          videoResults.push(result);
+        } else {
+          otherResults.push(result);
+        }
+      });
+
+      c = videoResults.map(result => (
+        <VideoItems
           key={result.file}
           file={result.file}
           idList={result.idList}
           titleList={result.titleList}
           contentList={result.contentList}
           keyword={this.props.match.params.keyword}>
-
-        </VideoItems> : <Items
+        </VideoItems>
+      )).concat(otherResults.map(result => (
+        <Items
           key={result.file}
           file={result.file}
           idList={result.idList}
           titleList={result.titleList}
           contentList={result.contentList}
           keyword={this.props.match.params.keyword}
         />
-      ));
+      )));
     }
     return (
       <Scrollbar>

src/web/toManual/sass/search.scss

@@ -210,8 +210,6 @@
 
   .videoItems {
     padding: 14px 20px 0px 0px;
-    position: absolute;
-    top: 0;
 
     #item {
       height: 34px;

src/web_dist/toManual/index.css

@@ -742,9 +742,7 @@ body {
     #search .items .highlight {
       color: #2bba57; }
   #search .videoItems {
-    padding: 14px 20px 0px 0px;
-    position: absolute;
-    top: 0; }
+    padding: 14px 20px 0px 0px; }
     #search .videoItems #item {
       height: 34px;
       display: flex;

src/web_dist/toManual/index.js

@@ -2850,17 +2850,6 @@ function VideoItems(props) {
     _loop3(i);
   }
 
-  (0, _react.useEffect)(function () {
-    var adjustOtherElements = function adjustOtherElements() {
-      var componentHeight = videoItemsRef.current.offsetHeight + 20;
-      setTimeout(function () {
-        document.getElementsByClassName("items")[0].style.marginTop = componentHeight + 'px';
-      }, 50);
-    };
-
-    adjustOtherElements(); // 调整其他元素的位置  
-  }, []);
-
   function handleHover() {
     console.log("hover....current:", videoItemsRef.current, "   ", videoItemsRef.current.offsetHeight);
   }
@@ -2910,22 +2899,33 @@ var SearchPage = function (_Component3) {
       if (this.context.mismatch) {
         c = _react2.default.createElement(Mismatch, { keyword: this.props.match.params.keyword });
       } else {
-        c = this.context.searchResult.map(function (result) {
-          return result.file === "video-guide" ? _react2.default.createElement(VideoItems, {
+        var videoResults = [];
+        var otherResults = [];
+        this.context.searchResult.forEach(function (result) {
+          if (result.file === "video-guide") {
+            videoResults.push(result);
+          } else {
+            otherResults.push(result);
+          }
+        });
+        c = videoResults.map(function (result) {
+          return _react2.default.createElement(VideoItems, {
             key: result.file,
             file: result.file,
             idList: result.idList,
             titleList: result.titleList,
             contentList: result.contentList,
-            keyword: _this6.props.match.params.keyword }) : _react2.default.createElement(Items, {
+            keyword: _this6.props.match.params.keyword });
+        }).concat(otherResults.map(function (result) {
+          return _react2.default.createElement(Items, {
             key: result.file,
             file: result.file,
             idList: result.idList,
             titleList: result.titleList,
             contentList: result.contentList,
             keyword: _this6.props.match.params.keyword
           });
-        });
+        }));
       }
       return _react2.default.createElement(
         _scrollbar2.default,