Merge pull request #89 from sj-distributor/distinguish-between-confir…

…m-and-cancel

Distinguish between confirm and cancel

web/src/dtos/enterprise/index.ts

@@ -120,6 +120,8 @@ export interface ITargetDialogProps {
   groupDeptUserSelectedList?: IDepartmentAndUserListValue[]
   chatId: string
   sendType?: SendObjOrGroup
+  outerTagsValue?: ITagsList[]
+  isUpdatedDeptUser: boolean
   setSendType?: React.Dispatch<React.SetStateAction<SendObjOrGroup>>
   setIsRefresh: React.Dispatch<React.SetStateAction<boolean>>
   setChatId?: React.Dispatch<React.SetStateAction<string>>
@@ -417,3 +419,10 @@ export interface UploadAttachmentResponseData {
   fileSize: number
   filePath: string
 }
+
+export interface IFirstState {
+  chatId: string
+  deptUserList: IDepartmentKeyControl[]
+  tagsValue: ITagsList[]
+  sendType: SendObjOrGroup
+}

web/src/pages/enterprise/components/select-content/hook.ts

@@ -1,5 +1,5 @@
 import { clone, flatten, isEmpty, uniqWith } from "ramda"
-import { useCallback, useEffect, useMemo, useRef, useState } from "react"
+import { useEffect, useMemo, useRef, useState } from "react"
 import {
   GetCorpAppList,
   GetCorpsList,
@@ -143,6 +143,8 @@ export const useAction = (props: SelectContentHookProps) => {
     SendObjOrGroup.Object
   )
 
+  const [isUpdatedDeptUser, setIsUpdatedDeptUser] = useState(false)
+
   const [editor, setEditor] = useState<wangEditor.IDomEditor | null>(null)
 
   const [html, setHtml] = useState("")
@@ -185,28 +187,35 @@ export const useAction = (props: SelectContentHookProps) => {
     const partiesSelected = flattenDepartmentList.find(
       (e) => e.key === corpAppValue?.appId
     )?.data
+    const workWeChatAppNotification =
+      sendObject ??
+      outerSendData?.workWeChatAppNotification ??
+      updateMessageJobInformation?.workWeChatAppNotification
 
     if (sendType === SendObjOrGroup.Object) {
-      outerSendData?.workWeChatAppNotification?.toParties &&
+      workWeChatAppNotification?.toParties &&
         partiesSelected &&
         result.push(
           ...partiesSelected
             .filter((e) =>
-              outerSendData.workWeChatAppNotification?.toParties?.some(
+              workWeChatAppNotification?.toParties?.some(
                 (item) => item === String(e.id)
               )
             )
             .map((e) => e.name)
         )
-      outerSendData?.workWeChatAppNotification?.toUsers &&
-        result.push(...outerSendData.workWeChatAppNotification.toUsers)
-      outerSendData?.workWeChatAppNotification?.toTags &&
-        result.push(...outerSendData.workWeChatAppNotification.toTags)
+      workWeChatAppNotification?.toUsers &&
+        result.push(...workWeChatAppNotification.toUsers)
+      tagsValue && result.push(...tagsValue.map((x) => x.tagName))
     } else {
       result.push(...groupList.filter((x) => x.chatId === chatId))
     }
     return result
-  }, [outerSendData?.workWeChatAppNotification, chatId])
+  }, [
+    sendObject,
+    outerSendData?.workWeChatAppNotification,
+    updateMessageJobInformation?.workWeChatAppNotification,
+  ])
 
   // 初始化企业数组
   useEffect(() => {
@@ -248,7 +257,7 @@ export const useAction = (props: SelectContentHookProps) => {
 
   // 获取Tags数组
   useEffect(() => {
-    if (corpAppValue?.appId !== undefined && isNewOrUpdate === "new") {
+    if (corpAppValue?.appId !== undefined) {
       GetTagsList({ AppId: corpAppValue.appId }).then(
         (tagsData: ITagsListResponse | null | undefined) => {
           tagsData && tagsData.errcode === 0 && setTagsList(tagsData.taglist)
@@ -257,13 +266,15 @@ export const useAction = (props: SelectContentHookProps) => {
       GetWeChatWorkCorpAppGroups(corpAppValue.id).then((data) => {
         data && setGroupList(data)
       })
-      // 清空切换应用时的已选值
-      setChatId("")
-      setTagsValue([])
-      setSendObject({
-        toUsers: [],
-        toParties: [],
-      })
+      if (isNewOrUpdate === "new") {
+        // 清空切换应用时的已选值
+        setChatId("")
+        setTagsValue([])
+        setSendObject({
+          toUsers: [],
+          toParties: [],
+        })
+      }
     }
   }, [corpAppValue?.appId])
 
@@ -435,6 +446,7 @@ export const useAction = (props: SelectContentHookProps) => {
         }
         return item
       })
+      setIsUpdatedDeptUser(true)
       setDepartmentAndUserList(array)
     }
   }, [isLoadStop])
@@ -1119,5 +1131,7 @@ export const useAction = (props: SelectContentHookProps) => {
     html,
     setHtml,
     setHtmlText,
+    tagsValue,
+    isUpdatedDeptUser,
   }
 }

web/src/pages/enterprise/components/select-content/index.tsx

@@ -60,7 +60,6 @@ const SelectContent = memo(
       setIsRefresh,
       departmentAndUserList,
       setDepartmentAndUserList,
-      setFlattenDepartmentList,
       departmentKeyValue,
       searchKeyValue,
       isTreeViewLoading,
@@ -104,6 +103,8 @@ const SelectContent = memo(
       setHtml,
       editorConfig,
       setHtmlText,
+      tagsValue,
+      isUpdatedDeptUser,
     } = useAction({
       outerSendData: sendData,
       getSendData,
@@ -387,6 +388,7 @@ const SelectContent = memo(
             setGroupList={setGroupList}
             setOpenFunction={setIsShowDialog}
             setDeptUserList={setDepartmentAndUserList}
+            outerTagsValue={tagsValue}
             setOuterTagsValue={setTagsValue}
             setIsRefresh={setIsRefresh}
             lastTagsValue={lastTimeTagsList}
@@ -395,6 +397,7 @@ const SelectContent = memo(
             setChatId={setChatId}
             sendType={sendType}
             setSendType={setSendType}
+            isUpdatedDeptUser={isUpdatedDeptUser}
           />
         </div>
         <div className={styles.typeShow}>
@@ -615,7 +618,10 @@ const SelectContent = memo(
     )
   },
   (prevProps, nextProps) => {
-    return prevProps.sendData === nextProps.sendData && prevProps === nextProps
+    return (
+      prevProps.sendData === nextProps.sendData &&
+      JSON.stringify(prevProps) === JSON.stringify(nextProps)
+    )
   }
 )
 

web/src/pages/enterprise/components/select-target-dialog/hook.ts

@@ -1,5 +1,5 @@
 import { clone } from "ramda"
-import { useEffect, useMemo, useState } from "react"
+import { useEffect, useState } from "react"
 import { PostWeChatWorkGroupCreate } from "../../../../api/enterprise"
 import {
   IDepartmentAndUserListValue,
@@ -9,8 +9,8 @@ import {
   ClickType,
   DeptUserCanSelectStatus,
   IWorkGroupCreate,
-  IWorkCorpAppGroup,
-  SendObjOrGroup
+  SendObjOrGroup,
+  IFirstState,
 } from "../../../../dtos/enterprise"
 
 const useAction = (props: {
@@ -22,7 +22,13 @@ const useAction = (props: {
   lastTagsValue: string[] | undefined
   tagsList: ITagsList[]
   clickName: string
+  chatId: string
+  outerTagsValue?: ITagsList[]
+  isUpdatedDeptUser: boolean
+  sendType?: SendObjOrGroup
+  setSendType?: React.Dispatch<React.SetStateAction<SendObjOrGroup>>
   setOpenFunction: (open: boolean) => void
+  setChatId?: React.Dispatch<React.SetStateAction<string>>
   setIsRefresh: React.Dispatch<React.SetStateAction<boolean>>
   setOuterTagsValue: React.Dispatch<React.SetStateAction<ITagsList[]>>
   setDeptUserList: React.Dispatch<React.SetStateAction<IDepartmentKeyControl[]>>
@@ -35,11 +41,17 @@ const useAction = (props: {
     isLoading,
     tagsList,
     clickName,
+    chatId,
+    outerTagsValue,
+    isUpdatedDeptUser,
+    lastTagsValue,
+    sendType,
+    setSendType,
+    setChatId,
     setIsRefresh,
     setOpenFunction,
     setDeptUserList,
     setOuterTagsValue,
-    lastTagsValue
   } = props
 
   const defaultGroupOwner = {
@@ -48,11 +60,7 @@ const useAction = (props: {
     type: DepartmentAndUserType.User,
     parentid: "",
     selected: false,
-    children: []
-  }
-  const defaultGroupValue = {
-    chatId: "",
-    chatName: ""
+    children: [],
   }
   const [departmentSelectedList, setDepartmentSelectedList] = useState<
     IDepartmentAndUserListValue[]
@@ -67,20 +75,21 @@ const useAction = (props: {
   const [groupName, setGroupName] = useState("")
   const [tipsObject, setTipsObject] = useState({
     show: false,
-    msg: ""
+    msg: "",
   })
   const [groupDeptUserList, setGroupDeptUserList] = useState<
     IDepartmentKeyControl[]
   >([])
   const [sendList, setSendList] = useState([
     SendObjOrGroup.Object,
-    SendObjOrGroup.Group
+    SendObjOrGroup.Group,
   ])
 
+  const [firstState, setFirstState] = useState<IFirstState>()
+
   const [createLoading, setCreateLoading] = useState(false)
 
-  const [groupValue, setGroupValue] =
-    useState<IWorkCorpAppGroup>(defaultGroupValue)
+  const [groupValue, setGroupValue] = useState<string>("")
 
   const recursiveSeachDeptOrUser = (
     hasData: IDepartmentAndUserListValue[],
@@ -109,7 +118,7 @@ const useAction = (props: {
             type: DepartmentAndUserType.User,
             parentid: String(e.parentid),
             selected: e.selected,
-            children: []
+            children: [],
           })
         : hasItemIndex > -1 && changeList.splice(hasItemIndex, 1)
       e.children.length > 0 && recursiveDeptList(e.children, changeList)
@@ -206,7 +215,7 @@ const useAction = (props: {
       : groupDeptUserSelectedList.length <= 1
       ? setTipsObject({
           show: true,
-          msg: "Please select 2 or more valid users"
+          msg: "Please select 2 or more valid users",
         })
       : !AppId
       ? setTipsObject({ show: true, msg: "Error for no AppId provided" })
@@ -216,7 +225,9 @@ const useAction = (props: {
             appId: AppId,
             name: groupName,
             owner: groupOwner.id as string,
-            userList: groupDeptUserSelectedList.map((item) => item.id as string)
+            userList: groupDeptUserSelectedList.map(
+              (item) => item.id as string
+            ),
           }
           if (requestData.owner === defaultGroupOwner.id)
             delete requestData.owner
@@ -245,6 +256,17 @@ const useAction = (props: {
         })()
   }
 
+  const handleConfirm = () => {
+    setOpenFunction(false)
+    setOuterTagsValue(tagsValue)
+    setFirstState(undefined)
+  }
+
+  const handleCancel = () => {
+    setOpenFunction(false)
+    clearSelected()
+  }
+
   useEffect(() => {
     // 限制条件下群组部门列表变化同步到群组搜索选择列表
     !isLoading &&
@@ -279,13 +301,31 @@ const useAction = (props: {
           setGroupDeptUserList((prev) => [...prev, clone(departmentKeyValue)]))
   }, [departmentAndUserList, AppId])
 
+  const clearSelected = () => {
+    if (firstState) {
+      setTagsValue(firstState.tagsValue)
+      setDeptUserList(firstState.deptUserList)
+      setChatId && setChatId(firstState.chatId)
+      setSendType && setSendType(firstState.sendType)
+      setFirstState(undefined)
+    }
+  }
+
   useEffect(() => {
-    // 切换应用时清空上次应用数据
-    setDepartmentSelectedList([])
-    setGroupDeptUserSelectedList([])
-    setTagsValue([])
+    clearSelected()
   }, [AppId])
 
+  useEffect(() => {
+    open &&
+      isUpdatedDeptUser &&
+      setFirstState({
+        tagsValue: outerTagsValue ?? [],
+        chatId,
+        deptUserList: clone(departmentAndUserList),
+        sendType: sendType ?? SendObjOrGroup.Object,
+      })
+  }, [open, isUpdatedDeptUser])
+
   useEffect(() => {
     const handleData = (
       prev: IDepartmentAndUserListValue[],
@@ -299,7 +339,6 @@ const useAction = (props: {
         })
       return newValue
     }
-    setOuterTagsValue(tagsValue)
     // 打开时load上次选中的数据
     open
       ? clickName === "选择发送目标"
@@ -364,7 +403,9 @@ const useAction = (props: {
     setTagsValue,
     handleDeptOrUserClick,
     setSearchToDeptValue,
-    handleCreateGroup
+    handleCreateGroup,
+    handleConfirm,
+    handleCancel,
   }
 }
 export default useAction