feat: 完成删除图文功能

src/components/EditorInput.jsx

@@ -8,7 +8,8 @@ import { isEmpty } from '@/utils/commons';
 const LexicalEditorInput = (props) => {
   const { id, value = {}, onChange } = props
 
-  const [defaultHtml, setDefaultHtml] = useState('');
+  const [defaultHtml, setDefaultHtml] = useState('')
+
   useEffect(() => {
     if (typeof value === 'string') {
       setDefaultHtml(value)
@@ -23,7 +24,6 @@ const LexicalEditorInput = (props) => {
    */
   const triggerChange = (changedValue) => {
     onChange?.({
-      // ...value,
       ...changedValue,
     })
   }

src/stores/SnippetStore.js

@@ -96,6 +96,16 @@ const useSnippetStore = create(devtools((set, get) => ({
       })
   },
 
+  createSnippet: (userId) => {
+    return {
+      snippetId: null,
+      title: '',
+      owner: userId + '/2',
+      category: null,
+      content: '',
+    }
+  },
+
   saveOrUpdateSnippet: async (formValues) => {
     const postSnippetUrl = `${API_HOST}/AddAutoDocInfo`
     const formData = new FormData()
@@ -123,6 +133,21 @@ const useSnippetStore = create(devtools((set, get) => ({
         }
       })
   },
+
+  deleteCurrentSnippet: async () => {
+    const {currentSnippet} = get()
+    const deleteSnippetUrl = `${API_HOST}/DeleteAutoDocInfo`
+    const params = {adi_sn: currentSnippet.snippetId};
+
+    return fetchJSON(deleteSnippetUrl, params)
+      .then(json => {
+        if (json.errcode === 0) {
+          console.info(json)
+        } else {
+          throw new Error(json?.errmsg + ': ' + json.errcode)
+        }
+      })
+  },
 }), { name: 'snippetStore' }))
 
 export default useSnippetStore

src/views/accounts/SnippetList.jsx

@@ -1,4 +1,5 @@
 import { App, Row, Col, Tag, List, Form, Input, Button, Space, Modal, Select, message } from 'antd'
+import { ExclamationCircleFilled } from '@ant-design/icons'
 import { useState, useEffect } from 'react'
 import EditorInput from '../../components/EditorInput'
 import HtmlPreview from './HtmlPreview'
@@ -11,16 +12,22 @@ function SnippetList() {
   const [searchform] = Form.useForm()
   const [snippetForm] = Form.useForm()
 
-  const [fetchParamList, ownerList, typeList, typeAllList, fetchSnippetList, snippetList, fetchSnippetDetail, currentSnippet, saveOrUpdateSnippet] = useSnippetStore((state) => [
-    state.fetchParamList,
-    state.ownerList,
-    state.typeList,
-    state.typeAllList,
-    state.fetchSnippetList,
-    state.snippetList,
-    state.fetchSnippetDetail,
-    state.currentSnippet,
-    state.saveOrUpdateSnippet,
+  const [
+    fetchParamList,
+    ownerList, typeList, typeAllList, fetchSnippetList, snippetList, fetchSnippetDetail, currentSnippet, saveOrUpdateSnippet,
+    deleteCurrentSnippet, createSnippet
+  ] = useSnippetStore(s => [
+    s.fetchParamList,
+    s.ownerList,
+    s.typeList,
+    s.typeAllList,
+    s.fetchSnippetList,
+    s.snippetList,
+    s.fetchSnippetDetail,
+    s.currentSnippet,
+    s.saveOrUpdateSnippet,
+    s.deleteCurrentSnippet,
+    s.createSnippet
   ])
 
   const [loginUser] = useAuthStore((state) => [state.loginUser])
@@ -54,7 +61,6 @@ function SnippetList() {
   }
 
   const handleSearchFinish = (values) => {
-    console.log('handleSearchFinish:', values)
     fetchSnippetList(values)
   }
 
@@ -68,6 +74,26 @@ function SnippetList() {
     setSnippetModalOpen(true)
   }
 
+  const handelSnippetNew = () => {
+    const snippet = createSnippet(383)
+    snippetForm.setFieldsValue(snippet)
+    setSnippetModalOpen(true)
+  }
+
+  const handelSnippetDelete = () => {
+    Modal.confirm({
+      title: '你确定要删除这条图文吗？',
+      icon: <ExclamationCircleFilled />,
+      content: currentSnippet.title,
+      onOk() {
+        deleteCurrentSnippet()
+      },
+      onCancel() {
+        console.log('Cancel')
+      },
+    })
+  }
+
   useEffect(() => {
     fetchParamList()
   }, [])
@@ -83,7 +109,10 @@ function SnippetList() {
         width={800}
         title={'图文'}
         open={isSnippetModalOpen}
-        onCancel={() => setSnippetModalOpen(false)}
+        onCancel={() => {
+          snippetForm.resetFields()
+          setSnippetModalOpen(false)}
+        }
         destroyOnClose
         forceRender
         modalRender={(dom) => (
@@ -173,10 +202,7 @@ function SnippetList() {
           </Form.Item>
           <Form.Item>
             <Button
-              onClick={() => {
-                snippetForm.resetFields()
-                setSnippetModalOpen(true)
-              }}>
+              onClick={() => {handelSnippetNew()}}>
               新增
             </Button>
           </Form.Item>
@@ -208,7 +234,7 @@ function SnippetList() {
               loading={isHtmlLoading}
               onEdit={() => handelSnippetEdit()}
               onCopied={() => messageApi.success('已复制')}
-              onDelete={() => console.info('onDelete')}
+              onDelete={() => handelSnippetDelete()}
             />
           </Col>
         </Row>