gridjs-spreadsheet 25.4.0 → 25.6.0

package/example/src/main/java/com/aspose/gridjs/demo/controller/GridJs2Controller.java

@@ -14,6 +14,7 @@ import java.util.concurrent.ExecutorService;
 import java.util.concurrent.Executors;
 import java.util.zip.GZIPOutputStream;
 
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.beans.factory.annotation.Value;
 import org.springframework.core.io.InputStreamResource;
 import org.springframework.http.HttpHeaders;
@@ -35,7 +36,9 @@ import com.aspose.cells.Workbook;
 import com.aspose.gridjs.Config;
 import com.aspose.gridjs.GridCellException;
 import com.aspose.gridjs.GridInterruptMonitor;
+import com.aspose.gridjs.GridJsControllerBase;
 import com.aspose.gridjs.GridJsWorkbook;
+import com.aspose.gridjs.IGridJsService;
 
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
@@ -43,26 +46,26 @@ import javax.servlet.http.Part;
 
 @RestController
 @RequestMapping({"/GridJs2"})
-public class GridJs2Controller {
+public class GridJs2Controller extends GridJsControllerBase{
      @Value("${testconfig.ListDir}")
     private String listDir;//="D:\\codebase\\customerissue\\wb\\tempfromdownload\\";
 
     
+  //   IGridJsService
+     @Autowired
+     public GridJs2Controller(IGridJsService gridJsService) {
+         super(gridJsService);  
+     }
+     
  
     @GetMapping("/DetailFileJsonWithUid")
     public ResponseEntity<String> detailFileJsonWithUid(@RequestParam String filename, @RequestParam String uid) {
         try {
            
         	Path filePath = Paths.get(listDir, filename);
-            GridJsWorkbook wbj = new GridJsWorkbook();
 
             // Check if already in cache
-            StringBuilder sb = wbj.getJsonByUid(uid, filename);
-            if (sb == null) {
-                Workbook wb = new Workbook(filePath.toString());
-                wbj.importExcelFile(uid, wb);
-                sb = wbj.exportToJsonStringBuilder(filename);
-            }
+            StringBuilder sb =   _gridJsService.detailFileJsonWithUid(  filePath.toString(), uid);
 
             // Return the content as plain text with UTF-8 encoding
             return ResponseEntity.ok()
@@ -78,17 +81,12 @@ public class GridJs2Controller {
        
            
         	Path filePath = Paths.get(listDir, filename);
-            GridJsWorkbook wbj = new GridJsWorkbook();
+            
 
             response.setContentType("application/json");
             response.setHeader("Content-Encoding", "gzip");
             try (GZIPOutputStream gzipOutputStream = new GZIPOutputStream(response.getOutputStream())) {
-            	boolean  isdone= wbj.jsonToStreamByUid(gzipOutputStream,uid, filename);
-				if (!isdone) {
-					Workbook wb = new Workbook(filePath.toString());
-					wbj.importExcelFile(uid,wb);
-					wbj.jsonToStream(gzipOutputStream, filename);
-				}
+            	  _gridJsService.detailStreamJsonWithUid(gzipOutputStream, filePath.toString(), uid);
             } catch (IOException e) {
 				// TODO Auto-generated catch block
 				e.printStackTrace();
@@ -107,452 +105,91 @@ public class GridJs2Controller {
        
            
         	Path filePath = Paths.get(uploadDir, filename);
-            GridJsWorkbook wbj = new GridJsWorkbook();
+          
 
             response.setContentType("application/json");
             response.setHeader("Content-Encoding", "gzip");
             try (GZIPOutputStream gzipOutputStream = new GZIPOutputStream(response.getOutputStream())) {
-            	boolean  isdone= wbj.jsonToStreamByUid(gzipOutputStream,uid, filename);
-				if (!isdone) {
-					Workbook wb = new Workbook(filePath.toString());
-					wbj.importExcelFile(uid,wb);
-					wbj.jsonToStream(gzipOutputStream, filename);
-				}
-            } catch (IOException e) {
-				// TODO Auto-generated catch block
-				e.printStackTrace();
+            	   _gridJsService.detailStreamJsonWithUid(gzipOutputStream, filePath.toString(), uid);
+				 
 			} catch (Exception e) {
 				// TODO Auto-generated catch block
 				e.printStackTrace();
 			}
     }
     
-    @PostMapping("/LazyLoading")
+    @PostMapping("/LazyLoadingStreamJson")
     public void lazyLoadingStreamJson(
             @RequestParam(value = "name", required = false) String sheetName,
             @RequestParam(value = "uid", required = false) String uid,
             HttpServletResponse response) throws IOException {
 
-        GridJsWorkbook wbj = new GridJsWorkbook();
 
-        // 设置响应头
-        response.setContentType(MediaType.APPLICATION_JSON_VALUE);
-        response.setHeader(HttpHeaders.CONTENT_ENCODING, "gzip");
+         super.lazyLoadingStreamJson(sheetName,uid,response);
 
-        try (GZIPOutputStream gzipOutputStream = new GZIPOutputStream(response.getOutputStream())) {
-            try {
-				wbj.lazyLoadingStream(gzipOutputStream, uid, sheetName);
-			} catch (Exception e) {
-				// TODO Auto-generated catch block
-				e.printStackTrace();
-			}
-        }
     }
     
     @PostMapping("/UpdateCell")
     public ResponseEntity<String> updateCell(HttpServletRequest request) {
-        String p = request.getParameter("p");
-        String uid = request.getParameter("uid");
-        GridJsWorkbook gwb = new GridJsWorkbook();
-        String ret;
-		try {
-			ret = gwb.updateCell(p, uid);
-			return new ResponseEntity<>(ret, HttpStatus.OK);
-		} catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
-		}
-
-    }
-    
-	@PostMapping("/AddImage_FAIL")
-	public ResponseEntity<String> addImageFail(HttpServletRequest request) {
-		String uid = request.getParameter("uid");
-		String p = request.getParameter("p");
-		String isControl = request.getParameter("control");
-		String ret = null;
-		GridJsWorkbook gwb = new GridJsWorkbook();
 		try {
-			if (isControl == null) {
-				Part filePart = request.getPart("image"); // Retrieves <input type="file" name="file">
-				if (filePart == null || filePart.getSize() == 0) {
-					// for add shape,need to set p.type as one of AutoShapeType
-					ret = gwb.insertImage(uid, p, null, null);
-
-				} else {
-					try (InputStream inputStream = filePart.getInputStream()) {
-						ret = gwb.insertImage(uid, p, inputStream, null);
-					} catch (IOException e) {
-						return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.BAD_REQUEST);
-					}
-				}
-			} else {
-				ret = gwb.insertImage(uid, p, null, null);
-			}
-			return new ResponseEntity<>(ret, HttpStatus.OK);
-		} catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
+        return super.updateCell(request);
+    	}catch(Exception e)
+    	{
+    		e.printStackTrace();
+    		return null;
 		}
 	}
 	
 	@PostMapping("/AddImage")
-	public ResponseEntity<String> handleFileUpload(@RequestParam(value = "image", required = false) MultipartFile file,
+    public ResponseEntity<String> addImage(
+            @RequestParam(value = "image", required = false) MultipartFile file,
 			@RequestParam("uid") String uid, 
 			@RequestParam("p") String p,
 			@RequestParam(value = "control", required = false) String isControl) {
-		String ret = null;
-		GridJsWorkbook gwb = new GridJsWorkbook();
-		try {
-			if (isControl == null) {
-				if (file != null && !file.isEmpty()) {
-					try (InputStream inputStream = file.getInputStream()) {
-//						Files.copy(inputStream,  Paths.get("D:\\tmpdel\\tmp\\gridjsjava\\upload\\123.png"));
-						ret = gwb.insertImage(uid, p, inputStream, null);
 						
-					} catch (IOException e) {
-						return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.BAD_REQUEST);
-					}
-					
-
-				} else {
-					// for add shape,need to set p.type as one of AutoShapeType
-					ret = gwb.insertImage(uid, p, null, null);
-
-				}
-			} else {
-				ret = gwb.insertImage(uid, p, null, null);
-			}
-
-			return new ResponseEntity<>(ret, HttpStatus.OK);
-		} catch (Exception e) {
-			e.printStackTrace();
-			return ResponseEntity.internalServerError().body("Error occurred while uploading file");
-		}
+    	 return super.addImage(file,uid,p,isControl);
 	}
 
     @PostMapping("/CopyImage")
     public ResponseEntity<String> copyImage(HttpServletRequest request) {
-        String uid = request.getParameter("uid");
-        String p = request.getParameter("p");
-        GridJsWorkbook gwb = new GridJsWorkbook();
-        try {
-        String ret = gwb.copyImageOrShape(uid, p);
-
-        return new ResponseEntity<>(ret, HttpStatus.OK);
-        } catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
-		}
+    	 return super.copyImage(request);
     }
 
-    private static InputStream getStreamFromUrl(String url) throws IOException {
-        URL imageUrl = new URL(url);
-        URLConnection connection = imageUrl.openConnection();
-        ByteArrayOutputStream baos = new ByteArrayOutputStream();
-        byte[] buffer = new byte[1024];
-        int bytesRead;
-        try (InputStream in = connection.getInputStream()) {
-            while ((bytesRead = in.read(buffer)) != -1) {
-                baos.write(buffer, 0, bytesRead);
-            }
-        }
-        return new ByteArrayInputStream(baos.toByteArray());
-    }
 
     @PostMapping("/AddImageByURL")
     public ResponseEntity<String> addImageByUrl(HttpServletRequest request) {
-        String uid = request.getParameter("uid");
-        String p = request.getParameter("p");
-        String imageUrl = request.getParameter("imageurl");
-        String ret = null;
-        GridJsWorkbook gwb = new GridJsWorkbook();
-        try {
-        if (imageUrl != null) {
-            try (InputStream stream = getStreamFromUrl(imageUrl)) {
-                ret = gwb.insertImage(uid, p, stream, imageUrl);
-            } catch (IOException e) {
-                return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.BAD_REQUEST);
-            }
-        } else {
-            return new ResponseEntity<>(gwb.errorJson("image url is null"), HttpStatus.BAD_REQUEST);
-        }
-
-        return new ResponseEntity<>(ret, HttpStatus.OK);
-        } catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
-		}
+  		 return super.addImageByUrl(request);
     }
     
     @GetMapping("/Image")
     public ResponseEntity<InputStreamResource> getImage(HttpServletRequest request) {
-        String fileId = request.getParameter("id");
-        String uid = request.getParameter("uid");
-        try {
-        InputStream imageStream = GridJsWorkbook.getImageStream(uid, fileId);
-        if (imageStream == null) {
-            return ResponseEntity.notFound().build();
-        }
-
-        return ResponseEntity.ok()
-                .contentType(MediaType.IMAGE_PNG)
-                .body(new InputStreamResource(imageStream));
-        } catch (Exception e) {
-			 e.printStackTrace();
-        	 return ResponseEntity.notFound().build();
-		}
-    }
-    /*
-    @GetMapping("/ImageTest")
-    public ResponseEntity<InputStreamResource> getImageTest(HttpServletRequest request) {
-        try {
-            // Load the image file from the classpath (resources folder)
-        	  String fileId = request.getParameter("id");
-              String uid = request.getParameter("uid");
-              
-              InputStream imageStream = GridJsWorkbook.getImageStream(uid, fileId);
-              if (imageStream == null) {
-                  return ResponseEntity.notFound().build();
-              }
-
-            // Set the headers for the response
-            HttpHeaders headers = new HttpHeaders();
-            headers.add("Content-Type", "image/jpeg");
-
-            // Return the InputStreamResource with the headers
-            return ResponseEntity
-                    .ok()
-                    .headers(headers)
-                    .body(new InputStreamResource(imageStream));
-        } catch (Exception e) {
-            e.printStackTrace();
-            return new ResponseEntity<>(HttpStatus.INTERNAL_SERVER_ERROR);
-        }
-    }
-    
-    @GetMapping("/PImage")
-    public ResponseEntity<InputStreamResource> getPImage(HttpServletRequest request) {
-        String fileId = request.getParameter("id");
-        String uid = request.getParameter("uid");
-        try {
-        InputStream imageStream = GridJsWorkbook.getImageStream(uid, fileId);
-        if (imageStream == null) {
-            return ResponseEntity.notFound().build();
-        }
-        InputStreamResource resource = new InputStreamResource(imageStream);
-        MediaType mediaType = MediaType.IMAGE_PNG; 
-        return ResponseEntity.ok()
-                .contentType(mediaType)
-                .header(HttpHeaders.CONTENT_DISPOSITION, "inline; filename=\"" + fileId + "\"")
-                .body(resource);
-        } catch (Exception e) {
-			 e.printStackTrace();
-        	 return ResponseEntity.notFound().build();
-		}
-    }
-    
-    @GetMapping("/pimages/{imageName}")
-    public ResponseEntity<InputStreamResource> getImage(@PathVariable("imageName") String imageName) {
-        try {
-            // Read the image file
-            FileInputStream fis = new FileInputStream("C:\\Users\\peter\\Pictures\\test\\" + imageName);
-            InputStreamResource resource = new InputStreamResource(fis);
-
-            // Set the content type based on the image type (JPEG, PNG, etc.)
-            MediaType mediaType = MediaType.IMAGE_JPEG; // Change this based on your image type
-
-            // Create the response entity with the appropriate headers
-            return ResponseEntity.ok()
-                    .contentType(mediaType)
-                    .header(HttpHeaders.CONTENT_DISPOSITION, "inline; filename=\"" + imageName + "\"")
-                    .body(resource);
-        } catch (IOException e) {
-            // Handle the exception, e.g., log it
-            e.printStackTrace();
-            return ResponseEntity.notFound().build();
-        }
-    }
-    */
-    
-    @GetMapping("/Ole")
-    public ResponseEntity<?> getOle(HttpServletRequest request) {
-        int oleId = Integer.parseInt(request.getParameter("id"));
-        String uid = request.getParameter("uid");
-        String sheet = request.getParameter("sheet");
-
-        GridJsWorkbook gwb = new GridJsWorkbook();
-        String[] filename = new String[1];
-        try {
-        byte[] fileByte = gwb.getOle(uid, sheet, oleId, filename);
-      
-        if (filename != null) {
-            return ResponseEntity.ok()
-                    .contentType( (getMimeType(filename[0])))
-                    .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + filename[0] + "\"")
-                    .body(fileByte);
-        } else {
-            return ResponseEntity.notFound().build();
-        }
-        } catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
-		}
+    	 return super.getImage(request);
     }
     
     
     @GetMapping("/ImageUrl")
     public ResponseEntity<String> getImageUrl(@RequestParam String id, @RequestParam String uid) {
-        if (GridJsWorkbook.CacheImp != null) {
-            return ResponseEntity.ok(GridJsWorkbook.getImageUrl(uid, id, "."));
-        } else {
-            String file = uid + "." + id;
-            return ResponseEntity.ok("/GridJs2/GetZipFile?f=" + file);
-        }
-    }
-
-    @GetMapping("/GetZipFile")
-    public ResponseEntity<StreamingResponseBody> getZipFile(@RequestParam String f) {
-        Path filePath = Paths.get(Config.getFileCacheDirectory(), f);
-
-        if (!Files.exists(filePath)) {
-            return ResponseEntity.notFound().build();
-        }
-
-        StreamingResponseBody responseBody = outputStream -> {
-            try (InputStream inputStream = Files.newInputStream(filePath)) {
-                byte[] buffer = new byte[1024];
-                int bytesRead;
-                while ((bytesRead = inputStream.read(buffer)) != -1) {
-                    outputStream.write(buffer, 0, bytesRead);
-                }
-            }
-        };
-
-        return ResponseEntity.ok()
-                .contentType(MediaType.APPLICATION_OCTET_STREAM)
-                .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + f + "\"")
-                .body(responseBody);
+      return super.getImageUrl(id, uid);
     }
     
-    public static MediaType getMimeType(String fileName) {
-        Path filePath = Paths.get(fileName);
-        try {
-            // Probe the content type of the file
-            String mimeType = Files.probeContentType(filePath);
-            
-            // If the MIME type couldn't be determined, default to binary
-            if (mimeType == null) {
-                mimeType = "application/octet-stream";
-            }
-
-            // Parse and return the MediaType
-            return MediaType.parseMediaType(mimeType);
-
-        } catch (IOException e) {
-            e.printStackTrace();
-            // Return a default MediaType in case of an error
-            return MediaType.APPLICATION_OCTET_STREAM;
-        }
+    @GetMapping("/Ole")
+    public ResponseEntity<?> getOle(HttpServletRequest request) {
+       return super.getOle(request);
     }
     
     @GetMapping("/GetFile")
-    public ResponseEntity<byte[]> getFile(@RequestParam("id") String fileid,@RequestParam("filename") String filename) throws IOException {
-       
-        MediaType mimeType = getMimeType(filename);
-       
-//        try {
-//            TimeUnit.SECONDS.sleep(3); // simulate network lag
-//        } catch (InterruptedException e) {
-//            Thread.currentThread().interrupt();
-//        }
-        Path filePath = Paths.get(Config.getFileCacheDirectory(), fileid.replace('/', '.')+"."+filename);
-        byte[] bytes = Files.readAllBytes(filePath);
-        return ResponseEntity.ok()
-                .contentType(mimeType)
-                .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=" + filename)
-                .body(bytes);
-    }
-    
-    
-    //this is for the way that implment GridCacheForStream
-    @GetMapping("/GetFileUseCacheStream")
-    public ResponseEntity<InputStreamResource>  getFileUseCacheStream(@RequestParam("id") String fileid) throws IOException {
- 
-    	MediaType mimeType = getMimeType(fileid);
-    	String name =   fileid.replace('/', '.');
- 
-    	
-    	 InputStream inputStream = GridJsWorkbook.CacheImp.loadStream(fileid);
-         if (inputStream == null) {
-             // Handle the case where the file is not found
-             return ResponseEntity.notFound().build();
+    public ResponseEntity<?> getFile(@RequestParam("id") String id) {
+        return super.getFile(id);
          }
 
-         HttpHeaders headers = new HttpHeaders();
-         headers.setContentType(mimeType);
-         headers.setContentDispositionFormData("attachment", name);
-
-         return ResponseEntity.ok()
-                 .headers(headers)
-                 .body(new InputStreamResource(inputStream));
-  
+    @PostMapping("/Download")
+	public ResponseEntity<String> download(HttpServletRequest request) {
+		 return super.download(request);
     }
     
     
     
-    private static void InterruptMonitor(GridInterruptMonitor monitor,int milliseconds)
-    {
     	 
-        try
-        {
-            Thread.sleep(milliseconds);
-           
-            (monitor).interrupt();
-        }
-        catch (Exception e)
-        {
-            System.out.println("Succeeded for load in give time.");
-        }
-    }
-    
-    @PostMapping("/Download")
-	public ResponseEntity<String> download(HttpServletRequest request) {
-		String p = request.getParameter("p");
-		String uid = request.getParameter("uid");
-		String filename = request.getParameter("file");
-
-		GridJsWorkbook gwb = new GridJsWorkbook();
-		try {
-			gwb.mergeExcelFileFromJson(uid, p);
-
-			GridInterruptMonitor m = new GridInterruptMonitor();
-			gwb.setInterruptMonitorForSave(m);
-
-			ExecutorService executor = Executors.newSingleThreadExecutor();
-			executor.submit(() -> InterruptMonitor(m, 30 * 1000));
-
-			try {
-				gwb.saveToCacheWithFileName(uid, filename, null);
-			} catch (Exception ex) {
-				if (ex instanceof GridCellException) {
-					return ResponseEntity
-							.ok(((GridCellException) ex).getMessage() + ((GridCellException) ex).getCode());
-				}
-			}
-
-			String fileUrl = null;
-			if (GridJsWorkbook.CacheImp != null) {
-				fileUrl = GridJsWorkbook.CacheImp.getFileUrl(uid + "/" + filename);
-			} else {
-				fileUrl = "/GridJs2/GetFile?id=" + uid + "&filename=" + filename;
-			}
-			return ResponseEntity.ok("\""+fileUrl+"\"");
-		} catch (Exception e) {
-			// TODO Auto-generated catch block
-			return new ResponseEntity<>(gwb.errorJson(e.getMessage()), HttpStatus.OK);
-		}
-	}
 
  
 }

package/example/src/main/resources/templates/fileFromUpload.html

@@ -164,7 +164,7 @@ html, body {
             const imageuploadurl1 = "/GridJs2/AddImage";
             const imageuploadurl2 = "/GridJs2/AddImageByURL";
             const imagecopyurl = "/GridJs2/CopyImage";        // x.spreadsheet.locale('zh-cn');
-            const lazyLoadingUrl = "/GridJs2/LazyLoading";
+            const lazyLoadingUrl = "/GridJs2/LazyLoadingStreamJson";
             xs = x_spreadsheet('#gridjs-demo-uid', option).loadData(sheets).change((cdata) => {
                 console.log(cdata);
                 console.log(xs.validate());

package/example/src/main/resources/templates/index.html

@@ -165,7 +165,7 @@ html, body {
             const imageuploadurl1 = "/GridJs2/AddImage";
             const imageuploadurl2 = "/GridJs2/AddImageByURL";
             const imagecopyurl = "/GridJs2/CopyImage";        // x.spreadsheet.locale('zh-cn');
-            const lazyLoadingUrl = "/GridJs2/LazyLoading";
+            const lazyLoadingUrl = "/GridJs2/LazyLoadingStreamJson";
             xs = x_spreadsheet('#gridjs-demo-uid', option).loadData(sheets).change((cdata) => {
                 console.log(cdata);
                 console.log(xs.validate());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gridjs-spreadsheet",
-  "version": "25.4.0",
+  "version": "25.6.0",
   "description": "this is the client side script for GridJs which is a lightweight, scalable, and customizable toolkit that provides cross-platform web applications, enables convenient development for editing or viewing Excel/Spreadsheet files, offers simple deployment, and provides easy-to-use APIs based on JSON format.",
   "types": "index.d.ts",
   "main": "xspreadsheet.js",

package/readme.md

@@ -327,6 +327,16 @@ v25.4:
 
 - support show statistics information in the lower right corner when cells are selected
 
+v25.5: 
+
+- add support for Polish menus.
+- support APIs for insert/delete rows/columns
+
+v25.6: 
+
+- support APIs for resize rows/columns
+- support APIs for hide/unhide rows/columns
+
 ## License
 
 MIT

package/xspreadsheet.css

@@ -145,14 +145,14 @@ body {
   height: 60px;
   margin: 10px;
   background-repeat: no-repeat;
-  background-image: url(9ab1b217edd126e8925e88cc8f25a154.svg);
+  background-image: url(555f60323063f2b68b6eac7ce9c45b19.svg);
 }
 .x-spreadsheet-banner-icon-s {
   width: 30px;
   height: 30px;
   margin: 5px;
   background-repeat: no-repeat;
-  background-image: url(9ab1b217edd126e8925e88cc8f25a154.svg);
+  background-image: url(555f60323063f2b68b6eac7ce9c45b19.svg);
 }
 .x-spreadsheet-banner-filename {
   width: max-content;
@@ -484,6 +484,14 @@ body {
 .x-spreadsheet-selector .x-spreadsheet-selector-autofill {
   border: 1px dashed rgba(0, 0, 0, 0.45);
 }
+.x-spreadsheet-selector .x-spreadsheet-selector-userlabel {
+  position: absolute;
+  top: -20px;
+  /* 比父级 div 向上偏移 20px */
+  left: 0;
+  /* 固定在父级 div 的左边 */
+  padding: 4px 8px;
+}
 .x-spreadsheet-selector .x-spreadsheet-selector-corner {
   pointer-events: auto;
   position: absolute;
@@ -1294,7 +1302,7 @@ form fieldset select {
   display: inline-block;
 }
 .x-spreadsheet-icon .x-spreadsheet-icon-img {
-  background-image: url(2922578eabb1a88d1974da56c65189ba.svg);
+  background-image: url(a3b683289420fd8ec937908397907279.svg);
   position: absolute;
   width: 262px;
   height: 444px;
@@ -1687,10 +1695,31 @@ form fieldset select {
   z-index: 1000;
   display: flex;
   flex-direction: column;
-  width: 50%;
-  height: 50%;
+  min-width: 20%;
   overflow: hidden;
 }
+.x-spreadsheet-modal-radio-container {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 10px 0;
+  align-items: flex-start;
+}
+.x-spreadsheet-modal-radio-option {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+.x-spreadsheet-modal-radio-option input[type="radio"] {
+  margin-right: 8px;
+  width: 16px;
+  height: 16px;
+  padding: 0;
+}
+.x-spreadsheet-modal-radio-option label {
+  font-size: 14px;
+  margin: 0;
+}
 @media screen and (max-width: 480px) {
   .x-spreadsheet-modal-component {
     width: 90% !important;