基建调整

package.json

@@ -39,7 +39,6 @@
     "@tarojs/cli": "3.2.10",
     "@tarojs/components": "3.2.10",
     "@tarojs/react": "3.2.10",
-    "@tarojs/redux": "^2.2.10",
     "@tarojs/rn-runner": "^3.2.10",
     "@tarojs/runtime": "3.2.10",
     "@tarojs/taro": "3.2.10",

src/actions/app.js

@@ -6,11 +6,13 @@ import { firstCharToLowerCase } from '../utils/tool';
 
 async function saveSafeArea(dispatch) {
   const res = await Taro.getSystemInfo();
-  if (res.safeArea) {
+  console.log('system info:', res);
+  if (res) {
     dispatch({
       type: 'app/update',
       payload: {
-        safeArea: res.safeArea,
+        statusBarHeight: res.statusBarHeight,
+        safeArea: res.safeArea || {},
       }
     })
   }

src/app.config.js

@@ -9,6 +9,7 @@ export default {
     navigationBarBackgroundColor: '#32323C',
     // navigationBarTitleText: 'WeChat',
     // navigationBarTextStyle: 'yellow'
+    navigationStyle: 'custom',
   },
   tabBar: {
     color: "#7A7E83",

src/components/Page/index.jsx

@@ -0,0 +1,32 @@
+import { ScrollView, View } from '@tarojs/components';
+import React from 'react';
+import { useSelector } from 'react-redux';
+import { AtNavBar } from 'taro-ui';
+import styles from './page.module.scss';
+
+export default function Page(props) {
+  const { wrapperClassName, className, children, headerColor, title = '', leftText } = props;
+  const statusBarHeight = useSelector(state => state.app.statusBarHeight);
+  return (
+    <View className={[styles.page, wrapperClassName]}>
+      <View className={styles.statusBar} style={{ height: `${statusBarHeight}Px`, backgroundColor: headerColor }} />
+      {/* <View className={styles.header} style={{ backgroundColor: headerColor }}>
+        <View className={styles.headerLeft}></View>
+        <View className={styles.headerCenter}>{title}</View>
+        <View className={styles.headerRight} />
+      </View> */}
+      <View className={styles.header} style={{ backgroundColor: headerColor }} onClickLeftIcon={() => {}}>
+        <AtNavBar
+          className={styles.navBar}
+          leftIconType={leftText ? "chevron-left" : undefined}
+          leftText={leftText}
+        >
+          <View>{title}</View>
+        </AtNavBar>
+      </View>
+      <View className={[styles.container, className]} style={{ height: `calc(100% - ${statusBarHeight}Px - 44Px)` }}>
+        {children}
+      </View>
+    </View>
+  )
+}

src/components/Page/page.module.scss

@@ -0,0 +1,28 @@
+.page {
+  // display: flex;
+  height: 100vh;
+  width: 100%;
+  // flex-direction: column;
+}
+.statusBar {
+  width: 100%;
+  height: 40px;
+  flex: none;
+  // background-color: red;
+}
+.header {
+  // display: flex;
+  // flex-direction: row;
+  // justify-content: space-between;
+  // flex: none;
+  height: 44Px;
+  .navBar {
+    background-color: transparent;
+    &:after {
+      content: none;
+    }
+    :global(.at-nav-bar__text) {
+      padding-left: 0;
+    }
+  }
+}

src/custom-taroui-variables.scss

@@ -3,4 +3,9 @@ $color-brand: #7850FF;
 $color-brand-light: #7850FF;
 $color-brand-dark: #7850FF;
 
-@import "~taro-ui/dist/style/components/button.scss";
+@import "~taro-ui/dist/style/components/button.scss";
+@import "~taro-ui/dist/style/components/search-bar.scss";
+@import "~taro-ui/dist/style/components/button.scss";
+@import "~taro-ui/dist/style/components/icon.scss";
+@import "~taro-ui/dist/style/components/nav-bar.scss";
+@import "~taro-ui/dist/style/components/list.scss";

src/reducers/app.js

@@ -1,6 +1,7 @@
 const initState = {
   isLogin:false,
   safeArea: {},
+  statusBarHeight: 20,
   accountId: '',
   accountName: '',
   companyId: '',

src/service/oss.js

@@ -22,6 +22,8 @@ import { memoize } from 'lodash';
 // const generateStoreKey = name => `${new Date().getTime()}/${name}`;
 
 export const wrapOssProtocol = path => `oss://${path}`;
+
+export const ossUrl = v => `https://yiyun-client-files.oss-cn-hangzhou.aliyuncs.com/${v}`;
 /**
  * 
  * @param {*} objectKey 文件在服务器上的path值，格式为: oss://${timestamp}/filename 
@@ -30,10 +32,11 @@ export const wrapOssProtocol = path => `oss://${path}`;
 export const getFileUrl = memoize(function getFileUrlInner(serverOSSPath = '', saveAs) {
   if (serverOSSPath.indexOf('oss://') === 0) {
     const objectKey = serverOSSPath.substr(6);
-    return `https://yiyun-client-files.oss-cn-hangzhou.aliyuncs.com/${objectKey}`;
+    return ossUrl(objectKey);
   }
   if(serverOSSPath.indexOf('static/') === 0) { // 处理 static/img/faceImg/faceXX.png
-    return `https://yiyun-client-files.oss-cn-hangzhou.aliyuncs.com/faceImg/${serverOSSPath.substr(19)}`;
+    return ossUrl(`faceImg/${serverOSSPath.substr(19)}`);
+    // return `https://yiyun-client-files.oss-cn-hangzhou.aliyuncs.com/faceImg/${serverOSSPath.substr(19)}`;
   }
   // const filename = saveAs || objectKey.split('/').pop();
   return serverOSSPath;