Просмотр исходного кода

fix:新增登录页背景图以及公告置顶选项

zhubo 2 лет назад
Родитель
Сommit
2d83ad39fd

+ 5 - 0
config/config.ts

@@ -167,6 +167,11 @@ export default defineConfig({
                   path: '/setting/banner',
                   component: './setting/banner/index',
                 },
+                {
+                  name: '登录页背景图',
+                  path: '/setting/bgi',
+                  component: './setting/bgi/index',
+                },
               ],
             },
           ],

+ 7 - 2
src/components/upload/index.tsx

@@ -6,6 +6,7 @@ import { PlusOutlined } from '@ant-design/icons';
 import type { PicturesWallType } from './data';
 
 import { baseUrl } from '@/utils/request';
+import { message } from 'antd';
 
 function getBase64(file) {
   return new Promise((resolve, reject) => {
@@ -64,8 +65,12 @@ class PicturesWall extends Component<PicturesWallType> {
     }
 
     if (fileList[0]?.status === 'done') {
-      // fileList.response.data
-      this.props.setCoverFn(fileList[0].response.data);
+      if (fileList[0].response.code === 0) {
+        // fileList.response.data
+        this.props.setCoverFn(fileList[0].response.data);
+      } else {
+        message.error(fileList[0].response.message);
+      }
     }
   };
   render() {

+ 2 - 1
src/layouts/BasicLayout.tsx

@@ -99,7 +99,8 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
       if (process.env.NODE_ENV === 'development') {
         window.location.href = `${BASE_URL}/#/user/login`;
       } else {
-        window.location.href = 'https://luojigou.vip/tieba-admin/#/user/login';
+        const { origin } = window.location;
+        window.location.href = `${origin}/tieba-admin/#/user/login`;
       }
     }
     // if (dispatch) {

+ 12 - 2
src/pages/notice/modal.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Modal, Form, Input, Select, message, Upload } from 'antd';
+import { Modal, Form, Input, Select, message, Upload, Radio } from 'antd';
 
 // import { ScissorOutlined } from '@ant-design/icons';
 
@@ -34,7 +34,7 @@ const layout = {
 };
 
 // 定义rem基准值
-const sizeBase = 23.4375;
+// const sizeBase = 23.4375;
 
 interface IProps {
   dispatch: Dispatch;
@@ -398,6 +398,16 @@ const NoticeModal: React.FC<noticeModalProps & IProps> = ({
         <Form.Item name="tag" label="公告标签:">
           <Input style={{ width: '375px' }} onChange={changeLabel} maxLength={10}></Input>
         </Form.Item>
+        <Form.Item
+          name="top"
+          label="是否置顶:"
+          rules={[{ required: true, message: '请选择是否置顶' }]}
+        >
+          <Radio.Group>
+            <Radio value={0}>否</Radio>
+            <Radio value={1}>是</Radio>
+          </Radio.Group>
+        </Form.Item>
         <Form.Item name="content" label="公告内容:">
           <EditorDemo key={editContent} changeContent={changeContent} editorContent={editContent} />
         </Form.Item>

+ 17 - 0
src/pages/setting/bgi/common.less

@@ -0,0 +1,17 @@
+.loginBGI {
+  .ant-upload-list-item {
+    width: 384px;
+    height: 576px;
+  }
+
+  .ant-upload {
+    width: 384px;
+    height: 576px;
+  }
+}
+
+.remark {
+  width: 384px;
+  margin-top: 500px;
+  text-align: center;
+}

+ 51 - 0
src/pages/setting/bgi/index.tsx

@@ -0,0 +1,51 @@
+import React, { memo, useEffect, useState } from 'react';
+import { PageContainer } from '@ant-design/pro-layout';
+import Upload from '../../../components/upload';
+import { message } from 'antd';
+import { getLoginBGI, setLoginBGI } from '@/services/notice';
+import './common.less';
+
+const MemoUpload = memo(Upload);
+
+const Banner = () => {
+  const [imgUrl, setImgUrl] = useState('');
+
+  // 设置登录背景图
+  const saveImgUrl = async (url: string) => {
+    const { status, msg } = await setLoginBGI(url);
+    if (status === 200) {
+      setImgUrl(url);
+    } else {
+      message.error(msg);
+    }
+  };
+
+  // 获取登录背景图
+  const getImgUrl = async () => {
+    const { status, data, msg } = await getLoginBGI();
+    if (status === 200) {
+      setImgUrl(data.backgroundImage);
+    } else {
+      message.error(msg);
+    }
+  };
+
+  useEffect(() => {
+    getImgUrl();
+  }, [imgUrl]);
+
+  return (
+    <PageContainer title="登录页背景图" className="loginBGI">
+      <MemoUpload
+        key={imgUrl}
+        maxCount={1}
+        desc="上传图片"
+        setCoverFn={saveImgUrl}
+        imgUrl={imgUrl}
+      />
+      <div className="remark">登录页封面GIF图上传</div>
+    </PageContainer>
+  );
+};
+
+export default Banner;

+ 19 - 0
src/services/notice.ts

@@ -45,3 +45,22 @@ export async function getBanner(roleId: string) {
 export async function deleteBanner(id: string) {
   return request(`/forum/admin/banner/${id}`, { method: 'DELETE' });
 }
+
+/**
+ * @description 获取登录页背景图
+ * @author 朱波
+ * @date 2022/10/24
+ */
+export async function getLoginBGI() {
+  return request(`/forum/system/config/content/LOGIN_BACKGROUND_IMAGE`, { method: 'GET' });
+}
+
+/**
+ * @description 设置登录页背景图
+ * @author 朱波
+ * @date 2022/10/24
+ */
+export async function setLoginBGI(imgUrl: string) {
+  const data = { backgroundImage: imgUrl };
+  return request(`/forum/system/config/ct/LOGIN_BACKGROUND_IMAGE`, { method: 'PUT', data });
+}

+ 4 - 4
src/utils/request.ts

@@ -64,8 +64,7 @@ const headers = {
 
 // https://open.luojigou.vip
 
-export const baseUrl: string =
-  process.env.NODE_ENV === 'development' ? '/api' : 'https://open.api.luojigou.vip';
+export const baseUrl: string = process.env.NODE_ENV === 'development' ? '/api' : '/zd-api';
 
 request.interceptors.request.use(
   (url: string, options: any, mutUrl?: string) => {
@@ -83,10 +82,11 @@ request.interceptors.request.use(
 request.interceptors.response.use(async (response, options) => {
   const r = await response.clone().json();
   if (r.code === 5001) {
+    const { origin } = window.location;
     if (process.env.NODE_ENV === 'development') {
-      window.location.href = `${BASE_URL}/#/user/login`;
+      window.location.href = `${origin}/#/user/login`;
     } else {
-      window.location.href = 'https://luojigou.vip/tieba-admin/#/user/login';
+      window.location.href = `${origin}/tieba-admin/#/user/login`;
     }
   }