From 5dc57f8c80916e7a232f86b5a8fe9d52f59e516c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com>
Date: Wed, 8 Mar 2023 18:32:11 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E6=BA=90=E7=AE=A1=E7=90=86=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E5=88=9D=E6=AD=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/resource/images/index.module.less | 13 ++++++
 src/pages/resource/images/index.tsx         | 46 +++++++++++++--------
 2 files changed, 41 insertions(+), 18 deletions(-)

diff --git a/src/pages/resource/images/index.module.less b/src/pages/resource/images/index.module.less
index 1ace70d..482f8e3 100644
--- a/src/pages/resource/images/index.module.less
+++ b/src/pages/resource/images/index.module.less
@@ -19,3 +19,16 @@
   line-height: 30px;
   display: flex;
 }
+
+.closeButton {
+  position: absolute;
+  right: -8px;
+  top: -8px;
+}
+
+
+.imageItem{
+  position: relative;
+  width: 120px;
+  height: 80px;
+}
\ No newline at end of file
diff --git a/src/pages/resource/images/index.tsx b/src/pages/resource/images/index.tsx
index ea5d6e1..93f752c 100644
--- a/src/pages/resource/images/index.tsx
+++ b/src/pages/resource/images/index.tsx
@@ -3,7 +3,7 @@ import {
   Button,
   Row,
   Col,
-  Modal,
+  Popconfirm,
   Image,
   Empty,
   message,
@@ -11,7 +11,6 @@ import {
 } from "antd";
 import { resource, resourceCategory } from "../../../api";
 import styles from "./index.module.less";
-import { CreateResourceCategory } from "../../../compenents/create-rs-category";
 import { CloseOutlined } from "@ant-design/icons";
 import { UploadImageSub } from "../../../compenents/upload-image-button/upload-image-sub";
 import { TreeCategory, PerButton } from "../../../compenents";
@@ -45,7 +44,6 @@ export const ResourceImagesPage = () => {
       sort: 0,
     },
   ]);
-  const [defaultCid, setDefaultCid] = useState(0);
   const [refreshCategories, setRefreshCategories] = useState(1);
 
   const [imageList, setImageList] = useState<ImageItem[]>([]);
@@ -54,6 +52,7 @@ export const ResourceImagesPage = () => {
   const [size, setSize] = useState(12);
   const [total, setTotal] = useState(0);
   const [category_ids, setCategoryIds] = useState<any>([]);
+  const [selected, setSelected] = useState(0);
 
   // 获取图片资源的分类
   const getCategories = () => {
@@ -77,8 +76,9 @@ export const ResourceImagesPage = () => {
 
   // 获取图片列表
   const getImageList = () => {
+    let categoryIds = category_ids.join(",");
     resource
-      .resourceList(page, size, "", "", "", "IMAGE", category_ids)
+      .resourceList(page, size, "", "", "", "IMAGE", categoryIds)
       .then((res: any) => {
         setTotal(res.data.result.total);
         setImageList(res.data.result.data);
@@ -119,7 +119,7 @@ export const ResourceImagesPage = () => {
                 <Row style={{ marginBottom: 24 }}>
                   <Col span={24}>
                     <UploadImageSub
-                      categoryId={defaultCid}
+                      categoryId={Number(category_ids.join(","))}
                       onUpdate={() => {
                         resetImageList();
                       }}
@@ -139,19 +139,29 @@ export const ResourceImagesPage = () => {
                   )}
 
                   {imageList.map((item) => (
-                    <Col
-                      key={item.id}
-                      span={6}
-                      onClick={() => {
-                        console.log(item.url);
-                      }}
-                    >
-                      <Image
-                        preview={false}
-                        width={120}
-                        height={80}
-                        src={item.url}
-                      />
+                    <Col key={item.id} span={6}>
+                      <div className={styles.imageItem}>
+                        <Image
+                          preview={false}
+                          width={120}
+                          height={80}
+                          src={item.url}
+                        />
+                        <Popconfirm
+                          title="警告"
+                          description="即将删除此图片，确认操作？"
+                          onConfirm={() => removeCategory(item.id)}
+                          okText="确定"
+                          cancelText="取消"
+                        >
+                          <Button
+                            className={styles.closeButton}
+                            danger
+                            shape="circle"
+                            icon={<CloseOutlined />}
+                          />
+                        </Popconfirm>
+                      </div>
                     </Col>
                   ))}