From e37a454fcf8e64ee3431f50e22ee4676b9b54592 Mon Sep 17 00:00:00 2001
From: Jimmy Liow <lyj@hainatravel.com>
Date: Tue, 29 Oct 2024 11:44:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=9B=BE=E6=96=87=E9=9B=86=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E6=93=8D=E4=BD=9C=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/accounts/Profile.jsx     |  14 ++--
 src/views/accounts/SnippetList.jsx | 128 ++++++++++++++++++++---------
 2 files changed, 94 insertions(+), 48 deletions(-)

diff --git a/src/views/accounts/Profile.jsx b/src/views/accounts/Profile.jsx
index f1dae12..8e20cf7 100644
--- a/src/views/accounts/Profile.jsx
+++ b/src/views/accounts/Profile.jsx
@@ -56,35 +56,35 @@ function Profile() {
             <Descriptions.Item label='商业号身份'>
             <Space>
               <Select
-                defaultValue='jack'
+                defaultValue='GH 顾问'
                 style={{
                   width: 200,
                 }}
                 options={[
                   {
-                    value: 'GH 顾问',
+                    value: '18741256987',
                     label: 'GH 顾问(18741256987)',
                   },
                   {
-                    value: 'GH 客服',
+                    value: '13845214785',
                     label: 'GH 客服(13845214785)',
                   },
                   {
-                    value: 'GH 客运',
+                    value: '191477856351',
                     label: 'GH 客运(191477856351)',
                   },
                   {
-                    value: '国际事业部',
+                    value: '0',
                     label: '国际事业部(无)',
                     disabled: true,
                   },
                   {
-                    value: 'CT 事业部',
+                    value: '0',
                     label: 'CT 事业部(无)',
                     disabled: true,
                   },
                   {
-                    value: '花梨鹰事业部',
+                    value: '0',
                     label: '花梨鹰事业部(无)',
                     disabled: true,
                   },
diff --git a/src/views/accounts/SnippetList.jsx b/src/views/accounts/SnippetList.jsx
index e0683b0..31bb53b 100644
--- a/src/views/accounts/SnippetList.jsx
+++ b/src/views/accounts/SnippetList.jsx
@@ -1,6 +1,17 @@
-import { Row, Col, Tag, List, Form, Input, Button, Space, Modal } from 'antd'
+import {
+  Flex,
+  Row,
+  Col,
+  Tag,
+  List,
+  Form,
+  Input,
+  Button,
+  Space,
+  Modal,
+  Select
+} from 'antd'
 import { useState, useRef } from 'react'
-import LexicalEditor from '@/components/LexicalEditor'
 import LexicalEditorInput from './LexicalEditorInput'
 
 function SnippetList() {
@@ -9,9 +20,9 @@ function SnippetList() {
   const editorRef = useRef(null)
 
   const [isSnippetModalOpen, setSnippetModalOpen] = useState(false)
-  const [editorContent, setEditorContent] = useState("<p>Discover the best of the world with one of the <strong>best-rated tour companies for personalized travel</strong>. With over <strong>10,000+ reviews and a 98.8% 5-star rating</strong>, we focus on streamlining your planning and ensuring joyful travels. Whether it's a milestone celebration or a relaxing getaway, let us help create your beautiful journey.</p>")
-
-
+  const [editorContent, setEditorContent] = useState(
+    "<p>Discover the best of the world with one of the <strong>best-rated tour companies for personalized travel</strong>. With over <strong>10,000+ reviews and a 98.8% 5-star rating</strong>, we focus on streamlining your planning and ensuring joyful travels. Whether it's a milestone celebration or a relaxing getaway, let us help create your beautiful journey.</p>",
+  )
 
   const onSnippetFinish = (values) => {
     console.log('onSnippetFinish:', values)
@@ -26,16 +37,16 @@ function SnippetList() {
 
   return (
     <>
-    <Modal
+      <Modal
         centered
         okButtonProps={{
           autoFocus: true,
           htmlType: 'submit',
         }}
         width={800}
-        zIndex={996}
         title={'图文'}
-        open={isSnippetModalOpen} onCancel={() => setSnippetModalOpen(false)}
+        open={isSnippetModalOpen}
+        onCancel={() => setSnippetModalOpen(false)}
         destroyOnClose
         forceRender
         modalRender={(dom) => (
@@ -46,13 +57,13 @@ function SnippetList() {
             className='max-w-4xl'
             onFinish={onSnippetFinish}
             onFinishFailed={onSnippetFailed}
-            autoComplete='off'
-          >
+            autoComplete='off'>
             {dom}
           </Form>
-        )}
-      >
-        <Form.Item name='snippetId' className='hidden' ><Input /></Form.Item>
+        )}>
+        <Form.Item name='snippetId' className='hidden'>
+          <Input />
+        </Form.Item>
         <Form.Item
           label='标题'
           name='title'
@@ -61,10 +72,25 @@ function SnippetList() {
               required: true,
               message: 'title required',
             },
-          ]}
-        >
+          ]}>
           <Input />
         </Form.Item>
+        <Form.Item
+          label='类型'
+          name='category'
+          rules={[
+            {
+              required: true,
+              message: 'title required',
+            },
+          ]}>
+          <Select>
+            <Select.Option value="收款">收款</Select.Option>
+            <Select.Option value="西藏">西藏</Select.Option>
+            <Select.Option value="催信">催信</Select.Option>
+            <Select.Option value="提醒">提醒</Select.Option>
+          </Select>
+        </Form.Item>
         <Form.Item
           label='内容'
           name='content'
@@ -73,16 +99,8 @@ function SnippetList() {
               required: true,
               message: 'content required',
             },
-          ]}
-        >
-          {/* <LexicalEditor
-              {...{ isRichText: true, editorRef }}
-              onChange={() => {
-                console.info('onChange')
-              }}
-              initialValue={editorContent}
-            /> */}
-            <LexicalEditorInput />
+          ]}>
+          <LexicalEditorInput />
         </Form.Item>
       </Modal>
 
@@ -165,24 +183,52 @@ function SnippetList() {
               )}
             />
           </Col>
-          <Col
-            span={16}>
+          <Col span={16}>
+            <div className='border-solid border rounded border-gray-300'>
               <Space
-    direction="vertical"
-    size="middle"
-    style={{
-      display: 'flex',
-    }}
-  >
-              <div
-            className='border-solid border rounded border-gray-300'>
-            <pre className='whitespace-pre-wrap break-words'>
-          <p>Discover China with the <strong>award-winning</strong> and <strong>best-rated</strong> tour company for <strong>personalized travel in China</strong>. Honored as <strong>China's Leading Tour Operator</strong> by the <strong>World Travel Awards</strong>, we boast <strong>10,000+ reviews</strong> and a remarkable <strong>98.8% 5-star rating</strong>. Our expertise in customizing personalized China explorations is backed by our company-managed local services across China. Explore and kickstart your personalized travel experience with just a click!</p>
-          </pre>
+                direction='vertical'
+                size='middle'
+                style={{
+                  display: 'flex',
+                }}>
+                <pre className='whitespace-pre-wrap break-words ps-6 pe-6'>
+                  <p>
+                    Discover China with the <strong>award-winning</strong> and{' '}
+                    <strong>best-rated</strong> tour company for{' '}
+                    <strong>personalized travel in China</strong>. Honored as{' '}
+                    <strong>China is Leading Tour Operator</strong> by the{' '}
+                    <strong>World Travel Awards</strong>, we boast{' '}
+                    <strong>10,000+ reviews</strong> and a remarkable{' '}
+                    <strong>98.8% 5-star rating</strong>. Our expertise in
+                    customizing personalized China explorations is backed by our
+                    company-managed local services across China. Explore and
+                    kickstart your personalized travel experience with just a
+                    click!
+                  </p>
+                </pre>
+                <Flex gap='middle' justify='flex-end' wrap className='p-6'>
+                  <Button
+                    onClick={() => {
+                      setSnippetModalOpen(true)
+                    }}>
+                    编辑
+                  </Button>
+                  <Button
+                    onClick={() => {
+                      //
+                    }}>
+                    复制
+                  </Button>
+                  <Button
+                    danger
+                    onClick={() => {
+                      //
+                    }}>
+                    删除
+                  </Button>
+                </Flex>
+              </Space>
             </div>
-
-
-            </Space>
           </Col>
         </Row>
       </Space>