fix: 解决镜像清理显示不全的问题 (#3558)

backend/app/api/v1/image.go

@@ -35,8 +35,24 @@ func (b *BaseApi) SearchImage(c *gin.Context) {
 }
 
 // @Tags Container Image
-// @Summary List images
+// @Summary List all images
-// @Description 获取镜像列表
+// @Description 获取所有镜像列表
+// @Produce json
+// @Success 200 {array} dto.ImageInfo
+// @Security ApiKeyAuth
+// @Router /containers/image/all [get]
+func (b *BaseApi) ListAllImage(c *gin.Context) {
+	list, err := imageService.ListAll()
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrTypeInternalServer, err)
+		return
+	}
+	helper.SuccessWithData(c, list)
+}
+
+// @Tags Container Image
+// @Summary load images options
+// @Description 获取镜像名称列表
 // @Produce json
 // @Success 200 {array} dto.Options
 // @Security ApiKeyAuth

backend/app/service/image.go

@@ -28,6 +28,7 @@ type ImageService struct{}
 type IImageService interface {
 	Page(req dto.SearchWithPage) (int64, interface{}, error)
 	List() ([]dto.Options, error)
+	ListAll() ([]dto.ImageInfo, error)
 	ImageBuild(req dto.ImageBuild) (string, error)
 	ImagePull(req dto.ImagePull) (string, error)
 	ImageLoad(req dto.ImageLoad) error
@@ -97,6 +98,30 @@ func (u *ImageService) Page(req dto.SearchWithPage) (int64, interface{}, error)
 	return int64(total), backDatas, nil
 }
 
+func (u *ImageService) ListAll() ([]dto.ImageInfo, error) {
+	var records []dto.ImageInfo
+	client, err := docker.NewDockerClient()
+	if err != nil {
+		return nil, err
+	}
+	list, err := client.ImageList(context.Background(), types.ImageListOptions{})
+	if err != nil {
+		return nil, err
+	}
+	containers, _ := client.ContainerList(context.Background(), types.ContainerListOptions{All: true})
+	for _, image := range list {
+		size := formatFileSize(image.Size)
+		records = append(records, dto.ImageInfo{
+			ID:        image.ID,
+			Tags:      image.RepoTags,
+			IsUsed:    checkUsed(image.ID, containers),
+			CreatedAt: time.Unix(image.Created, 0),
+			Size:      size,
+		})
+	}
+	return records, nil
+}
+
 func (u *ImageService) List() ([]dto.Options, error) {
 	var (
 		list      []types.ImageSummary

backend/router/ro_container.go

@@ -55,6 +55,7 @@ func (s *ContainerRouter) InitRouter(Router *gin.RouterGroup) {
 		baRouter.POST("/template/del", baseApi.DeleteComposeTemplate)
 
 		baRouter.GET("/image", baseApi.ListImage)
+		baRouter.GET("/image/all", baseApi.ListAllImage)
 		baRouter.POST("/image/search", baseApi.SearchImage)
 		baRouter.POST("/image/pull", baseApi.ImagePull)
 		baRouter.POST("/image/push", baseApi.ImagePush)

cmd/server/docs/docs.go

@@ -1,5 +1,5 @@
-// Package docs GENERATED BY SWAG; DO NOT EDIT
+// Code generated by swaggo/swag. DO NOT EDIT.
-// This file was generated by swaggo/swag
+
 package docs
 
 import "github.com/swaggo/swag"
@@ -1564,14 +1564,14 @@ const docTemplate = `{
                         "ApiKeyAuth": []
                     }
                 ],
-                "description": "获取镜像列表",
+                "description": "获取镜像名称列表",
                 "produces": [
                     "application/json"
                 ],
                 "tags": [
                     "Container Image"
                 ],
-                "summary": "List images",
+                "summary": "load images options",
                 "responses": {
                     "200": {
                         "description": "OK",
@@ -1585,6 +1585,34 @@ const docTemplate = `{
                 }
             }
         },
+        "/containers/image/all": {
+            "get": {
+                "security": [
+                    {
+                        "ApiKeyAuth": []
+                    }
+                ],
+                "description": "获取所有镜像列表",
+                "produces": [
+                    "application/json"
+                ],
+                "tags": [
+                    "Container Image"
+                ],
+                "summary": "List all images",
+                "responses": {
+                    "200": {
+                        "description": "OK",
+                        "schema": {
+                            "type": "array",
+                            "items": {
+                                "$ref": "#/definitions/dto.ImageInfo"
+                            }
+                        }
+                    }
+                }
+            }
+        },
         "/containers/image/build": {
             "post": {
                 "security": [
@@ -16047,6 +16075,29 @@ const docTemplate = `{
                 }
             }
         },
+        "dto.ImageInfo": {
+            "type": "object",
+            "properties": {
+                "createdAt": {
+                    "type": "string"
+                },
+                "id": {
+                    "type": "string"
+                },
+                "isUsed": {
+                    "type": "boolean"
+                },
+                "size": {
+                    "type": "string"
+                },
+                "tags": {
+                    "type": "array",
+                    "items": {
+                        "type": "string"
+                    }
+                }
+            }
+        },
         "dto.ImageLoad": {
             "type": "object",
             "required": [

cmd/server/docs/swagger.json

@@ -1557,14 +1557,14 @@
                         "ApiKeyAuth": []
                     }
                 ],
-                "description": "获取镜像列表",
+                "description": "获取镜像名称列表",
                 "produces": [
                     "application/json"
                 ],
                 "tags": [
                     "Container Image"
                 ],
-                "summary": "List images",
+                "summary": "load images options",
                 "responses": {
                     "200": {
                         "description": "OK",
@@ -1578,6 +1578,34 @@
                 }
             }
         },
+        "/containers/image/all": {
+            "get": {
+                "security": [
+                    {
+                        "ApiKeyAuth": []
+                    }
+                ],
+                "description": "获取所有镜像列表",
+                "produces": [
+                    "application/json"
+                ],
+                "tags": [
+                    "Container Image"
+                ],
+                "summary": "List all images",
+                "responses": {
+                    "200": {
+                        "description": "OK",
+                        "schema": {
+                            "type": "array",
+                            "items": {
+                                "$ref": "#/definitions/dto.ImageInfo"
+                            }
+                        }
+                    }
+                }
+            }
+        },
         "/containers/image/build": {
             "post": {
                 "security": [
@@ -16040,6 +16068,29 @@
                 }
             }
         },
+        "dto.ImageInfo": {
+            "type": "object",
+            "properties": {
+                "createdAt": {
+                    "type": "string"
+                },
+                "id": {
+                    "type": "string"
+                },
+                "isUsed": {
+                    "type": "boolean"
+                },
+                "size": {
+                    "type": "string"
+                },
+                "tags": {
+                    "type": "array",
+                    "items": {
+                        "type": "string"
+                    }
+                }
+            }
+        },
         "dto.ImageLoad": {
             "type": "object",
             "required": [

cmd/server/docs/swagger.yaml

@@ -1374,6 +1374,21 @@ definitions:
     - from
     - name
     type: object
+  dto.ImageInfo:
+    properties:
+      createdAt:
+        type: string
+      id:
+        type: string
+      isUsed:
+        type: boolean
+      size:
+        type: string
+      tags:
+        items:
+          type: string
+        type: array
+    type: object
   dto.ImageLoad:
     properties:
       path:
@@ -5965,7 +5980,7 @@ paths:
       - Container Docker
   /containers/image:
     get:
-      description: 获取镜像列表
+      description: 获取镜像名称列表
       produces:
       - application/json
       responses:
@@ -5977,7 +5992,24 @@ paths:
             type: array
       security:
       - ApiKeyAuth: []
-      summary: List images
+      summary: load images options
+      tags:
+      - Container Image
+  /containers/image/all:
+    get:
+      description: 获取所有镜像列表
+      produces:
+      - application/json
+      responses:
+        "200":
+          description: OK
+          schema:
+            items:
+              $ref: '#/definitions/dto.ImageInfo'
+            type: array
+      security:
+      - ApiKeyAuth: []
+      summary: List all images
       tags:
       - Container Image
   /containers/image/build:

frontend/src/api/modules/container.ts

@@ -53,6 +53,9 @@ export const inspect = (params: Container.ContainerInspect) => {
 export const searchImage = (params: SearchWithPage) => {
     return http.post<ResPage<Container.ImageInfo>>(`/containers/image/search`, params);
 };
+export const listAllImage = () => {
+    return http.get<Array<Container.ImageInfo>>(`/containers/image/all`);
+};
 export const listImage = () => {
     return http.get<Array<Container.Options>>(`/containers/image`);
 };

frontend/src/views/container/image/index.vue

@@ -231,7 +231,7 @@ const onOpenBuild = () => {
 };
 
 const onOpenPrune = () => {
-    dialogPruneRef.value!.acceptParams({ list: data.value });
+    dialogPruneRef.value!.acceptParams();
 };
 
 const onOpenload = () => {

frontend/src/views/container/image/prune/index.vue

@@ -48,8 +48,7 @@
 </template>
 
 <script lang="ts" setup>
-import { Container } from '@/api/interface/container';
+import { containerPrune, listAllImage } from '@/api/modules/container';
-import { containerPrune } from '@/api/modules/container';
 import i18n from '@/lang';
 import { MsgSuccess } from '@/utils/message';
 import { computeSize } from '@/utils/util';
@@ -61,11 +60,9 @@ const loading = ref();
 const unTagList = ref();
 const unUsedList = ref();
 
-interface DialogProps {
+const acceptParams = async (): Promise<void> => {
-    list: Array<Container.ImageInfo>;
+    const res = await listAllImage();
-}
+    let list = res.data || [];
-const acceptParams = (params: DialogProps): void => {
-    let list = params.list || [];
     unTagList.value = [];
     unUsedList.value = [];
     for (const item of list) {