feats

src/pages/batchimport/index.jsx

@@ -1,10 +1,9 @@
-import React, { useState } from "react";
+import React, { useState, useRef } from "react";
 import Taro, { useDidShow } from "@tarojs/taro";
 import "./index.scss";
 import { View, Text, Input, Image } from "@tarojs/components";
 import Tab from "../../compents/tab/index";
 import Tags from "../../compents/tags/index";
-import { AtImagePicker } from "taro-ui";
 import request, { uploadFiles } from "../../util/request";
 import uploadicon from "../../assets/uploadicon.png";
 import IsLogin from "../../layout/IsLogin";
@@ -80,13 +79,27 @@ const batchimport = props => {
       success: res => {
         const tempFilePaths = res.tempFilePaths;
 
+        Taro.showLoading({title: '请稍候...'})
+
         uploadFiles(tempFilePaths, "/api/mp/taMetaImage").then(res1 => {
-          setImgUrl(res1);
-        });
+          setImgUrl(imgUrl.concat(res1));
+          Taro.hideLoading()
+        }).catch(err => Taro.hideLoading());
       }
     });
   };
 
+  const handleImageDelete = row => {
+    Taro.showModal({
+      content: '确认删除当前图片?',
+      success: res => {
+        if (res.confirm) {
+          setImgUrl(imgUrl.filter(x => x.imageId !== row.imageId))
+        }
+      }
+    })
+  }
+
   return (
     <IsLogin>
       <View className="batchimport">
@@ -97,9 +110,9 @@ const batchimport = props => {
               className="at-row  at-row--wrap at-row__justify--center"
               style={{ marginTop: "0.15rem" }}
             >
-              {labelList.map((item, index) => {
+              {labelList.map(item => {
                 return (
-                  <View className="at-col at-col-4" key={index}>
+                  <View className="at-col at-col-4" key={item.name}>
                     <View className="tags-btn">{item.name}</View>
                   </View>
                 );
@@ -127,6 +140,7 @@ const batchimport = props => {
                     <View
                       className="at-col at-col-3"
                       style={{ padding: "3px", height: "94px" }}
+                      key={x.imageId}
                     >
                       <Image
                         className="guide-view-img"
@@ -135,7 +149,7 @@ const batchimport = props => {
                           height: "100%"
                         }}
                         mode="aspectFit"
-                        onClick={() => onUpImage()}
+                        onClick={() => handleImageDelete(x)}
                         src={x.image}
                       ></Image>
                     </View>
@@ -177,7 +191,7 @@ const batchimport = props => {
           <View style={{ padding: "0 20px" }}>
             {tagList.map((item, index) => {
               return (
-                <View className="material-card">
+                <View className="material-card" key={item.name}>
                   <Text>{item.name}</Text>
                   <Tags
                     list={item.taMateTagList}
@@ -200,6 +214,7 @@ const batchimport = props => {
               },
               e => {
                 if (labelList.length > 0) setPageState("2");
+                setImgUrl([])
               }
             ]}
           ></Tab>