feat: app发布页

.gitignore

@@ -11,4 +11,5 @@ npm-debug.log
 src/umi
 src/.umi
 *.local
+.history
 

src/global.less

@@ -29,6 +29,11 @@ ol {
   list-style: none;
 }
 
+iframe {
+  border: none;
+  padding-top: 15px;
+}
+
 @media (max-width: @screen-xs) {
   .ant-table {
     width: 100%;

src/pages/appConfig/VersionPublish.js

+import React, { useEffect, useState, useRef } from 'react';
+import { Switch, Button, Message, Spin, Modal } from 'antd';
+
+import BaseForm from '@/components/BaseForm/index';
+import { getApkNameAndDate } from '@/services/appConfig/api';
+
+import styles from './VersionPublish.less';
+
+export default () => {
+  const items = [
+    {
+      label: '更新描述',
+      dataIndex: 'describe',
+      rules: [
+        {
+          required: true,
+          message: '请输入apk的更新描述',
+        },
+      ],
+      formType: 'INPUT',
+    },
+    {
+      label: '强制更新',
+      dataIndex: 'forceUpdate',
+      initialValue: 1,
+      rules: [
+        {
+          required: true,
+          message: '请选择是否强制更新',
+        },
+      ],
+      options: [
+        {
+          children: '是',
+          value: 1,
+        },
+        {
+          children: '否',
+          value: 0,
+        },
+      ],
+      formType: 'SINGLE_RADIO',
+    },
+    {
+      label: 'apk上传',
+      dataIndex: 'file',
+      rules: [
+        {
+          required: true,
+          message: '请上传对应的apk',
+        },
+      ],
+      formType: 'IMGSHOP',
+    },
+  ];
+  const formEntity = useRef(null);
+  const [loading, setLoading] = useState(true); // 显示请求的loading
+  const [showModal, setShowModal] = useState(false); // 显示更新的modal
+  const [fileData, setFileData] = useState({}); // 获取到的包名和更新时间
+
+  const submitForm = () => {
+    console.log(formEntity);
+    const { validateFields } = formEntity.current;
+    validateFields()
+      .then(values => {
+        console.log(values);
+      })
+      .catch(res => {
+        const { errorFields, values } = res;
+        console.log(errorFields, values);
+      });
+  };
+
+  const handleGetForm = form => {
+    formEntity.current = form;
+  };
+
+  useEffect(() => {
+    getApkNameAndDate({})
+      .then(res => {
+        console.log(res);
+        const message = res.ResultMessage || '';
+        const [fileName, updateTime] = message.split(',');
+        setFileData({
+          fileName,
+          updateTime,
+        });
+        setLoading(false);
+      })
+      .catch(err => {
+        Message.error(err);
+        setLoading(false);
+      });
+  }, []);
+
+  return (
+    <div className={loading ? styles.loadingContainer : styles.VersionPublish}>
+      {loading ? (
+        <Spin />
+      ) : (
+        <div className="base-info">
+          <div className={styles.row}>
+            <div className={styles.label}>当前包名：</div>
+            <div className="value">
+              {fileData.fileName || '未找到对应的包名'}
+            </div>
+          </div>
+          <div className={styles.row}>
+            <div className={styles.label}>更新时间：</div>
+            <div className="value">{fileData.updateTime}</div>
+          </div>
+          <div className={styles.row}>
+            <div className={styles.label}>下载地址：</div>
+            <div className="value">
+              <a href="https://example.com" target="_blank">
+                https://example.com
+              </a>
+            </div>
+          </div>
+          <div className={styles.row}>
+            <div className={styles.label}>更新描述：</div>
+            <div className="value">
+              更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：更新描述：
+            </div>
+          </div>
+          <div className={styles.row}>
+            <div className={styles.label}>强制更新：</div>
+            <div className="value">
+              <Switch checked disabled />
+            </div>
+          </div>
+          <Button type="primary" onClick={() => setShowModal(true)}>
+            更新
+          </Button>
+        </div>
+      )}
+      {showModal && (
+        <Modal
+          visible={showModal}
+          closable={false}
+          maskClosable
+          onCancel={() => setShowModal(false)}
+          onOk={submitForm}
+        >
+          <BaseForm items={items} getForm={handleGetForm} />
+        </Modal>
+      )}
+    </div>
+  );
+};

src/pages/appConfig/VersionPublish.less

+.loadingContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 0 15px;
+  min-height: 300px;
+}
+
+.VersionPublish {
+  display: flex;
+  padding: 0 15px;
+  min-height: 300px;
+}
+
+.row {
+  display: flex;
+  align-items: flex-start;
+  margin-bottom: 15px;
+}
+
+.label {
+  width: 100px;
+  flex-shrink: 0;
+}
\ No newline at end of file

src/pages/appConfig/index.js

@@ -3,6 +3,7 @@ import { Tabs, Card } from 'antd';
 import PageContainer from '@/components/BasePageContainer';
 import SevenParams from './SevenParams';
 import AppMenu from './AppMenu';
+import VersionPublish from './VersionPublish';
 
 const AppConfigPage = () => {
   const { TabPane } = Tabs;
@@ -16,6 +17,9 @@ const AppConfigPage = () => {
           <TabPane tab="菜单管理" key="2" type="card">
             <AppMenu />
           </TabPane>
+          <TabPane tab="版本发布" key="3" type="card">
+            <VersionPublish />
+          </TabPane>
         </Tabs>
       </Card>
     </PageContainer>

src/services/appConfig/api.js

@@ -101,3 +101,9 @@ export const deleteMenuApi = id =>
     menuID: id,
     subSystemValue: 'miniapp',
   });
+// 获取当前服务器上最新的apk包名和更新时间
+export const getApkNameAndDate = params =>
+  get(
+    `/Cityinterface/Services/CityServer_MobileBusiness/REST/BaseREST.svc/AppModifyTime`,
+    params,
+  );