feat: 完成图文集新增

src/stores/AuthStore.js

@@ -1,4 +1,5 @@
 import { create } from 'zustand'
+import { devtools } from 'zustand/middleware'
 import { fetchJSON, postForm } from '@/utils/request'
 import { isEmpty, isNotEmpty } from '@/utils/commons'
 import { API_HOST } from '@/config'
@@ -6,7 +7,7 @@ import { API_HOST } from '@/config'
 export const PERM_MERGE_CONVERSATION = 'merge-conversation'
 export const PERM_ASSIGN_NEW_CONVERSATION = 'assign-new-conversation'
 
-const useAuthStore = create((set, get) => ({
+const useAuthStore = create(devtools((set, get) => ({
   loginUser: {
     userId: -1,
     userIdStr: '-1',
@@ -158,6 +159,6 @@ const useAuthStore = create((set, get) => ({
         }
       })
   },
-}))
+}), { name: 'authStore' }))
 
 export default useAuthStore

src/stores/SnippetStore.js

@@ -11,6 +11,13 @@ const useSnippetStore = create(devtools((set, get) => ({
   typeAllList: [],
   snippetList: [],
   drawerOpen: false,
+  currentSnippet: {
+    snippetId: 0,
+    title: '',
+    owner: '',
+    category: '',
+    content: {html: ''}
+  },
 
   openDrawer: () => {
     set(() => ({
@@ -25,7 +32,7 @@ const useSnippetStore = create(devtools((set, get) => ({
   },
 
   fetchParamList: async () => {
-    const fetchOwnerUrl = `${API_HOST}/v2/GetAutoDocParameters`
+    const fetchOwnerUrl = `${API_HOST}/GetAutoDocParameters`
     const params = {};
 
     return fetchJSON(fetchOwnerUrl, params)
@@ -50,7 +57,7 @@ const useSnippetStore = create(devtools((set, get) => ({
   },
 
   fetchSnippetList: async (formValues) => {
-    const fetchSnippetListUrl = `${API_HOST}/v2/QueryAutoDocInfo`
+    const fetchSnippetListUrl = `${API_HOST}/QueryAutoDocInfo`
 
     return fetchJSON(fetchSnippetListUrl, formValues)
       .then(json => {
@@ -64,15 +71,25 @@ const useSnippetStore = create(devtools((set, get) => ({
       })
   },
 
-  fetchSnippetDetail: async (snippetId) => {
+  fetchSnippetDetail: async (snippet) => {
-    const fetchSnippetDetailUrl = `${API_HOST}/v2/GetAutoDocInfoDetail`
+    const fetchSnippetDetailUrl = `${API_HOST}/GetAutoDocInfoDetail`
-    const params = {adi_sn: snippetId};
+    const params = {adi_sn: snippet.adi_sn};
 
     return fetchJSON(fetchSnippetDetailUrl, params)
       .then(json => {
         if (json.errcode === 0 && json?.result.length > 0) {
-          console.info(json)
+          const detail = json?.result[0]
-          return json?.result[0].adi_content
+          const content = detail.adi_content
+          set(() => ({
+            currentSnippet: {
+              snippetId: snippet.adi_sn,
+              title: snippet.adi_title,
+              owner: snippet.adi_owner,
+              category: snippet.adi_type,
+              content: { html: detail.adi_content}
+            }
+          }))
+          return content
         } else {
           throw new Error(json?.errmsg + ': ' + json.errcode)
         }
@@ -80,10 +97,10 @@ const useSnippetStore = create(devtools((set, get) => ({
   },
 
   saveOrUpdateSnippet: async (formValues) => {
-    const postSnippetUrl = `${API_HOST}/v2/AddAutoDocInfo`
+    const postSnippetUrl = `${API_HOST}/AddAutoDocInfo`
     const formData = new FormData()
     formData.append('adi_sn', formValues.snippetId)
-    formData.append('owner', 383)
+    formData.append('owner', formValues.owner)
     formData.append('type', formValues.category)
     formData.append('title', formValues.title)
     formData.append('adi_content', formValues.content.html)
@@ -92,7 +109,15 @@ const useSnippetStore = create(devtools((set, get) => ({
     return postForm(postSnippetUrl, formData)
       .then(json => {
         if (json.errcode === 0) {
-          console.info(json)
+          set(() => ({
+            currentSnippet: {
+              snippetId: formValues.snippetId,
+              title: formValues.title,
+              owner: formValues.owner,
+              category: formValues.category,
+              content: formValues.content
+            }
+          }))
         } else {
           throw new Error(json?.errmsg + ': ' + json.errcode)
         }

src/views/accounts/Profile.jsx

@@ -7,7 +7,6 @@ function Profile() {
   const [loginUser, setWhatsAppBusiness] = useAuthStore((state) => [state.loginUser, state.setWhatsAppBusiness])
 
   useEffect(() => {
-    console.info(loginUser)
     // 测试错误捕获：
     // throw new Error('💥 CABOOM 💥')
     // eslint-disable-next-line react-hooks/exhaustive-deps

src/views/accounts/SnippetList.jsx

@@ -17,7 +17,7 @@ import { useState, useRef, useEffect } from 'react'
 import LexicalEditorInput from './LexicalEditorInput'
 import HtmlPreview from './HtmlPreview'
 import useSnippetStore from '@/stores/SnippetStore'
-import LexicalEditor from '@/components/LexicalEditor'
+import useAuthStore from '@/stores/AuthStore'
 import { isEmpty, isNotEmpty } from '@/utils/commons'
 
 function SnippetList() {
@@ -35,6 +35,7 @@ function SnippetList() {
     fetchSnippetList,
     snippetList,
     fetchSnippetDetail,
+    currentSnippet,
     saveOrUpdateSnippet
   ] = useSnippetStore((state) => [
     state.fetchParamList,
@@ -44,22 +45,22 @@ function SnippetList() {
     state.fetchSnippetList,
     state.snippetList,
     state.fetchSnippetDetail,
+    state.currentSnippet,
     state.saveOrUpdateSnippet
   ])
 
+  const [loginUser] = useAuthStore((state) => [state.loginUser])
+
   const [isSnippetModalOpen, setSnippetModalOpen] = useState(false)
-  const [editorContent, setEditorContent] = useState('')
   const [isHtmlLoading, setHtmlLoading] = useState(false)
 
   const onSnippetFinish = (values) => {
     console.log('onSnippetFinish:', values)
     saveOrUpdateSnippet(values)
-    // console.info(JSON.stringify(editorRef.current.getEditorState()))
   }
 
   const onSnippetFailed = (error) => {
     console.log('Failed:', error)
-    // form.resetFields()
   }
 
   const handleSearchFinish = (values) => {
@@ -67,15 +68,17 @@ function SnippetList() {
     fetchSnippetList(values)
   }
 
-  const handleSnippetSelected = (snippetId) => {
+  const handleSnippetSelected = (snippet) => {
     setHtmlLoading(true)
-    fetchSnippetDetail(snippetId)
+    fetchSnippetDetail(snippet)
-      .then((content) => {
-        setEditorContent(content)
-      })
       .finally(() => setHtmlLoading(false))
   }
 
+  const handelSnippetEdit = () => {
+    snippetForm.setFieldsValue(currentSnippet)
+    setSnippetModalOpen(true)
+  }
+
   useEffect(() => {
     fetchParamList()
   }, [])
@@ -115,18 +118,31 @@ function SnippetList() {
           rules={[
             {
               required: true,
-              message: 'title required',
+              message: '标题必填',
             },
           ]}>
           <Input />
         </Form.Item>
+        <Form.Item label='所有者' name='owner'
+          rules={[
+            {
+              required: true,
+              message: '所有者必选',
+            },
+          ]}>
+            <Select
+              options={ownerList}
+              showSearch
+              optionFilterProp='label'
+              notFoundContent={'找不到'}></Select>
+          </Form.Item>
         <Form.Item
           label='类型'
           name='category'
           rules={[
             {
               required: true,
-              message: 'title required',
+              message: '类型必选',
             },
           ]}>
           <Select options={typeList}>
@@ -138,7 +154,7 @@ function SnippetList() {
           rules={[
             {
               required: true,
-              message: 'content required',
+              message: '内容必填',
             },
           ]}>
           <LexicalEditorInput />
@@ -151,7 +167,7 @@ function SnippetList() {
           form={searchform}
           onFinish={handleSearchFinish}
           initialValues={{
-            owner: '', // 默认登录登账号
+            owner: loginUser.userId + '/2', // 默认是登录账号
             type: '',
           }}>
           <Form.Item label='所有者' name='owner'>
@@ -188,16 +204,16 @@ function SnippetList() {
             <List
               bordered
               dataSource={snippetList}
-              renderItem={(item) => (
+              renderItem={(snippet) => (
                 <List.Item
                   className='hover:bg-stone-50'
                   onClick={() => {
-                    handleSnippetSelected(item.adi_sn)
+                    handleSnippetSelected(snippet)
                   }}>
                   <Row gutter={16} className='w-full'>
-                    <Col span={20}>{item.adi_title}</Col>
+                    <Col span={20}>{snippet.adi_title}</Col>
                     <Col span={4}>
-                      <Tag color='blue'>{item.adi_type_name}</Tag>
+                      <Tag color='blue'>{snippet.adi_type_name}</Tag>
                     </Col>
                   </Row>
                 </List.Item>
@@ -205,8 +221,8 @@ function SnippetList() {
             />
           </Col>
           <Col span={16}>
-            <HtmlPreview value={editorContent} loading={isHtmlLoading}
+            <HtmlPreview value={currentSnippet.content.html} loading={isHtmlLoading}
-              onEdit={() => console.info('onEdit')}
+              onEdit={() => handelSnippetEdit()}
               onCopied={() => messageApi.success('已复制')}
               onDelete={() => console.info('onDelete')} />
           </Col>