feats

config/config.js

@@ -8,6 +8,9 @@ import routes from './routes';
 const { REACT_APP_ENV } = process.env;
 
 export default defineConfig({
+  define: {
+    API_BASE: REACT_APP_ENV ? '' : ''
+  },
   hash: true,
   antd: {
     dark: true,

config/defaultSettings.ts

@@ -12,9 +12,9 @@ const Settings: LayoutSettings & {
   fixedHeader: false,
   fixSiderbar: true,
   colorWeak: false,
-  title: '军工站',
+  title: '军供',
   pwa: false,
-  logo: 'https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg',
+  logo: '/logo.png',
   iconfontUrl: '',
 };
 

config/proxy.js

@@ -11,7 +11,7 @@ export default {
     // localhost:8000/api/** -> https://preview.pro.ant.design/api/**
     '/api/': {
       // 要代理的地址
-      target: 'http://192.168.89.76:8087',
+      target: 'http://192.168.89.147:8087',
       // 配置了这个可以从 http 代理到 https
       // 依赖 origin 的功能可能需要这个，比如 cookie
       changeOrigin: true,

public/logo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200" version="1.1" viewBox="0 0 200 200"><title>Group 28 Copy 5</title><desc>Created with Sketch.</desc><defs><linearGradient id="linearGradient-1" x1="62.102%" x2="108.197%" y1="0%" y2="37.864%"><stop offset="0%" stop-color="#4285EB"/><stop offset="100%" stop-color="#2EC7FF"/></linearGradient><linearGradient id="linearGradient-2" x1="69.644%" x2="54.043%" y1="0%" y2="108.457%"><stop offset="0%" stop-color="#29CDFF"/><stop offset="37.86%" stop-color="#148EFF"/><stop offset="100%" stop-color="#0A60FF"/></linearGradient><linearGradient id="linearGradient-3" x1="69.691%" x2="16.723%" y1="-12.974%" y2="117.391%"><stop offset="0%" stop-color="#FA816E"/><stop offset="41.473%" stop-color="#F74A5C"/><stop offset="100%" stop-color="#F51D2C"/></linearGradient><linearGradient id="linearGradient-4" x1="68.128%" x2="30.44%" y1="-35.691%" y2="114.943%"><stop offset="0%" stop-color="#FA8E7D"/><stop offset="51.264%" stop-color="#F74A5C"/><stop offset="100%" stop-color="#F51D2C"/></linearGradient></defs><g id="Page-1" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="logo" transform="translate(-20.000000, -20.000000)"><g id="Group-28-Copy-5" transform="translate(20.000000, 20.000000)"><g id="Group-27-Copy-3"><g id="Group-25" fill-rule="nonzero"><g id="2"><path id="Shape" fill="url(#linearGradient-1)" d="M91.5880863,4.17652823 L4.17996544,91.5127728 C-0.519240605,96.2081146 -0.519240605,103.791885 4.17996544,108.487227 L91.5880863,195.823472 C96.2872923,200.518814 103.877304,200.518814 108.57651,195.823472 L145.225487,159.204632 C149.433969,154.999611 149.433969,148.181924 145.225487,143.976903 C141.017005,139.771881 134.193707,139.771881 129.985225,143.976903 L102.20193,171.737352 C101.032305,172.906015 99.2571609,172.906015 98.0875359,171.737352 L28.285908,101.993122 C27.1162831,100.824459 27.1162831,99.050775 28.285908,97.8821118 L98.0875359,28.1378823 C99.2571609,26.9692191 101.032305,26.9692191 102.20193,28.1378823 L129.985225,55.8983314 C134.193707,60.1033528 141.017005,60.1033528 145.225487,55.8983314 C149.433969,51.69331 149.433969,44.8756232 145.225487,40.6706018 L108.58055,4.05574592 C103.862049,-0.537986846 96.2692618,-0.500797906 91.5880863,4.17652823 Z"/><path id="Shape" fill="url(#linearGradient-2)" d="M91.5880863,4.17652823 L4.17996544,91.5127728 C-0.519240605,96.2081146 -0.519240605,103.791885 4.17996544,108.487227 L91.5880863,195.823472 C96.2872923,200.518814 103.877304,200.518814 108.57651,195.823472 L145.225487,159.204632 C149.433969,154.999611 149.433969,148.181924 145.225487,143.976903 C141.017005,139.771881 134.193707,139.771881 129.985225,143.976903 L102.20193,171.737352 C101.032305,172.906015 99.2571609,172.906015 98.0875359,171.737352 L28.285908,101.993122 C27.1162831,100.824459 27.1162831,99.050775 28.285908,97.8821118 L98.0875359,28.1378823 C100.999864,25.6271836 105.751642,20.541824 112.729652,19.3524487 C117.915585,18.4685261 123.585219,20.4140239 129.738554,25.1889424 C125.624663,21.0784292 118.571995,14.0340304 108.58055,4.05574592 C103.862049,-0.537986846 96.2692618,-0.500797906 91.5880863,4.17652823 Z"/></g><path id="Shape" fill="url(#linearGradient-3)" d="M153.685633,135.854579 C157.894115,140.0596 164.717412,140.0596 168.925894,135.854579 L195.959977,108.842726 C200.659183,104.147384 200.659183,96.5636133 195.960527,91.8688194 L168.690777,64.7181159 C164.472332,60.5180858 157.646868,60.5241425 153.435895,64.7316526 C149.227413,68.936674 149.227413,75.7543607 153.435895,79.9593821 L171.854035,98.3623765 C173.02366,99.5310396 173.02366,101.304724 171.854035,102.473387 L153.685633,120.626849 C149.47715,124.83187 149.47715,131.649557 153.685633,135.854579 Z"/></g><ellipse id="Combined-Shape" cx="100.519" cy="100.437" fill="url(#linearGradient-4)" rx="23.6" ry="23.581"/></g></g></g></g></svg>

public/pro_icon.svg

@@ -1,5 +0,0 @@
-<svg width="42" height="42" xmlns="http://www.w3.org/2000/svg">
- <g>
-  <path fill="#070707" d="m6.717392,13.773912l5.6,0c2.8,0 4.7,1.9 4.7,4.7c0,2.8 -2,4.7 -4.9,4.7l-2.5,0l0,4.3l-2.9,0l0,-13.7zm2.9,2.2l0,4.9l1.9,0c1.6,0 2.6,-0.9 2.6,-2.4c0,-1.6 -0.9,-2.4 -2.6,-2.4l-1.9,0l0,-0.1zm8.9,11.5l2.7,0l0,-5.7c0,-1.4 0.8,-2.3 2.2,-2.3c0.4,0 0.8,0.1 1,0.2l0,-2.4c-0.2,-0.1 -0.5,-0.1 -0.8,-0.1c-1.2,0 -2.1,0.7 -2.4,2l-0.1,0l0,-1.9l-2.7,0l0,10.2l0.1,0zm11.7,0.1c-3.1,0 -5,-2 -5,-5.3c0,-3.3 2,-5.3 5,-5.3s5,2 5,5.3c0,3.4 -1.9,5.3 -5,5.3zm0,-2.1c1.4,0 2.2,-1.1 2.2,-3.2c0,-2 -0.8,-3.2 -2.2,-3.2c-1.4,0 -2.2,1.2 -2.2,3.2c0,2.1 0.8,3.2 2.2,3.2z" class="st0" id="Ant-Design-Pro"/>
- </g>
-</svg>

src/components/UploadFile/index.jsx

@@ -0,0 +1,64 @@
+import React, { useCallback, useState } from 'react'
+import { UploadOutlined } from '@ant-design/icons';
+import { Upload, Button } from 'antd';
+import { uploadFile } from '@/services/api/rotationChart';
+
+const customRequest = ({ file, onError, onSuccess }) => {
+  const data = new FormData();
+  data.append('file', file);
+
+  uploadFile(data).then((res) => {
+    onSuccess(res.url)
+  }).catch((err) => {
+    onError(err);
+  })
+
+  return {
+    abort() {
+      console.log('upload progress is aborted.');
+    },
+  };
+}
+
+export default (props) => {
+  const { value, onChange, preview, ...inputProps } = props;
+  const [loading, setLoading] = useState(false);
+
+  const onUpload = useCallback((e) => {
+    const { files } = e.target;
+    if (!files || files.length < 1) return;
+
+    setLoading(true);
+    const data = new FormData();
+    data.append('file', files[0]);
+
+    uploadFile(data).then((res) => {
+      setLoading(false);
+      if (typeof onChange === 'function') {
+        onChange(res.url)
+      }
+    }).catch((err) => {
+      setLoading(false);
+      // onError(err);
+    })
+
+  }, [onChange])
+
+  const onClick = () => {
+    const input = document.createElement('input');
+    input.type = 'file';
+    Object.assign(input, inputProps);    
+    input.addEventListener('change', onUpload);
+    // input.removeEventListener('change', onUpload);
+    input.click();
+  }
+
+  return (
+    <div>
+      <Button icon={<UploadOutlined />} onClick={onClick}>上传文件</Button>
+      {
+        value && typeof preview === 'function' && preview(value)
+      }
+    </div>
+  )
+}

src/components/UploadImage/index.jsx

@@ -49,7 +49,7 @@ export default (props) => {
   return (
     <Upload
       // customRequest={uploadFile}
-      action={'/api/image/upload'}
+      action={'/api/upload'}
       accept='image/*'
       listType="picture-card"
       className="image-uploader"

src/pages/User/Login/index.jsx

@@ -63,7 +63,7 @@ const Login = () => {
       <div className={styles.content}>
         <LoginForm
           // logo={<img alt="logo" src="/logo.svg" />}
-          title="军工站"
+          title="军供"
           onFinish={async (values) => {
             await handleSubmit(values);
           }}

src/pages/document.ejs

@@ -22,7 +22,7 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
     />
-    <title>军工站</title>
+    <title>军供</title>
     <link rel="icon" href="<%= context.config.publicPath +'favicon.ico'%>" type="image/x-icon" />
   </head>
   <body>

src/pages/rotationChart/edit/index.jsx

@@ -1,5 +1,6 @@
 import UploadImage from '@/components/UploadImage';
 import UploadVideo from '@/components/UploadVideo';
+import UploadFile from '@/components/UploadFile';
 import { addBanner, getBannerdById, updataBanner } from '@/services/api/rotationChart';
 import {
   PageContainer,
@@ -10,18 +11,18 @@ import {
   ProFormTextArea,
 } from '@ant-design/pro-components';
 import { history, useSearchParams } from '@umijs/max';
-import { Card, Col, message, Row, Space } from 'antd';
+import { Card, Col, message, Row, Space, Image } from 'antd';
 import { useEffect, useRef, useState } from 'react';
 
 export default (props) => {
   const [searchParams, setSearchParams] = useSearchParams();
   const id = searchParams.get('id');
   const [data, setData] = useState({});
+  const [imgLabel, setImgLabel] = useState('图片');
   const formRef = useRef();
   useEffect(() => {
     if (id) {
       getBannerdById(id).then((res) => {
-        console.log(res, '====---');
         setData(res);
 
         formRef.current.setFieldsValue(res);
@@ -83,20 +84,22 @@ export default (props) => {
             }}
             placeholder="轮播图类型"
             rules={[{ required: true, message: 'Please select your country!' }]}
+            onChange={({ value }) =>  setImgLabel(value === '1' ? '图片' : '封面')}
           />
           <ProForm.Item
             width="md"
             name="image"
-            label="图片"
+            label={imgLabel}
             // extra="longgggggggggggggggggggggggggggggggggg"
             // rules={[{ required: true, message: '请上传图片' }]}
           >
-            <UploadImage />
+            <UploadFile
+              accept="image/*"
+              preview={src => <div style={{ marginTop: '2em' }}><Image width={200} src={src} /></div>}
+            />
           </ProForm.Item>
           <ProForm.Item noStyle shouldUpdate>
             {(form) => {
-              console.log(form, '==');
-
               return form.getFieldValue('type') == '1' ? null : (
                 <ProForm.Item
                   width="md"
@@ -105,7 +108,10 @@ export default (props) => {
                   // extra="longgggggggggggggggggggggggggggggggggg"
                   // rules={[{ required: true, message: '请上传图片' }]}
                 >
-                  <UploadVideo />
+                  <UploadFile
+                    accept="video/*"
+                    preview={src => <div style={{ marginTop: '6px' }}><video height={360} width={480} src={src} controls /></div>}
+                  />
                 </ProForm.Item>
               );
             }}
@@ -130,32 +136,5 @@ export default (props) => {
         </ProForm>
       </Card>
     </PageContainer>
-    // <ModalForm
-    //   title={`${butttomTitle}`}
-    //   trigger={
-    //     <Button type="primary" {...butttomProps}>
-    //       {butttomTitle}
-    //     </Button>
-    //   }
-    //   autoFocusFirstInput
-    //   initialValues={{ type: '1', ...data }}
-    //   modalProps={{
-    //     onCancel: () => console.log('run'),
-    //   }}
-    //   submitTimeout={2000}
-    //   onFinish={onFinish}
-    // >
-
-    //   <ProFormText width="md" name="platform" label="平台名称" placeholder="请输入平台名称" />
-    //   <ProFormText width="md" name="ipAddr" label="IP地址" placeholder="请输入IP地址" />
-    //   {/* <ProFormText
-    //     width="md"
-    //     name="name"
-    //     label="推送频率"
-    //     tooltip="最长为 24 位"
-    //     placeholder="请输入名称"
-    //   /> */}
-    //   <ProFormTimePicker width="md" name="pushTime" label="推送时间" />
-    // </ModalForm>
   );
 };

src/pages/rotationChart/list/index.jsx

@@ -46,11 +46,13 @@ const RotationChartList = (props) => {
     {
       title: '封面图',
       dataIndex: 'image',
+      render: t => !t || '-' === t ? t : <img src={t}  style={{ width: '96px', borderRadius: '6px' }} />
     },
 
     {
       title: '视频',
       dataIndex: 'video',
+      render: () => '-',
     },
     {
       title: '状态',

src/services/api/rotationChart.js

@@ -35,3 +35,10 @@ export const updataBanner = (id, data) => request(`/banner/${id}`, { method: 'pu
  * @returns
  */
 export const deleteBanner = (id) => request(`/banner/${id}`, { method: 'delete' });
+
+/**
+ * 上传文件
+ * @param {*} id
+ * @returns
+ */
+ export const uploadFile = (data) => request(`/upload`, { method: 'POST', data });

src/utils/request.js

@@ -8,7 +8,7 @@ function requestInterceptor(url, options) {
 
   return {
     // url,
-    url: `/api${url}`,
+    url: `${API_BASE}/api${url}`,
     options: {
       ...options,
       headers: {
@@ -20,10 +20,7 @@ function requestInterceptor(url, options) {
 }
 
 function responseInterceptor(response) {
-  console.log(response, '44114');
   const { data } = response;
-
-  console.log(data, data.data, '--==666=');
   if (data.code === 1000) {
     return data;
   } else {