雷闳焜：完成富文本编辑器的部分，由于下载引入老出问题，暂时用云调用

Reviewed-on: http://git.feashow.cn/wenhua/fateverse-react/pulls/25

src/Login.tsx

@@ -4,8 +4,6 @@ import './assets/styles/login.scss'
 import { getCaptchaApi, loginApi } from "./api/login";
 import { useNavigate } from "react-router-dom";
 import { setToken } from "./utils/auth";
-import { useDispatch } from "react-redux";
-import { addAuthInfo, getAuthInfo } from "./stores/auth";
 
 type Login = {
   uuid?: string,
@@ -18,14 +16,8 @@ export default function Login() {
   const [messageApi, contextHolder] = message.useMessage()
   const [uuid, setUuid] = useState<string>('')
   const [captcha, setCaptcha] = useState<string>('')
-  const dispatch = useDispatch()
   const navigate = useNavigate()
 
-  const requestAuthInfo = async () => {
-    const { payload } = await dispatch(getAuthInfo() as any)
-    dispatch(addAuthInfo(payload))
-  }
-
   const getCaptcha = async () => {
     try {
       const { code, data } = await getCaptchaApi()
@@ -45,7 +37,6 @@ export default function Login() {
       if (code === 1000) {
         setToken(data)
         messageApi.success(msg)
-        requestAuthInfo()
         navigate('/')
         return
       }

src/components/Authenticationbtn.tsx

@@ -1,5 +1,4 @@
 import { useState } from "react";
-import { useSelector } from "react-redux";
 
 /**
  * @author {温华}
@@ -10,10 +9,9 @@ import { useSelector } from "react-redux";
 
 export default function Authenticationbtn({ permission, children }: any) {
   // 还需从缓存中获取用户权限数组
-  const authInfo = useSelector((store: any) => store.auth)
   const [visible, setVisible] = useState(true)
   const allPermission: string = "*:*:*"
-  const authPermissions: Array<string> = authInfo.permissions
+  const authPermissions: Array<string> = []
   if(permission && permission instanceof Array && permission.length > 0) {
     const permissiosFlag = permission
     const hasPermission = authPermissions.some((perm: string)=>{
@@ -22,6 +20,6 @@ export default function Authenticationbtn({ permission, children }: any) {
     setVisible(hasPermission)
   }
 
-  if(visible) return children
+  if(visible) return <div>{children}</div>
   return null
 }

src/router/index.tsx

@@ -46,7 +46,7 @@ const currentRouter: Array<route> = [
   },
   {
     path: '/login',
-    element: <Suspense fallback={<Loading />}>{lazyLoad('login')}</Suspense>
+    element: lazyLoad('login')
   }
 ]
 

src/view/home/index.tsx

@@ -1,10 +1,5 @@
-import Authenticationbtn from "@/components/Authenticationbtn";
-import { Button } from "antd";
-
 export default function Home() {
   return(
-    <Authenticationbtn permission="['system:list']">
+    <div>home</div>
-      <Button>测试</Button>
-    </Authenticationbtn>
   )
 }

src/view/system/notice/publish/index.scss

@@ -59,3 +59,6 @@
         margin-right: 10px;
     }
 }
+.tox-tinymce{
+    width: 700px;
+}

src/view/system/notice/publish/index.tsx

@@ -15,6 +15,7 @@ import {
   Col,
   TreeSelect,
 } from "antd";
+import { Editor } from "@tinymce/tinymce-react";
 import type { ColumnsType } from "antd/es/table";
 import {
   SyncOutlined,
@@ -58,7 +59,18 @@ interface TableDataType {
   key?: number;
   total?: number;
 }
-
+interface dataType {
+  senders: string[];
+  cluster?: string | null;
+  createBy?: string | null;
+  contentType?: string | null;
+  noticeContent: string;
+  noticeId?: number | null;
+  noticeTitle?: string | null;
+  noticeType?: string | null;
+  sendType?: string | null;
+  state?: string | null;
+}
 //当前选择的角色信息
 interface queryParamsType {
   cluster?: string;
@@ -72,6 +84,29 @@ interface queryParamsType {
 }
 let thisrole: any = {};
 export default function Inform() {
+  const editorInit = {
+    language: "zh_CN",
+    min_height: 400,
+    plugins:
+      "print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template code codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists wordcount imagetools textpattern help emoticons autosave bdmap indent2em autoresize formatpainter axupimgs",
+    toolbar:
+      ["code undo redo restoredraft | cut copy paste pastetext | forecolor backcolor bold italic underline strikethrough link |  anchor | alignleft aligncenter alignright alignjustify outdent indent | \
+    styleselect formatselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
+    table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | bdmap indent2em lineheight formatpainter axupimgs"],
+    importcss_append: true,
+    //自定义文件选择器的回调内容
+    // file_picker_callback: function (callback, value, meta) {
+    //     if (meta.filetype === 'file') {
+    //       callback('https://www.baidu.com/img/bd_logo1.png', { text: 'My text' });
+    //     }
+    //     if (meta.filetype === 'image') {
+    //       callback('https://www.baidu.com/img/bd_logo1.png', { alt: 'My alt text' });
+    //     }
+    //     if (meta.filetype === 'media') {
+    //       callback('movie.mp4', { source2: 'alt.ogg', poster: 'https://www.baidu.com/img/bd_logo1.png' });
+    //     }
+    // }
+  };
   const { confirm } = Modal;
   //提示组件
   const [messageApi, contextHolder] = message.useMessage();
@@ -85,7 +120,12 @@ export default function Inform() {
     endTime: undefined,
   });
 
-  const [thisNotice, setThisNotice] = useState<any>({});
+  const [thisNotice, setThisNotice] = useState<dataType>({
+    noticeContent: "",
+    senders: [],
+  });
+
+  const [allDisplay,setAllDisplay]=useState('block')
   //Modal
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [isDetailModalOpen, setIsDetailModalOpen] = useState(false);
@@ -102,6 +142,7 @@ export default function Inform() {
   //发送对象数据
   const [senderIds, setSenderIds] = useState<any>(undefined);
 
+  const [editorValue,setEditorValue]=useState('')
   //表格数据总条数
   let [total, setTotal] = useState<number>(0);
   //表格格式
@@ -196,15 +237,26 @@ export default function Inform() {
     console.log(value);
     if (value === "user") {
       getUserList();
+      setAllDisplay('block')
     } else if (value === "role") {
       getRolesList();
+      setAllDisplay('block')
     } else if (value === "dept") {
       getDeptsList();
+      setAllDisplay('block')
+    }
+    else {
+      setAllDisplay('none')
     }
   };
+  const onEditorChange=(Value:string)=>{
+    setEditorValue(Value)
+  }
   //   let thisrole: any = {roleId:'s'};
   const handleDetail = (text: any) => {
     getData(text.noticeId);
+
+    // console.log(thisNotice.);
     setIsDetailModalOpen(true);
   };
   const handleDelete = (text: any) => {
@@ -255,9 +307,11 @@ export default function Inform() {
       .validateFields()
       .then((values) => {
         // form.resetFields();
-        console.log("add", values);
         if (modalTitle == "新增公告") {
-          postAdd({ ...values, cluster: "notice", action: "SEND" });
+          if(values.sendType==='all') values.senderIds=['0']
+          console.log(values);
+          
+          postAdd({ ...values, cluster: "notice", action: "SEND" ,noticeContent:editorValue});
         }
       })
       .catch((info) => {
@@ -282,6 +336,8 @@ export default function Inform() {
       senderIds: undefined,
       contentType: "html",
     });
+    setAllDisplay('block');
+    setEditorValue('')
     setIsModalOpen(true);
   };
   const filterOption = (
@@ -388,7 +444,6 @@ export default function Inform() {
         }
         console.log(data);
         setSenderIds([...data]);
-        // setTotal(data.total);
       }
     } catch (err: any) {
       console.log("555", err);
@@ -413,6 +468,7 @@ export default function Inform() {
       console.log("555", err);
     }
   };
+
   useEffect(() => {
     // setQueryParams({...queryParams,...valueSch})
     queryTableDataParams = {
@@ -624,8 +680,8 @@ export default function Inform() {
                   />
                 </Form.Item>
               </Col>
-              <Col span={12}>
+              <Col span={12}>{
-                <Form.Item
+                allDisplay==='block'?<Form.Item
                   name="senderIds"
                   label="发送对象"
                   rules={[{ required: true, message: "选择发送对象" }]}
@@ -663,9 +719,12 @@ export default function Inform() {
                     />
                   )}
                 </Form.Item>
+                :null
+              }
+                
               </Col>
             </Row>
-
+            <Row>
               <Form.Item
                 name="contentType"
                 label="内容类型"
@@ -678,11 +737,20 @@ export default function Inform() {
                   <Radio value="text">文本</Radio>
                 </Radio.Group>
               </Form.Item>
-            <Form.Item
+            </Row>
-              name="menuIds"
+
-              label="菜单权限"
+            <Form.Item name="noticeContent" label="公告内容">
-              className="collection-create-form_last-form-item"
+              <Row>
-            ></Form.Item>
+                <div>
+                <Editor
+                  apiKey="v4zo4n22oanvco29ws5drh0pecuf3gh53clx53cccj3grjwg"
+                  initialValue=""
+                  init={editorInit}
+                  value={editorValue}
+                  onEditorChange={(Value)=>onEditorChange(Value)}
+                ></Editor></div>
+              </Row>
+            </Form.Item>
           </Form>
         </Modal>
         <Modal
@@ -730,7 +798,7 @@ export default function Inform() {
               </Col>
               <Col span={8}>
                 <Form.Item name="sendIds" label="发送对象">
-                  <span></span>
+                  <span>{thisNotice.senders.join("，")}</span>
                 </Form.Item>
               </Col>
             </Row>

vite.config.ts

@@ -5,7 +5,7 @@ import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  base: '/',
+  base: './',
   plugins: [
     react(),
     createSvgIconsPlugin({